diff --git a/frame.js b/frame.js index 97a43cfc..a555a013 100644 --- a/frame.js +++ b/frame.js @@ -346,6 +346,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { }, input: function(can, item, value, target, style) { if ([html.BR, html.HR].indexOf(item.type) > -1) { return can.page.Append(can, target, [item]) } var icon = [], _item = can.base.Copy({className: "", type: "", name: ""}, item), input = can.page.input(can, _item, value) + if (item.type == html.BUTTON && !input.value) { input.value = can.user.trans(can, item.name) } if (item.type == html.TEXT) { input.onfocus = input.onfocus||function(event) { can.onmotion.selectRange(event.target) } input.onkeydown = item.onkeydown||function(event) { can.onkeymap.input(event, can), can.onkeymap.selectOutput(event, can) } input.onkeyup = item.onkeyup||function(event) { if (item.name == html.FILTER) { can.user.toast(can, "filter out "+can.page.Select(can, can._output, html.TR, function(tr, index) { @@ -414,12 +415,15 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { }); return list } ui.list = append(target, type, list||[html.PROJECT, [[html.CONTENT, html.PROFILE], html.DISPLAY]]) function calc(item, size, total) { return !ui.size[item]? can.base.isString(size)? parseInt(can.base.trimSuffix(size, "px")): size: ui.size[item] < 1? total*ui.size[item]: ui.size[item] } var defer = [], content_height, content_width; function layout(type, list, height, width) { var _width = width, _height = height; can.core.List(list, function(item) { - var target = ui[item] - if (item == html.CONTENT) { content_height = height, content_width = width - return defer.push(function() { can.page.style(can, target, html.HEIGHT, height, html.WIDTH, width) }) + if (can.base.isArray(item)) { return } + if (can.base.isObject(item)) { var meta = item; item = item._index } if (item == "plug") { return } + var target = ui[item]; if (!can.page.isDisplay(target)) { return } + if (item == html.CONTENT) { + return defer.push(function() { + content_height = height, content_width = width + can.page.style(can, target, html.HEIGHT, height, html.WIDTH, width) + }) } - if (item == "plug") { return } - if (!can.page.isDisplay(target)) { return } if (can.base.isObject(item)) { var meta = item; item = item._index } if (type == FLOW) { var h = calc(item, target.offsetHeight, height) if (can.base.isObject(meta)) { meta.layout(h, width) } can.page.style(can, target, html.WIDTH, width), height -= h @@ -471,7 +475,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { figure: function(can, meta, target, cb) { if (meta.type == html.SELECT || meta.type == html.BUTTON) { return } var input = meta.action||mdb.KEY, path = chat.PLUGIN_INPUT+input+nfs._JS; can.require([path], function(can) { function _cb(sub, value, old) { if (value == old) { return } can.base.isFunc(cb)? cb(sub, value, old): target.value = value } - target.onkeydown = function() { if (event.key == lang.ESCAPE && target._can) { return target._can.close(), target.blur() } } + target.onkeydown = function() { if (event.key == lang.ESCAPE && target._can) { return target._can.close(), target.blur() } else if (event.key == lang.ENTER) { can.base.isFunc(cb) && cb(event, target.value) } } can.core.ItemCB(can.onfigure[input], function(key, on) { var last = target[key]||function() { }; target[key] = function(event) { can.misc.Event(event, can, function(msg) { function show(sub, cb) { can.base.isFunc(cb) && cb(sub, _cb), can.onlayout.figure(event, can, sub._target, false), can.onmotion.toggle(can, sub._target, true) } can.core.CallFunc(on, {event: event, can: can, meta: meta, cb: _cb, target: target, sub: target._can, last: last, cbs: function(cb) { @@ -592,13 +596,15 @@ Volcanos(chat.ONMOTION, {_init: function(can, target) { if (can.page.ClassList.set(can, target, html.SELECT, target == which || index == which)) { can.base.isFunc(cb) && cb(target) } }); return old }, - modify: function(can, target, cb, item) { var back = target.innerHTML + modify: function(can, target, cb, item) { var back = target.innerHTML, _target = target if (back.length > 120 || back.indexOf(ice.NL) > -1) { return can.onmotion.modifys(can, target, cb) } var ui = can.page.Appends(can, target, [{type: html.INPUT, value: target.innerText, style: {width: can.base.Max(target.offsetWidth-20, 400)}, onkeydown: function(event) { switch (event.key) { case lang.ENTER: target.innerHTML = event.target.value, event.target.value == back || cb(event, event.target.value, back); break case lang.ESCAPE: target.innerHTML = back; break default: can.onkeymap.input(event, can) - } }, _init: function(target) { item && can.onappend.figure(can, item, target, cb), can.onmotion.focus(can, target), can.onmotion.delay(can, function() { target.click() }) }}]) + } }, _init: function(target) { item && can.onappend.figure(can, item, target, function(event, value) { + can.base.isFunc(cb) && cb(event, value), _target.innerText = value + }), can.onmotion.focus(can, target), can.onmotion.delay(can, function() { target.click() }) }}]) }, modifys: function(can, target, cb, item) { var back = target.innerHTML var ui = can.page.Appends(can, target, [{type: html.TEXTAREA, value: target.innerText, style: { diff --git a/index.css b/index.css index a98f0aa2..492c8ee7 100644 --- a/index.css +++ b/index.css @@ -1,3 +1,4 @@ +* { transition:background-color ease-in 3s; } * { tab-size:4; box-sizing:border-box; padding:0; border:0; margin:0; } body { background-color:black; color:cyan; font-size:16px; } legend { background-color:cadetblue; color:white; padding:0 20px; margin-right:5px; } @@ -135,9 +136,9 @@ legend, form.option, form.option>div.item, div.action, div.action>div.item, div. div.action, div.output, div.status, div.project, div.display, div.profile, div.content, table.content, table.content td, div.code, div.plug, div.story, div.toast, div.carte, fieldset.input { overflow:auto; } div.output, fieldset>div.status, div.item.textarea, div.project div.item, div.content:not(.item), div.code, div.story[data-type=spark] { clear:both; } fieldset>div.status>legend { margin-left:2px; margin-right:0; height:30px; float:right; clear:none; } -fieldset.plugin:not(.output):not(.float):not(.full):not(.cmd) { padding:10px; margin:10px; } -fieldset.plugin:not(.float):not(.full):not(.cmd)>legend { float:none; } -fieldset.auto, fieldset.full, fieldset.float, div.float { position:fixed; top:0; z-index:10; } +fieldset.Action>div.output>fieldset.plugin:not(.output):not(.float):not(.full):not(.cmd) { padding:10px; margin:10px; } +fieldset.Action>div.output>fieldset.plugin:not(.float):not(.full):not(.cmd)>legend { float:none; } +fieldset.auto, fieldset.full, fieldset.float, div.float { position:fixed; z-index:10; } fieldset.plug { position:absolute; bottom:0; right:0; } fieldset.cmd fieldset.plug { position:fixed; bottom:32px; right:0; } fieldset.plug div.output table.content { width:100%; } // fieldset.plugin>div.output>fieldset.story { position:sticky; left:0; } @@ -315,10 +316,9 @@ fieldset.xterm div.action>div.tabs.select { color:blue; } fieldset.xterm.output>div.output { overflow:hidden; } div.layout.flex>div.output { float:left; clear:none; } fieldset>div.layout { clear:both; } -fieldset.draw td.content { position:relative; } -fieldset.draw div.output div.content svg { background-color:#1b5b738c; } -fieldset.draw.spide div.output div.toggle { display:none; } -fieldset.draw.trend div.output div.toggle { display:none; } + +fieldset.draw.trend div.output svg { background-color:#1b5b738c; } +fieldset.draw.trend div.output { overflow:hidden; } fieldset.web.code.git.status>div.output table.content { width:100%; } fieldset.web.code.inner.cmd>div.output { overflow:hidden; } fieldset.web.chat.iframe>div.output { overflow:hidden; } diff --git a/lib/page.js b/lib/page.js index 4836b0f2..fbf142b1 100644 --- a/lib/page.js +++ b/lib/page.js @@ -72,13 +72,15 @@ Volcanos("page", { } else if (item.img) { var list = can.core.List(item.img); type = html.IMG, data.src = list[0] } else if (item.row) { type = html.TR, item.list = item.row.map(function(text) { return {text: [text, item.sub||html.TD]} }) } else if (item.th) { type = html.TR, item.list = item.th.map(function(text) { return {text: [text, html.TH]} }) - } else if (item.td) { type = html.TR, item.list = item.td.map(function(text) { return can.base.isObject(text)? text: {text: [text, html.TD]} }) } - if (type == html.SELECT) { data.title = can.user.trans(can, data.title||name) } + } else if (item.td) { type = html.TR, item.list = item.td.map(function(text) { return can.base.isObject(text)? text: {text: [text||"", html.TD]} }) } + // if (type == html.SELECT) { data.title = can.user.trans(can, data.title||name) } if (type == html.INPUT) { if (data.type == html.TEXT||data.type == html.PASSWORD||!data.type) { data.placeholder = (data.placeholder||name||"").split(ice.PT).pop(), data.title = can.user.trans(can, data.title||data.placeholder) data.autocomplete = data.autocomplete||"off" - } else if (data.type == html.BUTTON) { data.value = can.user.trans(can, data.value) } + } else if (data.type == html.BUTTON) { + // data.value = can.user.trans(can, data.value) + } } if (type == html.TEXTAREA) { data.placeholder = can.user.trans(can, (data.placeholder||name||"").split(ice.PT).pop()) } can.core.List(["className", "placeholder", "title"], function(key) { data[key] || delete(data[key]) }) name && (data.name = name); var node = can.page.Create(can, type, data) @@ -296,9 +298,7 @@ Volcanos("page", { libs[i] = "/require/modules/"+libs[i] } can.require(libs, cb, cbs) }, - requireDraw: function(can, cb) { can.page.ClassList.add(can, can._fields, "draw") - can.require(["/plugin/local/wiki/draw.js", "/plugin/local/wiki/draw/path.js"], function() { - can.onmotion.clear(can), can.onimport._show(can, can._msg), cb() - }) - }, + requireDraw: function(can, cb) { can.require(["/plugin/local/wiki/draw.js", "/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() + }) }, }) diff --git a/panel/search.js b/panel/search.js index 9688f9a1..1a8fa624 100644 --- a/panel/search.js +++ b/panel/search.js @@ -8,7 +8,7 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg) { can.onmotion.clear(can, can _size: function(can) { can.getActionSize(function(left, top, width, height) { can.page.style(can, can._target, {left: left||0, top: top||0, width: width}), can.page.style(can, can._output, html.MAX_HEIGHT, height -= 2*html.PLUGIN_MARGIN+html.ACTION_HEIGHT+can.onexport.statusHeight(can)) can.core.List([can.ui.content, can.ui.display], function(target) { can.page.style(can, target, html.MAX_WIDTH, can.ConfWidth(width-2*html.PLUGIN_MARGIN)) }) - can.ConfHeight(can.base.Min(height-can.ui.content.offsetHeight-can.ui.display.offsetHeight+can.onexport.statusHeight(can)-1, height/2)) + can.ConfHeight(can.base.Min(height-can.ui.content.offsetHeight-can.ui.display.offsetHeight-html.ACTION_HEIGHT-1, height/2)) }) }, _input: function(can, msg, arg, fields) { if (can.base.contains(arg[1], ";")) { arg = can.core.Split(arg[1], "\t ;", "\t ;") } can.run(can.request({}, {fields: fields.join(ice.FS)}, msg), arg, function(res) { can.db.type = arg[0] @@ -46,7 +46,7 @@ Volcanos(chat.ONACTION, {_init: function(can) { can.onmotion.hidden(can) }, list }, plugin: function(event, can, data) { if (can.base.isFunc(data.text)) { return can.onmotion.hidden(can), data.text(event) } var cmd = data.cmd == ctx.COMMAND? can.core.Keys(data.type, data.name.split(ice.SP)[0]): can.core.Keys(data.ctx, data.cmd) - var meta = {index: cmd||msg.Option(mdb.INDEX), args: cmd == web.WIKI_WORD? [data.name]: []} + var meta = {type: "plugin", index: cmd||msg.Option(mdb.INDEX), args: cmd == web.WIKI_WORD? [data.name]: []} if (data.type == cli.OPENS) { return can.runAction(event, cli.OPENS, [data.text], null, true) } if (data.type == ssh.SHELL) { meta = {index: web.CODE_XTERM, args: [data.text]} } if (data.type == ctx.INDEX) { meta = {index: data.text.split(ice.FS)[0], args: data.text.split(ice.FS).slice(1) } } diff --git a/plugin/local/code/inner.css b/plugin/local/code/inner.css index a61a35e0..2ce8ac4d 100644 --- a/plugin/local/code/inner.css +++ b/plugin/local/code/inner.css @@ -85,7 +85,7 @@ body.dark fieldset.inner>div.output div.content td.text span.datatype { color:la body.dark fieldset.inner>div.output div.content td.text span.function { color:lightgreen; } body.dark fieldset.inner>div.output div.content td.text span.constant { color:gray; } body.dark fieldset.inner>div.output div.content td.text span.string { color:orange; } -body.dark fieldset.inner>div.output div.content td.text span.object { color:gold; } +body.dark fieldset.inner>div.output div.content td.text span.object { color:silver; } body.mobile fieldset.inner>form.option input[name=file] { width:90px; } body.mobile fieldset.word fieldset.inner>form.option input[type=text] { display:none; } diff --git a/plugin/local/code/vimer.js b/plugin/local/code/vimer.js index cc96171f..cc684847 100644 --- a/plugin/local/code/vimer.js +++ b/plugin/local/code/vimer.js @@ -204,6 +204,8 @@ Volcanos(chat.ONKEYMAP, { normal: { s: shy("保存文件", function(event, can) { can.onaction.save(event, can, nfs.SAVE) }), c: shy("编译项目", function(event, can) { can.onaction.compile(event, can, code.COMPILE) }), + v: shy("渲染界面", function(event, can) { can.onaction.show(event, can) }), + r: shy("执行命令", function(event, can) { can.onaction.exec(event, can) }), Escape: shy("切换模式", function(event, can) { can.onkeymap._plugin(can) }), ArrowLeft: shy("光标左移", function(can, target) { can.onkeymap.cursorMove(target, -1) }), diff --git a/plugin/local/wiki/draw.css b/plugin/local/wiki/draw.css new file mode 100644 index 00000000..850d6f35 --- /dev/null +++ b/plugin/local/wiki/draw.css @@ -0,0 +1,27 @@ +fieldset.plugin>div.output div.project { border-right:gray solid 1px; max-width:240px; } +fieldset.plugin>div.output div.profile { border-left:gray solid 1px; max-width:240px; } +fieldset.plugin>div.output div.display { border-top:gray solid 1px; } +svg rect { transition:fill ease-in 5s; } +fieldset.draw>form.option>div.item.pid>input { width:60px; } +fieldset.draw svg text { font-size:24px; font-family:monospace; } +fieldset.draw svg rect { stroke-width:2; } +fieldset.draw svg line { stroke-width:2; } +fieldset.draw svg g[font-size] text { font-size:unset; } +fieldset.draw svg g[stroke-width] rect { stroke-width:unset; } +fieldset.draw svg g[stroke-width] line { stroke-width:unset; } +body.dark fieldset.draw svg text { stroke:white; fill:white; } +body.dark fieldset.draw svg rect { stroke:white; fill:black; } +body.dark fieldset.draw svg line { stroke:white; } +body.light fieldset.draw svg text { stroke:black; fill:black; } +body.light fieldset.draw svg rect { stroke:black; fill:white; } +body.light fieldset.draw svg line { stroke:black; } +body.light fieldset.draw svg g[fill] text { fill:unset; } +body.light fieldset.draw svg g[stroke] text { stroke:unset; } +body.light fieldset.draw svg g[stroke] line { stroke:unset; } +body.light fieldset.draw svg g[stroke] rect { stroke:unset; } +body.light fieldset.draw svg g[fill] rect { fill:unset; } +body.dark fieldset.draw svg g[fill] text { fill:unset; } +body.dark fieldset.draw svg g[stroke] text { stroke:unset; } +body.dark fieldset.draw svg g[stroke] line { stroke:unset; } +body.dark fieldset.draw svg g[stroke] rect { stroke:unset; } +body.dark fieldset.draw svg g[fill] rect { fill:unset; } diff --git a/plugin/local/wiki/draw.js b/plugin/local/wiki/draw.js index 9cb974d1..2242b874 100644 --- a/plugin/local/wiki/draw.js +++ b/plugin/local/wiki/draw.js @@ -1,85 +1,77 @@ -Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear(can) - can.onimport._show(can, msg), can.onmotion.delay(can, function() { - can.core.Item(kit.Dict(svg.GRID, 10, svg.FONT_SIZE, 24, svg.FONT_FAMILY, svg.MONOSPACE, svg.STROKE_WIDTH, 2, svg.STROKE, cli.YELLOW, svg.FILL, cli.PURPLE, - svg.GO, can.isCmdMode()? ice.AUTO: ice.RUN, svg.SHAPE, svg.RECT), function(key, value) { can.Action(key, can.svg.Value(key, can.svg.Value(key)||value)) }) - can.ondetail._select(can, can.misc.SearchHash(can)[0]||can.Option(svg.PID)||can.svg.Value(svg.PID), function(target) { can.onimport._profile(can, target), can.onmotion.toggle(can, can.ui.profile) }) - }), can.isCmdMode()? (can.keylist = [], can.onkeymap._build(can)): can.onmotion.hidden(can, can._action) - }, - _show: function(can, msg) { can.svg = null, can.group = null, can.temp = null, can.current = null, can.points = [], can._display_heights = {} - can.ui = can.onlayout.profile(can), can.page.Modify(can, can.ui.content, msg.Results()||can.onexport.content(can)), can.onmotion.hidden(can, [can.ui.project, can.ui.profile]) - 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).click() +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._index == web.WIKI_DRAW) { can.ui = can.onappend.layout(can, can._output) } else { can.ui = {content: can._output} } + can.page.Modify(can, can.ui.content, msg.Results()||can.onexport.content(can)) + 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.core.ItemCB(can.onaction, function(key, cb) { target[key] = function(event) { can.misc.Event(event, can, function(msg) { cb(event, can) }) } }) - }) + 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) }, _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 } var figure = can.onfigure._get(can, target); key = can.core.Value(figure, [svg.DATA, svg.TRANS, key])||key var _cb = can.core.Value(figure, [svg.DATA, key]); if (can.base.isFunc(_cb)) { return _cb(can, value, key, target) } - if (key == ice.SHIP) { return value != undefined && target.setAttribute(key, JSON.stringify(value)), can.base.Obj(target.getAttribute(key), []) } + if (value == ice.AUTO) { return target.removeAttribute(key) } if (key == html.INNER) { return value != undefined && (target.innerHTML = value), target.innerHTML } + if (key == ice.SHIP) { return value != undefined && target.setAttribute(key, JSON.stringify(value)), can.base.Obj(target.getAttribute(key), []) } return value != undefined && target.setAttribute(key, value), target.getAttribute(key) || can.core.Value(target[key], "baseVal.value") || can.core.Value(target[key], "baseVal") || undefined - } - target.Val = function(key, value) { return parseInt(target.Value(key, value == undefined? value: parseInt(value)||0))||0 } + }, 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 = [] for (var node = target; node && !can.page.tagis(node, html.SVG); node = node.parentNode) { can.page.tagis(node, svg.G) && node.Value(html.CLASS) && list.push(node.Value(html.CLASS)) } return list.reverse().join(ice.PT) }; return target }, - _group: function(can, target) { var name = target.Groups() + _group: function(can, target) { if (!can.ui.project) { return } var name = target.Groups() return name && can.onimport.item(can, {name: name}, function(event) { can.group = target, can.Status(svg.GROUP, name), can.onaction.show(event, can) - can.core.List([svg.FONT_SIZE, svg.STROKE_WIDTH, svg.STROKE, svg.FILL], function(key) { can.Action(key, target.Value(key)||can.Action(key)) }) + can.core.List([svg.FONT_SIZE, svg.STROKE_WIDTH, svg.STROKE, svg.FILL], function(key) { can.Action(key, target.Value(key)||ice.AUTO) }) }, function(event) { can.user.carteRight(event, can, can.onaction, can.onaction.menu_list) }, can.ui.project) }, - _profile: function(can, target) { can.misc.SearchHash(can, can.Option(svg.PID, can.svg.Value(svg.PID, can.onexport._pid(can, target)))) - if (target != can.svg && can.onmotion.cache(can, function() { return target.Value(svg.PID) }, can.ui.profile, can.ui.display)) { return can.onimport.layout(can) } + _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)]}, ].concat(can.core.List([].concat(can.core.Value(figure, "data.copy"), [svg.X, svg.Y, mdb.INDEX, ctx.ARGS]), function(key) { return key = can.core.Value(figure.data, can.core.Keys(svg.TRANS, key))||key, {td: [key, target.Value(key)], ondblclick: function(event) { - can.onmotion.modify(can, event.target, function(event, value) { - target.Value(key, value), can.ondetail._move(can, target) + can.onmotion.modify(can, event.target, function(event, value) { target.Value(key, value), can.ondetail._move(can, target) if (key == ctx.INDEX || key == ctx.ARGS) { can.onimport._display(can, target) } }, {name: key, action: "key"}) }} - })) }]), can.onimport._display(can, target) - // , can.onappend._action(can, can.ondetail.list, ui.action, {_engine: function(event, can, button) { can.ondetail[button]({target: target}, can, button) }}) + })) }]) + // 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) { can.onmotion.clear(can, can.ui.display) - target.Value(ctx.INDEX)? can.onappend.plugin(can, {index: target.Value(ctx.INDEX), args: target.Value(ctx.ARGS), height: can.ConfHeight()/2-2*html.ACTION_HEIGHT}, function(sub) { - can.onimport.layout(can), sub.onexport.output = function() { can._display_heights[target.Value(svg.PID)] = can.base.Max(sub._target.offsetHeight, can.ConfHeight()/2), can.onimport.layout(can) } - can._plugins = (can._plugins||[]).concat(sub) - }, can.ui.display): can.onimport.layout(can) + _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, "") + 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.ui.display), can.onmotion.toggle(can, can.ui.display, true) }, block: function(can, type, value, group) { group = group||can.group var target = document.createElementNS("http://www.w3.org/2000/svg", type) return group.appendChild(can.onimport._block(can, target)), target.Value(value), target }, group: function(can, name, value, group) { var target = can.onimport.block(can, svg.G, value, group||can.svg) - return target.Value(html.CLASS, name), can.onimport._group(can, target).click(), target + return target.Value(html.CLASS, name), can.onimport._group(can, target), target }, draw: function(can, value, group) { group = group||can.svg var figure = can.onfigure[value.shape], data = figure.draw({}, can, value.points, value.style||{}); can.core.Item(value.style, function(key, value) { data[key] = value }) 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) { var key = can.isCmdMode()? html.HEIGHT: html.MAX_HEIGHT - var height = can.page.isDisplay(can.ui.display)? can._display_heights[can.Option(svg.PID)]||html.ACTION_HEIGHT: 0; can.page.styleHeight(can, can.ui.display, height) - can.page.style(can, can.ui.content, key, can.ConfHeight()-height), can.page.styleHeight(can, can.ui.profile, can.ui.content.offsetHeight), can.page.styleHeight(can, can.ui.project, can.ui.content.offsetHeight+height) - can.page.styleWidth(can, can.ui.content, can.ConfWidth()-can.ui.project.offsetWidth-can.ui.profile.offsetWidth) - can.core.List(can._plugins, function(sub) { - sub.onimport.size(sub, can.ConfHeight()/2, can.ConfWidth()-can.ui.project.offsetWidth, true) - }) + layout: function(can) { can.onmotion.toggle(can, can._action, can.ConfWidth() > 1600) + 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, 1, 2, 3, 4, 5, 10, 20], - [svg.FONT_SIZE, 12, 16, 18, 24, 32], [svg.STROKE_WIDTH, 1, 2, 3, 4, 5], - [svg.STROKE, cli.RED, cli.YELLOW, cli.GREEN, cli.CYAN, cli.BLUE, cli.PURPLE, cli.BLACK, cli.WHITE], - [svg.FILL, cli.RED, cli.YELLOW, cli.GREEN, cli.CYAN, cli.BLUE, cli.PURPLE, cli.BLACK, cli.WHITE, cli.TRANSPARENT], +}, [""]) +Volcanos(chat.ONACTION, {list: [[svg.GRID, 10, 1, 2, 3, 4, 5, 10, 20], + [svg.FONT_SIZE, ice.AUTO, 12, 16, 18, 24, 32], [svg.STROKE_WIDTH, ice.AUTO, 1, 2, 3, 4, 5], + [svg.STROKE, ice.AUTO, cli.RED, cli.YELLOW, cli.GREEN, cli.CYAN, cli.BLUE, cli.PURPLE, cli.BLACK, cli.WHITE], + [svg.FILL, ice.AUTO, cli.RED, cli.YELLOW, cli.GREEN, cli.CYAN, cli.BLUE, cli.PURPLE, cli.BLACK, cli.WHITE, cli.TRANSPARENT], [svg.GO, ice.RUN, ice.AUTO, "manual"], [ice.MODE, web.DRAW, web.RESIZE], - [svg.SHAPE, svg.TEXT, svg.RECT, svg.LINE, svg.BLOCK, svg.CIRCLE, svg.ELLIPSE], + [svg.SHAPE, svg.RECT, svg.TEXT, svg.RECT, svg.LINE, svg.BLOCK, svg.CIRCLE, svg.ELLIPSE], ], _change: function(can, key, value) { can.Action(key, value), can.group.Value(key, value) }, "font-size": function(event, can, key, value) { can.onaction._change(can, key, value) }, "stroke-width": function(event, can, key, value) { can.onaction._change(can, key, value) }, @@ -97,7 +89,7 @@ Volcanos(chat.ONACTION, {list: [[svg.GRID, 1, 2, 3, 4, 5, 10, 20], clear: function(event, can) { can.onmotion.clear(can, can.group), delete(can.temp), can.points = [] }, remove: function(event, can) { can.group == can.svg || can.page.Remove(can, can.group) }, - save: function(event, can, button) { can.runAction(event, button, [can.Option(nfs.PATH), can.onexport.content(can, can.svg)]) }, + save: function(event, can, button) { can.runAction(can.request(event, {text: can.onexport.content(can, can.svg)}), button, [can.Option(nfs.PATH)]) }, edit: function(event, can) { can.Action(svg.GO, can.Action(svg.GO) == ice.RUN? ice.AUTO: ice.RUN) }, _mode: { @@ -144,14 +136,17 @@ Volcanos(chat.ONACTION, {list: [[svg.GRID, 1, 2, 3, 4, 5, 10, 20], can.onaction._figure(event, can, can.points.concat(point)) }, onclick: function(event, can) { var point = can.onexport._point(event, can) - if (can.Action(svg.GO) == ice.RUN) { return can.onimport._profile(can, event.target) } + if (can.Action(svg.GO) == ice.RUN) { return can.ondetail._select(can, event.target.Value(svg.PID)) } can.onaction._figure(event, can, can.points = can.points.concat(point)) }, 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) { return name? can.page.Select(can, can.svg, ice.PT+name, cb)[0]: null }, + _select(can, name, cb) { if (!name) { return } var target = can.page.SelectOne(can, can.svg, ice.PT+name, cb) + can.onimport._profile(can, target), can.onimport._display(can, target), can.onimport.layout(can) + return target + }, start: function(event, can) { var target = event.target var list = [target], dict = {} for (var i = 0; i < list.length; i++) { var ship = list[i].Value(svg.SHIP) @@ -215,11 +210,8 @@ Volcanos(chat.ONEXPORT, {list: [svg.GROUP, svg.FIGURE, ctx.INDEX, "pos"], 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("") + content: function(can, target) { return ['", target? target.innerHTML: "", ""]).join("") }, cursor: function(event, can, target) { var p = target.getBoundingClientRect(), q = {x: event.clientX, y: event.clientY}, pos = 5, margin = 20 @@ -273,16 +265,13 @@ 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"/> 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)} - }, + 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"/> @@ -318,15 +307,11 @@ Volcanos(chat.ONFIGURE, { }, 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)))} - }, + 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)))} }, }, ellipse: { // "75" cy="75" rx="20" ry="5"/> data: {points: 2, trans: {height: svg.RY, width: svg.RX, x: svg.CX, y: svg.CY}, copy: [svg.RY, svg.RX]}, - draw: function(event, can, points) { var p0 = points[0], p1 = points[1] - return {cx: p0.x, cy: p0.y, ry: Math.abs(p0.y - p1.y), rx: Math.abs(p0.x - p1.x)} - }, + draw: function(event, can, points) { var p0 = points[0], p1 = points[1]; return {cx: p0.x, cy: p0.y, ry: Math.abs(p0.y - p1.y), rx: Math.abs(p0.x - p1.x)} }, }, }, []) Volcanos(chat.ONKEYMAP, { diff --git a/plugin/story/json.css b/plugin/story/json.css index b5efc87c..aefad24e 100644 --- a/plugin/story/json.css +++ b/plugin/story/json.css @@ -1,8 +1,8 @@ div.output.json div.item:hover { background-color:transparent; } div.output.json div.item div.item { padding-left:15px; border:#0000000d solid 1px; border-left:lightblue dashed 1px; margin-left:5px; } -div.output.json div.item div.item:hover { border:red solid 1px; } +div.output.json div.item div.item:hover { color:unset; border:gray solid 1px; } div.output.json div.item span.nonce { color:#9cbeca4f; cursor:pointer; } -div.output.json div.item span.string { color:magenta; } -div.output.json div.item span.key { color:yellow; } -body.white div.output.json div.item span.key { color:blue; } -body.light div.output.json div.item span.key { color:blue; } +div.output.json div.item span.string { color:orange; } +// div.output.json div.item span.key { color:yellow; } +// body.white div.output.json div.item span.key { color:blue; } +// body.light div.output.json div.item span.key { color:blue; } diff --git a/plugin/story/pie.js b/plugin/story/pie.js index ab0c1784..58b2c928 100644 --- a/plugin/story/pie.js +++ b/plugin/story/pie.js @@ -1,11 +1,9 @@ -Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb, target) { - can.page.requireDraw(can, function() { - can.onimport.layout(can), can.onmotion.clear(can, can.ui.project), can.onmotion.toggle(can, can.ui.project, true) - can.onappend.table(can, msg, null, can.ui.project), can.page.Select(can, can.ui.project, html.TR, function(tr, index) { - can.page.Modify(can, tr, {onmouseenter: function(event) { can._draw(index-1) }}) - }), can.base.isFunc(cb) && cb(msg), can.onappend._status(can, [].concat(msg.append, ["weight"])) - }) - }, +Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb) { can.page.requireDraw(can, function() { + can.onaction.list = [], can.ui.display = can.page.Append(can, can._output, [html.DISPLAY])._target + can.onappend.table(can, msg, null, can.ui.display), can.page.Select(can, can.ui.display, html.TR, function(tr, index) { + can.page.Modify(can, tr, {onmouseenter: function(event) { can._draw(index-1) }}) + }), can.base.isFunc(cb) && cb(msg), can.onappend._status(can, [].concat(msg.append, ["weight"])) + }) }, _draw: function(can, msg, field, color, x, y, r, margin, which) { if (which == can._last) { return } can._last = which, field = field||mdb.VALUE if (msg.Length() == 1) { return can.onimport.draw(can, {shape: svg.CIRCLE, points: [{x: x, y: y}, {x: x, y: y+r}], style: {fill: color[0]}}) } function pos(x, y, r, angle) { angle -= 90; return [x + r * Math.cos(angle * Math.PI / 180), y + r * Math.sin(angle * Math.PI / 180)] } @@ -14,7 +12,6 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb, target) { ["M", x, y], ["L"].concat(pos(x, y, r, begin)), ["A", r, r, "0", span>180? "1": "0", "1"].concat(pos(x, y, r, begin+span)), ["Z"] ], ice.SP, ice.FS), ), onmouseenter: function(event) { can.base.isFunc(cb) && cb(event) } }) } - can.onmotion.clear(can, can.svg), can.svg.Value(mdb.COUNT, 0) var total = 0; msg.Table(function(value) { total += can.onimport._parseInt(can, value[field]) }) var begin = 0; msg[cli.COLOR] = [], msg["weight"] = [], msg.Table(function(value, index) { var span = can.onimport._parseInt(can, value[field])/total*360 @@ -32,8 +29,8 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb, target) { return parseInt(value) }, layout: function(can) { var color = ["#3300FF", "#2196F3", "#4CAF50", "#CDDC39", "#FFEB3B", "#9C27B0", "#795548", "#607D8B", "#CC33FF"] - var height = can.base.Max(can.ConfHeight(), can.ConfWidth()), margin = 20, r = height/2-margin; can.svg.Val(html.WIDTH, height), can.svg.Val(html.HEIGHT, height) + var height = can.base.Max(can.ConfHeight(), can.ConfWidth()/2), margin = 20, r = height/2-margin; can.svg.Val(html.WIDTH, height), can.svg.Val(html.HEIGHT, height) can._draw = function(which) { can.onimport._draw(can, can._msg, can.Conf(mdb.FIELD), color, r+margin, r+margin, r, margin, which) }, can._draw(0) - can.page.style(can, can.ui.project, html.MAX_WIDTH, can.ConfWidth()-height) + // can.page.style(can, can.ui.project, html.MAX_WIDTH, can.ConfWidth()-height) }, }) diff --git a/plugin/story/spide.js b/plugin/story/spide.js index 228df971..c00940bd 100644 --- a/plugin/story/spide.js +++ b/plugin/story/spide.js @@ -1,28 +1,23 @@ -Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb) { - can.page.requireDraw(can, function() { can.ConfDefault({field: msg.append[0], split: ice.PS}) - can.dir_root = can.Conf(nfs.DIR_ROOT)||msg.Option(nfs.DIR_ROOT), can._tree = can.onimport._tree(can, msg.Table(), can.Conf(mdb.FIELD), can.Conf(lex.SPLIT)) - can.base.isFunc(cb) && cb(msg), can.onimport.layout(can) +Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb) { can.page.requireDraw(can, function() { can.ConfDefault({field: msg.append[0], split: ice.PS}) + can.dir_root = can.Conf(nfs.DIR_ROOT)||msg.Option(nfs.DIR_ROOT), can._tree = can.onimport._tree(can, msg.Table(), can.Conf(mdb.FIELD), can.Conf(lex.SPLIT)) + can.onaction.list = [], can.base.isFunc(cb) && cb(msg), can.onimport.layout(can) + }) }, + _tree: function(can, list, field, split) { var node = {}; can.core.List(list, function(item) { can.core.List(item[field].split(split), function(value, index, array) { + var last = array.slice(0, index).join(split)||can.dir_root, name = array.slice(0, index+1).join(split) + value && !node[name] && (node[last] = node[last]||{name: last, meta: {}, list: []}).list.push(node[name] = { + name: value+(index==array.length-1? "": split), file: item[field]||item.file, hide: true, meta: item, list: [], last: node[last], }) - }, - _tree: function(can, list, field, split) { - var node = {}; can.core.List(list, function(item) { can.core.List(item[field].split(split), function(value, index, array) { - var last = array.slice(0, index).join(split)||can.dir_root, name = array.slice(0, index+1).join(split) - value && !node[name] && (node[last] = node[last]||{name: last, meta: {}, list: []}).list.push(node[name] = { - name: value+(index==array.length-1? "": split), file: item[field]||item.file, hide: true, meta: item, list: [], last: node[last], - }) - }) }); return node - }, + }) }); return node }, _height: function(can, tree) { tree.height = 0; if (tree.list.length == 0 || tree.hide) { return tree.height = 1 } can.core.List(tree.list, function(item) { tree.height += can.onimport._height(can, item) }); return tree.height }, _width: function(can, tree) { tree.width = 0; if (tree.list.length == 0 || tree.hide) { - return tree.width = can.onimport.draw(can, {shape: html.TEXT, points: [{x: 0, y: 0}], style: {inner: tree.name}}).Val(svg.TEXT_LENGTH)+can.margin - } can.core.List(tree.list, function(item) { tree.width += can.onimport._width(can, item) }); return tree.width - }, + return tree.width = can.onimport.draw(can, {shape: html.TEXT, points: [{x: 0, y: 0}], style: {inner: tree.name}}).Val(svg.TEXT_LENGTH)+can.margin + } can.core.List(tree.list, function(item) { tree.width += can.onimport._width(can, item) }); return tree.width }, _color: function(can, tree) { return tree.meta.color || (tree.list == 0? cli.PURPLE: cli.YELLOW) }, layout: function(can) { can.page.style(can, can._output, html.MAX_HEIGHT, "") - can.svg && can.svg.Val(svg.FONT_SIZE, can.size = parseInt(can.Action(html.SIZE))), can.margin = parseInt(can.Action(html.MARGIN)) - can.core.CallFunc(can.onaction[can.Action(ice.VIEW)], [event, can, can.Action(ice.VIEW)]) + can.svg && can.svg.Val(svg.FONT_SIZE, can.size = parseInt(can.Action(html.SIZE)||24)), can.margin = parseInt(can.Action(html.MARGIN)||10) + can.core.CallFunc(can.onaction[can.Action(ice.VIEW)||"横向"], [event, can, can.Action(ice.VIEW)]) }, }) Volcanos(chat.ONACTION, {list: [[ice.VIEW, "横向", "纵向"], [html.SIZE, 24, 32, 48], [html.MARGIN, 10, 30, 50]], @@ -56,40 +51,19 @@ Volcanos(chat.ONACTION, {list: [[ice.VIEW, "横向", "纵向"], [html.SIZE, 24, }) }, }) +Volcanos(chat.ONEXPORT, {list: ["time", "count"]}) Volcanos(chat.ONDETAIL, { - onmouseenter: function(event, can, tree) { var view = tree.view, width = can.Action(ice.VIEW) == "纵向"? view.Val(svg.TEXT_LENGTH)/2: 0 - can.page.Remove(can, can.pos), can.pos = can.onimport.draw(can, {shape: svg.RECT, points: [ - {x: view.Val(svg.X)-width-can.margin/2, y: view.Val(svg.Y)-(can.size+can.margin/2)/2}, {x: view.Val(svg.X)-width+view.Val(svg.TEXT_LENGTH)+can.margin/2, y: view.Val(svg.Y)+(can.size+can.margin/2)/2}, - ], style: {stroke: cli.RED, fill: html.NONE}}), can.onkeymap.prevent(event) - }, onclick: function(event, can, tree) { - if (tree.list.length > 0 || tree.tags || tree.name.endsWith(can.Conf(lex.SPLIT))) { - return tree.hide = !tree.hide, can.onaction[can.Action(ice.VIEW)](event, can) - } + if (tree.list.length > 0 || tree.name.endsWith(can.Conf(lex.SPLIT))) { return tree.hide = !tree.hide, can.onaction[can.Action(ice.VIEW)||"横向"](event, can) } for (var node = tree; node; node = node.last) { can.request(event, node.meta) } - can.run(can.request(event, can.Option()), can.base.Obj(can.Conf(lex.PREFIX), []).concat([can.Option("repos")||"", tree.file||"", tree.name]), function(msg) { + can.run(can.request(event, can.Option()), can.base.Obj(can.Conf(lex.PREFIX), []).concat([tree.file||"", tree.name]), function(msg) { if (msg.Length() == 0) { return can.ondetail.plugin(can, web.CODE_INNER, [can._msg.Option(nfs.DIR_ROOT), tree.file, tree.line], code.INNER) } - if (msg.Append(mdb.INDEX)) { msg.Table(function(value) { can.ondetail.plugin(can, value.index, []) }); return } - - if (msg.Option(lex.SPLIT)) { - tree.list = can.onimport._tree(can, msg.Table(), msg.Option(mdb.FIELD)||msg.append[0], msg.Option(lex.SPLIT))[can.dir_root].list||[] - can.core.List(tree.list, function(item) { item.last = tree }) - } else { - msg.Table(function(item) { tree.list.push({ - type: "tags", name: item.name||item.file||item[msg.append[0]], - file: item.file, line: item.line, hide: true, - meta: item, list: [], last: tree, - }) }) - } tree.tags = true, tree.hide = !tree.hide, can.onaction[can.Action(ice.VIEW)](event, can) + if (msg.Append(mdb.INDEX)) { return msg.Table(function(value) { can.ondetail.plugin(can, value.index, value.args) }) } }, true) }, - plugin: function(can, index, args, prefix) { - can.onappend.plugin(can, {mode: chat.FLOAT, index: index, args: args}, function(sub) { - sub.run = function(event, cmds, cb) { can.runAction(event, prefix||[ice.RUN, index], cmds, cb) } - can.getActionSize(function(left, top, width, height) { var margin = 100; left = left||0, top = top||0 - sub.ConfHeight(height-margin-2*html.ACTION_HEIGHT), sub.ConfWidth(width), can.page.style(can, sub._status, html.DISPLAY, html.BLOCK) - can.onmotion.move(can, sub._target, {left: left, top: top+margin}) - }), sub.onaction.close = function() { can.page.Remove(can, sub._target) } - }) - }, + plugin: function(can, index, args, prefix) { can.onappend.plugin(can, {mode: chat.FLOAT, index: index, args: args}, function(sub) { + can.getActionSize(function(left, top, width, height) { var margin = 100; left = left||0, top = top||0 + sub.onimport.size(sub, height/2-margin-html.ACTION_HEIGHT, width, true), can.onmotion.move(can, sub._target, {left: left, top: top+margin}) + }), sub.onaction.close = function() { can.page.Remove(can, sub._target) } + }) }, }) diff --git a/plugin/story/trend.js b/plugin/story/trend.js index 735d7796..c57c746c 100644 --- a/plugin/story/trend.js +++ b/plugin/story/trend.js @@ -1,53 +1,31 @@ -Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb) { can.page.requireDraw(can, function() { - can.data = msg.Table(), can.base.isFunc(cb) && cb(msg), can.onimport.layout(can) +Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb) { can.page.requireDraw(can, function() { can.base.isFunc(cb) && cb(msg) + can.Conf(ice.VIEW) && can.Action(ice.VIEW, can.Conf(ice.VIEW)), can.onmotion.toggle(can, can._option, !can.user.isMobile || !can.isFullMode()) + can.data = msg.Table(), can.onimport.layout(can) }) }, _sum: function(can) { if (can.list) { return can.list } var begin = "", count = 0, rest = 0, add = 0, del = 0, max = 0 can.max = 0, can.min = 0, can.list = can.core.List(can.data, function(value, index) { - var item = { - date: value[can._msg.append[0]], - text: value[can._msg.append[4]], - add: parseInt(value[can._msg.append[1]]), - del: parseInt(value[can._msg.append[2]]), - } - - item.begin = rest - item.max = rest + item.add - item.min = rest - item.del - item.close = rest + item.add - item.del - - begin = begin || item.date, count++ - rest = item.close, add += item.add, del += item.del - + var item = {date: value[can._msg.append[0]], text: value[can._msg.append[4]], add: parseInt(value[can._msg.append[1]]), del: parseInt(value[can._msg.append[2]])} + item.begin = rest, item.max = rest + item.add, item.min = rest - item.del, item.close = rest + item.add - item.del + begin = begin || item.date, count++, rest = item.close, add += item.add, del += item.del if (item.max - item.min > max) { max = item.max - item.min } if (item.max > can.max) { can.max = item.max } if (item.min < can.min) { can.min = item.min } return item - }) - can.Status({"from": begin, "commit": count, "total": add+del, "max": max}) + }), can.Status({"from": begin, "commit": count, "total": add+del, "max": max}) return can.list }, - _layout: function(can) { - var height = can.onexport.height(can), width = parseInt(can.ConfWidth()) - can.onmotion.clear(can, can._output), can.onimport._show(can, can._msg) - can.svg.Val(html.HEIGHT, height), can.svg.Val(html.WIDTH, width) + _layout: function(can) { var height = can.onexport.height(can), width = parseInt(can.ConfWidth()) + can.onmotion.clear(can, can.svg), can.svg.Val(html.HEIGHT, height), can.svg.Val(html.WIDTH, width) var margin = parseInt(can.Action(html.MARGIN)), step = parseFloat((width-2*margin) / can._msg.Length()) + can.page.style(can, can._output, html.MAX_HEIGHT, "") return {height: height, width: width, margin: margin, step: step} }, - layout: function(can) { - can.onmotion.toggle(can, can._option, !can.user.isMobile || !can.isFullMode()) - can.Conf(ice.VIEW) && can.Action(ice.VIEW, can.Conf(ice.VIEW)) - can.core.CallFunc(can.onaction[can.Action(ice.VIEW)], [{}, can]) - }, - transform: function(can, target) { - target.Value("transform", "translate(0, "+parseInt(can.ConfHeight())+") scale(1, -1)") - }, + layout: function(can) { can.data && can.core.CallFunc(can.onaction[can.Action(ice.VIEW)], [{}, can]) }, + transform: function(can, target) { target.Value("transform", "translate(0, "+parseInt(can.ConfHeight())+") scale(1, -1)") }, }) -Volcanos(chat.ONACTION, {list: [ - [ice.VIEW, "趋势图", "柱状图", "折线图", "数据源"], - [html.HEIGHT, ice.AUTO, 100, 200, 400, 600, 800], - [html.MARGIN, 10, 20, 50, 100], - [html.SPEED, 10, 20, 50, 100], +Volcanos(chat.ONACTION, {list: [[ice.VIEW, "趋势图", "柱状图", "折线图", "数据源"], + [html.HEIGHT, ice.AUTO, 100, 200, 400, 600, 800], [html.MARGIN, 10, 20, 50, 100], [html.SPEED, 10, 20, 50, 100], ], "趋势图": function(event, can) { var args = can.onimport._layout(can) function scale(y) { return (y - can.min)/(can.max - can.min)*(args.height-2*args.margin) } @@ -55,16 +33,9 @@ Volcanos(chat.ONACTION, {list: [ var black = can.onimport.group(can, cli.BLACK, kit.Dict(svg.STROKE, cli.BLACK, svg.FILL, cli.BLACK)) var white = can.onimport.group(can, cli.WHITE, kit.Dict(svg.STROKE, cli.WHITE, svg.FILL, cli.WHITE)) can.core.Next(can.onimport._sum(can), function(item, next, index) { can.core.Timer(parseInt(can.Action(html.SPEED)), next), can.Status(item) - can.onimport.draw(can, {shape: svg.LINE, points: [ - order(index, args.step/2, item.min), order(index, args.step/2, item.max), - ]}, item.begin < item.close? white: black) - - can.onimport.draw(can, {shape: svg.RECT, points: [ - order(index, args.step/4, item.close), order(index, args.step/4*3, item.begin), - ], style: {rx: 0, ry:0}, _init: function(target) { - can.core.ItemCB(can.ondetail, function(key, cb) { target[key] = function(event) { can.misc.Event(event, can, function(msg) { - cb(event, can, item) - }) } }) + can.onimport.draw(can, {shape: svg.LINE, points: [order(index, args.step/2, item.min), order(index, args.step/2, item.max)]}, item.begin < item.close? white: black) + can.onimport.draw(can, {shape: svg.RECT, points: [order(index, args.step/4, item.close), order(index, args.step/4*3, item.begin)], style: {rx: 0, ry:0}, _init: function(target) { + can.core.ItemCB(can.ondetail, function(key, cb) { target[key] = function(event) { can.misc.Event(event, can, function(msg) { cb(event, can, item) }) } }) }}, item.begin < item.close? white: black) }) }, @@ -76,9 +47,7 @@ Volcanos(chat.ONACTION, {list: [ can.core.List(can.base.Obj(can.Conf(mdb.FIELD), can._msg.append), function(field) { var max = can.data[0][field], min = can.data[0][field] for (var i = 1; i < can.data.length; i += 1) { var value = can.data[i][field]; if (value > max) { max = value } if (value < min) { min = value } } function order(i) { return i*args.step+args.margin } function scale(y) { return (y - min)/(max - min)*(args.height-2*args.margin)+args.margin } - for (var i = 1; i < can.data.length; i += 1) { - can.onimport.draw(can, {shape: svg.LINE, points: [{x: order(i-1), y: scale(can.data[i-1][field])}, {x: order(i), y: scale(can.data[i][field])}]}, group) - } + for (var i = 1; i < can.data.length; i += 1) { can.onimport.draw(can, {shape: svg.LINE, points: [{x: order(i-1), y: scale(can.data[i-1][field])}, {x: order(i), y: scale(can.data[i][field])}]}, group) } }) }, "柱状图": function(event, can) { var args = can.onimport._layout(can) @@ -91,22 +60,17 @@ Volcanos(chat.ONACTION, {list: [ function order(i) { return i*args.step+args.margin } function scale(y) { return (y - min)/(max - min)*(args.height-2*args.margin)+args.margin } can.core.Next(can.data, function(item, next, i) { can.core.Timer(parseInt(can.Action(html.SPEED)), next) can.onimport.draw(can, {shape: svg.RECT, style: {rx: 0, ry: 0}, points: [{x: order(i)+args.step/8.0, y: args.margin}, {x: order(i)+args.step/8.0*7, y: scale(item[field])}], _init: function(target) { - can.core.ItemCB(can.ondetail, function(key, cb) { target[key] = function(event) { can.misc.Event(event, can, function(msg) { - cb(event, can, item) - }) } }) + can.core.ItemCB(can.ondetail, function(key, cb) { target[key] = function(event) { can.misc.Event(event, can, function(msg) { cb(event, can, item) }) } }) }}, group) }) }) }, "数据源": function(event, can) { can.onmotion.clear(can), can.onappend.table(can, can._msg) }, - height: function(event, can) { can.onimport.layout(can) }, margin: function(event, can) { can.onimport.layout(can) }, speed: function(event, can) { can.onimport.layout(can) }, }) -Volcanos(chat.ONDETAIL, { - onmouseenter: function(event, can, item) { can.Status(item) }, -}) +Volcanos(chat.ONDETAIL, { onmouseenter: function(event, can, item) { can.Status(item) }, }) Volcanos(chat.ONEXPORT, {list: ["from", "commit", "total", "max", "date", "text", "add", "del"], height: function(can) { var height = can.Action(html.HEIGHT) if (height == ice.AUTO) { height = can.ConfHeight() } if (height < 200) { height = 200 } diff --git a/proto.js b/proto.js index 8c636716..8a2665f4 100644 --- a/proto.js +++ b/proto.js @@ -85,11 +85,9 @@ var web = {CHAT: "chat", IMAGE_PNG: "image/png", VIDEO_WEBM: "video/webm", CODE_GIT_STATUS: "web.code.git.status", - CODE_XTERM: "web.code.xterm", - CODE_VIMER: "web.code.vimer", - CODE_INNER: "web.code.inner", CHAT_FAVOR: "web.chat.favor", - WIKI_WORD: "web.wiki.word", + CODE_XTERM: "web.code.xterm", CODE_VIMER: "web.code.vimer", CODE_INNER: "web.code.inner", + WIKI_WORD: "web.wiki.word", WIKI_DRAW: "web.wiki.draw", WIKI_FEEL: "web.wiki.feel", TEAM_PLAN: "web.team.plan", } var aaa = { @@ -152,6 +150,7 @@ var wiki = { FIELD: "field", LOCAL: "local", PARSE: "parse", NAVMENU: "navmenu", PREMENU: "premenu", CONTENT: "content", STORY_ITEM: ".story", H2: "h2.story", H3: "h3.story", + DRAW: "draw", } var chat = { LIB: "lib", PAGE: "page", PANEL: "panel", PLUGIN: "plugin", STORY: "story", PLUG: "plug",