opt some

frame.js

@@ -188,8 +188,8 @@ Volcanos("onengine", {help: "解析引擎", list: [], _init: function(can, meta,
         }},
         "project": {name: "研发群", storm: {
             "studio": {name: "studio", action: [
-                {name: "dir", help: "文件夹", index: "nfs.dir", args: ["usr/publish/", "time size path link"]},
                 {name: "vimer", help: "编辑器", index: "web.code.vimer", args: ["src/", "main.go"]},
+                {name: "dir", help: "文件夹", index: "nfs.dir", args: ["usr/publish/", "time size path link"]},
                 {name: "status", help: "代码状态", index: "web.code.git.status"},
                 {name: "total", help: "代码统计", index: "web.code.git.total"},
                 {name: "paste", help: "粘贴板", index: "web.code.tmux.text"},
@@ -283,7 +283,7 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
             Option: function(key, value) {
                 if (typeof key == "object") { return sub.core.Item(key, sub.Option), key }
                 if (key == undefined) { value = {}
-                    sub.page.Select(sub, option, "select.args,input.args", function(item) {
+                    sub.page.Select(sub, option, "select.args,input.args,textarea.args", function(item) {
                         value[item.name] = item.value
                     })
                     return value
@@ -629,27 +629,33 @@ Volcanos("onlayout", {help: "页面布局", list: [], _init: function(can, meta,
     },
 })
 Volcanos("onkeypop", {help: "键盘交互", list: [], _init: function(can) {
+    var list = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
+    var ui = can.page.Append(can, document.body, [{view: "high", list: can.core.List(list, function(c, i) {
+        return {view: "char "+c, style: {position: "absolute", "bottom": "0", 
+            left: document.body.clientWidth/list.length*i+"px",
+            width: document.body.clientWidth/list.length+"px",
+            height: "10px",
+            background: "red",
+        }}
+    })}])
+
+    can.Timer({interval: 100}, function() {
+        can.page.Select(can, ui.high, "div.char", function(item) {
+            item.offsetHeight > 0 && can.page.Modify(can, item, {style: {height: item.offsetHeight-4+"px"}})
+        })
+    })
+
     document.body.onkeydown = function(event) { if (event.target != document.body) { return }
+        event.key !== " " && can.page.Select(can, ui.high, "div.char."+event.key, function(item) {
+            can.page.Modify(can, item, {style: {height: item.offsetHeight+500+"px"}})
+        })
         if (can.onkeypop.action && can.onkeypop.action.onimport) {
             can.onkeypop.action.onimport.keydown(event, can.onkeypop.action, event.key)
             return
         }
-        switch (event.key) {
-            case "n":
-                can.run(event, ["search", "River.onaction.create"])
-                break
-            case "m":
-                can.run(event, ["search", "Storm.onaction.create"])
-                break
-            case " ":
-                can.search.focus()
-                can.search.setSelectionRange(0, -1)
-                break
-            default:
-                return
-        }
         event.stopPropagation()
         event.preventDefault()
+        console.log(event)
     }
     document.body.onkeyup = function(event) {
     }

index.css

@@ -9,6 +9,7 @@ fieldset {
 }
 legend {
     margin-left:10px;
+    box-shadow: 4px 4px 20px 4px #626bd0;
 }
 legend:hover {
     cursor:pointer;
@@ -129,24 +130,11 @@ fieldset>div.output>pre.display:hover {
     /* max-height:640px; */
 }
 
-fieldset div.code {
-    color:white;
-    font-size:14px;
-    font-family:monospace;
-    background-color:#343a34f2;
-    white-space:pre;
-    padding:10px;
-    overflow:auto;
-    border:solid 3px green;
-    text-align:left;
-    /* max-height:640px; */
-}
 table {
-    font-size:14px;
+    border:0; white-space: pre;
-    cursor:pointer;
+    font-size:14px; font-family:monospace;
-    border:solid 1px green;
+    box-shadow: 4px 4px 10px 1px #626bd0;
-    overflow: auto;
+    cursor:pointer; overflow: auto;
-    text-align:left;
 }
 table tr:hover {
     background-color:#0fbd45;
@@ -158,16 +146,13 @@ table tr.over {
     background:red;
 }
 table th {
-    font-family:monospace;
     background-color:#0fbd45;
-    cursor:pointer;
     padding: 0 10px;
+    cursor:pointer;
 }
 table td {
     max-width:1200px;
-    font-family:monospace;
     padding: 0 10px;
-    white-space: pre;
 }
 table td:hover {
     background-color:red;
@@ -179,6 +164,16 @@ table td input {
     margin-left:4px;
 }
 
+div.code {
+    box-shadow: 4px 4px 20px 4px #626bd0;
+    font-size:14px; font-family:monospace;
+    color:white; background-color:#343a34f2;
+    padding:10px; border:solid 3px green;
+    text-align:left; white-space:pre;
+    overflow:auto;
+    /* max-height:640px; */
+}
+
 div.toast {
     color:yellow;
     background:black;
@@ -251,17 +246,16 @@ fieldset.input.key {
     z-index:101;
 }
 
-
 body.white {
     margin:0; padding:0;
     background-color:#0dabda;
 }
 body.white input[type=text] {
-    border:2px solid #c4c7ce;
+    border:2px solid #14a58e;
-    border-radius:8px 8px 8px 8px;
+    border-radius:6px 6px 6px 6px;
-    background-color:white;
+    color:black; background-color:white;
-    color:black;
     box-shadow: 4px 4px 10px 1px #626bd0;
+    padding: 0 4px;
 }
 body.white input[type=text]:hover {
     background-color:cyan;
@@ -272,7 +266,6 @@ body.white input[type=button] {
     border:2px solid #FF9900;
     background-color:#FF9900;
     color:white;
-    box-shadow: 4px 4px 10px 1px #626bd0;
 }
 body.white input[type=button]:hover {
     border-radius:10px 10px 10px 10px;
@@ -367,22 +360,28 @@ body.white fieldset.Action fieldset.plugin legend {
     color:white; background-color:#339999;
     padding:2px 20px; border:2px solid #99CCFF;
     border-radius:10px 10px 10px 10px;
-    box-shadow: 4px 4px 20px 4px #626bd0;
 }
 body.white fieldset.Action fieldset.plugin legend:hover {
     background-color:#6ee4e4;
 }
 body.white fieldset.Action fieldset.plugin div.output{
     color:black;
+    padding:10px;
 }
 body.white fieldset.Action fieldset.plugin div.item input[type=button] {
     letter-spacing:4px;
 }
-body.white fieldset.plugin table {
+body.white fieldset.Action fieldset.plugin div.item input {
-    border:0;
-    color:black; background-color:white;
     box-shadow: 4px 4px 10px 1px #626bd0;
 }
+body.white fieldset.Action fieldset.plugin div.item select {
+    box-shadow: 4px 4px 10px 1px #626bd0;
+    margin-top:-2px;
+}
+
+body.white fieldset.plugin table {
+    color:black; background-color:white;
+}
 body.white fieldset.plugin table tr {
     background-color:#e1f1ff;
 }
@@ -406,3 +405,9 @@ fieldset.command>form.option>div.item input.args {
 fieldset.command>form.option>div.item textarea {
     height:160px;
 }
+
+fieldset.max>form.option>div.item textarea.args {
+    background-color:cyan;
+    width:500px;
+    height:120px;
+}

lib/base.js

@@ -18,6 +18,15 @@ var base = Volcanos("base", {help: "基础模块",
         }
     },
 
+    parseSize: function(size) {
+        if (size.endsWith("MB") || size.endsWith("mb") || size.endsWith("M") || size.endsWith("m")) {
+            return parseInt(size) * 1024 * 1024
+        }
+        if (size.endsWith("KB") || size.endsWith("kb") || size.endsWith("K") || size.endsWith("k")) {
+            return parseInt(size) * 1024
+        }
+        return parseInt(size)
+    },
     Args: function(obj) {var res = [];
         for (var k in obj) {
             res.push(encodeURIComponent(k)+"="+encodeURIComponent(obj[k]))

lib/page.js

@@ -221,7 +221,7 @@ var page = Volcanos("page", {help: "网页模块",
         var num_list = can.core.List(list, function(tr) {
             var text = tr.childNodes[index].innerText
             return is_time? Date.parse(text):
-                is_number? parseInt(text): text
+                is_number? can.base.parseSize(text): text
         })
 
         // 选择排序

plugin/input.js

@@ -42,6 +42,10 @@ Volcanos("onaction", {help: "控件交互", list: [],
         }
     },
     onkeydown: function(event, can) {
+        event.key !== " " && can.page.Select(can, document.body, "div.char."+event.key, function(item) {
+            can.page.Modify(can, item, {style: {height: item.offsetHeight+100+"px"}})
+        })
+
         switch (event.key) {
             case "Enter":
                 if (event.target.tagName == "TEXTAREA") {

plugin/input/key.js

@@ -13,9 +13,11 @@ Volcanos("onfigure", {help: "控件详情", list: [],
                     {button: ["关闭", function(event) { can.page.Remove(can, figure.fieldset) }]},
                 ])
 
-                can.page.AppendTable(can, figure.output, msg, msg.append, function(event, value, key, index, tr, td) {
+                can.page.AppendTable(can, figure.output, msg, msg.append, function(value, key, index, line) {
+                    return {type: "td", inner: value, onclick: function() {
                         target.value = value; msg.Option("_refresh") && run()
                         can.page.Remove(can, figure.fieldset) 
+                    }}
                 })
             }, true)
         }

plugin/local/code/inner.css

@@ -1,6 +1,7 @@
 fieldset.editor>div.action>div.file {
     border:solid 2px red; padding:2px;
     float:left; margin:2px 0;
+    background-color:#211515;
     cursor:pointer;
 }
 fieldset.editor>div.action>div.file.over {
@@ -17,9 +18,9 @@ fieldset.editor>div.output {
     background-color:black;
 }
 fieldset.editor>div.output div.project {
-    text-align:left;
     max-height:400px; overflow:auto;
-    max-width:160px;
+    max-width:180px; text-align:left;
+    font-size:14px; font-family:monospace;
     color:white;
 }
 fieldset.editor>div.output div.project div.item {
@@ -52,7 +53,7 @@ fieldset.editor>div.output div.content {
     font-size:16px; font-family:monospace;
     border-left:solid 2px red;
     min-height:20px;
-    min-width:400px;
+    min-width:800px;
     max-width:1000px;
     overflow:auto;
     float:left;

plugin/table.js

@@ -1,5 +1,6 @@
 Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg, list, cb, target) {
         if (msg.Option("_progress")) {
+            // 异步进度
             can.page.Select(can, can._output, "td", function(td) {
                 if (td.innerText == msg.Option("name")) {
                     can.page.Modify(can, td, {style: {
@@ -10,17 +11,16 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg,
             return
         }
 
-        can._output.innerHTML = ""
+        // 自动刷新
-        can.ui = can.page.Append(can, can._target, [
-            {view: ["content", "div"]}, {view: ["display", "pre"]},
-        ])
-
-        can.onappend.table(can, can.ui.content, "table", msg)
-        can.onappend.board(can, can.ui.display, "board", msg)
-
         var refresh = msg.Option("_refresh") || can.Conf("feature")["_refresh"] 
         refresh && can.Timer(refresh, function() { can.run({}) })
 
+        // 展示数据
+        can.ui = can.page.Appends(can, can._target, [
+            {view: ["content", "div"]}, {view: ["display", "pre"]},
+        ])
+        can.onappend.table(can, can.ui.content, "table", msg)
+        can.onappend.board(can, can.ui.display, "board", msg)
         return typeof cb == "function" && cb(msg)
     },
 })
@@ -29,12 +29,3 @@ Volcanos("onaction", {help: "控件交互", list: [],
         can.run(event, [], function() {})
     },
 })
-Volcanos("ondetail", {help: "控件交互", list: ["编辑", "删除"],
-    "编辑": function(event, can, key) {
-        console.log(key)
-    },
-    "删除": function(event, can, key) {
-        console.log(key)
-    },
-})
-