add field.css

frame.js

@@ -744,7 +744,6 @@ Volcanos("onmotion", {help: "动态特效", list: [], _init: function(can, targe
         })
     },
     move: function(can, target, layout) { var begin
-
         target.onmousedown = function(event) {
             layout.width = target.offsetWidth
             layout.height = target.offsetHeight

lib/page.js

@@ -18,7 +18,7 @@ Volcanos("page", {help: "用户界面", ClassList: {
             return (this.has(can, obj, key)? this.del(can, obj, key): this.add(can, obj, key)).indexOf > -1
         },
     },
-    Select: shy("选择节点", function(can, target, key, cb, interval, cbs) { if (key == ".") { return [] }
+    Select: shy("选择节点", function(can, target, key, cb, interval, cbs) { if (key == ".") { cb(target); return [] }
         return can.core.List(target && target.querySelectorAll(key), cb, interval, cbs)
     }),
     Modify: shy("修改节点", function(can, target, value) { target = target || {}

page/field.css

@@ -0,0 +1,67 @@
+fieldset.story {
+    color:white;
+    position:fixed;
+    background:radial-gradient(black, #00000073);
+}
+fieldset.story legend {
+    text-align:left;
+    cursor:pointer;
+
+    background:radial-gradient(black, #00000073);
+}
+fieldset.story form.option div.item {
+    float:left; margin-right:3px;
+    min-height:25px; vertical-align:middle;
+}
+fieldset.story input[type=button] {
+    background-color:#FF9900; color:white;
+    border-radius:10px 10px 10px 10px;
+    border:2px solid #FF9900;
+}
+fieldset.story input[type=button]:hover {
+    background-color:#FFCC33;
+    border:2px solid #FFCC33;
+}
+fieldset.story input[type=text] {
+    background-color:white; color:black;
+    border-radius:6px 6px 6px 6px;
+    border:2px solid #14a58e;
+}
+fieldset.story input[type=text]:hover {
+    background-color:cyan;
+}
+fieldset.story div.input textarea {
+    border-radius:6px;
+    border:2px solid #14a58e;
+}
+fieldset.story select {
+    background-color:#99CC66; color:white;
+    border-radius:10px 10px 10px 10px;
+    border:2px solid #99CC66;
+}
+
+fieldset.story div.output {
+    clear:both;
+    overflow:auto;
+}
+fieldset.story div.status div.item {
+    float:left; padding:4px;
+    height:18px;
+}
+fieldset.story div.status div.item>label {
+    font-size:10px;
+    /* color:#504242e0; */
+}
+
+fieldset.story table {
+    color:white;
+}
+fieldset.story table tr {
+    background-color:#e1f1ff1f;
+}
+fieldset.story table th {
+    background-color:#99CCFF;
+}
+fieldset.story table.content tr:hover {
+    background-color:green;
+}

publish/chrome/chrome.js

@@ -50,7 +50,7 @@ Volcanos("chrome", {
         can.misc.Run(event, can, {names: "http://localhost:9020/code/chrome/"+cmds[0]}, cmds.slice(1), cb)
     },
     chrome.history.onVisited.addListener(function(item) {
-        can.run({}, ["sync", "link", item.title, item.url])
+        can.run({}, ["sync", kit.MDB_TYPE, "link", kit.MDB_NAME, item.title, kit.MDB_TEXT, item.url, "tid", item.id])
     })
 
     can.user.toast = function(message, title) {chrome.notifications.create(null, {

publish/chrome/contexts.js

@@ -5,7 +5,12 @@ Volcanos("chrome", {
         console.log(arg)
         cb()
     },
-    spide: function(can, msg) { var has = {}
+    style: function(can, msg, arg) {
+        can.page.Select(can, document.body, arg[0], function(target) {
+            can.page.Modify(can, target, can.base.Obj(arg[1]))
+        })
+    },
+    spide: function(can, msg, arg) { var has = {}
         can.page.Select(can, document.body, "video", function(item) {
             if (!item.src || has[item.src]) { return } has[item.src] = true
             var p = can.page.Select(can, document.body, "p.title")[0]
@@ -36,15 +41,14 @@ Volcanos("chrome", {
             msg.Push(kit.MDB_LINK, item.src)
         })
     },
-    field: function(can, msg, arg) { can.require(["https://shylinux.com/page/index.css"])
+    field: function(can, msg, arg) {
+        // can.require(["https://shylinux.com/page/index.css"])
+        can.require(["http://localhost:9020/page/field.css"])
         can.onappend.plugin(can, {index: arg[0], arg: arg.slice(1)}, function(sub, meta) {
             var top = msg.Option("top")||400
-            can.onmotion.float.auto(can, document.body, "carte")
             can.onmotion.float.auto(can, sub._output, "carte")
-            can.page.Modify(can, sub._target, {style: {
+            can.onmotion.float.auto(can, document.body, "carte")
-                background: "radial-gradient(black, #00000073)",
+            can.page.Modify(can, sub._target, {style: {"top": top}})
-                position: "absolute", "top": top,
-            }})
             can.page.Modify(can, sub._output, {style: {
                 "max-height": window.innerHeight-top-80,
                 "max-width": window.innerWidth,
@@ -58,8 +62,14 @@ Volcanos("chrome", {
             }, sub._legend.onclick()
 
             sub.run = function(event, cmds, cb) {
-                can.run(event, [ctx.ACTION, ctx.COMMAND, cli.RUN, meta.index].concat(cmds), cb)
+                can.run(event, [ctx.ACTION, cli.RUN, meta.index].concat(cmds), cb)
             }
+            can.onmotion.move(can, sub._target, {})
+
+            msg.Option("selection") && (document.body.ondblclick = function(event) {
+                sub.Option(msg.Option("selection"), window.getSelection())
+                sub.Update()
+            })
         }, document.body)
     },
 }, ["/frame.js"], function(can) {
@@ -73,7 +83,7 @@ Volcanos("chrome", {
     can.run = function(event, cmds, cb) { var msg = can.request(event, {hostname: location.hostname}); msg.detail = ["page"].concat(cmds)
         chrome.runtime.sendMessage(msg, function(res) { can.base.isFunc(cb) && cb(msg.Copy(res)) })
     }
-    can.run({}, [ctx.ACTION, ctx.COMMAND, "get"], function(msg) {
+    can.run({}, [ctx.ACTION, ctx.COMMAND], function(msg) {
         msg.result && msg.result[0] && can.field(can, msg, msg.result)
     })
 })