liubin/volcanos
1
0
Fork 0
forked from x/volcanos
Code Pull Requests Activity

opt draw

Browse Source
This commit is contained in:
shaoying 2022-11-06 18:12:37 +08:00
parent e5922c6d1d
commit 7dfada5990
3 changed files with 55 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
lib/misc.js
View File

@ -173,7 +173,10 @@ Volcanos("misc", {Message: function(event, can) { var msg = {}
return can.base.MergeURL(location.origin+path+(clear?"":location.search), objs) return can.base.MergeURL(location.origin+path+(clear?"":location.search), objs)
}, },
SearchOrConf: function(can, key, def) { return can.base.getValid(can.misc.Search(can, key), can.Conf(key), def) }, SearchOrConf: function(can, key, def) { return can.base.getValid(can.misc.Search(can, key), can.Conf(key), def) },
SearchHash: function(can) { return can.isCmdMode() && can._index == can.misc.Search(can, ice.CMD)? can.core.Split(decodeURIComponent(location.hash.slice(1)))||[]: [] }, SearchHash: function(can) { if (!can.isCmdMode()) { return [] }
if (arguments.length > 1) { location.hash = encodeURIComponent(can.core.List(arguments).slice(1).join(ice.FS)) }
return can.core.Split(decodeURIComponent(location.hash.slice(1)))||[]
},
Search: function(can, key, value) { var args = {} Search: function(can, key, value) { var args = {}
if (value == undefined && can.base.isString(key)) { var ls = location.pathname.split(ice.PS); if (ls[1] == chat.SHARE) { args[chat.SHARE] = ls[2] } if (value == undefined && can.base.isString(key)) { var ls = location.pathname.split(ice.PS); if (ls[1] == chat.SHARE) { args[chat.SHARE] = ls[2] }
for (var i = 2; i < ls.length; i += 2) { if (kit.Dict(ice.POD, true, ice.CMD, true, web.WEBSITE, true)[ls[i]]) { args[ls[i]] = ls[i+1] } } for (var i = 2; i < ls.length; i += 2) { if (kit.Dict(ice.POD, true, ice.CMD, true, web.WEBSITE, true)[ls[i]]) { args[ls[i]] = ls[i+1] } }

118
plugin/local/wiki/draw.js
View File

@ -3,9 +3,9 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear(
can.core.Item(kit.Dict(svg.FONT_SIZE, 24, svg.FONT_FAMILY, svg.MONOSPACE, svg.STROKE_WIDTH, 2, svg.STROKE, cli.YELLOW, svg.FILL, cli.PURPLE, can.core.Item(kit.Dict(svg.FONT_SIZE, 24, svg.FONT_FAMILY, svg.MONOSPACE, svg.STROKE_WIDTH, 2, svg.STROKE, cli.YELLOW, svg.FILL, cli.PURPLE,
"go", ice.RUN, svg.SHAPE, svg.RECT, svg.GRID, 10, "go", ice.RUN, svg.SHAPE, svg.RECT, svg.GRID, 10,
), function(key, value) { can.svg.Value(key, can.Action(key, can.svg.Value(key)||value)) }) ), function(key, value) { can.svg.Value(key, can.Action(key, can.svg.Value(key)||value)) })
var pid = can.Option(svg.PID)||can.svg.Value(svg.PID); if (!pid) { return } var pid = can.Option(svg.PID)||can.misc.SearchHash(can)[0]||can.svg.Value(svg.PID); if (!pid) { return }
can.page.Select(can, can.svg, ice.PT+pid, function(target) { can.onimport._profile(can, target), can.ondetail.run({target: target}, can) }) can.page.Select(can, can.svg, ice.PT+pid, function(target) { can.onimport._profile(can, target), can.ondetail.run({target: target}, can) })
}), can.keylist = [], can.onkeymap._build(can), can.onmotion.hidden(can, can._action) }), 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.point = [] _show: function(can, msg) { can.svg = null, can.group = null, can.temp = null, can.current = null, can.point = []
can.ui = can.onlayout.profile(can), can.page.Modify(can, can.ui.content, msg.Result()||can.onexport.content(can)), can.onmotion.hidden(can, can.ui.project) can.ui = can.onlayout.profile(can), can.page.Modify(can, can.ui.content, msg.Result()||can.onexport.content(can)), can.onmotion.hidden(can, can.ui.project)
@ -14,6 +14,23 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear(
can.core.ItemCB(can.onaction, function(key, cb) { target[key] = function(event) { cb(event, can) } }) can.core.ItemCB(can.onaction, function(key, cb) { target[key] = function(event) { cb(event, can) } })
}), can.page.style(can, can.ui.display, html.MIN_HEIGHT, 80, html.MAX_HEIGHT, can.ConfHeight()-can.svg.Val(html.HEIGHT)-52) }), can.page.style(can, can.ui.display, html.MIN_HEIGHT, 80, html.MAX_HEIGHT, can.ConfHeight()-can.svg.Val(html.HEIGHT)-52)
}, },
_block: function(can, target) {
target.Value = function(key, value) { if (can.base.isUndefined(key)) { return } if (can.base.isObject(key)) { can.core.Item(key, target.Value); return }
var figure = can.onfigure._get(can, target); key = can.core.Value(figure, ["data", "trans", key])||key
var _cb = can.core.Value(figure, ["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 (key == html.INNER) { return value != undefined && (target.innerHTML = value), target.innerHTML }
return value != undefined && target.setAttribute(key, value), target.getAttribute(key) || can.core.Value(target[key], "baseVal.value") || can.core.Value(target[key], "baseVal") || ""
}
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)
}
target.oncontextmenu = function(event) { can.page.style(can, can.user.carte(event, can, can.ondetail)._target, {left: event.clientX, top: event.clientY}) }
return target
},
_group: function(can, target) { var name = target.Groups() _group: function(can, target) { var name = target.Groups()
return name && can.onimport.item(can, {name: name}, function(event) { can.group = target return name && can.onimport.item(can, {name: name}, function(event) { can.group = target
can.core.List([svg.STROKE_WIDTH, svg.STROKE, svg.FILL, svg.FONT_SIZE], function(key) { can.core.List([svg.STROKE_WIDTH, svg.STROKE, svg.FILL, svg.FONT_SIZE], function(key) {
@ -21,67 +38,38 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.onmotion.clear(
}), can.onaction.show(event, can), can.Status(svg.GROUP, name) }), can.onaction.show(event, can), can.Status(svg.GROUP, name)
}, function(event) { can.user.carteRight(event, can, can.onaction, can.onaction.menu_list) }, can.ui.project) }, function(event) { can.user.carteRight(event, can, can.onaction, can.onaction.menu_list) }, can.ui.project)
}, },
_block: function(can, target) { _profile: function(can, target, list) { can.misc.SearchHash(can, can.Option(svg.PID, can.onexport._pid(can, target)))
target.Val = function(key, value) { return parseInt(target.Value(key, value == undefined? value: parseInt(value)||0))||0 }
target.Value = function(key, value) { if (can.base.isUndefined(key)) { return }
if (can.base.isObject(key)) { can.core.Item(key, target.Value); return }
var figure = can.onfigure._get(can, target); key = can.core.Value(figure, ["data", "trans", key])||key
var _cb = can.core.Value(figure, ["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 (key == html.INNER) { return value != undefined && (target.innerHTML = value), target.innerHTML }
return value != undefined && target.setAttribute(key, value), target.getAttribute(key||html.CLASS)
|| target[key]&&target[key].baseVal&&target[key].baseVal.value || target[key]&&target[key].baseVal || ""
}
target.Group = function() { for (var item = target; item; item = item.parentNode) { if (can.page.tagis(item, svg.G, html.SVG)) { return item } } return can.svg }
target.Groups = function() { var list = []; if (target == can.svg) { return html.SVG }
for (var item = target; item && !can.page.tagis(item, html.SVG); item = item.parentNode) { can.page.tagis(item, svg.G) && item.Value(html.CLASS) && list.push(item.Value(html.CLASS)) }
return list.reverse().join(ice.PT)
}
target.oncontextmenu = function(event) {
var carte = can.user.carte(event, can, can.ondetail, null, function(ev, button, meta) { meta[button](event, can, button) })
can.page.style(can, carte._target, {left: event.clientX, top: event.clientY})
}
return target
},
_profile: function(can, target, list) { can.Option(svg.PID, can.onexport._pid(can, target))
if (can.onmotion.cache(can, function() { return target.Value(svg.PID) }, can.ui.profile, can.ui.display)) { return } if (can.onmotion.cache(can, function() { return target.Value(svg.PID) }, can.ui.profile, can.ui.display)) { return }
var ui = can.page.Append(can, can.ui.profile, [html.ACTION, html.OUTPUT]) var figure = can.onfigure._get(can, target), ui = can.page.Append(can, can.ui.profile, [html.OUTPUT, html.ACTION])
can.onappend._action(can, can.ondetail.list, ui.action, {_engine: function(event, can, button) { can.ondetail[button]({target: target}, can, button) }}) can.page.Append(can, ui.output, [{view: [html.CONTENT, html.TABLE], list: [
var figure = can.onfigure._get(can, target); can.page.Append(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)]}, {th: [mdb.KEY, mdb.VALUE]}, {td: [mdb.TYPE, target.tagName]}, {td: [svg.PID, target.Value(svg.PID)]},
].concat(can.core.List((list||[]).concat(figure.data.copy, [svg.X, svg.Y, mdb.INDEX, ctx.ARGS]), function(key) { ].concat(can.core.List((list||[]).concat(figure.data.copy, [svg.X, svg.Y, mdb.INDEX, ctx.ARGS]), function(key) {
return key = can.core.Value(figure.data, can.core.Keys("trans", key))||key, {td: [key, target.Value(key)], ondblclick: function(event) { return key = can.core.Value(figure.data, can.core.Keys("trans", key))||key, {td: [key, target.Value(key)], ondblclick: function(event) {
can.onmotion.modify(can, event.target, function(event, value, old) { target.Value(key, value), can.ondetail._move(can, target) }) can.onmotion.modify(can, event.target, function(event, value, old) { target.Value(key, value), can.ondetail._move(can, target) })
}} }}
})) }]) })) }]), can.onappend._action(can, can.ondetail.list, ui.action, {_engine: function(event, can, button) { can.ondetail[button]({target: target}, can, button) }})
},
block: function(can, type, value, group) { group = group||can.group||can.svg
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)
return target.Value(html.CLASS, name), can.onimport._group(can, target).click(), target
}, },
draw: function(event, can, value, group) { draw: function(event, can, value, group) {
var figure = can.onfigure[value.shape], data = figure.draw(event, can, value.point, value.style); can.core.Item(value.style, function(key, value) { data[key] = value }) var figure = can.onfigure[value.shape], data = figure.draw(event, can, value.point, 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.group||can.svg); can.core.ItemCB(value, function(key, cb) { target[key] = cb }) var target = can.onimport.block(can, figure.data.name||value.shape, data, group); can.core.ItemCB(value, function(key, cb) { target[key] = cb })
return can.onimport._block(can, target), value._init && value._init(target), target return value._init && value._init(target), target
},
group: function(can, name, value, group) { group = group||can.group||can.svg
var g = document.createElementNS('http://www.w3.org/2000/svg', svg.G); group.append(g)
can.onimport._block(can, g), g.Value(html.CLASS, name), can.onimport._group(can, g).click()
return value && g.Value(value), g
},
block: function(can, type, value, target) {
var _target = document.createElementNS("http://www.w3.org/2000/svg", type)
return target.appendChild(can.onimport._block(can, _target)), _target.Value(value), _target
}, },
}, [""]) }, [""])
Volcanos(chat.ONACTION, {list: [ Volcanos(chat.ONACTION, {list: [[svg.GRID, 1, 2, 3, 4, 5, 10, 20],
[svg.FONT_SIZE, 12, 16, 18, 24, 32], [svg.FONT_SIZE, 12, 16, 18, 24, 32], [svg.STROKE_WIDTH, 1, 2, 3, 4, 5],
[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.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, "#0000"], [svg.FILL, cli.RED, cli.YELLOW, cli.GREEN, cli.CYAN, cli.BLUE, cli.PURPLE, cli.BLACK, cli.WHITE, "#0000"],
["go", ice.RUN, ice.AUTO, "manual"], ["go", ice.RUN, ice.AUTO, "manual"], [ice.MODE, "draw", web.RESIZE],
["mode", "draw", "resize"],
[svg.SHAPE, svg.TEXT, svg.CIRCLE, svg.ELLIPSE, svg.RECT, svg.LINE, svg.BLOCK], [svg.SHAPE, svg.TEXT, svg.CIRCLE, svg.ELLIPSE, svg.RECT, svg.LINE, svg.BLOCK],
[svg.GRID, 1, 2, 3, 4, 5, 10, 20], ], _change: function(can, key, value) { can.Action(key, value), can.group.Value(key, value) },
], menu_list: [ice.HIDE, ice.SHOW, mdb.CREATE, web.CLEAR, mdb.REMOVE],
_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) }, "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) }, "stroke-width": function(event, can, key, value) { can.onaction._change(can, key, value) },
stroke: function(event, can, key, value) { can.onaction._change(can, key, value) }, stroke: function(event, can, key, value) { can.onaction._change(can, key, value) },
@ -91,31 +79,25 @@ Volcanos(chat.ONACTION, {list: [
mode: 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) }, shape: function(event, can, key, value) { can.Action(key, value) },
edit: function(event, can) { can.Action("go", can.Action("go") == ice.RUN? ice.AUTO: ice.RUN) }, menu_list: [ice.HIDE, ice.SHOW, mdb.CREATE, web.CLEAR, mdb.REMOVE],
save: function(event, can, button) { can.runAction(can.request(event, {text: can.onexport.content(can, can.svg)}), button, [can.Option(nfs.PATH)]) },
hide: function(event, can) { can.onmotion.hide(can, {interval: 100, length: 10}, null, can.group) }, 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) }, show: function(event, can) { can.onmotion.show(can, {interval: 10, length: 1}, null, can.group) },
create: function(event, can) { can.user.input(event, can, [svg.GROUP], function(list) { can.onimport.group(can, list[0]) }) }, create: function(event, can) { can.user.input(event, can, [svg.GROUP], function(list) { can.onimport.group(can, list[0]) }) },
clear: function(event, can) { can.onmotion.clear(can, can.group), delete(can.temp), can.point = [] }, clear: function(event, can) { can.onmotion.clear(can, can.group), delete(can.temp), can.point = [] },
remove: function(event, can) { if (can.group == can.svg) { return } can.page.Remove(can, can.group) }, remove: function(event, can) { can.group == can.svg || can.page.Remove(can, can.group) },
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("go", can.Action("go") == ice.RUN? ice.AUTO: ice.RUN) },
_mode: { _mode: {
run: function(event, can) { can.onimport._profile(can, event.target) },
draw: function(event, can, point) { var shape = can.Action(svg.SHAPE), figure = can.onfigure[shape] draw: function(event, can, point) { var shape = can.Action(svg.SHAPE), figure = can.onfigure[shape]
if (event.type == html.CLICK) {
debugger
}
figure.grid && figure.grid(event, can, point); if (figure.data.points && figure.data.points != point.length) { return } figure.grid && figure.grid(event, can, point); if (figure.data.points && figure.data.points != point.length) { return }
var data = figure.draw && figure.draw(event, can, point, {}), target = data && can.onimport.block(can, figure.data.name||shape, data, can.group) var data = figure.draw && figure.draw(event, can, point, {}), target = data && can.onimport.block(can, figure.data.name||shape, data, can.group)
if (event.type == html.CLICK) { can.point = []; if (target) { if (event.type == html.CLICK) { can.point = []; if (target) { var pid = can.onexport._pid(can, target)
var pid = can.onexport._pid(can, target); can.core.List(point, function(p, i) { if (!p.target) { return } can.core.List(point, function(p, i) { p.target && p.target.Value(ice.SHIP, p.target.Value(ice.SHIP).concat([{pid: pid, which: i+1, anchor: p.anchor}])) })
p.target.Value(ice.SHIP, p.target.Value(ice.SHIP).concat([{pid: pid, which: i+1, anchor: p.anchor}])) } } return target
})
} }
return target
}, },
resize: function(event, can, point, target) { target = target||event.target resize: function(event, can, point) { var target = event.target
if (event.type == html.CLICK) { if (point.length > 1) { return can.point = [], delete(can.current) } if (event.type == html.CLICK) { if (point.length > 1) { return can.point = [], delete(can.current) }
return can.current = {target: target, begin: can.core.List([target], function(target) { if (can.page.tagis(target, svg.G)) { return } return can.current = {target: target, begin: can.core.List([target], function(target) { if (can.page.tagis(target, svg.G)) { return }
return {target: target, height: target.Val(html.HEIGHT), width: target.Val(html.WIDTH), x: target.Val(svg.X), y: target.Val(svg.Y), return {target: target, height: target.Val(html.HEIGHT), width: target.Val(html.WIDTH), x: target.Val(svg.X), y: target.Val(svg.Y),
@ -140,17 +122,17 @@ Volcanos(chat.ONACTION, {list: [
default: can.Action(ice.MODE, "draw"), can.Action(svg.SHAPE, svg.LINE) default: can.Action(ice.MODE, "draw"), can.Action(svg.SHAPE, svg.LINE)
} } } }
}, },
_figure: function(event, can, points, target) { can.temp && can.page.Remove(can, can.temp) && delete(can.temp) _figure: function(event, can, points) { can.temp && can.page.Remove(can, can.temp) && delete(can.temp)
can.temp = can.core.CallFunc([can.onaction._mode, can.Action(ice.MODE)], [event, can, points, target]), can.point.length == 0 && delete(can.temp) can.temp = can.core.CallFunc([can.onaction._mode, can.Action(ice.MODE)], [event, can, points]), can.point.length == 0 && delete(can.temp)
}, },
onmouseover: function(event, can) { can.onexport._show(can, event.target) },
onmousemove: function(event, can) { var point = can.onexport._point(event, can) onmousemove: function(event, can) { var point = can.onexport._point(event, can)
if (can.Action("go") == ice.RUN) { return } can.onexport.cursor(event, can, event.target) if (can.Action("go") == ice.RUN) { return } can.onexport.cursor(event, can, event.target)
if (can.Action("go") == ice.AUTO) { can.onaction._auto(can, event.target) } if (can.Action("go") == ice.AUTO) { can.onaction._auto(can, event.target) }
can.onaction._figure(event, can, can.point.concat(point)) can.onaction._figure(event, can, can.point.concat(point))
}, },
onmouseover: function(event, can) { can.onexport._show(can, event.target) },
onclick: function(event, can) { var point = can.onexport._point(event, can) onclick: function(event, can) { var point = can.onexport._point(event, can)
if (can.Action("go") == ice.RUN) { return can.onimport._profile(can, event.target), event.shiftKey? can.onaction._mode.run(event, can): can.ondetail.run(event, can) } if (can.Action("go") == ice.RUN) { return can.onimport._profile(can, event.target) }
can.onaction._figure(event, can, can.point = can.point.concat(point)) can.onaction._figure(event, can, can.point = can.point.concat(point))
}, },
ondblclick: function(event, can) { can.ondetail.label(event, can) }, ondblclick: function(event, can) { can.ondetail.label(event, can) },

2
proto.js
View File

@ -72,7 +72,7 @@ var aaa = {
} }
var web = { var web = {
SPACE: "space", DREAM: "dream", SHARE: "share", SPACE: "space", DREAM: "dream", SHARE: "share",
WEBSITE: "website", REFRESH: "refresh", CLEAR: "clear", UPLOAD: "upload", DOWNLOAD: "download", WEBSITE: "website", RESIZE: "resize", REFRESH: "refresh", CLEAR: "clear", UPLOAD: "upload", DOWNLOAD: "download",
SHARE_CACHE: "/share/cache/", SHARE_CACHE: "/share/cache/",
GET: "GET", PUT: "PUT", POST: "POST", DELETE: "DELETE", GET: "GET", PUT: "PUT", POST: "POST", DELETE: "DELETE",