x/volcanos
1
0
Fork 1
mirror of https://shylinux.com/x/volcanos synced 2025-04-25 08:48:06 +08:00
Code Issues Packages Projects Releases Wiki Activity

add 20200202

Browse Source
This commit is contained in:
shaoying 2020-02-02 04:22:33 +08:00
parent 8363e001a8
commit b88af45ac5
18 changed files with 1000 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
frame.js
View File

@ -112,6 +112,7 @@ var can = Volcanos("chat", {
var option = field.querySelector("form.option");
var action = field.querySelector("div.action");
var output = field.querySelector("div.output");
var status = field.querySelector("div.status");
var history = []
@ -190,7 +191,7 @@ var can = Volcanos("chat", {
})
},
Show: function(type, msg, cb) {plugin.msg = msg, msg._plugin_name = name;
return plugin._output = plugin[type] = can.Output(plugin, feature, type, msg, cb, output, option)
return plugin._output = plugin[type] = can.Output(plugin, feature, type, msg, cb, output, action, option, status)
},
Clone: function(event, cb) {meta.nick = meta.name + can.ID()
meta.args = can.page.Select(can, plugin.option, ".args", function(item) {return item.value})
@ -199,6 +200,31 @@ var can = Volcanos("chat", {
},
Delete: function(event) {field.parentNode.removeChild(field)},
}, Config.libs.concat(["plugin/"+(meta.type||feature.active||"state")]), function(plugin) {plugin.Conf(meta);
var resize = false, last, size, change;
can.page.Select(can, field, "div.border-bottom", function(item) {
item.onmousedown = function(event) {resize = !resize;
can.escape = function(event) {resize = false
plugin._output.onaction && plugin._output.onaction.resize && plugin._output.onaction.resize(event, plugin._output, change, "y")
}
can.resize = plugin.resize = function(event) {change = event.clientY - last;
if (resize) {field.style.height = size + change + "px"}
}
size = field.offsetHeight;
last = event.clientY;
}
item.onmousemove = function(event) {plugin.resize && plugin.resize(event)}
})
can.page.Select(can, field, "div.border-right", function(item) {
item.onmousedown = function(event) {resize = !resize;
can.escape = function(event) {resize = false}
can.resize = plugin.resize = function(event) {
if (resize) {field.style.width = size + event.clientX - last + "px"}
}
size = field.offsetWidth;
last = event.clientX;
}
item.onmousemove = function(event) {plugin.resize && plugin.resize(event)}
})
var list = JSON.parse(meta.inputs||"[]");
plugin.onimport._init? plugin.onimport._init(plugin, feature, plugin.output, plugin.action, plugin.option):
can.core.Next(list.length>0? list: [{type: "text"}, {type: "button", value: "执行"}], plugin.Append, function() {
@ -229,24 +255,37 @@ var can = Volcanos("chat", {
})
return input
}),
Output: shy("构造组件", function(can, feature, type, msg, cb, target, option) {
Output: shy("构造组件", function(can, feature, type, msg, cb, target, action, option, status) {
if (type == "inner" && (!msg.result || msg.result.length == 0)) {type = "table"}
var output = Volcanos(type, {_type: "local", msg: msg, feature: feature,
var output = Volcanos(type, {_type: "local", action: action, msg: msg, feature: feature,
Option: function(key, value) {
can.page.Select(can, can.option, "input[name="+key+"],select[name="+key+"]", function(item) {
value != undefined && (item.value = value), value = item.value
})
return value
},
Import: function(event, value, key) {var cb = output.onimport[key];
typeof cb == "function" && cb(event, output, value, key, target);
},
Status: function(event, value, key) {var cb = output.onstatus[key];
typeof cb == "function"? cb(event, output, value, key, can.page.Select(can, status, "div."+key)[0]): false && output.run(event, ["status", key, value], function(msg) {
output.Export(event, msg, key)
}, true)
},
Export: function(event, value, key, index) {var cb = output.onexport[key];
typeof cb == "function"? cb(event, output, value, key, target): can.Report(event, value, key, index)
},
Export: function(event, value, key, index) {can.Report(event, value, key, index)},
run: function(event, cmd, cb, silent) {
var msg = can.Event(event);
run: function(event, cmd, cb, silent) {var msg = can.Event(event);
can.page.Select(can, option, "input,select", function(item) {
item.name && item.value && msg.Option(item.name, item.value)
});
(output[cmd[1]] || can[cmd[1]] || can.Run)(event, cmd, cb, silent);
},
}, Config.libs.concat(["plugin/"+type]), function(output) {
output.onimport.init(output, msg, cb, target, option);
}, Config.libs.concat([(type.startsWith("/")? "": "plugin/")+type]), function(output) {
status.innerHTML = "", output.onstatus && can.page.AppendStatus(output, status, output.onstatus.list)
output.onimport.init(output, msg, cb, target, action, option);
}, msg)
return output.target = target, target.Output = output
}),

25
lib/page.js
View File

@ -86,12 +86,13 @@ Volcanos("page", {help: "网页模块",
} else if (item.select) {var list = item.select;
type = "select", name = name || list[0][0];
data.onchange = function(event) {
typeof list[1] == "function" && list[1](event, event.target.value);
typeof list[1] == "function" && list[1](event, event.target.value, name);
}
item.list = list[0].slice(1).map(function(value) {
return {type: "option", value: value, inner: value};
})
data.className = list[0][0] || "";
data.title = data.title || name;
} else if (item.input) {var list = can.core.List(item.input);
type = "input", name = name || list[0] || "";
@ -129,6 +130,10 @@ Volcanos("page", {help: "网页模块",
} else if (item.row) {type = "tr";
item.list = item.row.map(function(text) {return {text: [text, item.sub||"td"]}});
} else if (item.include) {var list = can.core.List(item.include);
type = "script";
data.src = list[0];
data.onload = list[1];
}
@ -145,7 +150,7 @@ Volcanos("page", {help: "网页模块",
return target.innerHTML = "", can.page.Append(can, target, key, value)
}),
Remove: shy("删除节点", function(can, target, key, value) {
target.parentNode.removeChild(target)
target.parentNode && target.parentNode.removeChild(target)
}),
CopySub: shy("复制节点", function(can, target, source) {
@ -184,10 +189,11 @@ Volcanos("page", {help: "网页模块",
AppendField: shy("添加插件", function(can, target, type, item) {
var dataset = {}; item && item.name && (dataset.names = item.name);
var field = can.page.Append(can, target, [{view: [type, "fieldset"], list: [
{view: ["border-left"]}, {view: ["border-right"]},
item.pos? undefined: {text: [(item.nick||item.name||"")+"("+(item.help||"")+")", "legend"]},
{view: ["option", "form"], dataset: dataset, list: [{type: "input", style: {display: "none"}}]},
{view: ["action"]},
{view: ["output"]},
{view: ["action"]}, {view: ["output"]}, {view: ["status"]},
{view: ["border-bottom"]},
]}]).first;
return field;
}),
@ -253,6 +259,17 @@ Volcanos("page", {help: "网页模块",
})
},
AppendAction: shy("添加控件", function(can, action, list, cb) {
can.page.Append(can, action, can.core.List(list, function(line) {
return typeof line == "string"? {button: [line, cb]}: line.length > 0? {select: [line, cb]}: line
}))
}),
AppendStatus: shy("添加控件", function(can, status, list, cb) {
can.page.Append(can, status, can.core.List(list, function(line) {
return {view: [line]}
}))
}),
Display: function(text) {
if (text.startsWith("http")) {return "<a href='"+text+"' target='_blank'>"+text+"</a>"}
text = text.replace(/\033\[31m/g, "<span style='color:#f00'>")

2
lib/user.js
View File

@ -1,7 +1,7 @@
Volcanos("user", {help: "用户模块",
alert: function(text) {alert(JSON.stringify(text))},
confirm: function(text) {return confirm(JSON.stringify(text))},
prompt: function(text, cb) {(text = prompt(text)) != undefined && typeof cb == "function" && cb(text); return text},
prompt: function(text, cb, def) {(text = prompt(text, def||"")) != undefined && typeof cb == "function" && cb(text); return text},
reload: function(force) {(force || confirm("重新加载页面？")) && location.reload()},
title: function(text) {document.title = text},

1
order.js
View File

@ -31,6 +31,7 @@ var Config = {context: "/chat/",
{group: "index", name: "Footer", pos: "foot", state: ["ntxt", "ncmd"], title: '<a href="mailto:shylinux@163.com">shylinux@163.com</a>'},
], layout: {def: "办公", list: ["工作", "办公", "聊天"], size: {
"最大": {head: 0, foot: 0, left: 0, right: 0, bottom: -1, center: 0, top: 0},
"工作": {head: 30, foot: 30, left: 0, right: 100, bottom: -1, center: 0, top: 0},
"办公": {head: 30, foot: 30, left: 100, right: 100, bottom: -1, center: 0, top: 0},
"聊天": {head: 30, foot: 30, left: 100, right: 100, bottom: 300, center: 40, top: -2},

1
page/chat.js
View File

@ -18,6 +18,7 @@ Volcanos("onaction", {help: "组件交互", list: [],
can.Report(event, {x: 0, y: 30}, "scroll")
break
case "Escape":
can.Action.escape && can.Action.escape(event)
break
case " ":
can.Favor && can.page.Select(can, can.Favor.Show(), "input.cmd", function(item) {

14
pane/Action.js
View File

@ -50,18 +50,14 @@ Volcanos("onimport", {help: "导入数据", list: [],
can._plugin && can._plugin.Import(event, msg, cmd)
},
})
Volcanos("onaction", {help: "组件交互", list: [["layout", "工作", "办公", "聊天"], "清屏", "刷新", "串行", "并行",
Volcanos("onaction", {help: "组件交互", list: [["layout", "最大", "工作", "办公", "聊天"], "清屏", "刷新", "串行", "并行",
{input: "pod"}, {input: "you"}, {input: "hot"}, {input: "top"},
],
"工作": function(event, can, msg, cmd, output) {
can.Export(event, cmd, "layout")
onmousemove: function(event, can, msg, cmd, output) {
can.resize && can.resize(event)
},
"办公": function(event, can, msg, cmd, output) {
can.Export(event, cmd, "layout")
},
"聊天": function(event, can, msg, cmd, output) {
can.Export(event, cmd, "layout")
layout: function(event, can, value, cmd, output) {
can.Export(event, value, cmd)
},
"清屏": function(event, can, msg, cmd, output) {
can.page.Select(can, output, "fieldset.item>div.output", function(item) {

133
plugin/china.js Normal file
View File

@ -0,0 +1,133 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
// can.page.Append(can, action, [{type: "script", src: "https://cdn.bootcss.com/echarts/4.2.0-rc.2/echarts.js"}]);
can.page.Append(can, output, [{include: ["/plugin/github.com/shylinux/echarts/echarts.js", function(event) {
can.page.Append(can, output, [{include: ["/plugin/github.com/shylinux/echarts/china.js", function(event) {
var china_chart = echarts.init(can.page.Append(can, output, [{type: "div", style: {width: "600px", height: "400px"}}]).last);
var data = msg.Table()
var yData = [];
var barData = [];
for (var i = 0; i < (data.length>10? 10: data.length); i++) {
yData.push(i + data[i].name);
barData.push(data[i]);
}
var option = {
title: [{
text: msg.Option("title"),
show: true, right: 250, top: 10,
textStyle: {color: '#2D3E53', fontSize: 18},
}],
tooltip: {
show: true, formatter: function(params) {
return params.name + "<br/>"
+ ' 确认病例:' + params.data['confirm'] + '人<br/>'
+ ' 死亡病例:' + params.data['dead'] + '人<br/>'
},
},
visualMap: {
type: 'continuous',
orient: 'horizontal',
itemWidth: 10,
itemHeight: 80,
text: ['高', '低'],
showLabel: true,
seriesIndex: [0],
min: 0,
max: data[1].value,
inRange: {
color: ['#6FCF6A', '#FFFD64', '#FF5000']
},
textStyle: {
color: '#7B93A7'
},
bottom: 30,
left: 'left',
},
grid: {right: 10, top: 135, bottom: 100, width: '20%'},
xAxis: {show: false},
yAxis: {
type: 'category',
inverse: true,
nameGap: 16,
axisLine: {show: false, lineStyle: {color: '#ddd'}},
axisTick: {show: false, lineStyle: {color: '#ddd'}},
axisLabel: {
margin: 0,
interval: 0,
textStyle: {color: '#455A74', align: 'left', fontSize: 14},
rich: {
a: {
color: '#fff',
backgroundColor: '#FAAA39',
width: 20,
height: 20,
align: 'center',
borderRadius: 2
},
b: {
color: '#fff',
backgroundColor: '#4197FD',
width: 20,
height: 20,
align: 'center',
borderRadius: 2
}
},
formatter: function(params) {
if (parseInt(params.slice(0, 1)) < 3) {
return [
'{a|' + (parseInt(params.slice(0, 1)) + 1) + '}' + ' ' + params.slice(1)
].join('\n')
} else {
return [
'{b|' + (parseInt(params.slice(0, 1)) + 1) + '}' + ' ' + params.slice(1)
].join('\n')
}
}
},
data: yData
},
geo: {
map: 'china', left: 'left', right: '100',
label: {emphasis: {show: false}},
itemStyle: {emphasis: {areaColor: '#fff464'}},
},
series: [{
roam: false, type: 'map', name: 'mapSer',
geoIndex: 0, label: {show: false},
data: data
}, {
roam: false, type: 'bar', name: 'barSer',
visualMap: false, barGap: 0, barMaxWidth: 8,
zlevel: 100, itemStyle: {
normal: {
color: function(params) {
// build a color map as your need.
var colorList = [{colorStops: [
{offset: 0, color: '#FFD119'}, // 0% 处的颜色
{offset: 1, color: '#FFAC4C'}, // 100% 处的颜色
]}, {colorStops: [
{offset: 0, color: '#00C0FA'}, // 0% 处的颜色
{offset: 1, color: '#2F95FA'}, // 100% 处的颜色
]}];
return params.dataIndex < 3? colorList[0]: colorList[1]
},
barBorderRadius: 15
}
},
data: barData
}]
};
china_chart.setOption(option);
}]}]);
}]}]);
},
})
Volcanos("onaction", {help: "组件交互", list: []})
Volcanos("onchoice", {help: "组件菜单", list: []})
Volcanos("ondetail", {help: "组件详情", list: []})
Volcanos("onexport", {help: "导出数据", list: []})

2
plugin/inner.js
View File

@ -1,5 +1,5 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, option) {output.innerHTML = msg.Result();
init: function(can, msg, cb, output, action, option) {output.innerHTML = msg.Result();
can.page.Select(can, output, "table", function(table) {can.page.OrderTable(can, table)})
can.page.Select(can, output, ".story", function(story) {var data = story.dataset||{};
story.oncontextmenu = function(event) {var detail = can.feature.detail || can.ondetail.list;

2
plugin/media.js
View File

@ -2,7 +2,7 @@ Volcanos("onimport", {help: "导入数据", list: [],
_init: function(can, output, action, option, field) {
output.innerHTML = msg.Result();
},
init: function(can, msg, cb, output, option) {output.innerHTML = msg.Result();
init: function(can, msg, cb, output, action, option) {output.innerHTML = msg.Result();
},
favor: function(event, can, msg, cmd, output) {var key = msg.detail[0];
var cb = can.onaction[key]; if (typeof cb == "function") {cb(event, can, msg, cmd, output); return msg.Echo(can._name, " onaction ", key), msg._hand = true}

2
plugin/table.js
View File

@ -1,5 +1,5 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, option) {output.innerHTML = "";
init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
if (!msg.append || msg.append.length == 0) {
var code = can.page.Append(can, output, [{view: ["code", "div", msg.Result()]}]).code;
return typeof cb == "function" && cb(msg), code;

10
plugin/template.js Normal file
View File

@ -0,0 +1,10 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
},
})
Volcanos("onaction", {help: "组件交互", list: []})
Volcanos("onchoice", {help: "组件菜单", list: []})
Volcanos("ondetail", {help: "组件详情", list: []})
Volcanos("onexport", {help: "导出数据", list: []})

85
plugin/wiki/data.js Normal file
View File

@ -0,0 +1,85 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
var isData = msg.result && msg.result.length > 0;
if (msg.append && msg.append.length > 0) {
var table = can.page.AppendTable(can, output, msg, msg.append);
table.onclick = function(event) {switch (event.target.tagName) {
case "TD":
if (isData) {
var target = event.target;
can.page.Appends(can, event.target, [{type: "input", value: target.innerHTML, onkeydown: function(event) {
if (event.key == "Enter") {
target.innerHTML = event.target.value
}
}}])
break
}
can.onimport.which(event, table, msg.append, function(index, key) {
can.Option("name", event.target.innerHTML.trim())
can.run(event, [event.target.innerHTML.trim()], function(msg) {})
})
break
case "TH":
break
case "TR":
case "TABLE":
}}
return typeof cb == "function" && cb(msg), table;
}
},
which: function(event, table, list, cb) {if (event.target == table) {return cb(-1, "")}
can.page.Select(can, table, "tr", function(tr, index) {if (event.target == tr) {return cb(index-1, "")}
can.page.Select(can, tr, "th,td", function(td, order) {
if (event.target == td) {return cb(index-1, list[order])}
})
})
},
})
Volcanos("onaction", {help: "组件菜单", list: ["保存",
],
"保存": function(event, can, msg, cmd, target) {
can.run(event, ["action", cmd, can.Option("name"), can.page.Select(can, target, "tr", function(tr) {return can.page.Select(can, tr, "th,td", function(td) {return td.innerHTML}).join(",")}).join("\n")], function() {
can.user.toast("保存成功")
}, true)
},
})
Volcanos("onchoice", {help: "组件交互", list: ["保存", "清空", ["rect", "rect", "line", "circle"]],
"清空": function(event, can, msg, cmd, target) {
console.log("choice", cmd)
},
})
Volcanos("ondetail", {help: "组件详情", list: ["编辑", "删除"],
"编辑": function(event, can, msg, index, key, cmd, target) {
can.user.prompt("文字", function(text) {
if (target.tagName == "text") {return target.innerHTML = text}
var data = {"text-anchor": "middle", "dominant-baseline": "middle"}
var figure = can.onfigure[target.tagName]
figure.text(event, can, data, target)
var p = can.onaction.push(event, can, data, "text", can.svg)
p.innerHTML = text;
target.Text && can.page.Remove(can, target.Text) && delete(target.Text)
target.Text = p
}, target.Text && target.Text.innerText || "")
},
"复制": function(event, can, msg, index, key, cmd, target) {
var figure = can.onfigure[target.tagName]
figure.copy(event, can, target)
},
"删除": function(event, can, msg, index, key, cmd, target) {
can.page.Remove(can, target)
},
})
Volcanos("onstatus", {help: "组件状态", list: ["begin", "width", "point", "which"],
"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.width+","+value.height: ""},
"point": function(event, can, value, cmd, target) {target.innerHTML = value.x+","+value.y},
"which": function(event, can, value, cmd, target) {var figure = can.onfigure[value.tagName];
target.innerHTML = figure? figure.show(event, can, value, target): value.tagName;
},
})
Volcanos("onexport", {help: "导出数据", list: []})

90
plugin/wiki/feel.js Normal file
View File

@ -0,0 +1,90 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
if (msg.append && msg.append.length > 0) {
var table = can.page.AppendTable(can, output, msg, msg.append);
var prefix = can.page.Append(can, output, [{view: ["prefix"], list: msg.Table(function(item) {
var items = item.path.split(".")
switch (items[items.length-1]) {
case "JPG":
return {img: "/share/local/"+item.path, width: "200"}
case "MOV":
return {type: "video", width: "200",
data: {controls: "controls", autoplay: false, loop: true, src: "/share/local/"+item.path}}
default:
return
}
})}]);
table.onclick = function(event) {switch (event.target.tagName) {
case "TD":
can.onimport.which(event, table, msg.append, function(index, key) {
var name = event.target.innerHTML.trim()
if (name.endsWith("/")) {
can.Option("name", name)
can.run(event, [name], function(msg) {})
}
})
break
case "TH":
break
case "TR":
case "TABLE":
}}
return typeof cb == "function" && cb(msg), table;
}
},
which: function(event, table, list, cb) {if (event.target == table) {return cb(-1, "")}
can.page.Select(can, table, "tr", function(tr, index) {if (event.target == tr) {return cb(index-1, "")}
can.page.Select(can, tr, "th,td", function(td, order) {
if (event.target == td) {return cb(index-1, list[order])}
})
})
},
})
Volcanos("onaction", {help: "组件菜单", list: ["保存",
],
"保存": function(event, can, msg, cmd, target) {
can.run(event, ["action", cmd, can.Option("name"), can.page.Select(can, target, "tr", function(tr) {return can.page.Select(can, tr, "th,td", function(td) {return td.innerHTML}).join(",")}).join("\n")], function() {
can.user.toast("保存成功")
}, true)
},
})
Volcanos("onchoice", {help: "组件交互", list: ["保存", "清空", ["rect", "rect", "line", "circle"]],
"清空": function(event, can, msg, cmd, target) {
console.log("choice", cmd)
},
})
Volcanos("ondetail", {help: "组件详情", list: ["编辑", "删除"],
"编辑": function(event, can, msg, index, key, cmd, target) {
can.user.prompt("文字", function(text) {
if (target.tagName == "text") {return target.innerHTML = text}
var data = {"text-anchor": "middle", "dominant-baseline": "middle"}
var figure = can.onfigure[target.tagName]
figure.text(event, can, data, target)
var p = can.onaction.push(event, can, data, "text", can.svg)
p.innerHTML = text;
target.Text && can.page.Remove(can, target.Text) && delete(target.Text)
target.Text = p
}, target.Text && target.Text.innerText || "")
},
"复制": function(event, can, msg, index, key, cmd, target) {
var figure = can.onfigure[target.tagName]
figure.copy(event, can, target)
},
"删除": function(event, can, msg, index, key, cmd, target) {
can.page.Remove(can, target)
},
})
Volcanos("onstatus", {help: "组件状态", list: ["begin", "width", "point", "which"],
"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.width+","+value.height: ""},
"point": function(event, can, value, cmd, target) {target.innerHTML = value.x+","+value.y},
"which": function(event, can, value, cmd, target) {var figure = can.onfigure[value.tagName];
target.innerHTML = figure? figure.show(event, can, value, target): value.tagName;
},
})
Volcanos("onexport", {help: "导出数据", list: []})

315
plugin/wiki/mind.js Normal file
View File

@ -0,0 +1,315 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
if (msg.append && msg.append.length > 0) {
var table = can.page.AppendTable(can, output, msg, msg.append);
table.onclick = function(event) {switch (event.target.tagName) {
case "TD":
can.onimport.which(event, table, msg.append, function(index, key) {
can.Option("name", event.target.innerHTML.trim())
can.run(event, [event.target.innerHTML.trim()], function(msg) {})
})
break
case "TH":
break
case "TR":
case "TABLE":
}}
return typeof cb == "function" && cb(msg), table;
}
var code = can.page.Append(can, output, [{view: ["code", "div", msg.Result()]}]).code;
can.page.Select(can, output, "svg", function(item) {can.svg = item, item.Value = function(key) {return item[key].baseVal.value}});
can.page.Select(can, output, "svg *", function(item, index) {
can.onaction.init(event, can, msg, index, item);
})
can.point = []
return typeof cb == "function" && cb(msg), code;
},
which: function(event, table, list, cb) {if (event.target == table) {return cb(-1, "")}
can.page.Select(can, table, "tr", function(tr, index) {if (event.target == tr) {return cb(index-1, "")}
can.page.Select(can, tr, "th,td", function(td, order) {
if (event.target == td) {return cb(index-1, list[order])}
})
})
},
})
Volcanos("onfigure", {help: "图形绘制", list: [],
rect: {
data: {rx: 4, ry: 4}, // <rect x="60" y="10" rx="10" ry="10" width="30" height="30"/>
draw: function(event, can, point, color) {
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),
"height": Math.abs(p0.y-p1.y),
}
can.core.Item(can.onfigure.rect.data, function(key, value) {
data[key] = value
}), data.fill = color
can.Status(event, data, "width");
event.type == "click" && point.length == 2 && (can.point = [])
return data;
},
text: function(event, can, data, target) {
data.x = target.x.baseVal.value+target.width.baseVal.value/2
data.y = target.y.baseVal.value+target.height.baseVal.value/2
return data
},
copy: function(event, can) {
},
show: function(event, can, value, target) {
return value.tagName
+ ": (" + value.x.baseVal.value + "," + value.y.baseVal.value+ ")"
+ " + (" + value.width.baseVal.value + "," + value.height.baseVal.value+ ")"
},
},
circle: {
data: {}, // <circle cx="25" cy="75" r="20"/>
draw: function(event, can, point, color) {
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)),
"fill": color,
}
event.type == "click" && point.length == 2 && (can.point = [])
return data;
},
text: function(event, can, data, target) {
data.x = target.cx.baseVal.value
data.y = target.cy.baseVal.value
return data
},
show: function(event, can, value, target) {
return value.tagName
+ ": (" + value.cx.baseVal.value + "," + value.cy.baseVal.value+ ")"
+ " > (" + parseInt(value.r.baseVal.value) + ")"
},
},
ellipse: {
data: {}, // <ellipse cx="75" cy="75" rx="20" ry="5"/>
draw: function(event, can, point, color) {
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),
"fill": color,
}
event.type == "click" && point.length == 2 && (can.point = [])
return data;
},
text: function(event, can, data, target) {
data.x = target.cx.baseVal.value
data.y = target.cy.baseVal.value
return data
},
show: function(event, can, value, target) {
return value.tagName
+ ": (" + value.cx.baseVal.value + "," + value.cy.baseVal.value+ ")"
+ " > (" + parseInt(value.rx.baseVal.value) + parseInt(value.ry.baseVal.value) + ")"
},
},
line: {
data: {}, // <line x1="10" x2="50" y1="110" y2="150"/>
draw: function(event, can, point, color) {
var p0 = point[0], p1 = point[1];
var data = {
"x1": p0.x, "y1": p0.y,
"x2": p1.x, "y2": p1.y,
"stroke": color,
}
event.type == "click" && point.length == 2 && (can.point = [])
return data;
},
text: function(event, can, data, target) {
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.x1.baseVal.value + "," + value.y1.baseVal.value+ ")"
+ " - (" + value.x2.baseVal.value + "," + value.y2.baseVal.value+ ")"
},
},
path: {
data: {}, // <path d="M10 10 H 90 V 90 H 10 Z" fill="transparent" stroke="black"/>
draw: function(event, can, point, color) {
var data = {
d: can.core.List(point, function(p, i) {
switch (i) {
case 0: return "M " + p.x + " " + p.y; break
case 1: return "H " + p.x; break
case 2: return "V " + p.y; break
case 3: return "H " + p.x + " Z"; break
}
}).join(" ")
}
console.log(data)
event.type == "click" && point.length == 4 && (can.point = [])
return data;
},
text: function(event, can, data, target) {
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.x1.baseVal.value + "," + value.y1.baseVal.value+ ")"
+ " - (" + value.x2.baseVal.value + "," + value.y2.baseVal.value+ ")"
},
},
polyline: {
data: {}, // <polyline points="60 110, 65 120, 70 115, 75 130, 80 125, 85 140, 90 135, 95 150, 100 145"/>
draw: function(event, can, point, color) {if (point.length < 2) {return}
var data = {
points: can.core.List(point, function(item) {return item.x + " " + item.y}).join(", ")
}
return data;
},
text: function(event, can, data, target) {
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 + ")"
},
},
polygon: {
data: {}, // <polyline points="60 110, 65 120, 70 115, 75 130, 80 125, 85 140, 90 135, 95 150, 100 145"/>
draw: function(event, can, point, color) {if (point.length < 2) {return}
var data = {
points: can.core.List(point, function(item) {return item.x + " " + item.y}).join(", ")
}
return data;
},
text: function(event, can, data, target) {
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 + ")"
},
},
})
Volcanos("onaction", {help: "组件菜单", list: ["保存",
["color", "red", "yellow", "green", "purple", "blue", "cyan", "white", "black"],
["shape", "rect", "circle", "ellipse", "path", "line", "polyline", "polygon"],
],
"保存": function(event, can, msg, cmd, target) {
can.run(event, ["action", cmd, can.Option("name"),
'<svg vertion="1.1" xmlns="https://www.w3.org/2000/svg" width="'+can.svg.Value("width")+'" height="'+can.svg.Value("height")+'">',
can.svg.innerHTML,
"</svg>",
], function() {
can.user.toast("保存成功")
}, true)
},
color: function(event, can, value, cmd, target) {can.color = value},
shape: function(event, can, value, cmd, target) {can.shape = value},
resize: function(event, can, value, cmd, item) {var target = can.target.firstChild;
if (cmd == "x") {target.style.width = target.offsetHeight + value + "px"}
if (cmd == "y") {target.style.height = target.offsetHeight + value + "px"}
},
init: function(event, can, msg, cmd, item) {
item.ondblclick = item.oncontextmenu = function(event) {can.user.carte(event, shy("", can.ondetail, can.ondetail.list, function(event, key, meta) {var cb = meta[key];
typeof cb == "function" && cb(event, can, msg, cmd, key, key, item);
}), can), event.stopPropagation(), event.preventDefault()}
item.onclick = function() {
}
return item;
},
push: function(event, can, msg, cmd, target) {
var rect = document.createElementNS("http://www.w3.org/2000/svg", cmd);
can.core.Item(msg, function(key, value) {rect.setAttribute(key, value)});
target.appendChild(can.onaction.init(event, can, msg, cmd, rect));
return rect;
},
draw: function(event, can, point) {
can.Status(event, null, "width");
can.Status(event, null, "begin");
if (point.length == 1) {return}
can.Status(event, point[0], "begin")
var color = can.page.Select(can, can.action, "select.color", function(item) {return item.value})[0]
var shape = can.page.Select(can, can.action, "select.shape", function(item) {return item.value})[0]
var figure = can.onfigure[shape];
var data = figure && figure.draw(event, can, point, color);
return data && can.onaction.push(event, can, data, shape, can.svg)
},
onclick: function(event, can) {if (!can.svg) {return}
var p = can.svg.getBoundingClientRect()
var point = {x: event.clientX-p.x, y: event.clientY-p.y}
can.point = (can.point || []).concat([point])
can.onaction.draw(event, can, can.point)
},
onmouseover: function(event, can) {
can.Status(event, event.target, "which")
},
onmousemove: function(event, can) {if (!can.svg) {return}
var p = can.svg.getBoundingClientRect()
var point = {x: event.clientX-p.x, y: event.clientY-p.y}
can.temp && can.page.Remove(can, can.temp) && delete(can.temp)
can.temp = can.onaction.draw(event, can, can.point.concat(point))
can.Status(event, point, "point")
},
onkeydown: function(event, can) {
if (event.key == "Enter") {
can.point = []
return
}
},
})
Volcanos("onchoice", {help: "组件交互", list: ["保存", "清空", ["rect", "rect", "line", "circle"]],
"清空": function(event, can, msg, cmd, target) {
console.log("choice", cmd)
},
})
Volcanos("ondetail", {help: "组件详情", list: ["编辑", "删除"],
"编辑": function(event, can, msg, index, key, cmd, target) {
can.user.prompt("文字", function(text) {
if (target.tagName == "text") {return target.innerHTML = text}
var color = can.page.Select(can, can.action, "select.color", function(item) {return item.value})[0]
var data = {"text-anchor": "middle", "dominant-baseline": "middle", "stroke": color}
var figure = can.onfigure[target.tagName]
figure.text(event, can, data, target)
var p = can.onaction.push(event, can, data, "text", can.svg)
p.innerHTML = text;
target.Text && can.page.Remove(can, target.Text) && delete(target.Text)
target.Text = p
}, target.Text && target.Text.innerText || "")
},
"复制": function(event, can, msg, index, key, cmd, target) {
var figure = can.onfigure[target.tagName]
figure.copy(event, can, target)
},
"删除": function(event, can, msg, index, key, cmd, target) {
can.page.Remove(can, target)
},
})
Volcanos("onstatus", {help: "组件状态", list: ["begin", "width", "point", "which"],
"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.width+","+value.height: ""},
"point": function(event, can, value, cmd, target) {target.innerHTML = value.x+","+value.y},
"which": function(event, can, value, cmd, target) {var figure = can.onfigure[value.tagName];
target.innerHTML = figure? figure.show(event, can, value, target): value.tagName;
},
})
Volcanos("onexport", {help: "导出数据", list: []})

155
plugin/wiki/walk.js Normal file
View File

@ -0,0 +1,155 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
if (!msg.result || msg.result.length == 0) {
var table = can.page.AppendTable(can, output, msg, msg.append);
table.onclick = function(event) {switch (event.target.tagName) {
case "TD":
can.onimport.which(event, table, msg.append, function(index, key) {
can.Option("file", event.target.innerHTML.trim())
can.run(event, [event.target.innerHTML.trim()], function(msg) {})
})
break
case "TH":
break
case "TR":
case "TABLE":
}}
return typeof cb == "function" && cb(msg), table;
}
// can.page.Append(can, action, [{type: "script", src: "https://cdn.bootcss.com/echarts/4.2.0-rc.2/echarts.js"}]);
can.page.Append(can, output, [{include: ["/plugin/github.com/shylinux/echarts/echarts.js", function(event) {
can.page.Append(can, output, [{include: ["/plugin/github.com/shylinux/echarts/china.js", function(event) {
var china_chart = echarts.init(can.page.Append(can, output, [{type: "div", style: {width: "600px", height: "400px"}}]).last);
var data = msg.Table()
var yData = [];
var barData = [];
for (var i = 0; i < (data.length>10? 10: data.length); i++) {
yData.push(i + data[i].name);
barData.push(data[i]);
}
var option = {
title: [{
text: msg.Option("title"),
show: true, right: 250, top: 10,
textStyle: {color: '#2D3E53', fontSize: 18},
}],
tooltip: {
show: true, formatter: function(params) {
return params.name +": "+params.value
},
},
visualMap: {
type: 'continuous',
orient: 'horizontal',
itemWidth: 10,
itemHeight: 80,
text: ['高', '低'],
showLabel: true,
seriesIndex: [0],
min: 0,
max: data[1].value,
inRange: {
color: ['#6FCF6A', '#FFFD64', '#FF5000']
},
textStyle: {
color: '#7B93A7'
},
bottom: 30,
left: 'left',
},
grid: {right: 10, top: 135, bottom: 100, width: '20%'},
xAxis: {show: false},
yAxis: {
type: 'category',
inverse: true,
nameGap: 16,
axisLine: {show: false, lineStyle: {color: '#ddd'}},
axisTick: {show: false, lineStyle: {color: '#ddd'}},
axisLabel: {
margin: 0,
interval: 0,
textStyle: {color: '#455A74', align: 'left', fontSize: 14},
rich: {
a: {
color: '#fff',
backgroundColor: '#FAAA39',
width: 20,
height: 20,
align: 'center',
borderRadius: 2
},
b: {
color: '#fff',
backgroundColor: '#4197FD',
width: 20,
height: 20,
align: 'center',
borderRadius: 2
}
},
formatter: function(params) {
if (parseInt(params.slice(0, 1)) < 3) {
return [
'{a|' + (parseInt(params.slice(0, 1)) + 1) + '}' + ' ' + params.slice(1)
].join('\n')
} else {
return [
'{b|' + (parseInt(params.slice(0, 1)) + 1) + '}' + ' ' + params.slice(1)
].join('\n')
}
}
},
data: yData
},
geo: {
map: 'china', left: 'left', right: '100',
label: {emphasis: {show: false}},
itemStyle: {emphasis: {areaColor: '#fff464'}},
},
series: [{
roam: false, type: 'map', name: 'mapSer',
geoIndex: 0, label: {show: false},
data: data
}, {
roam: false, type: 'bar', name: 'barSer',
visualMap: false, barGap: 0, barMaxWidth: 8,
zlevel: 100, itemStyle: {
normal: {
color: function(params) {
// build a color map as your need.
var colorList = [{colorStops: [
{offset: 0, color: '#FFD119'}, // 0% 处的颜色
{offset: 1, color: '#FFAC4C'}, // 100% 处的颜色
]}, {colorStops: [
{offset: 0, color: '#00C0FA'}, // 0% 处的颜色
{offset: 1, color: '#2F95FA'}, // 100% 处的颜色
]}];
return params.dataIndex < 3? colorList[0]: colorList[1]
},
barBorderRadius: 15
}
},
data: barData
}]
};
china_chart.setOption(option);
}]}]);
}]}]);
},
which: function(event, table, list, cb) {if (event.target == table) {return cb(-1, "")}
can.page.Select(can, table, "tr", function(tr, index) {if (event.target == tr) {return cb(index-1, "")}
can.page.Select(can, tr, "th,td", function(td, order) {
if (event.target == td) {return cb(index-1, list[order])}
})
})
},
})
Volcanos("onaction", {help: "组件交互", list: []})
Volcanos("onchoice", {help: "组件菜单", list: []})
Volcanos("ondetail", {help: "组件详情", list: []})
Volcanos("onexport", {help: "导出数据", list: []})

76
plugin/wiki/word.js Normal file
View File

@ -0,0 +1,76 @@
Volcanos("onimport", {help: "导入数据", list: [],
init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
if (msg.append && msg.append.length > 0) {
var table = can.page.AppendTable(can, output, msg, msg.append);
table.onclick = function(event) {switch (event.target.tagName) {
case "TD":
can.onimport.which(event, table, msg.append, function(index, key) {
can.Option("name", event.target.innerHTML.trim())
can.run(event, [event.target.innerHTML.trim()], function(msg) {})
})
break
case "TH":
break
case "TR":
case "TABLE":
}}
return typeof cb == "function" && cb(msg), table;
}
var last = can.page.Append(can, output, [{type: "textarea", cols: 40, rows: 18, inner: msg.Result()}]).last;
return typeof cb == "function" && cb(msg), can.view = last;
},
which: function(event, table, list, cb) {if (event.target == table) {return cb(-1, "")}
can.page.Select(can, table, "tr", function(tr, index) {if (event.target == tr) {return cb(index-1, "")}
can.page.Select(can, tr, "th,td", function(td, order) {
if (event.target == td) {return cb(index-1, list[order])}
})
})
},
})
Volcanos("onaction", {help: "组件菜单", list: ["保存"],
"保存": function(event, can, msg, cmd, target) {
can.run(event, ["action", cmd, can.Option("name"), can.view.value], function() {
can.user.toast("保存成功")
}, true)
},
})
Volcanos("onchoice", {help: "组件交互", list: ["保存", "清空", ["rect", "rect", "line", "circle"]],
"清空": function(event, can, msg, cmd, target) {
console.log("choice", cmd)
},
})
Volcanos("ondetail", {help: "组件详情", list: ["编辑", "删除"],
"编辑": function(event, can, msg, index, key, cmd, target) {
can.user.prompt("文字", function(text) {
if (target.tagName == "text") {return target.innerHTML = text}
var data = {"text-anchor": "middle", "dominant-baseline": "middle"}
var figure = can.onfigure[target.tagName]
figure.text(event, can, data, target)
var p = can.onaction.push(event, can, data, "text", can.svg)
p.innerHTML = text;
target.Text && can.page.Remove(can, target.Text) && delete(target.Text)
target.Text = p
}, target.Text && target.Text.innerText || "")
},
"复制": function(event, can, msg, index, key, cmd, target) {
var figure = can.onfigure[target.tagName]
figure.copy(event, can, target)
},
"删除": function(event, can, msg, index, key, cmd, target) {
can.page.Remove(can, target)
},
})
Volcanos("onstatus", {help: "组件状态", list: ["begin", "width", "point", "which"],
"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.width+","+value.height: ""},
"point": function(event, can, value, cmd, target) {target.innerHTML = value.x+","+value.y},
"which": function(event, can, value, cmd, target) {var figure = can.onfigure[value.tagName];
target.innerHTML = figure? figure.show(event, can, value, target): value.tagName;
},
})
Volcanos("onexport", {help: "导出数据", list: []})

42
proto.js
View File

@ -101,6 +101,9 @@ function Volcanos(name, can, libs, cb, msg) { // 封装模块
res.append && (msg.append = res.append) && res.append.forEach(function(item) {
res[item] && (msg[item] = res[item])
})
res.option && (msg.option = res.option) && res.option.forEach(function(item) {
res[item] && (msg[item] = res[item])
})
return msg
},
Table: shy("遍历数据", function(cb) {if (!msg.append || !msg.append.length || !msg[msg.append[0]]) {return}
@ -132,14 +135,14 @@ function Volcanos(name, can, libs, cb, msg) { // 封装模块
if (type.endsWith(".css")) {
var style = document.createElement("link");
style.rel = "stylesheet", style.type = "text/css";
style.href = (can._path||meta.path)+type
style.href = (type.startsWith("/")? "": (can._path||meta.path))+type
style.onload = line;
target.appendChild(style);
return style
}
if (type.endsWith(".js")) {
var script = document.createElement("script");
script.src = (can._path||meta.path)+type,
script.src = (type.startsWith("/")? "": (can._path||meta.path))+type,
script.onload = line;
target.appendChild(script);
return script
@ -182,22 +185,27 @@ function Volcanos(name, can, libs, cb, msg) { // 封装模块
// 加载模块
function next() {
libs && libs.length > 1? Volcanos(name, can, libs.slice(1), cb):
typeof cb == "function" && setTimeout(function() {cb(can);
if (!can.target) {return}
can.core.Item(can.onaction, function(key, cb) {key.indexOf("on") == 0 && (can.target[key] = function(event) {
cb(event, can);
})});
can.target.oncontextmenu = function(event) {
can.user.carte(event, shy("", can.onchoice, can.onchoice.list, function(event, key, meta) {var cb = meta[key];
typeof cb == "function"? cb(event, can, msg, key, event.target):
can.run(event, [typeof cb == "string"? cb: key, event.target], null, true)
}), can)
event.stopPropagation()
event.preventDefault()
libs && libs.length > 1? Volcanos(name, can, libs.slice(1), cb): typeof cb == "function" && setTimeout(function() {cb(can); if (can.target) {
function run(event, msg, key, cb) {
if (typeof cb == "function") {
// 本地命令
cb(event, can, msg, key, can.target)
} else {
// 本地命令
can.run(event, ["action", key], function(msg) {can.Import(event, msg, key)}, true)
}
}, 10);
}
// 注册event
can.core.Item(can.onaction, function(key, cb) {key.indexOf("on") == 0 && (can.target[key] = function(event) {cb(event, can)})});
// 注册action
can.action && (can.action.innerHTML = ""), can.onaction && can.page.AppendAction(can, can.action, can.onaction.list, function(event, value, key) {
key? run(event, value, key, can.onaction[key]): run(event, msg, value, can.onaction[value]);
})
// 注册choice
can.target.oncontextmenu = function(event) {can.user.carte(event, shy("", can.onchoice, can.onchoice.list, function(event, key, meta) {
run(event, msg, key, can.onchoice[key] || can.onaction[key]);
}), can), event.stopPropagation(), event.preventDefault()}
}}, 10);
}
if (libs && libs.length > 0) {
if (can[libs[0]]) {

31
style.css
View File

@ -61,6 +61,7 @@ fieldset>form.option div.item.textarea {
}
fieldset>div.action {
padding:6px;
clear:both;
}
fieldset>div.action div.space {
display:inline-block;
@ -178,6 +179,36 @@ fieldset.item>div.output>div.status>input.cmd {
width:250px;
}
fieldset.item>div.output>div.code svg {
border: solid 2px red;
}
fieldset.item div.border-left {
position:absolute;
width:2px;
height:inherit;
height:-webkit-fill-available;
background:green;
cursor:ew-resize;
}
fieldset.item div.border-right {
position:absolute;
right:0px;
width:2px;
height:inherit;
height:-webkit-fill-available;
background:green;
cursor:ew-resize;
}
fieldset.item div.border-bottom {
position:absolute;
bottom:0px;
height:2px;
width:-webkit-fill-available;
background:green;
cursor:ns-resize;
}
fieldset table {
font-size:14px;
overflow: auto;