From 714fbeec647647c3fce676e446a7e2046d39a84a Mon Sep 17 00:00:00 2001 From: shy Date: Sat, 7 Oct 2023 07:48:36 +0800 Subject: [PATCH] opt draw --- const.js | 1 + frame.js | 18 +++-- index.css | 7 ++ lib/base.js | 1 + lib/page.js | 2 +- lib/user.js | 42 +++++++---- plugin/local/wiki/draw.js | 144 +++++++++++++++++++++----------------- 7 files changed, 130 insertions(+), 85 deletions(-) diff --git a/const.js b/const.js index 6c55149f..19ab3979 100644 --- a/const.js +++ b/const.js @@ -260,6 +260,7 @@ var html = {PLUGIN_MARGIN: 10, ACTION_HEIGHT: 32, ACTION_MARGIN: 200, VISIBILITY: "visibility", VERTICAL: "vertical", HORIZON: "horizon", NOTICE: "notice", DANGER: "danger", + TOIMAGE: "toimage", SIZE: "size", OPACITY: "opacity", VISIBLE: "visible", CLASS: "class", DARK: "dark", LIGHT: "light", WHITE: "white", BLACK: "black", diff --git a/frame.js b/frame.js index 0cc5b83e..65223383 100644 --- a/frame.js +++ b/frame.js @@ -115,7 +115,10 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { return can.base.isUndefined(value)? (value = target.innerHTML): (target.innerHTML = value.trim? value.trim(): value+"") }); return value } catch {} }, - Action: function(key, value) { return can.page.SelectArgs(can, action, key, value)[0] }, + Action: function(key, value) { + key && value && can.misc.sessionStorage(can, [sub.ConfIndex(), ctx.ACTION, key], value) + return can.page.SelectArgs(can, action, key, value)[0] + }, Option: function(key, value) { return can.page.SelectArgs(can, option, key, value)[0] }, Update: function(event, cmds, cb, silent) { sub.request(event)._caller(), sub.onappend._output0(sub, sub.Conf(), event||{}, cmds||sub.Input([], !silent), cb, silent); return true }, Focus: function() { can.page.SelectOne(can, option, html.INPUT_ARGS, function(target) { target.focus() }) }, @@ -188,7 +191,8 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { can.base.isString(item)? /* 2.按键 */ {type: html.BUTTON, name: item, value: can.user.trans(can, item, meta._trans), onclick: function(event) { run(event, item) }}: item.length > 0? /* 3.列表 */ {type: html.SELECT, name: item[0], values: item.slice(1), onchange: function(event) { can.misc.Event(event, can, function(msg) { - var button = event.target.value; meta[item[0]]? can.core.CallFunc(meta[item[0]], [event, can, item[0], button]): meta[button] && can.core.CallFunc(meta[button], [event, can, button]) + var button = event.target.value; meta[item[0]]? can.core.CallFunc(meta[item[0]], [event, can, item[0], button]): + meta[button]? can.core.CallFunc(meta[button], [event, can, button]): can.Action(item[0], button) }) }}: /* 4.其它 */(item.type == html.BUTTON && (item.value = item.value||can.user.trans(can, item.name, meta._trans), item.onclick = item.onclick||function(event) { run(event, item.name||item.value) }, item._init = item._init||function(target) { item.action && can.onappend.figure(sub, item, target, function(_sub, value) { can.Update() }) @@ -234,6 +238,10 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { if (action !== false) { can.onkeymap._build(sub) can.onmotion.clear(can, can._action), sub.onappend._action(sub, can.Conf(ice.MSG_ACTION)||msg.Option(ice.MSG_ACTION), action||can._action) sub.onappend._status(sub, sub.onexport&&sub.onexport.list||msg.Option(ice.MSG_STATUS)), can.user.isMobile || sub.onappend.tools(sub, msg) + can.core.Item(can.Action(), function(key) { + var value = can.misc.sessionStorage(can, [can.ConfIndex(), ctx.ACTION, key]) + value && can.Action(key, value[0]) + }) } can.onappend.style(sub, sub.Conf(ctx.STYLE)), can.onmotion.story.auto(can, can._output) if (can.onimport.size) { if (can.isFullMode() || can.isCmdMode()) { can.ConfHeight(can.page.height()), can.ConfWidth(can.page.width()) } @@ -300,8 +308,8 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { }}]) } }, - select: function(can, select, item) { - return can.page.Append(can, select.parentNode, [{type: html.INPUT, data: {className: html.SELECT, type: html.BUTTON, name: item.name, value: can.user.trans(can, item.value||item.values[0]), title: item.name}, onclick: function(event) { var target = event.target + select: function(can, select, item) { // can.user.trans(can, item.value||item.values[0]) + return can.page.Append(can, select.parentNode, [{type: html.INPUT, data: {className: html.SELECT, type: html.BUTTON, name: item.name, value: item.value||item.values[0], title: item.name}, onclick: function(event) { var target = event.target var carte = can.user.carte(event, can, {}, item.values, function(event, button) { carte.close(); if (target.value == button) { return } target.value = button, select.value = button, select.onchange && select.onchange({target: select}) }); can.onappend.style(can, [html.SELECT, item.name], carte._target), can.page.style(can, carte._target, html.MIN_WIDTH, event.target.offsetWidth) @@ -426,7 +434,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { if (can.base.isObject(meta) && meta.layout) { meta.layout(h, width) } can.page.style(can, target, html.WIDTH, width), height -= h } else { - if (item == html.PROJECT) { var w = can.user.isMobile? 120: 230, h = height } else { var w = calc(item, target.offsetWidth||target.style.width||_width/list.length, _width), h = height } + var w = calc(item, target.offsetWidth||target.style.width||_width/list.length, _width), h = height if (can.base.isObject(meta)) { meta.layout(h, w = _width/list.length) } can.page.style(can, target, html.HEIGHT, h, html.WIDTH, w), width -= w } diff --git a/index.css b/index.css index 1a112680..f256ba6d 100644 --- a/index.css +++ b/index.css @@ -240,6 +240,10 @@ svg line { stroke-width:var(--svg-stroke-width); stroke:var(--body-fg-color); } svg line:hover { stroke:var(--hover-fg-color); } svg path { stroke-width:var(--svg-stroke-width); stroke:var(--body-fg-color); } svg path:hover { stroke:var(--hover-fg-color); } +svg g[font-size] text { font-size:unset; } +svg g[stroke-width] rect { stroke-width:unset; } +svg g[stroke-width] line { stroke-width:unset; } +svg g[stroke-width] path { stroke-width:unset; } svg g[stroke] text { stroke:unset; } svg g[stroke] rect { stroke:unset; } svg g[stroke] line { stroke:unset; } @@ -493,12 +497,15 @@ fieldset.plan>div.output>div.layout>div.layout>div.profile input { box-shadow:va fieldset.plan>div.output>div.layout>div.layout>div.profile input:not(:last-child) { margin-right:5px; } fieldset.plan>div.output>div.layout>div.layout>div.profile td:last-child { cursor:text; } fieldset.draw div.output svg { margin-bottom:-5px; } +fieldset.draw>div.output>div.layout>div.layout>div.profile table { width:100%; } fieldset.draw>form.option>div.item.pid>input { width:60px !important; } fieldset.draw.trend div.output svg { background-color:#1b5b738c; } fieldset.draw.trend div.output { overflow:hidden; } fieldset.draw.spide div.output { overflow-y:hidden; } fieldset.draw.spide div.output svg text { cursor:pointer; } fieldset.draw.spide div.output svg path { stroke-width:1; } +fieldset.draw>div.output>div.project { width:180px; flex:0 0 180px; } +fieldset.draw>div.output>div.layout>div.layout>div.profile { width:180px; flex:0 0 180px; } fieldset.web.chat.location>div.action input[type=text] { width:80px !important; } fieldset.web.chat.location>div.output>div.layout>div.layout>div.profile { position:absolute; top:0; right:0; height:200px; width:200px; z-index:5; border-left:none; } fieldset.web.chat.location>div.output>div.layout>div.layout { position:relative; } diff --git a/lib/base.js b/lib/base.js index 1ba81c84..98d11104 100644 --- a/lib/base.js +++ b/lib/base.js @@ -9,6 +9,7 @@ Volcanos("base", { Obj: function(val, def) { try { if (typeof val == code.STRING) { if (val == "") { return def } val = JSON.parse(val) } + if (typeof val == code.NUMBER) { return [val] } if (val.length > 0) { return val } for (var k in val) { return val } return def } catch (e) { return typeof val == code.STRING && val.split(mdb.FS) || def } }, diff --git a/lib/page.js b/lib/page.js index 5deda4a9..b84d9bd1 100644 --- a/lib/page.js +++ b/lib/page.js @@ -332,7 +332,7 @@ Volcanos("page", { } can.require(libs, cb, cbs) }, requireDraw: function(can, cb) { can.require([chat.PLUGIN_LOCAL+"wiki/draw.js", chat.PLUGIN_LOCAL+"wiki/draw/path.js"], function() { - can.onimport._last_init(can, can.request(), can._output), can.onappend.style(can, wiki.DRAW, can._fields), cb() + can.onimport._last_init(can, can.request()), can.onappend.style(can, wiki.DRAW, can._fields), cb() }, function(can, mod, sub) { mod == chat.ONIMPORT && (can[mod]._last_init = sub._init) }) }, drawText: function(can, text, size, margin, fonts) { text = text.slice(0, 1), size = size||80, margin = margin == undefined? 10: margin var colors = ["rgb(239,150,26)", 'rgb(255,58,201)', "rgb(111,75,255)", "rgb(36,174,34)", "rgb(80,80,80)"] diff --git a/lib/user.js b/lib/user.js index 5f0251b9..720d1989 100644 --- a/lib/user.js +++ b/lib/user.js @@ -121,31 +121,45 @@ Volcanos("user", { can.onmotion.focus(can, input), document.execCommand("Copy"), can.page.Remove(can, input) return can.user.toastSuccess(can, text, "copy success"), can.misc.Log(nfs.COPY, text), text }, - carte: function(event, can, meta, list, cb, parent, trans) { + carte: function(event, can, meta, list, cb, parent, trans) { var msg = can.request(event) function remove_sub(carte) { carte._sub && can.page.Remove(can, carte._sub._target), delete(carte._sub) } parent? remove_sub(parent): can.onmotion.clearCarte(can) - var msg = can.request(event); trans = trans||meta._trans - meta = meta||can.ondetail||can.onaction||{}, list = can.base.getValid(list, meta.list, can.core.Item(meta)); if (!list || list.length == 0) { return } - function click(event, button) { can.misc.Event(event, can, function() { can.onkeymap.prevent(event), can.request(event, {action: button}), + meta = meta||can.ondetail||can.onaction||{}, list = can.base.getValid(list, meta.list, can.core.Item(meta)), trans = trans||meta._trans + if (!list || list.length == 0) { return } + var isinput = can.page.tagis(event.target, html.INPUT) + var _events = event._events||event + function click(event, button) { can.misc.Event(event, can, function() { + can.onkeymap.prevent(event), can.request(event, {action: button}), event._events = _events, (meta[button]? can.core.CallFunc([meta, button], {event: event, can: can, msg: msg, button: button}): can.base.isFunc(cb)? cb(event, button, meta, carte): can.Update(event, [ctx.ACTION, button])) || can.onmotion.clearCarte(can) }) } - var ui = can.page.Append(can, document.body, [{view: [[chat.CARTE, meta._style||can.base.replaceAll(can._index||"", nfs.PT, lex.SP)||"", chat.FLOAT]], list: can.core.List(list, function(item, index) { + var ui = can.page.Append(can, document.body, [{view: [[chat.CARTE, meta._style||can.base.replaceAll(can.ConfIndex()||"", nfs.PT, lex.SP)||"", chat.FLOAT]], list: can.core.List(list, function(item, index) { + if (item === "") { + return {type: html.HR} + } if (item == web.FILTER) { return {input: [html.FILTER, function(event) { if (event.key == code.ESCAPE) { return carte.close() } can.onkeymap.selectItems(event, can, carte._target) }], _init: function(target) { can.onmotion.delay(can, function() { target.placeholder = "search in "+(can.core.List(list, function(item) { if (item) { return item } }).length-1)+" items", target.focus() }) } } } - function subs(event) { var sub = can.user.carte(event, can, meta, item.slice(1), cb||function(event, button) { - can.onimport && can.onimport[item[0]] && can.onimport[item[0]](can, button) - }, carte, trans); can.onlayout.figure(event, can, sub._target, true), carte._sub = sub } - var _style = can.page.buttonStyle(can, item) - return item === ""? /* 0.space */ {type: html.HR}: can.base.isString(item)||can.base.isNumber(item)? /* 1.string */ {view: [[html.ITEM, item, _style], html.DIV, meta._style == ice.CMD? item: can.user.trans(can, item, trans)], onclick: function(event) { click(event, item) }, onmouseenter: function(event) { remove_sub(carte) } }: - can.base.isArray(item)? /* 2.array */ {view: html.ITEM, list: [{text: can.user.trans(can, item[0], trans)}, {text: [lex.SP+can.page.unicode.next, "", [html.ICON, "next"]]}], onmouseenter: subs, onclick: subs}: /* 3.object */ item + if (can.base.isString(item)||can.base.isNumber(item)) { var _style = can.page.buttonStyle(can, item) + return {view: [[html.ITEM, item, _style], html.DIV, + isinput || meta._style == ice.CMD? item: can.user.trans(can, item, trans) + ], onclick: function(event) { click(event, item) }, onmouseenter: function(event) { remove_sub(carte) } } + } + if (can.base.isArray(item)) { + function subs(event) { var sub = can.user.carte(event, can, meta, item.slice(1), cb||function(event, button) { + can.onimport && can.onimport[item[0]] && can.onimport[item[0]](can, button) + }, carte, trans); carte._sub = sub } + return {view: html.ITEM, list: [ + {text: can.user.trans(can, item[0], trans)}, + {text: [lex.SP+can.page.unicode.next, "", [html.ICON, "next"]]} + ], onmouseenter: subs, onclick: subs} + } + return item })}]); can.onkeymap.prevent(event), can.page.Select(can, ui._target, html.IMG, function(target) { target.onload = function() { can.onlayout.figure(event, can, ui._target) } }) - var carte = {_target: ui._target, _parent: parent, layout: can.onlayout.figure(event, can, ui._target, false, 200), close: function() { can.page.Remove(can, ui._target) }} - parent && (parent._sub = carte) - return carte + var carte = {_target: ui._target, _parent: parent, layout: can.onlayout.figure(event, can, ui._target, parent, 200), close: function() { can.page.Remove(can, ui._target) }} + return parent && (parent._sub = carte), carte }, carteRight: function(event, can, meta, list, cb, parent) { var carte = can.user.carte(event, can, meta, list, cb, parent) return carte && can.onlayout.figure(event, can, carte._target, true), carte diff --git a/plugin/local/wiki/draw.js b/plugin/local/wiki/draw.js index df5f89cc..a5b18c8f 100644 --- a/plugin/local/wiki/draw.js +++ b/plugin/local/wiki/draw.js @@ -1,14 +1,14 @@ -Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear(can); var pid = can.misc.SearchHash(can)[0] - can.svg = null, can.group = null, can.temp = null, can.current = null, can.points = [], can._display_heights = {} - if (can.Conf(ctx.INDEX) == web.WIKI_DRAW) { - can.ui = can.onappend.layout(can); if (can.user.isMobile) { can.onmotion.hidden(can, can.ui.project), can.onmotion.hidden(can, can.ui.profile) } - can.onmotion.hidden(can, can.ui.project), can.onmotion.hidden(can, can.ui.profile) - } else { can.ui = {content: can._output} } - can.page.Modify(can, can.ui.content, msg.Results()||can.onexport.content(can)), can.onexport.title(can, can.Option(nfs.PATH)) +Volcanos(chat.ONIMPORT, {_init: function(can, msg) { var pid = can.misc.SearchHash(can)[0] + can.isCmdMode() || can.onmotion.hidden(can, can._action) + if (can.ConfIndex() == web.WIKI_DRAW) { can.ui = can.onappend.layout(can), can.onexport.title(can, can.Option(nfs.PATH)) + if (can.user.isMobile || !can.isCmdMode()) { can.onmotion.hidden(can, can.ui.project) } + can.isCmdMode() && can.onmotion.toggle(can, can.ui.profile, true) + } else { can.ui = {content: can._output} } can.page.Modify(can, can.ui.content, msg.Results()||can.onexport.content(can)) + can.svg = null, can.group = null, can.current = null, can.temp = null, can.points = [], can._display_heights = {} can.page.Select(can, can.ui.content, html.SVG, function(target) { can.svg = can.group = can.onimport._block(can, target), can.onimport._group(can, target) - can.page.Select(can, target, mdb.FOREACH, function(target) { can.onimport._block(can, target), can.page.tagis(target, svg.G) && target.Value(html.CLASS) && can.onimport._group(can, target) }) - can.ui.profile && can.core.ItemCB(can.onaction, function(key, cb) { target[key] = function(event) { can.misc.Event(event, can, function(msg) { cb(event, can) }) } }) - }), can.ondetail._select(can, (can.isCmdMode()? pid: "")||can.Option(svg.PID)||can.svg.Value(svg.PID)), can.onkeymap._build(can) + can.page.Select(can, target, "", function(target) { can.onimport._block(can, target), can.page.tagis(target, svg.G) && target.Value(html.CLASS) && can.onimport._group(can, target) }) + can.isCmdMode() && can.core.ItemCB(can.onaction, function(key, cb) { target[key] = function(event) { can.misc.Event(event, can, function(msg) { cb(event, can) }) } }) + }), can.ondetail._select(can, (can.isCmdMode()? pid: "")||can.Option(svg.PID)||can.svg.Value(svg.PID)) }, _block: function(can, target) { target.Value = function(key, value) { if (can.base.isUndefined(key)) { return } if (can.base.isObject(key)) { return can.core.Item(key, target.Value), key } @@ -17,9 +17,7 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear( if (value == ice.AUTO) { return target.removeAttribute(key) } if (key == html.INNER) { return value != undefined && (target.innerHTML = value), target.innerHTML } if (key == svg.SHIP) { return value != undefined && target.setAttribute(key, JSON.stringify(value)), can.base.Obj(target.getAttribute(key), []) } - try { - return value != undefined && target.setAttribute(key, value), target.getAttribute(key) || can.core.Value(target[key], "baseVal.value") || can.core.Value(target[key], "baseVal") || undefined - } catch(e) { } + try { return value != undefined && target.setAttribute(key, value), target.getAttribute(key) || can.core.Value(target[key], "baseVal.value") || can.core.Value(target[key], "baseVal") || undefined } catch(e) { } }, target.Val = function(key, value) { return parseInt(target.Value(key, value == undefined? value: parseInt(value)||0))||0 } target.Group = function() { for (var node = target; node; node = node.parentNode) { if (can.page.tagis(node, svg.G, html.SVG)) { return node } } return can.svg } target.Groups = function() { if (target == can.svg) { return html.SVG } var list = [] @@ -32,7 +30,8 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear( can.core.List([svg.FONT_SIZE, svg.STROKE_WIDTH, svg.STROKE, svg.FILL], function(key) { can.Action(key, target.Value(key)||key) }) }, function(event) { can.user.carteRight(event, can, can.onaction, can.onaction.menu_list) }, can.ui.project) }, - _profile: function(can, target) { if (!can.ui.profile) { return } can.misc.SearchHash(can, can.Option(svg.PID, can.svg.Value(svg.PID, can.onexport._pid(can, target)))) + _profile: function(can, target) { if (!can.ui.profile) { return } + can.misc.SearchHash(can, can.Option(svg.PID, can.svg.Value(svg.PID, can.onexport._pid(can, target)))) var figure = can.onfigure._get(can, target), ui = can.page.Appends(can, can.ui.profile, [html.OUTPUT, html.ACTION]) can.page.Appends(can, ui.output, [{view: [html.CONTENT, html.TABLE], list: [ {th: [mdb.KEY, mdb.VALUE]}, {td: [mdb.TYPE, target.tagName]}, {td: [svg.PID, target.Value(svg.PID)]}, {td: [mdb.TEXT, target.Value(mdb.TEXT)]}, @@ -46,15 +45,15 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear( // can.onappend._action(can, can.ondetail.list, ui.action, {_engine: function(event, can, button) { can.ondetail[button]({target: target}, can, button) }}) }, _display: function(can, target) { if (!can.ui.display) { return } - if (can.onmotion.cache(can, function() { return target.Value(svg.PID) }, can.ui.display)) { return } if (!target.Value(ctx.INDEX)) { return } - can.onappend.plugin(can, {index: target.Value(ctx.INDEX), args: target.Value(ctx.ARGS), height: can.ConfHeight()/2-2*html.ACTION_HEIGHT}, function(sub) { - sub.run = function(event, cmds, cb) { sub.ConfHeight(can.ConfHeight()/2-2*html.ACTION_HEIGHT), can.runActionCommand(event, target.Value(ctx.INDEX), cmds, cb) } - sub.onexport.output = function() { can.onmotion.delay(can, function() { - can.page.style(can, sub._output, html.MAX_HEIGHT, "") + if (!target.Value(ctx.INDEX)) { return can.onmotion.hidden(can, can.ui.display) } can.onmotion.toggle(can, can.ui.display, true) + if (can.onmotion.cache(can, function() { return target.Value(svg.PID) }, can.ui.display)) { return } + can.onappend.plugin(can, {index: target.Value(ctx.INDEX), args: target.Value(ctx.ARGS), height: can.ConfHeight()/2}, function(sub) { + sub.onexport.output = function() { can.onmotion.delay(can, function() { can.page.style(can, sub._output, html.MAX_HEIGHT, "") sub.onimport.size(sub, can._display_heights[target.Value(svg.PID)] = can.base.Max(sub._target.offsetHeight, can.ConfHeight()/2), can.ConfWidth()-can.ui.project.offsetWidth, true) - can.onimport.layout(can), can.page.style(can, sub._output, html.MAX_HEIGHT, sub.ConfHeight()) + can.onimport.layout(can) }) } - }, can.ui.display), can.onmotion.toggle(can, can.ui.display, true) + sub.onaction._close = function() { can.onmotion.hidden(can, can.ui.display), can.onimport.layout(can) } + }, can.ui.display) }, block: function(can, type, value, group) { group = group||can.group var target = document.createElementNS("http://www.w3.org/2000/svg", type) @@ -68,16 +67,19 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear( var target = can.onimport.block(can, figure.data.name||value.shape, data, group); can.core.ItemCB(value, function(key, cb) { target[key] = cb }) return value._init && value._init(target), target }, - layout: function(can, height, width) { can.onmotion.toggle(can, can._action, can.ConfWidth() > 1600) - can.page.style(can, can._output, html.HEIGHT, height, html.WIDTH, width) + layout: function(can, height, width) { can.ui.layout && can.ui.layout(can.ConfHeight(), can.ConfWidth(), 0, function(height, width) { can.page.style(can, can.svg, html.MIN_HEIGHT, height, html.MIN_WIDTH, width) }) }, }) -Volcanos(chat.ONACTION, {list: [[svg.GRID, 10, 1, 2, 3, 4, 5, 10, 20], - [svg.FONT_SIZE, svg.FONT_SIZE, 12, 16, 18, 24, 32], [svg.STROKE_WIDTH, svg.STROKE_WIDTH, 1, 2, 3, 4, 5], +Volcanos(chat.ONACTION, {list: [ + [svg.GRID, svg.GRID, 1, 2, 3, 4, 5, 10, 20], + [svg.FONT_SIZE, svg.FONT_SIZE, 12, 16, 18, 24, 32], + [svg.STROKE_WIDTH, svg.STROKE_WIDTH, 1, 2, 3, 4, 5], [svg.STROKE, svg.STROKE, cli.RED, cli.YELLOW, cli.GREEN, cli.CYAN, cli.BLUE, cli.PURPLE, cli.BLACK, cli.WHITE], - [svg.FILL, svg.FILL, cli.RED, cli.YELLOW, cli.GREEN, cli.CYAN, cli.BLUE, cli.PURPLE, cli.BLACK, cli.WHITE, cli.TRANSPARENT], - [svg.GO, ice.AUTO, ctx.RUN, ice.AUTO, "manual"], [ice.MODE, web.DRAW, web.RESIZE], + [svg.FILL, svg.FILL, cli.RED, cli.YELLOW, cli.GREEN, cli.CYAN, cli.BLUE, cli.PURPLE, cli.BLACK, cli.WHITE], + // [svg.GO, ice.AUTO, ctx.RUN, ice.AUTO, "manual"], + [svg.GO, ctx.RUN, ice.AUTO, "manual"], + [ice.MODE, web.DRAW, web.RESIZE], [svg.SHAPE, svg.RECT, svg.TEXT, svg.RECT, svg.LINE, svg.BLOCK, svg.CIRCLE, svg.ELLIPSE], ], _change: function(can, key, value) { value == "" && (value = key), can.Action(key, value) @@ -88,10 +90,6 @@ Volcanos(chat.ONACTION, {list: [[svg.GRID, 10, 1, 2, 3, 4, 5, 10, 20], stroke: function(event, can, key, value) { can.onaction._change(can, key, value) }, fill: function(event, can, key, value) { can.onaction._change(can, key, value) }, - go: function(event, can, key, value) { can.Action(key, value) }, - mode: function(event, can, key, value) { can.Action(key, value) }, - shape: function(event, can, key, value) { can.Action(key, value) }, - menu_list: [html.HIDE, html.SHOW, mdb.CREATE, web.CLEAR, mdb.REMOVE], hide: function(event, can) { can.onmotion.hide(can, {interval: 100, length: 10}, null, can.group) }, show: function(event, can) { can.onmotion.show(can, {interval: 10, length: 1}, null, can.group) }, @@ -139,11 +137,15 @@ Volcanos(chat.ONACTION, {list: [[svg.GRID, 10, 1, 2, 3, 4, 5, 10, 20], can._undo && can._undo(), can._undo = function() { can.temp && can.page.Remove(can, can.temp) && delete(can.temp), delete(can._undo) } can.temp = can.core.CallFunc([can.onaction._mode, can.Action(ice.MODE)], [event, can, points]), can.points.length == 0 && can._undo && can._undo() }, - onmouseover: function(event, can) { can.onexport._show(can, event.target) }, - onmousemove: function(event, can) { var point = can.onexport._point(event, can) - if (can.Action(svg.GO) == ctx.RUN) { return can.page.style(can, can.svg, "cursor", "pointer") } can.onexport.cursor(event, can, event.target) + onmouseover: function(event, can) { + can.onexport._show(can, event.target) + }, + onmousemove: function(event, can) { + var point = can.onexport._point(event, can); can.onexport.cursor(event, can, event.target) + if (can.Action(svg.GO) == ctx.RUN) { return can.page.style(can, can.svg, "cursor", "pointer") } if (can.Action(svg.GO) == ice.AUTO) { can.onaction._auto(can, event.target) } can.onaction._figure(event, can, can.points.concat(point)) + can.temp && can.onexport._show(can, can.temp||event.target) }, onclick: function(event, can) { var point = can.onexport._point(event, can) if (can.Action(svg.GO) == ctx.RUN) { return can.ondetail._select(can, event.target.Value(svg.PID)) } @@ -152,12 +154,15 @@ Volcanos(chat.ONACTION, {list: [[svg.GRID, 10, 1, 2, 3, 4, 5, 10, 20], ondblclick: function(event, can) { can.ondetail.label(event, can) }, oncontextmenu: function(event, can) { can.page.style(can, can.user.carte(event, can, can.ondetail, null, function(ev, button, meta) { meta[button](event, can, button) })._target, {left: event.clientX, top: event.clientY}) }, }) -Volcanos(chat.ONDETAIL, {list: [cli.START, ice.COPY, html.LABEL, "toimage", mdb.REMOVE], - _select(can, name, cb) { if (!name) { return } var target = can.page.SelectOne(can, can.svg, nfs.PT+name, cb) +Volcanos(chat.ONDETAIL, { + list: [cli.START, nfs.COPY, html.LABEL, html.TOIMAGE, mdb.REMOVE], + _trans: {copy: "复制", label: "标签", toimage: "成图"}, + _select(can, name, cb) { if (!name) { return } var target = can.page.SelectOne(can, can.svg, nfs.PT+name, cb); if (!target) { return } can.onimport._profile(can, target), can.onimport._display(can, target), can.onimport.layout(can, can.ConfHeight(), can.ConfWidth()) return target }, - start: function(event, can) { var target = event.target + start: function(event, can) { + event = event._events||event; var target = event.target; if (target == can.svg) { return } var list = [target], dict = {} for (var i = 0; i < list.length; i++) { var ship = list[i].Value(svg.SHIP) for (var j = 0; j < ship.length; j++) { var pid = ship[j].pid @@ -167,25 +172,30 @@ Volcanos(chat.ONDETAIL, {list: [cli.START, ice.COPY, html.LABEL, "toimage", mdb. } } can.core.Next(list, function(target, next) { can.onmotion.delay(can, function() { - can.onmotion.show(can, {interval: 300, length: 10}, null, target) + can.onmotion.show(can, {interval: 300, length: 10}, null, target) can.user.toast(can, target.Value(ctx.INDEX)) can.ondetail.run({target: target}, can), next() }) }) }, - copy: function(event, can) { var target = event.target, figure = can.onfigure._get(can, target), trans = can.core.Value(figure, [svg.DATA, svg.TRANS])||{}, data = {} + copy: function(event, can) { + event = event._events||event; var target = event.target; if (target == can.svg) { return } + var figure = can.onfigure._get(can, target), trans = can.core.Value(figure, [svg.DATA, svg.TRANS])||{}, data = {} data[trans.x||svg.X] = target.Val(trans.x||svg.X)+10, data[trans.y||svg.Y] = target.Val(trans.y||svg.Y)+10 can.core.List(figure.data.copy, function(key) { data[key] = target.Value(key) }) return can.onimport.block(can, target.tagName, data, can.group) }, - label: function(event, can) { var target = event.target + label: function(event, can) { + event = event._events||event; var target = event.target; if (target == can.svg) { return } var _target, text = target.Value(mdb.TEXT); can.ondetail._select(can, text, function(target) { _target = target, text = target.Value(html.INNER) }) can.user.input(event, can, [{name: html.LABEL, value: text}], function(list) { if (_target) { _target.Value(html.INNER, list[0]); return } if (can.page.tagis(target, html.TEXT)) { target.innerHTML = list[0]; return } target.Value(mdb.TEXT, can.onexport._pid(can, can.onimport.block(can, html.TEXT, can.onexport._text(can, target, can.onfigure._get(can, target), {inner: list[0]}), target.Group()) )) }) }, - toimage: function(event, can) { can.user.toimage(can, can.Option(nfs.PATH).split(nfs.PS).pop().split(nfs.PT)[0], can.svg) }, - remove: function(event, can) { if (target == can.svg) { return } var target = event.target + toimage: function(event, can) { + can.user.toimage(can, can.Option(nfs.PATH).split(nfs.PS).pop().split(nfs.PT)[0], can.svg) }, + remove: function(event, can) { + event = event._events||event; var target = event.target; if (target == can.svg) { return } can.core.List(target.Value(svg.SHIP), function(item) { can.ondetail._select(can, item.pid, function(target) { can.page.Remove(can, target) }) }) can.ondetail._select(can, target.Value(mdb.TEXT), function(target) { can.page.Remove(can, target) }), can.page.Remove(can, target) }, @@ -197,7 +207,7 @@ Volcanos(chat.ONDETAIL, {list: [cli.START, ice.COPY, html.LABEL, "toimage", mdb. }) Volcanos(chat.ONEXPORT, {list: [svg.GROUP, svg.FIGURE, ctx.INDEX, "pos"], _point: function(event, can) { var p = can.svg.getBoundingClientRect(), point = {x: event.clientX-p.x, y: event.clientY-p.y} - point.x = point.x - point.x % parseInt(can.Action(svg.GRID)), point.y = point.y - point.y % parseInt(can.Action(svg.GRID)) + point.x = point.x - point.x % can.onexport.grid(can), point.y = point.y - point.y % can.onexport.grid(can) return can.Status("pos", point.x+mdb.FS+point.y), point }, _pid: function(can, target) { if (target.Value(svg.PID)) { return target.Value(svg.PID) } @@ -209,18 +219,19 @@ Volcanos(chat.ONEXPORT, {list: [svg.GROUP, svg.FIGURE, ctx.INDEX, "pos"], return data.x = target.Val(trans[svg.X]||svg.X), data.y = target.Val(trans[svg.Y]||svg.Y), data }, _size: function(can, target, figure) { var trans = can.core.Value(figure.data, svg.TRANS)||{} - return "<("+target.Val(trans[html.HEIGHT]||html.HEIGHT)+mdb.FS+target.Val(trans[html.WIDTH]||html.WIDTH)+")" + return "<("+target.Val(trans[html.WIDTH]||html.WIDTH)+mdb.FS+target.Val(trans[html.HEIGHT]||html.HEIGHT)+")" }, _position: function(can, target, figure) { var trans = can.core.Value(figure.data, svg.TRANS)||{} return "@("+target.Val(trans[svg.X]||svg.X)+mdb.FS+target.Val(trans[svg.Y]||svg.Y)+")" }, _show: function(can, target) { var figure = can.onfigure._get(can, target) - function show() { return can.onexport._size(can, target, figure)+lex.SP+can.onexport._position(can, target, figure) } - can.Status(svg.FIGURE, target.tagName+nfs.DF+target.Value(svg.PID)+lex.SP+(figure? (figure.show||show)(can, target, figure): "")) + function show() { return can.onexport._position(can, target, figure)+lex.SP+can.onexport._size(can, target, figure) } + can.Status(svg.FIGURE, can.core.Keys(target.tagName, target.Value(svg.PID))+lex.SP+(figure? (figure.show||show)(can, target, figure): "")) can.Status(svg.GROUP, target.Groups()||can.group.Groups()||html.SVG) can.Status(ctx.INDEX, target.Value(ctx.INDEX)||"") }, - content: function(can, target) { return ['", target? target.innerHTML: "", ""]).join("") }, cursor: function(event, can, target) { @@ -275,32 +286,17 @@ Volcanos(chat.ONEXPORT, {list: [svg.GROUP, svg.FIGURE, ctx.INDEX, "pos"], }) Volcanos(chat.ONFIGURE, { _get: function(can, target, name) { return can.onfigure[name]||can.onfigure[target.getAttribute(mdb.NAME)]||can.onfigure[target.tagName] }, - svg: { // "600" grid="10" count="0" font-size="24" stroke-width="2" stroke="yellow" fill="purple"/> + svg: { // data: {copy: [html.HEIGHT, html.WIDTH]}, show: function(can, target, figure) { return can.onexport._size(can, target, figure) } }, - text: { // "60" y="10">hi - data: {points: 1, copy: [html.INNER]}, - draw: function(event, can, points, style) { var p0 = points[0]; return {x: p0.x, y: p0.y, inner: style.inner||can.user.prompt(mdb.TEXT)} }, - show: function(can, target, figure) { return can.onexport._position(can, target, figure) } - }, - rect: { // "30" width="30" rx="10" ry="10" x="60" y="10"/> + rect: { // data: {points: 2, rx: 4, ry: 4, copy: [html.HEIGHT, html.WIDTH, svg.RX, svg.RY]}, draw: function(event, can, points, style) { var p0 = points[0], p1 = points[1] return {height: Math.abs(p0.y-p1.y), width: Math.abs(p0.x-p1.x), x: Math.min(p0.x, p1.x), y: Math.min(p0.y, p1.y), rx: style.rx == undefined? this.data.rx: style.rx, ry: style.ry == undefined? this.data.ry: style.ry} }, text: function(can, target, data) { return data.x = target.Val(svg.X)+target.Val(html.WIDTH)/2, data.y = target.Val(svg.Y)+target.Val(html.HEIGHT)/2, data }, }, - block: { // "30" width="30" rx="10" ry="10" x="60" y="10"/> - data: {points: 2, rx: 4, ry: 4, copy: [html.HEIGHT, html.WIDTH, svg.RX, svg.RY]}, - draw: function(event, can, points, style) { - can._undo && can._undo(), can._temp = can.onimport.block(can, svg.G, {}, can.group) - can._undo = function() { can._temp && can.page.Remove(can, can._temp) && delete(can._temp), delete(can._undo) } - var target = can.onimport.block(can, svg.RECT, can.onfigure.rect.draw(event, can, points, style), can._temp) - if (event.type == html.CLICK) { can.onexport._pid(can, target), delete(can._temp) } - }, - text: function(can, target, data) { can.onfigure.rect.text(can, data, target) }, - }, line: { // "10" y1="50" x2="110" y2="150"/> data: {points: 2, trans: {x: svg.X1, y: svg.Y1}, copy: [svg.X1, svg.Y1, svg.X2, svg.Y2]}, grid: function(event, can, points) { var target = event.target; if (target == can.svg) { return } @@ -315,6 +311,24 @@ Volcanos(chat.ONFIGURE, { text: function(can, target, data) { return data.x = (target.Val(svg.X1)+target.Val(svg.X2))/2, data.y = (target.Val(svg.Y1)+target.Val(svg.Y2))/2, data }, show: function(can, target, figure) { return "<("+(target.Val(svg.Y2)-target.Val(svg.Y1))+mdb.FS+(target.Val(svg.X2)-target.Val(svg.X1))+")"+can.onexport._position(can, target, figure) }, }, + + text: { // hi + data: {points: 1, copy: [html.INNER]}, + draw: function(event, can, points, style) { if (event.type == "mousemove") { return } + var p0 = points[0]; return {x: p0.x, y: p0.y, inner: style.inner||can.user.prompt(mdb.TEXT)} + }, + show: function(can, target, figure) { return can.onexport._position(can, target, figure) } + }, + block: { // "30" width="30" rx="10" ry="10" x="60" y="10"/> + data: {points: 2, rx: 4, ry: 4, copy: [html.HEIGHT, html.WIDTH, svg.RX, svg.RY]}, + draw: function(event, can, points, style) { + can._undo && can._undo(), can._temp = can.onimport.block(can, svg.G, {}, can.group) + can._undo = function() { can._temp && can.page.Remove(can, can._temp) && delete(can._temp), delete(can._undo) } + var target = can.onimport.block(can, svg.RECT, can.onfigure.rect.draw(event, can, points, style), can._temp) + if (event.type == html.CLICK) { can.onexport._pid(can, target), delete(can._temp) } + }, + text: function(can, target, data) { can.onfigure.rect.text(can, data, target) }, + }, circle: { // "25" cy="75" r="20"/> data: {points: 2, trans: {height: svg.R, width: svg.R, x: svg.CX, y: svg.CY}, copy: [svg.R]}, draw: function(event, can, points) { var p0 = points[0], p1 = points[1]; return {cx: p0.x, cy: p0.y, r: parseInt(Math.sqrt(Math.pow(p0.x-p1.x, 2)+Math.pow(p0.y-p1.y, 2)))} }, @@ -327,7 +341,7 @@ Volcanos(chat.ONFIGURE, { Volcanos(chat.ONKEYMAP, { _mode: { normal: { - Escape: function(event, can) { can._undo && can._undo(), can.points = [] }, + Escape: function(event, can) { can._undo && can._undo(), can.points = [] }, gr: function(event, can) { can.Action(svg.GO, ctx.RUN) }, ga: function(event, can) { can.Action(svg.GO, ice.AUTO) }, gm: function(event, can) { can.Action(svg.GO, "manual") },