mirror of
https://shylinux.com/x/volcanos
synced 2025-04-25 16:58:06 +08:00
opt draw
This commit is contained in:
shylinux
parent
c9ab57067d
commit
14ddd66d70
6
frame.js
6
frame.js
@ -264,8 +264,9 @@ Volcanos("onappend", { _init: function(can, meta, list, cb, target, field) { met
|
||||
var cb = can.onaction[item] || can.onkeymap && can.onkeymap._remote
|
||||
cb? cb(event, can, item): can.run(event, ["action", item], function(msg) {}, true)
|
||||
}}): item.length > 0? can.onappend.input(can, action, "input", {type: "select", values: item.slice(1), name: item[0], onchange: function(event) {
|
||||
can.onaction[item[0]](event, can, item[0], item[event.target.selectedIndex+1])
|
||||
}}): typeof item == "object" && can.onappend.input(can, action, "input", item)
|
||||
var cb = can.onaction[item[0]]
|
||||
cb && cb(event, can, item[0], item[event.target.selectedIndex+1])
|
||||
}}): typeof item == "object" && can.page.Append(can, action, [item])
|
||||
})
|
||||
},
|
||||
_detail: function(can, msg, list, target) {
|
||||
@ -520,6 +521,7 @@ Volcanos("onappend", { _init: function(can, meta, list, cb, target, field) { met
|
||||
can.onappend.toast(can, "上传成功")
|
||||
}, true);
|
||||
})
|
||||
action.upload.click()
|
||||
},
|
||||
modify: function(can, target, cb) { var back = target.innerHTML
|
||||
var ui = can.page.Appends(can, target, [{type: "input", value: back, onkeydown: function(event) {
|
||||
|
||||
@ -130,6 +130,10 @@ fieldset>div.output>div.profile>div.item {
|
||||
fieldset>div.output>div.profile>div.item:hover {
|
||||
border:solid 1px red;
|
||||
}
|
||||
fieldset>div.output>pre.display {
|
||||
position:sticky; bottom:0;
|
||||
clear:both;
|
||||
}
|
||||
|
||||
fieldset div.code {
|
||||
color:white;
|
||||
|
||||
11
index.js
11
index.js
@ -10,7 +10,14 @@ Volcanos({name: "demo", volcano: "/frame.js", iceberg: "/chat/", intshell: "plug
|
||||
"ncmd",
|
||||
]},
|
||||
], main: {name: "Header", engine: "remote", list: ["/publish/order.js"]}, plugin: [
|
||||
"/plugin/state.js", "/plugin/input.js", "/plugin/table.js",
|
||||
"/plugin/input/key", "/plugin/input/date",
|
||||
"/plugin/state.js",
|
||||
"/plugin/table.js",
|
||||
"/plugin/input.js",
|
||||
"/plugin/input/key",
|
||||
"/plugin/input/date",
|
||||
"/plugin/local/team/plan.js",
|
||||
"/plugin/local/wiki/draw.js",
|
||||
"/plugin/local/wiki/word.js",
|
||||
"/plugin/local/code/inner.js",
|
||||
],
|
||||
})
|
||||
|
||||
@ -35,6 +35,7 @@ var page = Volcanos("page", {help: "网页模块",
|
||||
var size = {
|
||||
"width": true, "height": true,
|
||||
"max-height": true,
|
||||
"min-height": true,
|
||||
"margin-left": true,
|
||||
"left": true, "right": true,
|
||||
"top": true, "bottom": true,
|
||||
|
||||
@ -2,31 +2,19 @@ fieldset.editor>div.action {
|
||||
clear:none;
|
||||
}
|
||||
fieldset.editor>div.action>div.file {
|
||||
border:solid 2px red;
|
||||
padding:2px;
|
||||
float:left;
|
||||
margin:2px 0;
|
||||
border:solid 2px red; padding:2px;
|
||||
float:left; margin:2px 0;
|
||||
cursor:pointer;
|
||||
}
|
||||
fieldset.editor>div.action>div.file:hover {
|
||||
background-color:green;
|
||||
cursor:pointer;
|
||||
}
|
||||
fieldset.editor>div.action>div.file.select {
|
||||
background-color:green;
|
||||
}
|
||||
|
||||
fieldset.editor>div.output {
|
||||
min-height:300px;
|
||||
}
|
||||
fieldset.editor>div.output>table {
|
||||
max-height:100px;
|
||||
overflow:auto;
|
||||
display:block;
|
||||
}
|
||||
fieldset.editor>div.output>div.project {
|
||||
width:80px; overflow:auto;
|
||||
position:fixed;
|
||||
min-height:240px;
|
||||
max-width:120px; overflow:auto;
|
||||
}
|
||||
fieldset.editor>div.output>div.profile {
|
||||
position:absolute; right:0;
|
||||
@ -38,46 +26,40 @@ fieldset.editor>div.output>div.profile:hover {
|
||||
|
||||
fieldset.editor>div.output div.preview {
|
||||
font-family:monospace;
|
||||
float:left; margin-left:80px;
|
||||
float:left;
|
||||
}
|
||||
fieldset.editor>div.output div.preview>div.item {
|
||||
text-align:right;
|
||||
text-align:right; padding:0 4px; margin:0;
|
||||
height:20px; border:solid 1px black;
|
||||
padding:0 4px; margin:0;
|
||||
}
|
||||
fieldset.editor>div.output div.preview>div.item:hover {
|
||||
background-color:green;
|
||||
}
|
||||
fieldset.editor>div.output div.preview>div.item.select {
|
||||
background-color:red;
|
||||
height:20px; border:solid 1px yellow;
|
||||
border:solid 1px yellow;
|
||||
}
|
||||
fieldset.editor>div.output div.content {
|
||||
font-size:16px; font-family:monospace;
|
||||
border-left:solid 2px red;
|
||||
padding-left:10px;
|
||||
float:left;
|
||||
}
|
||||
fieldset.editor>div.output div.content>pre.item {
|
||||
height:20px; border:solid 1px black;
|
||||
padding:0; margin:0;
|
||||
}
|
||||
fieldset.editor>div.output div.content>pre.item:hover {
|
||||
border:solid 1px red;
|
||||
padding-left:10px;
|
||||
}
|
||||
fieldset.editor>div.output div.content>pre.item span.comment {
|
||||
background-color:blue; color:cyan;
|
||||
color:cyan; background-color:blue;
|
||||
}
|
||||
fieldset.editor>div.output div.content>pre.item span.keyword {
|
||||
font-weight:bold;
|
||||
color:yellow;
|
||||
color:yellow; font-weight:bold;
|
||||
}
|
||||
fieldset.editor>div.output div.content>pre.item span.function {
|
||||
font-weight:bold;
|
||||
color:cyan;
|
||||
color:cyan; font-weight:bold;
|
||||
}
|
||||
fieldset.editor>div.output div.content>pre.item span.datatype {
|
||||
font-weight:bold;
|
||||
color:lightgreen;
|
||||
color:lightgreen; font-weight:bold;
|
||||
}
|
||||
fieldset.editor>div.output div.content>pre.item span.string {
|
||||
color:magenta;
|
||||
@ -87,41 +69,37 @@ fieldset.editor>div.output pre.display {
|
||||
max-height:80px; overflow:auto;
|
||||
position:sticky; bottom:0;
|
||||
display:none;
|
||||
clear:both;
|
||||
margin:0;
|
||||
}
|
||||
fieldset.editor>div.output pre.display:hover {
|
||||
background-color:black;
|
||||
max-height:360px;
|
||||
z-index:100;
|
||||
z-index:10;
|
||||
}
|
||||
|
||||
fieldset.editor>div.output textarea.editor.normal {
|
||||
background-color:#00000000; color:#00000000;
|
||||
caret-color:#00000000;
|
||||
}
|
||||
fieldset.editor>div.output textarea.editor {
|
||||
position:absolute; padding:0; margin:0;
|
||||
font-size:16px; font-family:monospace;
|
||||
background-color:black; color:white;
|
||||
caret-color:yellow;
|
||||
|
||||
position:absolute; left:0;
|
||||
border:solid 1px red;
|
||||
width:0; height:20px;
|
||||
padding:0; margin:0;
|
||||
padding-left:12px;
|
||||
|
||||
background-color:#00000000; color:#00000000;
|
||||
padding-left:12px;
|
||||
caret-color:yellow;
|
||||
display:none;
|
||||
}
|
||||
fieldset.editor>div.output textarea.editor.normal {
|
||||
caret-color:#00000000;
|
||||
}
|
||||
fieldset.editor>div.output textarea.command {
|
||||
clear:both;
|
||||
padding:0; margin:0;
|
||||
font-size:16px; font-family:monospace;
|
||||
padding-left:12px;
|
||||
|
||||
background-color:black; color:white;
|
||||
font-family:monospace;
|
||||
caret-color:red;
|
||||
|
||||
position:sticky; bottom:0;
|
||||
width:0; height:20px;
|
||||
border:solid 1px red;
|
||||
padding:0; margin:0;
|
||||
padding-left:10px;
|
||||
z-index:200;
|
||||
}
|
||||
|
||||
|
||||
@ -3,11 +3,8 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, list, cb,
|
||||
can.page.Modify(can, target, {style: {"max-height": height-160+"px"}})
|
||||
|
||||
can.onappend.table(can, target, "table", msg), can.ui = can.page.Append(can, target, [
|
||||
{view: ["project", "div"], style: {width: "80px", "max-height": height-180+"px"}},
|
||||
{view: ["profile", "div"]},
|
||||
|
||||
{view: "preview", style: {width: "30px"}},
|
||||
{view: "content"}, {type: "code", list: [{view: ["display", "pre"]}]},
|
||||
{view: "project"}, {view: "profile"},
|
||||
{view: "preview"}, {view: "content"},
|
||||
|
||||
{view: ["editor", "textarea"], onkeydown: function(event) {
|
||||
can.onkeymap.parse(event, can, "insert"), can.Timer(10, function() {
|
||||
@ -23,10 +20,11 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, list, cb,
|
||||
{view: ["command", "textarea"], onkeydown: function(event) {
|
||||
can.onkeymap.parse(event, can, "command")
|
||||
}},
|
||||
{type: "code", list: [{view: ["display", "pre"]}]},
|
||||
])
|
||||
|
||||
msg.Option("path", can.Option("path"))
|
||||
msg.Option("name", can.Option("name"))
|
||||
msg.Option("file", can.Option("file"))
|
||||
msg.Option("key", can.Option("key"))
|
||||
can.tabview = {}, can.Timer(10, function() {
|
||||
can.onimport.project(can, can.Option("path"))
|
||||
@ -45,13 +43,13 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, list, cb,
|
||||
can.Conf("height", can.Conf("height") + 64)
|
||||
}
|
||||
},
|
||||
tabview: function(can, path, name) { can.Option({path: path, name: name, key: ""})
|
||||
if (can.tabview[path+name]) { return can.onsyntax._init(can, can.tabview[path+name]) }
|
||||
can.run({}, [path, name], function(msg) {
|
||||
msg.Option({path: can.Option("path"), name: can.Option("name")})
|
||||
can.page.Append(can, can._action, [{view: ["file", "div", name], onclick: function(event) {
|
||||
can.onsyntax._init(can, can.tabview[path+name] = msg)
|
||||
can.Option({path: path, name: name, key: ""})
|
||||
tabview: function(can, path, file) { can.Option({path: path, file: file, key: ""})
|
||||
if (can.tabview[path+file]) { return can.onsyntax._init(can, can.tabview[path+file]) }
|
||||
can.run({}, [path, file], function(msg) {
|
||||
msg.Option({path: can.Option("path"), file: can.Option("file")})
|
||||
can.page.Append(can, can._action, [{view: ["file", "div", file], onclick: function(event) {
|
||||
can.onsyntax._init(can, can.tabview[path+file] = msg)
|
||||
can.Option({path: path, file: file, key: ""})
|
||||
}, ondblclick: function(event) {
|
||||
can.onkeymap._remote(event, can, "运行")
|
||||
}, oncontextmenu: function(event) {
|
||||
@ -62,17 +60,22 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, list, cb,
|
||||
project: function(can, path) { can.Option({path: path}), can.ui.project.innerHTML = ""
|
||||
can.run({}, ["action", "project", path+"/"], function(res) { res.Table(function(value) {
|
||||
var title = can.core.List(["time", "size"], function(item) { return item + ": " + value[item] }).join("\n")
|
||||
can.page.Append(can, can.ui.project, [{text: [value.file, "div", "item"], title: title, onclick: function(event) {
|
||||
can.page.Append(can, can.ui.project, [{text: [value.file, "div", "item"], title: title,
|
||||
onclick: function(event) {
|
||||
value.file.endsWith("/")? can.onimport.project(can, can.base.Path(can.Option("path"), value.file)):
|
||||
can.onimport.tabview(can, can.Option("path"), value.file)
|
||||
}} ])
|
||||
},
|
||||
ondblclick: function(event) {
|
||||
can.onkeymap._remote(event, can, "运行", ["action", "运行", path, value.file])
|
||||
},
|
||||
}])
|
||||
}) }, true)
|
||||
},
|
||||
}, ["/plugin/local/code/inner.css"])
|
||||
Volcanos("onsyntax", {help: "语法高亮", list: ["keyword", "prefix", "line"], _init: function(can, msg) { can._msg = msg
|
||||
// action
|
||||
can.page.Select(can, can._action, "div.file", function(item) {
|
||||
item.innerText == msg.Option("name")? can.page.ClassList.add(can, item, "select"):
|
||||
item.innerText == msg.Option("file")? can.page.ClassList.add(can, item, "select"):
|
||||
can.page.ClassList.del(can, item, "select")
|
||||
})
|
||||
|
||||
@ -81,7 +84,7 @@ Volcanos("onsyntax", {help: "语法高亮", list: ["keyword", "prefix", "line"],
|
||||
can.Cache(can.file+item, can.ui[item], can.current)
|
||||
});
|
||||
// caches load
|
||||
can.file = can.base.Path(msg.Option("path"), msg.Option("name"))
|
||||
can.file = can.base.Path(msg.Option("path"), msg.Option("file"))
|
||||
var cache = false; can.core.List(["preview", "content", "display"], function(item) {
|
||||
var p = can.Cache(can.file+item, can.ui[item]); if (!cache && p) { p.click(), cache = true }
|
||||
}); if (cache) { return }
|
||||
@ -100,7 +103,7 @@ Volcanos("onsyntax", {help: "语法高亮", list: ["keyword", "prefix", "line"],
|
||||
typeof p.display == "object" && ( p.display.height && can.page.Modify(can, can.ui.display, {style: {
|
||||
"max-height": p.display.height,
|
||||
}}))
|
||||
}; var p = can.onsyntax[can.parse]; !p? can.run({}, ["action", "plug", can.Option("path"), can.Option("name")], function(msg) {
|
||||
}; var p = can.onsyntax[can.parse]; !p? can.run({}, ["action", "plug", can.Option("path"), can.Option("file")], function(msg) {
|
||||
p = can.onsyntax[can.parse] = can.base.Obj(msg.Result()), can.onsyntax._init(can, can._msg), init(p)
|
||||
}, true): init(p)
|
||||
},
|
||||
@ -319,7 +322,8 @@ Volcanos("onsyntax", {help: "语法高亮", list: ["keyword", "prefix", "line"],
|
||||
line: function(can, line) { var auto = true, loop = true, total = 0
|
||||
var p = location.href.startsWith("https")? "": "http://localhost:9020"
|
||||
function cb(event) { console.log(event) }
|
||||
return {className: "preview", type: "video", style: {height: can.Conf("height")-160+"px", width: can.Conf("width")-160+"px"},
|
||||
can.page.Modify(can, can._target, {style: {"min-height": can.Conf("height")-160}})
|
||||
return {className: "preview", type: "video", style: {height: can.Conf("height")-160+"px", width: can._target.offsetWidth-160+"px"},
|
||||
data: {src: p+"/share/local/"+line, controls: "controls", autoplay: auto, loop: loop},
|
||||
oncontextmenu: cb, onplay: cb, onpause: cb, onended: cb,
|
||||
onloadedmetadata: function(event) { total = event.timeStamp
|
||||
@ -357,8 +361,9 @@ Volcanos("onkeymap", {help: "键盘交互", list: ["command", "normal", "insert"
|
||||
}), can.onkeymap[item]._engine = engine
|
||||
}), can.onkeymap._mode(can, mode||"normal")
|
||||
},
|
||||
_mode: function(can, value) {
|
||||
can.ui.editor.className = "editor "+can.Status("输入法", can.Action("mode", can.mode = value))
|
||||
_mode: function(can, value) { can.Action("mode", can.mode = value)
|
||||
can.page.Modify(can, can.ui.editor, {className: "editor "+can.mode, style: {display: "none"}})
|
||||
can.page.Modify(can, can.ui.command, {className: "command "+can.mode, style: {display: "none"}})
|
||||
return value
|
||||
},
|
||||
_command: function(can) { can.onkeymap._mode(can, "command")
|
||||
@ -371,9 +376,10 @@ Volcanos("onkeymap", {help: "键盘交互", list: ["command", "normal", "insert"
|
||||
_remote: function(event, can, key, arg, cb) { can.ui.display.innerHTML = "", can.ui.profile.innerHTML = ""
|
||||
var p = can.onsyntax[can.parse]; can.display = p && p.profile && can.ui.profile || can.ui.display
|
||||
|
||||
can.page.Modify(can, can.display, {innerHTML: "", style: {display: "none"}})
|
||||
var msg = can.request(event); msg.Option("content", can.onexport.content(can))
|
||||
can.run(event, arg||["action", key, can.Option("path"), can.Option("name")], cb||function(msg) {
|
||||
can.page.Modify(can, can.display, {innerHTML: "", style: {display: "block"}})
|
||||
can.run(event, arg||["action", key, can.Option("path"), can.Option("file")], cb||function(msg) {
|
||||
(msg.Result() || msg.append && msg.append.length > 0) && can.page.Modify(can, can.display, {innerHTML: "", style: {display: "block"}})
|
||||
can.onappend.table(can, can.display, "table", msg)
|
||||
can.onappend.board(can, can.display, "board", msg)
|
||||
}, true)
|
||||
@ -415,11 +421,11 @@ Volcanos("onkeymap", {help: "键盘交互", list: ["command", "normal", "insert"
|
||||
},
|
||||
command: {
|
||||
Escape: function(event, can) { can.onkeymap._normal(can)
|
||||
can.page.Modify(can, can.ui.command, {style: {display: "none"}})
|
||||
can.editor.focus()
|
||||
can.current.click()
|
||||
},
|
||||
Enter: function(event, can) { var line = can.ui.command.value; var ls = can.core.Split(line, " ", ",", {simple: true})
|
||||
var cb = can.onkeymap._engine[ls[0]]; typeof cb == "function"? cb(event, can, line, ls): can.onkeymap._remote(event, can, line, ["action", "cmd"].concat(ls))
|
||||
var cb = can.onkeymap._engine[ls[0]]; typeof cb == "function"? cb(event, can, line, ls):
|
||||
can.onkeymap._remote(event, can, line, ["action", "cmd"].concat(ls))
|
||||
can.onkeymap.command.Escape(event, can)
|
||||
},
|
||||
jk: function(event, can) { can.history = can.history.slice(0, -1)
|
||||
@ -531,10 +537,8 @@ Volcanos("onkeymap", {help: "键盘交互", list: ["command", "normal", "insert"
|
||||
},
|
||||
})
|
||||
Volcanos("onaction", {help: "控件交互", list: [
|
||||
"", "项目", "上传",
|
||||
"", "保存", "运行", "串行", "并行", "日志",
|
||||
"", "提交", "历史", "记录", "复盘",
|
||||
"", "收藏", "列表", "搜索", "推荐",
|
||||
"", "项目", "上传", "", "保存", "运行",
|
||||
"", "提交", "记录", "复盘", "历史",
|
||||
],
|
||||
modifyLine: function(can, target, value) { var p = can.onsyntax.parse(can, value)
|
||||
typeof p == "object"? can.page.Appends(can, target, [p]): target.innerHTML = p
|
||||
@ -552,12 +556,14 @@ Volcanos("onaction", {help: "控件交互", list: [
|
||||
}); if (typeof target != "object") { return }; can.current = target
|
||||
|
||||
can.page.Modify(can, can.editor, {className: "editor "+can.mode, value: can.current.innerText, style: {
|
||||
height: target.offsetHeight+"px", width: target.offsetWidth+"px",
|
||||
top: (target.offsetTop)+"px", display: "block",
|
||||
height: target.offsetHeight, width: target.offsetWidth,
|
||||
left: target.offsetLeft, top: target.offsetTop,
|
||||
display: "block",
|
||||
}}), can.editor.focus()
|
||||
|
||||
can.page.Modify(can, can.ui.command, {value: can.current.innerText, style: {
|
||||
height: target.offsetHeight+"px", width: target.offsetWidth+"px",
|
||||
can.page.Modify(can, can.ui.command, {style: {
|
||||
height: target.offsetHeight, width: target.offsetWidth,
|
||||
left: target.offsetLeft,
|
||||
}})
|
||||
},
|
||||
appendLine: function(can, value) { var index = can.max++
|
||||
@ -635,20 +641,7 @@ Volcanos("onlayout", {help: "页面布局", list: [], _init: function(can) {
|
||||
can.onlayout.project(can)
|
||||
},
|
||||
project: function(can) { var hide = can.ui.project.style.display == "none"
|
||||
var width = 80, height = 480;
|
||||
can.page.Modify(can, can.ui.project, {style: {width: width, "max-height": height, display: hide? "": "none"}})
|
||||
|
||||
var style = {style: {
|
||||
"margin-left": hide? width: 0,
|
||||
}}; can.page.Modify(can, can.ui.preview, style)
|
||||
|
||||
var style = {style: {
|
||||
"margin-left": hide? width+30: 30,
|
||||
}}; can.page.Modify(can, can.ui.content, style)
|
||||
|
||||
can.page.Modify(can, can.ui.display, style)
|
||||
can.page.Modify(can, can.ui.command, style)
|
||||
can.page.Modify(can, can.ui.editor, style)
|
||||
can.page.Modify(can, can.ui.project, {style: {display: hide? "": "none"}})
|
||||
},
|
||||
})
|
||||
Volcanos("onexport", {help: "导出数据", list: ["输入法", "输入值", "文件名", "解析器", "当前行", "ncmd"],
|
||||
|
||||
@ -7,30 +7,25 @@ fieldset.plan>div.output table.content {
|
||||
fieldset.plan>div.output table.profile {
|
||||
float:left;
|
||||
}
|
||||
fieldset.plan>div.output pre.display {
|
||||
position:sticky; bottom:0;
|
||||
clear:both;
|
||||
}
|
||||
|
||||
fieldset.plan>div.output table.content div.prepare {
|
||||
background-color:blue;
|
||||
}
|
||||
fieldset.plan>div.output table.content div.process {
|
||||
/* background-color:yellow; */
|
||||
}
|
||||
fieldset.plan>div.output table.content div.finish {
|
||||
background-color:green;
|
||||
}
|
||||
fieldset.plan>div.output table.content div.cancel {
|
||||
fieldset.plan>div.output table.content div.finish {
|
||||
background-color:red;
|
||||
}
|
||||
fieldset.plan>div.output table.content div.cancel {
|
||||
background-color:yellow;
|
||||
}
|
||||
|
||||
fieldset.plan>div.output table.content td {
|
||||
vertical-align:top;
|
||||
}
|
||||
fieldset.plan>div.output table.content td div.date {
|
||||
color:gray;
|
||||
}
|
||||
fieldset.plan>div.output table.content td.over {
|
||||
border:solid 2px red;
|
||||
}
|
||||
fieldset.plan>div.output table.content td div.date {
|
||||
color:gray;
|
||||
}
|
||||
|
||||
@ -2,7 +2,7 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg,
|
||||
can._name = "plan", can.ui = can.page.Append(can, can._target, [
|
||||
{view: ["project", "table"], style: {display: can.user.Searchs(can, "project")||"none"}},
|
||||
{view: ["content", "table"]},
|
||||
{view: ["profile", "table"], style: {display: can.user.Searchs(can, "profile")||"none"}},
|
||||
{view: ["profile", "table"]},
|
||||
{view: ["display", "pre"]},
|
||||
])
|
||||
|
||||
|
||||
@ -1,34 +1,5 @@
|
||||
|
||||
fieldset.item>div.output>div.status>div {
|
||||
float:left;
|
||||
height:20px;
|
||||
border:1px solid black;
|
||||
fieldset.draw div.output div.project {
|
||||
}
|
||||
fieldset.item>div.output>div.status>input.cmd {
|
||||
float:left;
|
||||
background-color:black;
|
||||
color:lightgreen;;
|
||||
font-size:16px;
|
||||
width:250px;
|
||||
}
|
||||
fieldset.item>div.output>div.action>button.trap {
|
||||
background-color:lightblue;
|
||||
border:2px blue solid;
|
||||
}
|
||||
fieldset.item>div.output>div.action>div.space {
|
||||
width:10px;
|
||||
display:inline-block;
|
||||
}
|
||||
fieldset.item>div.output>canvas {
|
||||
background-color:#8dd09e;
|
||||
}
|
||||
fieldset table tr.hidden {
|
||||
display:none;
|
||||
}
|
||||
fieldset table th.order {
|
||||
background-color:red;
|
||||
cursor:pointer;
|
||||
}
|
||||
fieldset table td.clip {
|
||||
background-color:red;
|
||||
fieldset.draw div.output div.project div.item.select {
|
||||
background-color:red; border:solid 2px yellow;
|
||||
}
|
||||
|
||||
@ -1,28 +1,30 @@
|
||||
Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg, list, cb, target) { can._output.innerHTML = "";
|
||||
can.onappend.table(can, target, "table", msg)
|
||||
can.onappend.table(can, target, "table", msg), can.ui = can.page.Append(can, target, [
|
||||
{view: "project"}, {view: "profile"},
|
||||
{view: "preview"}, {view: "content"}, {view: "display"},
|
||||
])
|
||||
can.core.Item(can.onaction, function(key, value) { if (key.indexOf("on") == -1) { return }
|
||||
if (!can.onaction.hasOwnProperty(key)) { return }
|
||||
|
||||
can.ui.content[key] = can.ui.content[key] || function(event) {
|
||||
value(event, can);
|
||||
}
|
||||
})
|
||||
|
||||
// 交互数据
|
||||
can.point = [], can.keys = []
|
||||
can.group = null, can.svg = null
|
||||
can.current = null, can.temp = null
|
||||
can.svg = null, can.group = null
|
||||
can.temp = null, can.current = null
|
||||
can.last = null
|
||||
|
||||
// 加载绘图
|
||||
var code = can.page.AppendBoard(can, can._output, msg.Result()||can.onexport.file(event, can))
|
||||
can.page.Select(can, can._output, "svg", function(svg) {
|
||||
// 画布
|
||||
can.onaction.init(event, can, msg, "init", svg);
|
||||
can.group = can.svg = svg;
|
||||
|
||||
var list = can.core.List(can.onaction.list, function(item, index) {if (item[0] == "group") {
|
||||
// 清空分组
|
||||
return can.onaction.list[index] = ["group", "svg"]
|
||||
}})[0]
|
||||
|
||||
var code = can.page.AppendBoard(can, can.ui.content, msg.Result()||can.onexport.file(event, can))
|
||||
can.page.Select(can, can.ui.content, "svg", function(svg) { can.svg = can.group = svg
|
||||
can.onimport.block(can, svg), can.onimport.group(can, svg).click()
|
||||
can.page.Select(can, svg, "*", function(item, index) {
|
||||
// 元素
|
||||
can.onaction.init(event, can, msg, index, item);
|
||||
item.tagName == "g" && item.Value("class") != "" && list.push(item.Value("class"));
|
||||
can.onimport.block(can, item); if (item.tagName == "g" && item.Value("class") != "") {
|
||||
can.onimport.group(can, item)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
@ -38,18 +40,56 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg,
|
||||
can.core.Item(def, function(key, value) {
|
||||
can.svg.Value(key, can.Action(key, can.svg.Value(key)||value))
|
||||
})
|
||||
can.Action("mode", "select")
|
||||
can.Action("mode", "draw")
|
||||
can.Action("shape", "path")
|
||||
})
|
||||
return typeof cb == "function" && cb(msg);
|
||||
},
|
||||
group: function(can, target) { var name = target.Value("class") || "svg"
|
||||
return can.onappend.item(can, can.ui.project, "item", {name: name}, function(event) {
|
||||
can.group = target, can.core.List(["font-size", "storke-width", "stroke", "fill"], function(key) {
|
||||
can.Action(key, target.Value(key)||can.Action(key))
|
||||
can.Status("group", name)
|
||||
})
|
||||
})
|
||||
},
|
||||
block: function(can, target) {
|
||||
target.ondblclick = function(event) {
|
||||
}
|
||||
target.Val = function(key, value) {
|
||||
return parseInt(target.Value(key, value == undefined? value: parseInt(value)||0)) || 0
|
||||
}
|
||||
target.Value = function(key, value) {
|
||||
if (typeof key == "object") { can.core.Item(key, target.Value); return }
|
||||
|
||||
var figure = can.onaction._get(can, target)
|
||||
key && (key = figure && figure.data && figure.data.size && figure.data.size[key] || key)
|
||||
|
||||
if (figure && figure.data && typeof figure.data[key] == "function") {
|
||||
return figure.data[key](event, can, value, key, target)
|
||||
}
|
||||
if (key == "inner") {
|
||||
return value != undefined && (target.innerHTML = value), target.innerHTML
|
||||
}
|
||||
if (key == "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||"class")
|
||||
|| target[key]&&target[key].baseVal&&target[key].baseVal.value
|
||||
|| target[key]&&target[key].baseVal || ""
|
||||
}
|
||||
target.Group = function() { var item = target
|
||||
while (item) { if (["svg", "g"].indexOf(item.tagName) > -1) {
|
||||
return item
|
||||
}; item = item.parentNode }
|
||||
return can.svg
|
||||
}
|
||||
return target
|
||||
},
|
||||
|
||||
draw: function(event, can, value) {
|
||||
var figure = can.onfigure[value.shape]
|
||||
var data = figure.draw(event, can, value.point, value.style)
|
||||
can.core.Item(value.style, function(key, value) {data[key] = value})
|
||||
return can.onaction.push(event, can, data, value.shape, can.group||can.svg)
|
||||
return can.onaction.push(can, data, value.shape, can.group||can.svg)
|
||||
},
|
||||
escape: function(event, can, value) {
|
||||
can.point = can.point.slice(0, -1)
|
||||
@ -122,29 +162,20 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg,
|
||||
},
|
||||
}, ["plugin/local/wiki/draw.css"])
|
||||
Volcanos("onfigure", {help: "图形绘制", list: [],
|
||||
_spawn: function(sup, can) {can.sup = sup},
|
||||
_swell: function(can, sub) {
|
||||
can.sup && can.sup.action && sub.draw && can.page.Select(can, can.sup.action, "select.shape", function(shape) {
|
||||
can.page.Append(can, shape, [{text: [sub._name, "option"]}])
|
||||
})
|
||||
},
|
||||
svg: {
|
||||
data: {
|
||||
size: {},
|
||||
}, // <svg font-size="24" stroke-width="2" stroke="yellow" fill="purple" grid="10"/>
|
||||
show: function(event, can, value, target) {
|
||||
return can.svg.Val("width") +","+ can.svg.Val("width")
|
||||
show: function(can, target) {
|
||||
return target.Val("width") +","+ target.Val("height")
|
||||
},
|
||||
},
|
||||
rect: {
|
||||
data: {
|
||||
rx: 4, ry: 4,
|
||||
size: {x: "x", y: "y"},
|
||||
data: { size: {x: "x", y: "y"}, rx: 4, ry: 4,
|
||||
copy: ["width", "height", "rx", "ry"],
|
||||
}, // <rect x="60" y="10" rx="10" ry="10" width="30" height="30" rx="4" ry="4"/>
|
||||
draw: function(event, can, point) {if (point.length < 2) {return}
|
||||
var p0 = point[0], p1 = point[1];
|
||||
var data = {
|
||||
draw: function(event, can, point) { if (point.length < 2) { return }
|
||||
var p0 = point[0], p1 = point[1]; var data = {
|
||||
"x": p0.x > p1.x? p1.x: p0.x,
|
||||
"y": p0.y > p1.y? p1.y: p0.y,
|
||||
"width": Math.abs(p0.x-p1.x),
|
||||
@ -154,82 +185,33 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
|
||||
}
|
||||
return event.type == "click" && point.length == 2 && (can.point = []), data;
|
||||
},
|
||||
text: function(event, can, data, target) {
|
||||
text: function(can, target, data) {
|
||||
data.x = target.Val("x")+target.Val("width")/2
|
||||
data.y = target.Val("y")+target.Val("height")/2
|
||||
return data
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
return ": (" + value.Val("x") + "," + value.Val("y") + ")"
|
||||
+ " + (" + value.Val("width") + "," + value.Val("height") + ")"
|
||||
},
|
||||
},
|
||||
circle: {
|
||||
data: {
|
||||
size: {x: "cx", y: "cy", width: "r", height: "r"},
|
||||
copy: ["r"],
|
||||
}, // <circle cx="25" cy="75" r="20"/>
|
||||
draw: function(event, can, point) {if (point.length < 2) {return}
|
||||
var p0 = point[0], p1 = point[1];
|
||||
var data = {
|
||||
"cx": p0.x, "cy": p0.y,
|
||||
"r": Math.sqrt(Math.pow(p0.x-p1.x, 2)+Math.pow(p0.y-p1.y, 2)),
|
||||
}
|
||||
return event.type == "click" && point.length == 2 && (can.point = []), data;
|
||||
},
|
||||
text: function(event, can, data, target) {
|
||||
data.x = target.Val("cx")
|
||||
data.y = target.Val("cy")
|
||||
return data
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
return ": (" + value.Val("cx") + "," + value.Val("cy") + ")"
|
||||
+ " > (" + parseInt(value.Val("r")) + ")"
|
||||
},
|
||||
},
|
||||
ellipse: {
|
||||
data: {
|
||||
size: {x: "cx", y: "cy", width: "rx", height: "ry"},
|
||||
copy: ["rx", "ry"],
|
||||
}, // <ellipse cx="75" cy="75" rx="20" ry="5"/>
|
||||
draw: function(event, can, point) {if (point.length < 2) {return}
|
||||
var p0 = point[0], p1 = point[1];
|
||||
var data = {
|
||||
"cx": p0.x, "cy": p0.y,
|
||||
"rx": Math.abs(p0.x - p1.x), "ry": Math.abs(p0.y - p1.y),
|
||||
}
|
||||
return event.type == "click" && point.length == 2 && (can.point = []), data;
|
||||
},
|
||||
text: function(event, can, data, target) {
|
||||
data.x = target.Val("cx")
|
||||
data.y = target.Val("cy")
|
||||
return data
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
return ": (" + value.Val("cx") + "," + value.Val("cy") + ")"
|
||||
+ " > (" + value.Val("rx") + value.Val("ry") + ")"
|
||||
show: function(can, target) {
|
||||
return ": (" + target.Val("x") + "," + target.Val("y") + ")"
|
||||
+ " + (" + target.Val("width") + "," + target.Val("height") + ")"
|
||||
},
|
||||
},
|
||||
text: {
|
||||
data: {
|
||||
size: {x: "x", y: "y"},
|
||||
data: { size: {x: "x", y: "y"},
|
||||
copy: ["inner"],
|
||||
}, // <text x="60" y="10">hi<text>
|
||||
draw: function(event, can, point, style) {if (point.length < 1 || event.type == "mousemove") {return}
|
||||
var p0 = point[0];
|
||||
var data = {
|
||||
draw: function(event, can, point, style) { if (point.length < 1 || event.type == "mousemove") { return }
|
||||
var p0 = point[0]; var data = {
|
||||
"x": p0.x, "y": p0.y,
|
||||
"inner": style&&style.inner||can.user.prompt("text"),
|
||||
"inner": style&&style.inner || can.user.prompt("text"),
|
||||
}
|
||||
return can.point = [], data;
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
show: function(can, target) {
|
||||
return ": (" + target.Val("x") + "," + target.Val("y")+ ")"
|
||||
}
|
||||
},
|
||||
line: {
|
||||
data: {
|
||||
size: {},
|
||||
data: { size: {},
|
||||
copy: ["x1", "y1", "x2", "y2"],
|
||||
x: function(event, can, value, cmd, target) {
|
||||
if (value != undefined) {
|
||||
@ -257,35 +239,123 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
|
||||
},
|
||||
}, // <line x1="10" y1="50" x2="110" y2="150"/>
|
||||
grid: function(event, can, point) {var target = event.target
|
||||
if (event.target == can.svg) {return}
|
||||
var pos = can.page.Prepos(event, target)
|
||||
if (target == can.svg) {return}
|
||||
var p = point[point.length-1]
|
||||
p.target = target
|
||||
p.anchor = pos
|
||||
var pos = can.page.Prepos(event, target)
|
||||
target.Val && can.page.Anchor(event, target, pos, p)
|
||||
return point
|
||||
return p.target = target, p.anchor = pos, point
|
||||
},
|
||||
draw: function(event, can, point) {if (point.length < 2) {return}
|
||||
var p0 = point[0], p1 = point[1];
|
||||
var data = {
|
||||
draw: function(event, can, point) { if (point.length < 2) { return }
|
||||
var p0 = point[0], p1 = point[1]; var data = {
|
||||
"x1": p0.x, "y1": p0.y,
|
||||
"x2": p1.x, "y2": p1.y,
|
||||
}
|
||||
return event.type == "click" && point.length == 2 && (can.point = []), data;
|
||||
},
|
||||
text: function(event, can, data, target) {
|
||||
text: function(can, target, data) {
|
||||
data.x = (target.Val("x1") + target.Val("x2")) / 2
|
||||
data.y = (target.Val("y1") + target.Val("y2")) / 2
|
||||
return data
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
return ": (" + value.Val("x1") + "," + value.Val("y1") + ")"
|
||||
+ " - (" + value.Val("x2") + "," + value.Val("y2") + ")"
|
||||
show: function(can, target) {
|
||||
return ": (" + target.Val("x1") + "," + target.Val("y1") + ")"
|
||||
+ " - (" + target.Val("x2") + "," + target.Val("y2") + ")"
|
||||
},
|
||||
},
|
||||
circle: {
|
||||
data: { size: {x: "cx", y: "cy", width: "r", height: "r"},
|
||||
copy: ["r"],
|
||||
}, // <circle cx="25" cy="75" r="20"/>
|
||||
draw: function(event, can, point) { if (point.length < 2) { return }
|
||||
var p0 = point[0], p1 = point[1]; var data = {
|
||||
"cx": p0.x, "cy": p0.y,
|
||||
"r": Math.sqrt(Math.pow(p0.x-p1.x, 2)+Math.pow(p0.y-p1.y, 2)),
|
||||
}
|
||||
return event.type == "click" && point.length == 2 && (can.point = []), data;
|
||||
},
|
||||
text: function(can, target, data) {
|
||||
data.x = target.Val("cx")
|
||||
data.y = target.Val("cy")
|
||||
return data
|
||||
},
|
||||
show: function(can, target) {
|
||||
return ": (" + target.Val("cx") + "," + target.Val("cy") + ")"
|
||||
+ " > (" + parseInt(target.Val("r")) + ")"
|
||||
},
|
||||
},
|
||||
ellipse: {
|
||||
data: { size: {x: "cx", y: "cy", width: "rx", height: "ry"},
|
||||
copy: ["rx", "ry"],
|
||||
}, // <ellipse cx="75" cy="75" rx="20" ry="5"/>
|
||||
draw: function(event, can, point) { if (point.length < 2) { return }
|
||||
var p0 = point[0], p1 = point[1]; var data = {
|
||||
"cx": p0.x, "cy": p0.y,
|
||||
"rx": Math.abs(p0.x - p1.x), "ry": Math.abs(p0.y - p1.y),
|
||||
}
|
||||
return event.type == "click" && point.length == 2 && (can.point = []), data;
|
||||
},
|
||||
text: function(can, target, data) {
|
||||
data.x = target.Val("cx")
|
||||
data.y = target.Val("cy")
|
||||
return data
|
||||
},
|
||||
show: function(can, target) {
|
||||
return ": (" + target.Val("cx") + "," + target.Val("cy") + ")"
|
||||
+ " > (" + target.Val("rx") + target.Val("ry") + ")"
|
||||
},
|
||||
},
|
||||
block: {
|
||||
data: { size: {x: "x", y: "y"}, rx: 4, ry: 4,
|
||||
copy: ["width", "height", "rx", "ry"],
|
||||
}, // <rect x="60" y="10" rx="10" ry="10" width="30" height="30" rx="4" ry="4"/>
|
||||
draw: function(event, can, point) { if (point.length < 2) { return }
|
||||
this._temp && can.page.Remove(can, this._temp) && delete(this._temp)
|
||||
this._temp = can.onaction.push(can, {}, "g", can.group||can.svg)
|
||||
|
||||
var temp = this._temp
|
||||
var rect = can.onaction.push(can, can.onfigure.rect.draw(event, can, point), "rect", temp)
|
||||
if (event.type == "click" && point.length == 2) { var point = can.onfigure.rect.text(can, rect, {})
|
||||
can.require(["/plugin/input/key"])
|
||||
can.run(event, ["action", "plugin"], function(msg) {
|
||||
var ui = can.user.input(event, can, [
|
||||
{name: "zone", select: [["zone"].concat(msg.append), function(event, value) {
|
||||
can.page.Appends(can, ui.type, can.core.List(msg[value], function(item) {
|
||||
return {type: "option", value: item, inner: item}
|
||||
}))
|
||||
}]},
|
||||
{name: "type", select: [["type"].concat(msg[msg.append[0]]), function(event, value) {
|
||||
|
||||
}]},
|
||||
|
||||
{name: "name", type: "input", onclick: function(event) {
|
||||
can.onfigure.key.onclick(event, can, {name: "name", zone: ui.zone.value, type: ui.type.value}, event.target)
|
||||
}, autocomplete: "off"},
|
||||
{name: "text", type: "input", onclick: function(event) {
|
||||
can.onfigure.key.onclick(event, can, {name: "text", zone: ui.zone.value, type: ui.type.value}, event.target)
|
||||
}, autocomplete: "off"},
|
||||
], function(event, button, data, list) {
|
||||
var text = can.onaction.push(can, can.onfigure.text.draw(event, can, [point], {inner: data.name}), "text", temp)
|
||||
rect.Value(data)
|
||||
text.Value(data)
|
||||
return true
|
||||
})
|
||||
}, true)
|
||||
delete(this._temp)
|
||||
}
|
||||
},
|
||||
text: function(can, target, data) {
|
||||
data.x = target.Val("x")+target.Val("width")/2
|
||||
data.y = target.Val("y")+target.Val("height")/2
|
||||
return data
|
||||
},
|
||||
show: function(can, target) {
|
||||
return ": (" + target.Val("x") + "," + target.Val("y") + ")"
|
||||
+ " + (" + target.Val("width") + "," + target.Val("height") + ")"
|
||||
},
|
||||
},
|
||||
|
||||
path: {
|
||||
data: {
|
||||
size: {},
|
||||
data: { size: {},
|
||||
x: function(event, can, value, cmd, target) {
|
||||
var tt = JSON.parse(target.Value("tt")||'{"tx":0, "ty":0}')
|
||||
if (value != undefined) {
|
||||
@ -407,40 +477,13 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
|
||||
}
|
||||
return data;
|
||||
},
|
||||
text: function(event, can, data, target) {
|
||||
text: function(can, target, data) {
|
||||
data.x = (target.x1.baseVal.value + target.x2.baseVal.value) / 2
|
||||
data.y = (target.y1.baseVal.value + target.y2.baseVal.value) / 2
|
||||
return data
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
return value.tagName
|
||||
},
|
||||
},
|
||||
|
||||
think: {
|
||||
data: {
|
||||
rx: 4, ry: 4,
|
||||
size: {x: "x", y: "y"},
|
||||
copy: ["width", "height", "rx", "ry"],
|
||||
}, // <rect x="60" y="10" rx="10" ry="10" width="30" height="30" rx="4" ry="4"/>
|
||||
draw: function(event, can, point) {if (point.length < 2) {return}
|
||||
can._temp && can.page.Remove(can, can._temp) && delete(can._temp);
|
||||
can._temp = can.onaction.push(event, can, {}, "g", can.group||can.svg)
|
||||
var rect = can.onaction.push(event, can, can.onfigure.rect.draw(event, can, point), "rect", can._temp)
|
||||
if (event.type == "click" && point.length == 2) {
|
||||
can.ondetail["标签"](event, can, {}, "", rect);
|
||||
delete(can._temp)
|
||||
}
|
||||
return
|
||||
},
|
||||
text: function(event, can, data, target) {
|
||||
data.x = target.Val("x")+target.Val("width")/2
|
||||
data.y = target.Val("y")+target.Val("height")/2
|
||||
return data
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
return ": (" + value.Val("x") + "," + value.Val("y") + ")"
|
||||
+ " + (" + value.Val("width") + "," + value.Val("height") + ")"
|
||||
show: function(can, target) {
|
||||
return target.tagName
|
||||
},
|
||||
},
|
||||
polyline: {
|
||||
@ -451,13 +494,13 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
|
||||
}
|
||||
return data;
|
||||
},
|
||||
text: function(event, can, data, target) {
|
||||
text: function(can, target, data) {
|
||||
data.x = (target.x1.baseVal.value + target.x2.baseVal.value) / 2
|
||||
data.y = (target.y1.baseVal.value + target.y2.baseVal.value) / 2
|
||||
return data
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
return value.tagName + ": (" + value.points.baseVal.value + ")"
|
||||
show: function(can, target) {
|
||||
return target.tagName + ": (" + target.points.baseVal.value + ")"
|
||||
},
|
||||
},
|
||||
polygon: {
|
||||
@ -468,214 +511,122 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
|
||||
}
|
||||
return data;
|
||||
},
|
||||
text: function(event, can, data, target) {
|
||||
text: function(can, target, data) {
|
||||
data.x = (target.x1.baseVal.value + target.x2.baseVal.value) / 2
|
||||
data.y = (target.y1.baseVal.value + target.y2.baseVal.value) / 2
|
||||
return data
|
||||
},
|
||||
show: function(event, can, value, target) {
|
||||
return value.tagName + ": (" + value.points.baseVal.value + ")"
|
||||
show: function(can, target) {
|
||||
return target.tagName + ": (" + target.points.baseVal.value + ")"
|
||||
},
|
||||
},
|
||||
})
|
||||
Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除", "添加",
|
||||
["group", "svg"],
|
||||
Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除", "添加", "",
|
||||
["font-size", 12, 16, 18, 24, 32],
|
||||
["stroke-width", 1, 2, 3, 4, 5],
|
||||
{text: "c"}, ["stroke", "red", "yellow", "green", "purple", "blue", "cyan", "white", "black"],
|
||||
{text: "f"}, ["fill", "red", "yellow", "green", "purple", "blue", "cyan", "white", "black", "#0000"],
|
||||
{text: "a"}, ["go", "auto", "manual"],
|
||||
{text: "a"}, ["mode", "draw", "move", "resize", "select", "delete"],
|
||||
{text: "s"}, ["shape", "think", "rect", "circle", "ellipse", "text", "line", "path", "polyline", "polygon"],
|
||||
{text: [" c:", "div", "item"]}, ["stroke", "red", "yellow", "green", "purple", "blue", "cyan", "white", "black"],
|
||||
{text: [" f:", "div", "item"]}, ["fill", "red", "yellow", "green", "purple", "blue", "cyan", "white", "black", "#0000"],
|
||||
"",
|
||||
{text: [" a:", "div", "item"]}, ["go", "run", "auto", "manual"],
|
||||
{text: [" a:", "div", "item"]}, ["mode", "run", "draw", "move", "resize", "select", "delete"],
|
||||
{text: [" s:", "div", "item"]}, ["shape", "block", "rect", "text", "line", "circle", "ellipse"],
|
||||
"",
|
||||
["grid", 1, 2, 3, 4, 5, 10, 20],
|
||||
],
|
||||
"保存": function(event, can, msg, cmd, target) {
|
||||
can.run(event, ["action", cmd, can.Option("path"), can.Export(event, can.svg, "file")], function() {
|
||||
"保存": function(event, can, key) { var msg = can.request(event)
|
||||
msg.Option("content", can.onexport.file(can, can.svg))
|
||||
can.run(event, ["action", key, can.Option("path")], function() {
|
||||
can.user.toast("保存成功")
|
||||
}, true)
|
||||
},
|
||||
"清空": function(event, can, msg, cmd, target) {
|
||||
can.svg.innerHTML = ""
|
||||
can.point = []
|
||||
can.keys = []
|
||||
"清空": function(event, can) {
|
||||
can.point = [], can.keys = [], can.svg.innerHTML = "", can.group = can.svg
|
||||
},
|
||||
"删除": function(event, can, msg, cmd, target) {if (can.group == can.svg) {return}
|
||||
"删除": function(event, can) {if (can.group == can.svg) {return}
|
||||
can.page.Remove(can, can.group), can.page.Select(can, can.action, "option[value="+can.group.Value("class")+"]", function(item) {
|
||||
can.page.Remove(can, item)
|
||||
})
|
||||
can.Action("group", "svg")
|
||||
},
|
||||
"添加": function(event, can, msg, cmd, target) {
|
||||
"添加": function(event, can) {
|
||||
can.user.prompt("add group", function(name) {
|
||||
var group = document.createElementNS('http://www.w3.org/2000/svg', 'g');
|
||||
can.group.append(can.onaction.init(event, can, msg, cmd, group))
|
||||
var group = document.createElementNS('http://www.w3.org/2000/svg', 'g')
|
||||
can.group.append(can.onimport.block(can, group))
|
||||
group.Value("class", name), can.core.List(["font-size", "stroke-width", "stroke", "fill"], function(name) {
|
||||
group.Value(name, can.Action(name))
|
||||
})
|
||||
|
||||
can.group = group, can.group.Value("class", name)
|
||||
can.core.List(["font-size", "stroke-width", "stroke", "fill"], function(name) {
|
||||
can.group.Value(name, can.Action(name))
|
||||
})
|
||||
can.page.Select(can, can.action, "select.group", function(item) {
|
||||
can.page.Append(can, item, [{type: "option", value: name, inner: name}]);
|
||||
item.value = name
|
||||
})
|
||||
can.onimport.group(can, group).click()
|
||||
})
|
||||
},
|
||||
|
||||
group: function(event, can, value, cmd, target) {
|
||||
if (cmd == "svg") {
|
||||
can.group = can.svg
|
||||
} else {
|
||||
can.page.Select(can, can.svg, "g."+cmd, function(item) {
|
||||
can.group = item
|
||||
})
|
||||
}
|
||||
can.core.List(["font-size", "storke-width", "stroke", "fill"], function(key) {
|
||||
can.Action(key, can.group.Value(key)||can.Action(key))
|
||||
})
|
||||
return can.group
|
||||
},
|
||||
"font-size": function(event, can, value, cmd, target) {can.Action(value, can.group.Value(value, cmd))},
|
||||
"stroke-width": function(event, can, value, cmd, target) {can.Action(value, can.group.Value(value, cmd))},
|
||||
stroke: function(event, can, value, cmd, target) {can.Action(value, can.group.Value(value, cmd))},
|
||||
fill: function(event, can, value, cmd, target) {can.Action(value, can.group.Value(value, cmd))},
|
||||
shape: function(event, can, value, cmd, target) {cmd && can.Action(value, cmd)},
|
||||
mode: function(event, can, value, cmd, target) {cmd && can.Action(value, cmd)},
|
||||
grid: function(event, can, value, cmd, target) {cmd && can.Action(value, cmd)},
|
||||
"font-size": function(event, can, key, value) { can.group.Value(key, value) },
|
||||
"stroke-width": function(event, can, key, value) { can.group.Value(key, value) },
|
||||
stroke: function(event, can, key, value) { can.group.Value(key, value) },
|
||||
fill: function(event, can, key, value) { can.group.Value(key, value) },
|
||||
|
||||
init: function(event, can, msg, cmd, item) {
|
||||
item.Value = function(key, value) {
|
||||
if (typeof key == "object") {
|
||||
can.core.Item(key, function(key, value) {
|
||||
item.Value(key, value)
|
||||
})
|
||||
return
|
||||
push: function(can, data, cmd, target) {
|
||||
var rect = document.createElementNS("http://www.w3.org/2000/svg", cmd)
|
||||
target.appendChild(can.onimport.block(can, rect))
|
||||
rect.Value(data); if (can.point.length == 0) {
|
||||
var pid = "p"+can.svg.Val("count", can.svg.Val("count")+1)
|
||||
rect.Value("class", (rect.Value("class") + " " + rect.Value("pid", pid)).trim())
|
||||
}
|
||||
var figure = can.onaction._get(can, item);
|
||||
key && (key = figure && figure.data && figure.data.size && figure.data.size[key] || key)
|
||||
if (figure && figure.data && typeof figure.data[key] == "function") {
|
||||
return figure.data[key](event, can, value, key, item)
|
||||
}
|
||||
if (key == "inner") {
|
||||
return value != undefined && (item.innerHTML = value), item.innerHTML
|
||||
}
|
||||
return value && item.setAttribute(key, value), item.getAttribute(key||"class")||item[key]&&item[key].baseVal&&item[key].baseVal.value||item[key]&&item[key].baseVal||"";
|
||||
}
|
||||
item.Val = function(key, value) {
|
||||
return parseInt(item.Value(key, value == undefined? value: parseInt(value)||0))||0;
|
||||
}
|
||||
item.Group = function() {var target = item
|
||||
while (target) {
|
||||
if (["svg", "g"].indexOf(target.tagName) > -1) {
|
||||
return target;
|
||||
}
|
||||
target = target.parentNode;
|
||||
}
|
||||
return can.svg
|
||||
}
|
||||
return item;
|
||||
},
|
||||
push: function(event, can, msg, cmd, target) {
|
||||
var rect = document.createElementNS("http://www.w3.org/2000/svg", cmd);
|
||||
target.appendChild(can.onaction.init(event, can, msg, cmd, rect));
|
||||
|
||||
can.core.Item(msg, function(key, value) {
|
||||
if (key == "inner") {return rect.innerHTML = value}
|
||||
rect.Value(key, value)
|
||||
});
|
||||
|
||||
if (can.point.length == 0) {
|
||||
var pid = "p"+ can.svg.Val("count", can.svg.Val("count")+1)
|
||||
rect.Value("class", (rect.Value("class") + " " + rect.Value("pid", pid)).trim());
|
||||
}
|
||||
return can.last = rect;
|
||||
return can.last = rect
|
||||
},
|
||||
_get: function(can, item, name) {
|
||||
return can.onfigure[name||item.getAttribute("name")||item.tagName];
|
||||
return can.onfigure[name||item.getAttribute("name")||item.tagName]
|
||||
},
|
||||
_ship: function(can, value, target) {
|
||||
var ship = JSON.parse(target.Value("ship")||"[]").concat([value])
|
||||
target.Value("ship", JSON.stringify(ship))
|
||||
_ship: function(can, target, value) {
|
||||
return target.Value("ship", target.Value("ship").concat([value]))
|
||||
},
|
||||
_run: function(event, can, target) {
|
||||
var figure = can.onaction._get(can, event.target);
|
||||
var msg = can.Event(event);
|
||||
figure && can.core.List(["x", "y", "cmd"].concat(figure.copy||[]), function(item) {
|
||||
msg.Option(item, target.Value(item))
|
||||
})
|
||||
figure && figure.run? figure.run(event, can, figure, "run", event.target): (event.type == "click" && can.run(event, ["action", "执行", target.Value("cmd")], function(msg) {
|
||||
msg.Table(function(value, index) {
|
||||
index > 0 && can.core.Item(value, function(key, val) {
|
||||
target.Value(key, val)
|
||||
})
|
||||
})
|
||||
}, true))
|
||||
return
|
||||
_mode: {
|
||||
run: function(event, can) { var target = event.target
|
||||
event.type == "click" && target.Value("type") && can.run(event, ["action", "run", target.Value("zone"), target.Value("type"), target.Value("name"), target.Value("text")], function(msg) {
|
||||
can.onappend.table(can, can.ui.display, "table", msg)
|
||||
can.onappend.board(can, can.ui.display, "board", msg)
|
||||
}, true)
|
||||
},
|
||||
_draw: function(event, can, point) {
|
||||
var shape = can.Action("shape");
|
||||
var figure = can.onfigure[shape];
|
||||
figure && figure.grid && figure.grid(event, can, point);
|
||||
var data = figure && figure.draw(event, can, point);
|
||||
var obj = data && can.onaction.push(event, can, data, figure.data.name||shape, can.group||can.svg);
|
||||
draw: function(event, can, point) {
|
||||
var shape = can.Action("shape")
|
||||
var figure = can.onfigure[shape]
|
||||
figure.grid && figure.grid(event, can, point)
|
||||
|
||||
event.type == "click" && obj && can.core.List(point, function(item, index) {if (!item.target) {return}
|
||||
can.onaction._ship(can, {pid: obj.Value("pid"), which: index, anchor: item.anchor}, item.target)
|
||||
var data = figure.draw && figure.draw(event, can, point)
|
||||
var obj = data && can.onaction.push(can, data, figure.data.name||shape, can.group||can.svg)
|
||||
|
||||
event.type == "click" && obj && can.core.List(point, function(item, index) {
|
||||
item.target && can.onaction._ship(can, item.target, {pid: obj.Value("pid"), which: index, anchor: item.anchor})
|
||||
})
|
||||
return obj
|
||||
},
|
||||
_move: function(event, can, point) {
|
||||
if (point.length == 1) {if (event.type != "click") {return}
|
||||
can.onaction._select(event, can, point)
|
||||
// can.point = point, can.current = {target: can.group}
|
||||
move: function(event, can, point) {
|
||||
if (point.length == 1) { if (event.type == "click") {
|
||||
can.onaction._mode.select(event, can, point)
|
||||
can.point = point, can.current = {target: event.target}
|
||||
} else if (point.length == 2) {
|
||||
if (event.type == "click") {
|
||||
}; return } else if (point.length == 2) { if (event.type == "click") {
|
||||
return can.point = [], delete(can.current)
|
||||
}
|
||||
}
|
||||
} }
|
||||
|
||||
var target = can.current.target
|
||||
var figure = can.onaction._get(can, target);
|
||||
if (point.length == 1) {
|
||||
target.style.cursor = "move"
|
||||
var figure = can.onaction._get(can, target)
|
||||
if (point.length == 1) { target.style.cursor = "move"
|
||||
can.current.pos = 5, can.current.begin = can.core.List([target], function(item) {
|
||||
if (item.tagName == "g") {return}
|
||||
if (item.tagName == "g") { return }
|
||||
return target.style.cursor = "move", {
|
||||
target: item,
|
||||
x: item.Val("x"),
|
||||
y: item.Val("y"),
|
||||
width: item.Val("width"),
|
||||
height: item.Val("height"),
|
||||
ship: can.core.List(JSON.parse(item.Value("ship")||"[]"), function(ship) {
|
||||
x: item.Val("x"), y: item.Val("y"), width: item.Val("width"), height: item.Val("height"),
|
||||
target: item, ship: can.core.List(item.Value("ship"), function(ship) {
|
||||
return ship.pid && (ship.target = can.page.Select(can, can.svg, "."+ship.pid)[0]) && ship
|
||||
})
|
||||
}
|
||||
})
|
||||
/*
|
||||
can.current.pos = 5, can.current.begin = can.page.Select(can, target, "*", function(item) {
|
||||
if (item.tagName == "g") {return}
|
||||
return target.style.cursor = "move", {
|
||||
target: item,
|
||||
x: item.Val("x"),
|
||||
y: item.Val("y"),
|
||||
width: item.Val("width"),
|
||||
height: item.Val("height"),
|
||||
ship: can.core.List(JSON.parse(item.Value("ship")||"[]"), function(ship) {
|
||||
ship.target = can.page.Select(can, can.svg, "."+ship.pid)[0];
|
||||
return ship
|
||||
})
|
||||
}
|
||||
})
|
||||
*/
|
||||
return
|
||||
}
|
||||
|
||||
can.core.List(can.current.begin, function(item) {
|
||||
var figure = can.onaction._get(can, item.target)
|
||||
|
||||
can.core.List(can.current.begin, function(item) { var figure = can.onaction._get(can, item.target)
|
||||
can.page.Resizes(event, item.target, item, point[0], point[1], can.current.pos)
|
||||
can.page.Select(can, can.svg, "."+item.target.Value("text"), function(text) {
|
||||
text.Value(figure.text(event, can, {}, item.target))
|
||||
text.Value(figure.text(can, item.target, {}))
|
||||
})
|
||||
can.core.List(item.ship, function(ship) {
|
||||
var p = can.page.Anchor(event, item.target, ship.anchor, {})
|
||||
@ -690,17 +641,15 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
|
||||
})
|
||||
})
|
||||
},
|
||||
_resize: function(event, can, point) {
|
||||
if (point.length == 1) {if (event.type != "click") {return}
|
||||
resize: function(event, can, point) {
|
||||
if (point.length == 1) { if (event.type == "click") {
|
||||
can.current = {target: event.target}
|
||||
} else if (point.length == 2) {
|
||||
if (event.type == "click") {
|
||||
} return } else if (point.length == 2) { if (event.type == "click") {
|
||||
return can.point = [], delete(can.current)
|
||||
}
|
||||
}
|
||||
} }
|
||||
|
||||
var target = can.current.target
|
||||
var figure = can.onaction._get(can, target);
|
||||
var figure = can.onaction._get(can, target)
|
||||
if (point.length == 1) {
|
||||
can.current.pos = can.page.Prepos(event, target)
|
||||
can.current.begin = {
|
||||
@ -714,34 +663,7 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
|
||||
|
||||
can.page.Resizes(event, target, can.current.begin, point[0], point[1], can.current.pos)
|
||||
},
|
||||
_scale: function(event, can, point) {if (point.length < 2) {return}
|
||||
if (point.length == 2) {
|
||||
can.last && can.page.Remove(can, can.last)
|
||||
var figure = can.onfigure["line"];
|
||||
var data = figure && figure.draw(event, can, point);
|
||||
can.last = can.onaction.push(event, can, data, "line", can.group||can.svg)
|
||||
if (event.type == "click" && point.length == 2) {
|
||||
can.point = point
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
can.now && can.page.Remove(can, can.now)
|
||||
var figure = can.onfigure["line"];
|
||||
var data = figure && figure.draw(event, can, [point[0], point[2]]);
|
||||
can.now = can.onaction.push(event, can, data, "line", can.group||can.svg)
|
||||
if (event.type == "click" && point.length == 3) {
|
||||
can.now && can.page.Remove(can, can.now)
|
||||
can.last && can.page.Remove(can, can.last)
|
||||
can.point = []
|
||||
}
|
||||
|
||||
can.group.Value("transform", "scale("+(point[2].x-point[0].x)/(point[1].x-point[0].x)+","+(point[2].y-point[0].y)/(point[1].y-point[0].y)+")")
|
||||
},
|
||||
_delete: function(event, can, point) {
|
||||
can.point = [], event.target != can.svg && can.page.Remove(can, event.target)
|
||||
},
|
||||
_select: function(event, can, point) {var target = event.target
|
||||
select: function(event, can, point) {var target = event.target
|
||||
while (target) {
|
||||
if (target.tagName == "g") {
|
||||
can.Action("group", target.Value("class"))
|
||||
@ -757,43 +679,69 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
|
||||
}
|
||||
can.point = []
|
||||
},
|
||||
delete: function(event, can, point) {
|
||||
can.point = [], event.target != can.svg && can.page.Remove(can, event.target)
|
||||
},
|
||||
|
||||
oncontextmenu: function(event, can) {var target = event.target
|
||||
var figure = can.onaction._get(can, target);
|
||||
can.user.carte(event, shy("", can.ondetail, figure.data.detail || can.ondetail.list, function(event, key, meta) {var cb = meta[key];
|
||||
typeof cb == "function" && cb(event, can, figure, key, target);
|
||||
}), can), event.stopPropagation(), event.preventDefault()
|
||||
},
|
||||
onclick: function(event, can) {
|
||||
var p = can.svg.getBoundingClientRect();
|
||||
var point = {x: event.clientX-p.x, y: event.clientY-p.y};
|
||||
point.x = point.x - point.x % parseInt(can.Action("grid"));
|
||||
point.y = point.y - point.y % parseInt(can.Action("grid"));
|
||||
can.point = (can.point || []).concat([point]);
|
||||
scale: function(event, can, point) {if (point.length < 2) {return}
|
||||
if (point.length == 2) {
|
||||
can.last && can.page.Remove(can, can.last)
|
||||
var figure = can.onfigure["line"];
|
||||
var data = figure && figure.draw(event, can, point);
|
||||
can.last = can.onaction.push(can, data, "line", can.group||can.svg)
|
||||
if (event.type == "click" && point.length == 2) {
|
||||
can.point = point
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
can.temp && can.page.Remove(can, can.temp) && delete(can.temp);
|
||||
can.temp = can.onaction["_"+can.Action("mode")](event, can, can.point);
|
||||
can.point.length == 0 && delete(can.temp);
|
||||
can.now && can.page.Remove(can, can.now)
|
||||
var figure = can.onfigure["line"];
|
||||
var data = figure && figure.draw(event, can, [point[0], point[2]]);
|
||||
can.now = can.onaction.push(can, data, "line", can.group||can.svg)
|
||||
if (event.type == "click" && point.length == 3) {
|
||||
can.now && can.page.Remove(can, can.now)
|
||||
can.last && can.page.Remove(can, can.last)
|
||||
can.point = []
|
||||
}
|
||||
|
||||
can.group.Value("transform", "scale("+(point[2].x-point[0].x)/(point[1].x-point[0].x)+","+(point[2].y-point[0].y)/(point[1].y-point[0].y)+")")
|
||||
},
|
||||
onmouseover: function(event, can) {
|
||||
can.Status(event, event.target, "which")
|
||||
},
|
||||
onmousemove: function(event, can) {
|
||||
|
||||
_point: function(event, can) {
|
||||
var p = can.svg.getBoundingClientRect()
|
||||
var point = {x: event.clientX-p.x, y: event.clientY-p.y}
|
||||
point.x = point.x - point.x % parseInt(can.Action("grid"));
|
||||
point.y = point.y - point.y % parseInt(can.Action("grid"));
|
||||
can.Status(event, point, "point")
|
||||
point.x = point.x - point.x % parseInt(can.Action("grid"))
|
||||
point.y = point.y - point.y % parseInt(can.Action("grid"))
|
||||
return point
|
||||
},
|
||||
_action: function(event, can, points) {
|
||||
can.temp && can.page.Remove(can, can.temp) && delete(can.temp)
|
||||
can.temp = can.onaction._mode[can.Action("mode")](event, can, points)
|
||||
can.point.length == 0 && delete(can.temp)
|
||||
},
|
||||
_show: function(event, can, target) { var figure = can.onaction._get(can, target)
|
||||
can.Status("target", (target.Group && target.Group().Value("class") || "") + " " + target.tagName + " " + (
|
||||
figure? figure.show(can, target): ""))
|
||||
if (target.Value) {
|
||||
can.Status("zone", target.Value("zone"))
|
||||
can.Status("type", target.Value("type"))
|
||||
can.Status("name", target.Value("name"))
|
||||
}
|
||||
},
|
||||
_menu: function(event, can, target) { var figure = can.onaction._get(can, target)
|
||||
can.onappend.carte(event, can.ondetail, figure.data.detail||can.ondetail.list, function(event, key, meta) {
|
||||
typeof cb == "function" && cb(event, can, figure, key, target)
|
||||
})
|
||||
},
|
||||
_auto: function(event, can, target, pos) {
|
||||
if (target.tagName == "text") {
|
||||
|
||||
var pos = can.page.Prepos(event, event.target)
|
||||
|
||||
if (can.Action("go") == "auto" && can.point.length == 0) {
|
||||
if (event.target.tagName == "text") {
|
||||
|
||||
} else if (event.target == can.svg) {
|
||||
} else if (target == can.svg) {
|
||||
if (pos == 5) {
|
||||
can.Action("mode", "draw")
|
||||
can.Action("shape", "think")
|
||||
can.Action("shape", "block")
|
||||
} else {
|
||||
can.Action("mode", "resize")
|
||||
}
|
||||
@ -805,23 +753,35 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
|
||||
can.Action("shape", "line")
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
oncontextmenu: function(event, can) {
|
||||
can.onaction._show(event, can, event.target)
|
||||
},
|
||||
ondblclick: function(event, can) {
|
||||
},
|
||||
onclick: function(event, can) {
|
||||
if (can.Action("go") == "run") {
|
||||
can.onaction._mode.run(event, can)
|
||||
return
|
||||
}
|
||||
|
||||
// if (["move", "resize"].indexOf(can.Action("mode"))) {
|
||||
// can.current ||
|
||||
// }
|
||||
|
||||
can.temp && can.page.Remove(can, can.temp) && delete(can.temp);
|
||||
can.temp = can.onaction["_"+can.Action("mode")](event, can, can.point.concat(point));
|
||||
can.point.length == 0 && delete(can.temp);
|
||||
if (event.target == can._target) { return }
|
||||
var point = can.onaction._point(event, can)
|
||||
can.onaction._action(event, can, can.point = can.point.concat(point))
|
||||
},
|
||||
})
|
||||
Volcanos("onchoice", {help: "组件交互", list: ["move", "draw", "保存", "添加", "删除"],
|
||||
"move": function(event, can, msg, cmd, target) {
|
||||
can.Action("mode", cmd)
|
||||
onmouseover: function(event, can) {
|
||||
can.onaction._show(event, can, event.target)
|
||||
},
|
||||
"draw": function(event, can, msg, cmd, target) {
|
||||
can.Action("mode", cmd)
|
||||
onmousemove: function(event, can) {
|
||||
var point = can.onaction._point(event, can)
|
||||
can.Status("point", point.x+","+point.y)
|
||||
if (can.Action("go") == "run") { return }
|
||||
|
||||
var pos = can.page.Prepos(event, event.target)
|
||||
if (can.Action("go") == "auto" && can.point.length == 0) {
|
||||
can.onaction._auto(event, can, event.target, pos)
|
||||
}
|
||||
can.onaction._action(event, can, can.point.concat(point))
|
||||
},
|
||||
})
|
||||
Volcanos("ondetail", {help: "组件详情", list: ["标签", "编辑", "复制", "变色", "运行", "删除"],
|
||||
@ -839,8 +799,8 @@ Volcanos("ondetail", {help: "组件详情", list: ["标签", "编辑", "复制",
|
||||
}
|
||||
|
||||
var figure = can.onaction._get(can, target);
|
||||
var data = figure.text(event, can, {inner: text}, target)
|
||||
var obj = can.onaction.push(event, can, data, "text", target.Group())
|
||||
var data = figure.text(can, target, {inner: text})
|
||||
var obj = can.onaction.push(can, data, "text", target.Group())
|
||||
target.Value("text", obj.Value("pid"))
|
||||
}, def, value.silent)
|
||||
},
|
||||
@ -861,7 +821,7 @@ Volcanos("ondetail", {help: "组件详情", list: ["标签", "编辑", "复制",
|
||||
data[figure.size.x||"x"] = parseInt(target.Value(figure.size.x||"x"))+20;
|
||||
data[figure.size.y||"y"] = parseInt(target.Value(figure.size.y||"y"))+20;
|
||||
|
||||
var p = data && can.onaction.push(event, can, data, target.tagName, can.group||can.svg)
|
||||
var p = data && can.onaction.push(can, data, target.tagName, can.group||can.svg)
|
||||
can.page.Select(can, can.svg, "."+target.Value("text"), function(item) {
|
||||
can.ondetail["标签"](event, can, {silent: true, def: item.Value("inner")}, "", p);
|
||||
})
|
||||
@ -893,23 +853,12 @@ Volcanos("ondetail", {help: "组件详情", list: ["标签", "编辑", "复制",
|
||||
},
|
||||
"删除": function(event, can, value, cmd, target) {can.page.Remove(can, target)},
|
||||
})
|
||||
|
||||
Volcanos("onexport", {help: "导出数据", list: ["point", "which", "begin", "width", "keys"],
|
||||
file: function(event, can, svg) {
|
||||
Volcanos("onexport", {help: "导出数据", list: ["group", "target", "zone", "type", "name", "point", "keys"],
|
||||
file: function(can, svg) {
|
||||
return ['<svg vertion="1.1" xmlns="https://www.w3.org/2000/svg" text-anchor="middle" dominant-baseline="middle"'].concat(
|
||||
svg? can.core.List(["count", "width", "height", "font-size", "stroke-width", "stroke", "fill"], function(item) {
|
||||
return svg.Value(item)? ' ' + item + '="' + svg.Value(item) + '"': ""
|
||||
}): []).concat(['>', svg? svg.innerHTML: "", "</svg>"]).join("")
|
||||
},
|
||||
|
||||
"point": function(event, can, value, cmd, target) {target.innerHTML = value.x+","+value.y},
|
||||
"which": function(event, can, value, cmd, target) {
|
||||
var figure = can.onaction._get(can, value);
|
||||
target.innerHTML = (value.Group && value.Group().Value("class") || "") + " " + value.tagName + " " + (
|
||||
figure? figure.show(event, can, value, value): "")
|
||||
},
|
||||
"begin": function(event, can, value, cmd, target) {target.innerHTML = value? value.x+","+value.y: ""},
|
||||
"width": function(event, can, value, cmd, target) {target.innerHTML = value? value.Val("width")+","+value.Val("height"): ""},
|
||||
"keys": function(event, can, value, cmd, target) {target.innerHTML = value},
|
||||
})
|
||||
|
||||
|
||||
@ -1,51 +1,25 @@
|
||||
fieldset.story {
|
||||
clear:both;
|
||||
margin:5px;
|
||||
}
|
||||
fieldset.float {
|
||||
float:left;
|
||||
clear:none;
|
||||
}
|
||||
fieldset.clear {
|
||||
fieldset.word h2.story {
|
||||
clear:both;
|
||||
}
|
||||
|
||||
fieldset p.story {
|
||||
fieldset.word p.story {
|
||||
white-space:pre;
|
||||
}
|
||||
fieldset ul.story li:hover {
|
||||
border:solid 2px red;
|
||||
cursor:pointer;
|
||||
fieldset.word svg.story {
|
||||
display:block;
|
||||
float:left;
|
||||
}
|
||||
fieldset.word fieldset.story {
|
||||
float:left; clear:both;
|
||||
}
|
||||
fieldset.word fieldset.story:hover {
|
||||
border:solid 1px red;
|
||||
}
|
||||
fieldset code.story {
|
||||
display:block;
|
||||
color:white;
|
||||
font-size:14px;
|
||||
font-family:monospace;
|
||||
background-color:#272822;
|
||||
white-space:pre;
|
||||
padding:10px;
|
||||
overflow:auto;
|
||||
border:solid 3px green;
|
||||
max-height:640px;
|
||||
display:block; border:solid 3px green;
|
||||
color:white; background-color:#272822;
|
||||
font-size:14px; font-family:monospace;
|
||||
max-height:640px; overflow:auto;
|
||||
padding:10px; white-space:pre;
|
||||
clear:both;
|
||||
}
|
||||
|
||||
fieldset div.stack:hover {
|
||||
background-color:red;
|
||||
}
|
||||
fieldset div.stack {
|
||||
cursor:pointer;
|
||||
width:fit-content;
|
||||
}
|
||||
fieldset div.stack.fold {
|
||||
font-weight:bold;
|
||||
}
|
||||
fieldset ul.stack {
|
||||
border:solid 2px #0000;
|
||||
margin:0px;
|
||||
}
|
||||
fieldset ul.stack:hover {
|
||||
border:solid 2px red;
|
||||
}
|
||||
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user