opt action.js

2025-04-25 16:58:06 +08:00 · 2022-01-13 18:04:01 +08:00 · 2022-01-13 18:04:01 +08:00 · 1c939babd1
commit 1c939babd1
parent 9fcb69e8db
16 changed files with 268 additions and 223 deletions
--- a/frame.js
+++ b/frame.js
@ -116,7 +116,7 @@ Volcanos("ondaemon", {help: "推荐引擎", list: [], _init: function(can, name)
    },
 })
 Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta, list, cb, target, field) {
-        meta.name = meta.name||"", meta.name = meta.name.split(ice.SP)[0].split(ice.PT).pop()
+        meta.name = (meta.name||"").split(ice.SP)[0].split(ice.PT).pop()
        field = field||can.onappend.field(can, meta.type, meta, target).first
        var legend = can.page.Select(can, field, ice.PT+html.LEGEND)[0]||can.page.Select(can, field, html.LEGEND)[0]
        var option = can.page.Select(can, field, html.FORM_OPTION)[0]
@ -130,13 +130,13 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,

            Status: function(key, value) {
                if (sub.base.isObject(key)) { return sub.core.Item(key, sub.Status), key }
-                sub.page.Select(sub, status, "div."+key+">span", function(item) {
+                sub.page.Select(sub, status, [[[html.DIV, key], html.SPAN]], function(item) {
                    return value == undefined? (value = item.innerHTML): (item.innerHTML = value)
                }); return value
            },
            Action: function(key, value) { return sub.page.SelectArgs(sub, action, key, value)[0] },
            Option: function(key, value) { return sub.page.SelectArgs(sub, option, key, value)[0] },
-            Update: function(event, cmds, cb, silent) { sub.onappend._output0(sub, sub.Conf(), event||{}, cmds||sub.Input(), cb, silent) },
+            Update: function(event, cmds, cb, silent) { sub.onappend._output0(sub, sub.Conf(), event||{}, cmds||sub.Input(), cb, silent); return true },
            Input: function(cmds, silent) {
                cmds = cmds && cmds.length > 0? cmds: sub.page.SelectArgs(sub, option, ""), cmds = can.base.trim(cmds)
                silent || cmds[0] == ctx.ACTION || sub.base.Eq(sub._history[sub._history.length-1], cmds) || sub._history.push(cmds)
@ -156,8 +156,8 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
            }})

            if (meta.msg) { var msg = sub.request(); msg.Copy(sub.base.Obj(meta.msg))
-                sub.onappend._output(sub, msg, msg.Option(ice.MSG_DISPLAY))
                meta.inputs && sub.onappend._option(sub, meta, sub._option, true)
+                sub.onappend._output(sub, msg, msg.Option(ice.MSG_DISPLAY))
            } else {
                meta.inputs && sub.onappend._option(sub, meta, sub._option)
            }
@ -170,12 +170,12 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
            return Volcanos(item.name, {_follow: can.core.Keys(can._follow, item.name),
                _target: can.onappend.input(can, item, args[index]||opts[item.name], option||can._option),
                _option: can._option, _action: can._action, _output: can._output, _status: can._status,
-                Option: can.Option, Action: can.Action, Status: can.Status, CloneField: function() { can.Clone() },
+                Option: can.Option, Action: can.Action, Status: can.Status, CloneField: can.Clone,
                CloneInput: function() { can.onmotion.focus(can, add(item)._target) },
-            }, [item.display||"/plugin/input.js"], function(input) { input.Conf(item)
+            }, [item.display||chat.PLUGIN_INPUT_JS], function(input) { input.Conf(item)
                input.run = function(event, cmds, cb, silent) { var msg = can.request(event)
-                    if (msg.RunAction(event, input, cmds)) { return }
                    if (msg.RunAction(event, can.core.Value(can, "_outputs.-1"), cmds)) { return }
+                    if (msg.RunAction(event, input, cmds)) { return }
                    return can.Update(event, can.Input(cmds, silent), cb, silent)
                }, can._inputs[item.name] = input, input.sup = can

@ -226,11 +226,11 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
            can.onappend._output(can, msg, msg.Option(ice.MSG_DISPLAY)||meta.display||meta.feature.display)
        })
    },
-    _output: function(can, msg, display, output) { display = display||"/plugin/table.js", output = output||can._output
+    _output: function(can, msg, display, output) { display = display||chat.PLUGIN_TABLE_JS, output = output||can._output
        Volcanos(display, {_follow: can.core.Keys(can._follow, display), _display: display, _target: output, _fields: can._target,
            _option: can._option, _action: can._action, _output: can._output, _status: can._status,
            Update: can.Update, Option: can.Option, Action: can.Action, Status: can.Status,
-        }, [display, "/plugin/table.js"], function(table) { table.Conf(can.Conf())
+        }, [display, chat.PLUGIN_TABLE_JS], function(table) { table.Conf(can.Conf())
            table.run = function(event, cmds, cb, silent) { var msg = can.request(event)
                if (msg.RunAction(event, table, cmds)) { return }
                return can.Update(event, can.Input(cmds, silent), cb, silent)
@ -254,7 +254,7 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
        can.core.List(root.list, function(item) {
            var ui = can.page.Append(can, target, [{view: [html.ITEM, html.DIV, item.meta.name], onclick: function(event) {
                can.base.isFunc(cb) && cb(event, item) || can.onmotion.toggle(can, ui.list)
-                can.onmotion.select(can, target, "div.item", event.target)
+                can.onmotion.select(can, target, html.DIV_ITEM, event.target)
            }}, {view: html.LIST}]); can.onappend.list(can, item, cb, ui.list)
        })
    },
@ -292,8 +292,8 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
        }

        var input = can.page.input(can, item, value)
-        var br = input.type == html.TEXTAREA? [{type: html.BR, style: {clear: "both"}}]: []
-        var title = can.Conf(["feature", chat.TITLE, item.name].join(ice.PT))||""; title && (input.title = title)
+        var br = input.type == html.TEXTAREA? [{type: html.BR, style: {clear: html.BOTH}}]: []
+        var title = can.Conf([ctx.FEATURE, chat.TITLE, item.name].join(ice.PT))||""; title && (input.title = title)
        return can.page.Append(can, target, ([{view: style||can.base.join([html.ITEM, item.type]), list: [input]}]).concat(br))[item.name]
    },
    table: function(can, msg, cb, target, sort) {
@ -333,7 +333,7 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
    },
    board: function(can, text, target) { text && text.Result && (text = text.Result()); if (!text) { return }
        var code = can.page.Append(can, target||can._output, [{text: [can.page.Color(text), html.DIV, html.CODE]}]).code
-        can.page.Select(can, code, "input[type=button]", function(target) {
+        can.page.Select(can, code, html.INPUT_BUTTON, function(target) {
            target.onclick = function(event) { var msg = can.sup.request(event, can.Option())
                return can.run(event, [ctx.ACTION, target.name], function(msg) { can.run() }, true)
            }
@ -352,14 +352,13 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
        meta.help = meta.help||value.help||chat.PLUGIN
        meta.type = meta.type||chat.PLUGIN

-        can.onappend._init(can, meta, ["/plugin/state.js"], function(sub, skip) {
+        can.onappend._init(can, meta, [chat.PLUGIN_STATE_JS], function(sub, skip) {
            sub.run = function(event, cmds, cb) { can.run(event, can.misc.concat([ctx.ACTION, ice.RUN, meta.index], cmds), cb) }
            can.base.isFunc(cb) && cb(sub, meta, skip)
        }, target||can._output)
    },
    plugin: function(can, meta, cb, target) { meta = meta||{}, meta.index = meta.index||can.core.Keys(meta.ctx, meta.cmd)
-        var p = can.onengine.plugin.meta[meta.index]
-        var res = {}; function cbs(sub, meta, skip) { res.__proto__ = sub, cb(sub, meta, skip) }
+        var p = can.onengine.plugin.meta[meta.index], res = {}; function cbs(sub, meta, skip) { res.__proto__ = sub, cb(sub, meta, skip) }
        (meta.meta || meta.inputs && meta.inputs.length > 0)? /* 局部命令 */ can.onappend._plugin(can, {meta: meta.meta, list: meta.list}, meta, cbs, target):
            p? /* 前端命令 */ can.onappend._plugin(can, {name: meta.index, help: p.help, meta: p.meta, list: p.list}, meta, function(sub, meta, skip) {
                sub.run = function(event, cmds, cb) { can.core.CallFunc(p, {msg: can.request(event), cmds: cmds, cb: cb}) }
@ -373,11 +372,9 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
        var input = meta.action||mdb.KEY; input != ice.AUTO && can.require(["/plugin/input/"+input+".js"], function(can) {
            can.core.ItemCB(can.onfigure[input], function(key, on) { var last = target[key]; target[key] = function(event) { on(event, can, meta, function(cb) {
                can.sub? can.base.isFunc(cb) && cb(can.sub, cbs): can.onappend._init(can, {type: html.INPUT, name: input, pos: chat.FLOAT}, ["/plugin/input/"+input+".js"], function(sub) { sub.Conf(meta)
-                    sub.run = function(event, cmds, cb) { var msg = sub.request(event, can.Option());
-                        (meta.run||can.run)(event, cmds, cb, true)
-                    }, can.sub = sub
-
+                    sub.run = function(event, cmds, cb) { var msg = sub.request(event, can.Option()); (meta.run||can.run)(event, cmds, cb, true) }, can.sub = sub
                    sub.close = function() { sub.page.Remove(sub, sub._target), delete(can.sub) }
+
                    sub.onappend._action(sub, [cli.CLOSE, cli.CLEAR], sub._action, kit.Dict(
                        cli.CLOSE, function(event) { sub.close() },
                        cli.CLEAR, function(event) { target.value = "" },
@ -430,27 +427,26 @@ Volcanos("onlayout", {help: "页面布局", list: [], _init: function(can, targe
        // }
        //
        var width = window.innerWidth, height = window.innerHeight
-        can.page.Select(can, target, [can.core.Keys(html.FIELDSET, chat.HEAD), can.core.Keys(html.FIELDSET, chat.FOOT)], function(field) {
+        can.page.Select(can, target, can.page.Keys(html.FIELDSET_HEAD, html.FIELDSET_FOOT), function(field) {
            height -= field.offsetHeight
        })

-        can.page.Select(can, target, can.core.Keys(html.FIELDSET, chat.LEFT), function(field, index) {
+        can.page.Select(can, target, html.FIELDSET_LEFT, function(field, index) {
            can.user.isMobile || (width -= field.offsetWidth)
-
            can.page.Modify(can, field, {style: {height: height}})
-            can.page.Select(can, target, "fieldset.left>div.output", function(output) {
+            can.page.Select(can, target, [[html.FIELDSET_LEFT, html.DIV_OUTPUT]], function(output) {
                can.page.Modify(can, output, {style: {height: height-32}})
            })
        })

-        can.page.Select(can, target, can.core.Keys(html.FIELDSET, chat.MAIN), function(field, index) {
+        can.page.Select(can, target, html.FIELDSET_MAIN, function(field, index) {
            if (can.user.isMobile) {
-                can.page.Modify(can, field, {style: {"padding-top": can.user.isLandscape()? "0px": ""}})
+                can.page.style(can, field, "padding-top", can.user.isLandscape()? "0px": "")
            } else {
-                can.page.Modify(can, field, {style: {height: height}})
-                can.page.Select(can, target, "fieldset.main>div.output", function(output) {
-                    height -= can.page.Select(can, field, can.core.Keys(html.DIV, html.ACTION))[0].offsetHeight
-                    can.page.Modify(can, output, {style: {height: height}})
+                can.page.style(can, field, html.HEIGHT, height)
+                can.page.Select(can, target, [[html.FIELDSET_MAIN, html.DIV_OUTPUT]], function(output) {
+                    height -= can.page.Select(can, field, html.DIV_ACTION)[0].offsetHeight
+                    can.page.style(can, output, html.HEIGHT, height)
                })
            }
        })
@ -597,6 +593,12 @@ Volcanos("onmotion", {help: "动态特效", list: [], _init: function(can, targe
            }})
        },
    },
+    cache: function(can, next) { var list = can.base.Obj(can.core.List(arguments).slice(2), [can._output])
+        can.core.List(list, function(item) { can.page.Cache(item._cache_key, item, item.scrollTop+1) })
+        return can.core.List(list, function(item) { var pos = can.page.Cache(item._cache_key = next(), item)
+            if (pos) { item.scrollTo(0, pos-1); return item }
+        }).length > 0
+    },

    hidden: function(can, target, show) {
        can.page.Modify(can, target||can._target, {style: {display: show? "": html.NONE}})
--- a/lib/base.js
+++ b/lib/base.js
@ -197,6 +197,21 @@ Volcanos("base", {help: "数据类型",
        return res + (n > 0? ice.PT+parseInt(n/10): "") + "s"
    },

+    getValid: function() {
+        for (var i = 0; i < arguments.length; i++) { var v = arguments[i]
+            if (typeof v == lang.OBJECT) {
+                if (v == null) { continue }
+                for (var k in v) { return v }
+                if (v.length > 0) { return v }
+            } else if (typeof v == lang.STRING && v) {
+                return v
+            } else if (typeof v == undefined) {
+                continue
+            } else {
+                return v
+            }
+        }
+    },
    isNumber: function(val) { return typeof val == lang.NUMBER },
    isString: function(val) { return typeof val == lang.STRING },
    isObject: function(val) { return typeof val == lang.OBJECT },
@ -206,6 +221,12 @@ Volcanos("base", {help: "数据类型",
    isCallback: function(key, value) { return key.indexOf("on") == 0 && typeof value == lang.FUNCTION },
    isUndefined: function(val) { return val == undefined },
    isNull: function(val) { return val == null },
+    replaceAll: function(str) {
+        for (var i = 1; i < arguments.length; i += 2) {
+            str = str.replaceAll(arguments[i], arguments[i+1])
+        }
+        return str
+    },

    isNight: function() { var now = new Date()
        return now.getHours() < 7 || now.getHours() > 17
--- a/lib/misc.js
+++ b/lib/misc.js
@ -9,6 +9,7 @@ Volcanos("misc", {help: "通信协议", Message: function(event, can) { var msg
            },
            OptionStatus: function() { return msg.Option(ice.MSG_STATUS) },
            OptionProcess: function() { return msg.Option(ice.MSG_PROCESS) },
+            OptionOrSearch: function(key) { return can.misc.Search(can, key)||msg.Option(key) },
            Option: function(key, val) {
                if (key == undefined) { return msg && msg.option || [] }
                if (can.base.isObject(key)) { can.core.Item(key, msg.Option) }
@ -189,6 +190,9 @@ Volcanos("misc", {help: "通信协议", Message: function(event, can) { var msg
        var val = (new RegExp(key+"=([^;]*);?")).exec(document.cookie)
        return val && val.length > 0? val[1]: ""
    }),
+    SearchOrConf: function(can, key, def) {
+        can.base.getValid(can.misc.Search(can, key), can.Conf(key), def)
+    },
    Search: shy("请求参数", function(can, key, value) { var args = {}
        if (value == undefined && can.base.isString(key)) {
            var ls = location.pathname.split(ice.PS)
@ -223,7 +227,7 @@ Volcanos("misc", {help: "通信协议", Message: function(event, can) { var msg
        return can.base.MergeURL(location.origin+path+(clear?"":location.search), objs)
    }),

-    concat: function(to, from) {
+    concat: function(to, from) { to = to||[], from = from||[]
        if (from[0] == "_search") { return from }
        return to.concat(from)
    },
--- a/lib/page.js
+++ b/lib/page.js
@ -40,7 +40,7 @@ Volcanos("page", {help: "用户界面", ClassList: {
        return can.core.List(target && target.querySelectorAll(key), cb, interval, cbs)
    }),
    Select: shy("选择节点", function(can, target, key, cb, interval, cbs) { if (key == ice.PT) { cb(target); return [] }
-        return can.core.List(target && target.querySelectorAll(key), cb, interval, cbs)
+        return can.core.List(target && target.querySelectorAll(can.page.Keys(key)), cb, interval, cbs)
    }),
    Modify: shy("修改节点", function(can, target, value) { target = target||{}
        target = can.base.isObject(target)? target: document.querySelector(target)
@ -276,7 +276,8 @@ Volcanos("page", {help: "用户界面", ClassList: {
        }
    },

-    Cache: function(name, output, data) { var cache = output._cache||{}; output._cache = cache
+    Cache: function(name, output, data) { if (!name) { return }
+        var cache = output._cache||{}; output._cache = cache
        if (data) { if (output.children.length == 0) { return }
            var temp = document.createDocumentFragment()
            while (output.childNodes.length > 0) { // 写缓存
@ -366,5 +367,28 @@ Volcanos("page", {help: "用户界面", ClassList: {
        can.page.Modify(can, target, {style: value})
        return value
    },
+    Keys: function() { var list = []
+        for (var i = 0; i < arguments.length; i++) { var v = arguments[i]
+            if (typeof v == lang.OBJECT) {
+                for (var j = 0; j < v.length; j++) {
+                    if (typeof v[j] == lang.OBJECT) {
+                        for (var k = 0; k < v[j].length; k++) {
+                            if (typeof v[j][k] == lang.OBJECT) { v[j][k] = v[j][k].join(ice.PT) }
+                        }
+                        v[j] = v[j].join(ice.GT)
+                    }
+                }
+                list.push(v.join(ice.SP))
+            } else {
+                list.push(v+"")
+            }
+        }
+        return list.join(ice.FS)
+    },
+    css: function(text) {
+        var styleSheet = document.createElement("style")
+        styleSheet.type = "text/css", styleSheet.innerText = text
+        document.head.appendChild(styleSheet)
+    },
 })

--- a/page/index.css
+++ b/page/index.css
@ -280,6 +280,22 @@ fieldset>div.action>div.item.space {
 fieldset div.action>div.item>label {
    display:none;
 }
+fieldset>div.action>div.tabs {
+    float:left; padding:4px; margin:0;
+    cursor:pointer;
+}
+fieldset>div.action>div.tabs:hover {
+    border-bottom:solid 2px red;
+    background-color:#2e515f;
+}
+fieldset>div.action>div.tabs.over {
+    background-color:blue;
+}
+fieldset>div.action>div.tabs.select {
+    border-bottom:solid 2px red;
+    background-color:#2e515f;
+}
+
 fieldset>div.status {
    clear:both;
 }
--- a/panel/action.css
+++ b/panel/action.css
@ -3,26 +3,12 @@ fieldset.Action {
    min-width:160px;
 }
 fieldset.Action>div.action {
-    display:none;
-}
-fieldset.Action>div.action.tabs {
    width:-webkit-fill-available;
    background-color:#159cc7b0;
-    display:block; height:28px;
+    display:none; height:28px;
    padding:0; margin:0;
    position:absolute;
 }
-fieldset.Action>div.action div.item {
-    padding:4px; margin:0;
-}
-fieldset.Action>div.action div.item:hover {
-    border-bottom:solid 2px red;
-    background-color:#2e515f;
-}
-fieldset.Action>div.action div.item.select {
-    border-bottom:solid 2px red;
-    background-color:#2e515f;
-}

 fieldset.Action div.output fieldset.plugin:hover {
    box-shadow:4px 4px 12px 6px #626bd0;
@ -36,30 +22,32 @@ fieldset.Action div.output fieldset.plugin legend:hover {
    background:red;
 }

-fieldset.Action div.output.tabs {
+fieldset.Action.tabs>div.action {
+    display:block;
+}
+fieldset.Action.tabs>div.output {
    margin-top:28px;
 }
-fieldset.Action div.output.flow fieldset.plugin {
+fieldset.Action.flow>div.output fieldset.plugin {
    float:left;
 }
-fieldset.Action div.output.grid fieldset.plugin {
-    width:480px; height:320px; overflow:auto;
-    float:left;
+fieldset.Action.grid>div.output fieldset.plugin {
+    float:left; overflow:auto;
 }
-fieldset.Action div.output.grid fieldset.plugin>div.output {
-    width:480px; height:320px; overflow:auto;
+fieldset.Action.grid>div.output fieldset.plugin>div.output {
+    overflow:auto;
 }
-fieldset.Action div.output.tabs fieldset.plugin {
+fieldset.Action.tabs>div.output fieldset.plugin {
    display:none;
    float:left;
 }
-fieldset.Action div.output.tabs fieldset.plugin.select {
+fieldset.Action.tabs>div.output fieldset.plugin.select {
    display:block;
 }
-fieldset.Action div.output.free fieldset.plugin {
+fieldset.Action.free>div.output fieldset.plugin {
    position:absolute;
 }
-fieldset.Action div.output.free fieldset.plugin.select {
+fieldset.Action.free>div.output fieldset.plugin.select {
    display:block;
 }

--- a/panel/action.js
+++ b/panel/action.js
@ -1,8 +1,8 @@
 Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg) {
        var river = can.Conf(chat.RIVER), storm = can.Conf(chat.STORM)
        can.onmotion.clear(can), can.core.Next(msg.Table(), function(item, next) {
-            item.height = parseInt(can.Conf(html.HEIGHT))-can.Conf(html.MARGIN_Y)
-            item.width = parseInt(can.Conf(html.WIDTH))-can.Conf(html.MARGIN_X)
+            item.height = can.Conf(html.HEIGHT)-can.Conf(html.MARGIN_Y)
+            item.width = can.Conf(html.WIDTH)-can.Conf(html.MARGIN_X)
            item.feature = can.base.Obj(item.feature||item.meta)
            item.inputs = can.base.Obj(item.inputs||item.list)

@ -10,20 +10,20 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg)
                can.onimport._plugin(can, river, storm, sub, meta), skip || next()
            })
        }, function() { can.onimport._menu(can, msg), can.onkeypop._init(can)
-            can.onaction.layout(can, can.misc.Search(can, chat.LAYOUT)||can.Conf(chat.LAYOUT))
+            can.onaction.layout(can, can.misc.SearchOrConf(can, chat.LAYOUT))
        })
    },
    _plugin: function(can, river, storm, sub, meta) { sub._target._meta = meta
        sub.run = function(event, cmds, cb) { var msg = sub.request(event)
-            return can.run(event, can.misc.concat([river, storm, meta.id||meta.index], cmds||[]), cb)
-        }, can._plugins = (can._plugins||[]).concat([sub])
+            return can.run(event, can.misc.concat([river, storm, meta.id||meta.index], cmds), cb)
+        }, can._plugins = can.misc.concat(can._plugins, [sub])

        meta.id && (sub._option.dataset = sub._option.dataset||{}, sub._option.dataset.id = meta.id)

        can.page.Modify(can, sub._output, {style: kit.Dict(html.MAX_WIDTH, meta.width)})
-        can.page.Append(can, can._action, [{view: [html.ITEM, html.DIV, meta.name], onclick: function(event) {
+        can.page.Append(can, can._action, [{view: [chat.TABS, html.DIV, meta.name], onclick: function(event) {
            can.onmotion.select(can, can._output, html.FIELDSET_PLUGIN, sub._target)
-            can.onmotion.select(can, can._action, html.DIV_ITEM, event.target)
+            can.onmotion.select(can, can._action, chat.DIV_TABS, event.target)
        }}])
    },
    _menu: function(can, msg) { if (can.user.mod.isPod||can.user.isMobile) { return }
@ -34,8 +34,8 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg)
    },

    _share: function(can, share) { share && can.run({}, ["_share", share], function(msg) {
-        can.user.topic(can, can.misc.Search(can, chat.TOPIC)||msg.Option(chat.TOPIC))
-        can.user.title(can.misc.Search(can, chat.TITLE)||msg.Option(chat.TITLE))
+        can.user.title(msg.OptionOrSearch(chat.TITLE))
+        can.setHeader(chat.TOPIC, msg.OptionOrSearch(chat.TOPIC))
        can.page.Select(can, document.body, html.FIELDSET_PANEL, function(item) {
            item != can._target && can.onmotion.hidden(can, item)
        })
@ -119,14 +119,7 @@ Volcanos("onaction", {help: "交互操作", list: [], _init: function(can, cb, t
        })
    },
    onstorm_select: function(can, msg, river, storm) { can.onlayout._init(can)
-        function key(name) { return can.core.Keys(can.Conf(chat.RIVER), can.Conf(chat.STORM), name) }
-        can.page.Cache(key(html.ACTION), can._action, can._output.scrollTop+1)
-        can.page.Cache(key(html.OUTPUT), can._output, can._output.scrollTop+1)
-
-        can.Conf(chat.RIVER, river), can.Conf(chat.STORM, storm)
-        var position = can.page.Cache(key(html.ACTION), can._action)
-        var position = can.page.Cache(key(html.OUTPUT), can._output)
-        if (position) { can._output.scrollTo(0, position-1); return }
+        if (can.onmotion.cache(can, function() { return can.core.Keys(can.Conf(chat.RIVER, river), can.Conf(chat.STORM, storm)) }, can._action, can._output)) { return }

        can.run({}, [river, storm], function(msg) { if (msg.Length() > 0) { return can.onimport._init(can, msg) }
            can.onengine.signal(can, "onaction_notool", can.request({}, {river: river, storm: storm}))
@ -138,18 +131,24 @@ Volcanos("onaction", {help: "交互操作", list: [], _init: function(can, cb, t
    onsize: function(can, msg, height, width) { can.Conf({height: height, width: width}) },

    help: function(can, button) { can.user.open("/help/"+button+".shy") },
-    layout: function(can, button) { can.Conf(chat.LAYOUT, button)
-        can.page.Modify(can, can._action, {className: chat.ACTION+ice.SP+button})
-        can.page.Modify(can, can._output, {className: chat.OUTPUT+ice.SP+button})
+    layout: function(can, button) {
+        can.page.ClassList.del(can, can._target, can.Conf(chat.LAYOUT))
+        can.page.ClassList.add(can, can._target, can.Conf(chat.LAYOUT, button))

        if (button == "tabs") {
            can.onmotion.select(can, can._output, html.FIELDSET_PLUGIN, 0)
-            can.onmotion.select(can, can._action, html.DIV_ITEM, 0)
+            can.onmotion.select(can, can._action, chat.DIV_TABS, 0)
        } else if (button == "free") {
-            can.page.Select(can, can._target, html.DIV_OUTPUT+ice.GT+html.FIELDSET_PLUGIN, function(item, index) {
+            can.page.Select(can, can._target, [[html.DIV_OUTPUT, html.FIELDSET_PLUGIN]], function(item, index) {
                can.page.Modify(can, item, {style: {left: 40*index, top: 40*index}})
                can.onmotion.move(can, item, {left: 40*index, top: 40*index})
            })
+        } else if (button == "grid") {
+            can.user.input(event, can, [{name: "m", value: 2}, {name: "n", value: 2}], function(event, button, data, list, args) {
+                can.getActionSize(function(height, width) { var m = parseInt(data.m)||2, n = parseInt(data.n)||2
+                    can.page.css(can.base.replaceAll(chat.ACTION_LAYOUT_FMT, "_width", (width-(4*m+1)*html.PLUGIN_MARGIN)/m+"px", "_height", (height-(4*n+1)*html.PLUGIN_MARGIN)/n+"px"))
+                })
+            })
        }
        can.onlayout._init(can)
    },
@ -182,7 +181,7 @@ Volcanos("onkeypop", {help: "键盘交互", list: [], _focus: [], _init: functio
                can.page.Select(can, document.body, html.FIELDSET_AUTO, function(item) {
                    can.onmotion.hidden(can, item)
                })
-                can.page.Select(can, document.body, can.base.join([html.FIELDSET_FLOAT, html.DIV_FLOAT], ice.FS), function(item) {
+                can.page.Select(can, document.body, can.page.Keys(html.FIELDSET_FLOAT, html.DIV_FLOAT), function(item) {
                    can.page.Remove(can, item)
                })
            },
@ -191,7 +190,7 @@ Volcanos("onkeypop", {help: "键盘交互", list: [], _focus: [], _init: functio
 })
 Volcanos("onexport", {help: "导出数据", list: [],
    args: function(can, cb, target) {
-        can.core.Next(can.page.Select(can, target, html.FIELDSET_PLUGIN+ice.GT+html.FORM_OPTION), function(item, next, index, array) {
+        can.core.Next(can.page.Select(can, target, [[html.FIELDSET_PLUGIN, html.FORM_OPTION]]), function(item, next, index, array) {
            item.dataset.args = JSON.stringify(can.page.Select(can, item, html.OPTION_ARGS, function(item) { return item.value||"" }))
            cb(item, next, index, array)
        })
@ -207,7 +206,7 @@ Volcanos("onexport", {help: "导出数据", list: [],
    },
    layout: function(can, msg) { return can.Conf(chat.LAYOUT) },
    plugin: function(can, msg, word) { var fields = can.core.Split(msg.Option(ice.MSG_FIELDS))
-        can.page.Select(can, can._output, html.FIELDSET_PLUGIN+ice.GT+html.LEGEND, function(item) {
+        can.page.Select(can, can._output, [[html.FIELDSET_PLUGIN, html.LEGEND]], function(item) {
            if (item.innerHTML.indexOf(word[1]) == -1) { return }

            var meta = item.parentNode._meta
--- a/panel/header.js
+++ b/panel/header.js
@ -94,6 +94,7 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg,
    time: function(can, target) { can.onlayout.topic(can)
        target.innerHTML = can.user.time(can, null, "%w %H:%M:%S")
    },
+    topic: function(can, topic) { can.onlayout.topic(can, can._topic = topic) },
    background: function(event, can, url) { if (can.user.isExtension || can.user.isLocalFile) { return }
        can.run(event, [ctx.ACTION, aaa.BACKGROUND, url], function(msg) { can.onimport._background(can, msg) })
    },
--- a/plugin/local/code/inner.css
+++ b/plugin/local/code/inner.css
@ -1,11 +1,10 @@
-fieldset.inner>div.action div.file {
+fieldset.inner>div.action div.tabs {
    border:solid 2px red; padding:2px;
-    float:left; cursor:pointer;
 }
-fieldset.inner>div.action div.file.over {
+fieldset.inner>div.action div.tabs.over {
    background-color:blue;
 }
-fieldset.inner>div.action div.file.select {
+fieldset.inner>div.action div.tabs.select {
    background-color:green;
 }

@ -67,6 +66,9 @@ fieldset.inner>div.output div.content td.text span.string {

 fieldset.inner>div.output div.search {
    padding:6px; border:solid 1px red;
+    position:absolute;
+    background:#0d969f8a;
+    bottom:0;
 }
 fieldset.inner>div.output div.search div.tags {
    text-align:left; overflow:auto;
@ -78,6 +80,11 @@ fieldset.inner>div.output div.search td>div {
    max-height:100px;
    overflow:hidden;
 }
+fieldset.inner div.output fieldset.story {
+    position:absolute;
+    bottom:0px;
+    background:#0d969f8a;
+}

 body.white fieldset.inner>div.output div.project {
    color:#a2dad2;
--- a/plugin/local/code/inner.js
+++ b/plugin/local/code/inner.js
@ -1,32 +1,31 @@
-Volcanos("onimport", {help: "导入数据", _init: function(can, msg, list, cb, target) {
-        can.onmotion.clear(can)
-        can.ui = can.onlayout.profile(can)
+Volcanos("onimport", {help: "导入数据", _init: function(can, msg, cb, target) {
+        can.onmotion.clear(can), can.ui = can.onlayout.profile(can)
        can.onimport._content(can, target)
        can.onimport._output(can, target)
-        // can.onimport._favor(can, target)
-        // can.onimport._search(can, target)
+        can.onimport._favor(can, target)
+        can.onimport._search(can, target)

-        can.history = can.history||[]
        msg.Option({path: can.Option(nfs.PATH), file: can.Option(nfs.FILE), line: can.Option(nfs.LINE)||1})
        can.tabview = can.tabview||{}, can.tabview[can.Option(nfs.PATH)+can.Option(nfs.FILE)] = msg
+        can.history = can.history||[]

        can.onimport.tabview(can, msg.Option(nfs.PATH), msg.Option(nfs.FILE), msg.Option(nfs.LINE)||1)
        can.onimport.project(can, msg.Option(nfs.PATH))
        can.base.isFunc(cb) && cb(msg)
    },
    _content: function(can, target) { var height = can.Conf(html.HEIGHT)
-        can.page.Modify(can, can.ui.project, {style: {"max-height": height}})
-        can.page.Modify(can, can.ui.content, {style: {"max-height": height}})
-        can.page.Modify(can, can.ui.display, {style: {display: chat.NONE}})
+        can.page.style(can, can.ui.project, html.MAX_HEIGHT, height)
+        can.page.style(can, can.ui.content, html.MAX_HEIGHT, height)
+        can.page.style(can, can.ui.display, html.DISPLAY, html.NONE)
    },
    _output: function(can, target) {
        var ui = can.page.Append(can, can.ui.display, [{view: html.ACTION}, {view: html.OUTPUT}]); can.ui.output = ui.output

-        can.onappend._action(can, ["exec", cli.CLEAR, cli.CLOSE], ui.action, {
-            exec: function(event) { can.onaction["exec"](event, can) },
-            clear: function(event) { can.onmotion.clear(can, can.ui.output) },
-            close: function(event) { can.onmotion.hidden(can, can.ui.display) },
-        })
+        can.onappend._action(can, [cli.EXEC, cli.CLEAR, cli.CLOSE], ui.action, kit.Dict(
+            cli.EXEC, function(event) { can.onaction[cli.EXEC](event, can) },
+            cli.CLEAR, function(event) { can.onmotion.clear(can, can.ui.output) },
+            cli.CLOSE, function(event) { can.onmotion.hidden(can, can.ui.display) },
+        ))
    },
    _favor: function(can, target) {
        can.onappend.plugin(can, {type: chat.STORY, index: "web.code.favor"}, function(sub) {
@ -37,28 +36,26 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, list, cb,

                can.run(event, can.misc.concat([ctx.ACTION, code.FAVOR], cmds), function(msg) {
                    can.base.isFunc(cb) && cb(msg), can.core.Timer(10, function() {
-                        can.onappend._action(sub, [cli.CLOSE], sub._action, {
-                            close: function(event) { can.onmotion.hidden(sub, sub._target) },
-                        })
+                        can.onappend._action(sub, [cli.CLOSE], sub._action, kit.Dict(
+                            cli.CLOSE, function(event) { can.onmotion.hidden(sub, sub._target) },
+                        ))
                    })
                }, true)
-            }, can.ui.favor = sub
-
-            can.onmotion.hidden(sub, sub._target)
+            }, can.ui.favor = sub, can.onmotion.hidden(sub, sub._target)
        }, target)
    },
    _search: function(can, target) {
        var ui = can.page.Append(can, target, [
-            {view: mdb.SEARCH, style: {display: chat.NONE}, list: [
+            {view: mdb.SEARCH, style: {display: html.NONE}, list: [
                {view: chat.ACTION, list: [
                    {input: ["word", function(event) {
                        event.key == lang.ENTER && can.onaction.searchLine(event, can, ui.word.value)
-                    }], value: "main", onfocus: function(event) { event.target.setSelectionRange(0, -1) }},
-                    {button: [mdb.SEARCH, function(event) { can.onaction.searchLine(event, can, ui.word.value) }]},
-                    {button: ["back", function(event) { can.onaction["back"](event, can) }]},
-                    {button: ["close", function(event) { can.onaction["搜索"](event, can) }]},
+                    }], value: cli.MAIN, onfocus: function(event) { event.target.setSelectionRange(0, -1) }},
+                    {button: ["find", function(event) { can.onaction.searchLine(event, can, ui.word.value) }]},
+                    {button: [cli.BACK, function(event) { can.onaction[cli.BACK](event, can) }]},
+                    {button: [cli.CLOSE, function(event) { can.onaction["搜索"](event, can) }]},
                ]},
-                {view: "tags", style: {"max-height": 160}},
+                {view: "tags", style: kit.Dict(html.MAX_HEIGHT, 160)},
            ]},
        ]); can.base.Copy(can.ui, ui, mdb.SEARCH, "word", "tags")
    },
@ -81,62 +78,49 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, list, cb,
            return can.onsyntax._init(can, can._msg), can.base.isFunc(cb) && cb()
        }

-        can.run({}, [path, file], function(msg) {
+        can.run({}, [path, file], function(msg) { can.tabview[path+file] = msg
            msg.Option({path: path, file: file, line: line||1})
-            can.tabview[path+file] = msg

            msg._tab = can.page.Append(can, can._action, [
-                {text: [file.split(ice.PS).pop(), html.DIV, nfs.FILE], title: file, onclick: function(event) {
+                {text: [file.split(ice.PS).pop(), html.DIV, chat.TABS], title: file, onclick: function(event) {
                    can.onimport.tabview(can, path, file, "", cb)
-                }, _init: function(item) {
-                    can.core.Timer(10, function() { item.click() })
-                    can.onaction.EnableDrop(can, can._action, "div.file", item)
+                }, _init: function(item) { can.core.Timer(10, function() { item.click() })
+                    can.onaction.EnableDrop(can, can._action, chat.DIV_TABS, item)
                }}
            ]).last
        }, true)
    },
 }, [""])
 Volcanos("onsyntax", {help: "语法高亮", list: ["keyword", "prefix", "line"], _init: function(can, msg) {
-        // caches save
-        can.file && can.core.List([chat.CONTENT, chat.PROFILE, chat.OUTPUT], function(item) { can.page.Cache(can.file, can.ui[item], {
-            scrollTop: can.ui.content.scrollTop, current: can.current, max: can.max,
-        }) })
-
-        can.file = can.base.Path(msg.Option(nfs.PATH), msg.Option(nfs.FILE))
-        can.parse = can.base.Ext(can.file)
-        can.Status("模式", "normal")
-
-        // caches load
-        can.onmotion.select(can, can._action, "div.file", msg._tab)
-        var cache = false; can.core.List([chat.CONTENT, chat.PROFILE, chat.OUTPUT], function(item) {
-            var p = can.page.Cache(can.file, can.ui[item]); if (p != undefined && !cache) { cache = true
-                can.onaction.selectLine(can, parseInt(msg.Option(nfs.LINE)))
-                can.ui.content.scrollTo(0, p.scrollTop)
-                can.max = p.max
-            }
-        }); if (cache) { return }
-
-        function init(p) { can.max = 0
-            can.core.List(can.ls = msg.Result().split(ice.NL), function(item) {
-                can.onaction.appendLine(can, item)
-            }), can.onaction.selectLine(can, msg.Option(nfs.LINE)||1)
+        can._cache_list = can._cache_list||{}, can._cache_list[can.file] = {current: can.current, max: can.max}
+        if (can.onmotion.cache(can, function() { can.file = can.base.Path(msg.Option(nfs.PATH), msg.Option(nfs.FILE))
+            var p = can._cache_list[can.file]; if (p) { can.current = p.current, can.max = p.max }
+            can.parse = can.base.Ext(can.file), can.Status("模式", "normal")
+            can.onmotion.select(can, can._action, chat.DIV_TABS, msg._tab)
+            return can.file
+        }, can.ui.content, can.ui.profile, can.ui.output)) {
+            return can.onaction.selectLine(can, parseInt(msg.Option(nfs.LINE)))
        }

-        // plugin
+        can.current = {}
+        function init(p) { can.max = 0, can.core.List(can.ls = msg.Result().split(ice.NL), function(item) {
+            can.onaction.appendLine(can, item)
+        }), can.onaction.selectLine(can, msg.Option(nfs.LINE)||1) }
+
        var p = can.onsyntax[can.parse]; !p? can.run({}, [ctx.ACTION, mdb.PLUGIN, can.parse, msg.Option(nfs.FILE), msg.Option(nfs.PATH)], function(msg) {
            init(p = can.onsyntax[can.parse] = can.base.Obj(msg.Result()))
        }, true): init(p)
    },
-    _parse: function(can, line) { line = line||"", line = line.replace("<", "&lt;").replace(">", "&gt;")
+    _parse: function(can, line) { line = can.base.replaceAll(line||"", "<", "&lt;", ">", "&gt;")
        var p = can.onsyntax[can.parse]; if (!p) { return line }
        p = can.onsyntax[p.link]||p

        function wrap(type, str) { return type? '<span class="'+type+'">'+str+'</span>': str }
-        p.keyword && (line = can.core.List(can.core.Split(line, p.split && p.split.space||ice.SP, p.split && p.split.operator || "{[(|)]}", {detail: true}), function(item, index, array) {
+        p.keyword && (line = can.core.List(can.core.Split(line, p.split&&p.split.space||ice.SP, p.split&&p.split.operator||"{[(|)]}", {detail: true}), function(item, index, array) {
            item = can.base.isObject(item)? item: {text: item}, p.word && (item = p.word(item, index, array))
            var text = item.text; var key = item.keyword||p.keyword[text]

-            switch (item.type) { case "space": return text
+            switch (item.type) { case html.SPACE: return text
                case lang.STRING: return wrap(lang.STRING, item.left+text+item.right)
                default: return wrap(key, text)
            }
@ -158,21 +142,19 @@ Volcanos("onsyntax", {help: "语法高亮", list: ["keyword", "prefix", "line"],
    },
 })
 Volcanos("onaction", {help: "控件交互", list: ["项目", "收藏"],
-    "back": function(event, can) {
+    back: function(event, can) {
        var last = can.history.pop(); last = can.history.pop()
        last && can.onimport.tabview(can, last.path, last.file, last.line)
        can.Status("跳转数", can.history.length)
    },
-    "项目": function(event, can) {
-        var width = can.Conf(html.WIDTH)-(can.onmotion.toggle(can, can.ui.project)? 170: 0)
-    },
+    "项目": function(event, can) { can.onmotion.toggle(can, can.ui.project) },
    "收藏": function(event, can) { can.onmotion.toggle(can, can.ui.favor._target) },
    "搜索": function(event, can) { can.onmotion.toggle(can, can.ui.search) },
-    "exec": function(event, can) { var msg = can.request(event, {_toast: "运行中..."})
+    exec: function(event, can) { var msg = can.request(event, {_toast: "运行中..."})
        can.run(event, [ctx.ACTION, mdb.ENGINE, can.parse, can.Option(nfs.FILE), can.Option(nfs.PATH)], function(msg) {
            can.onappend.table(can, msg, null, can.ui.output||can.ui.display)
            can.onappend.board(can, msg.Result(), can.ui.output||can.ui.display)
-            can.page.Modify(can, can.ui.display, {style: {display: html.BLOCK}})
+            can.page.style(can, can.ui.display, html.DISPLAY, html.BLOCK)
        }, true)
    },

@ -256,11 +238,12 @@ Volcanos("onaction", {help: "控件交互", list: ["项目", "收藏"],
        can.page.Modify(can, can.ui.search, {style: {display: ""}})
        value = can.ui.word.value = value||can.ui.word.value||"main"

-        can.request(event, {_toast: "搜索中..."})
+        can.request(event, kit.Dict(ice.MSG_HANDLE, ice.TRUE, ice.MSG_FIELDS, "file,line,text"))
        can.run(event, [ctx.ACTION, mdb.SEARCH, can.parse, value, can.Option(nfs.PATH)], function(msg) {
+            can.onmotion.hidden(can, can.ui.search, true)
            can.onmotion.clear(can, can.ui.tags)
            can.onappend.table(can, msg, function(value, key, index, line) {
-                value = value.replace("<", "&lt;").replace(">", "&gt;"), value = value.replace("./", "")
+                value = can.base.replaceAll(value, "<", "&lt;", ">", "&gt;", "./", "")

                return {text: ["", html.TD], list: [{text: [value, html.DIV]}], onclick: function(event) {
                    line.line && can.onimport.tabview(can, can.Option(nfs.PATH), line.file.replace("./", ""), parseInt(line.line), function() {
@ -294,24 +277,17 @@ Volcanos("onaction", {help: "控件交互", list: ["项目", "收藏"],
    },

    favorLine: function(can, value) {
-        can.user.input(event, can, [
-            {name: "zone", value: "hi"},
-            {name: "name", value: "hello"},
-        ], function(event, button, meta, list) {
-            can.run(event, [ctx.ACTION, code.FAVOR,
-                ctx.ACTION, mdb.INSERT, mdb.ZONE, meta.zone||"",
+        can.user.input(event, can, [{name: "zone", value: "hi"}, {name: "name", value: "hello"}], function(event, button, meta, list) {
+            can.run(event, [ctx.ACTION, code.FAVOR, ctx.ACTION, mdb.INSERT, mdb.ZONE, meta.zone||"",
                mdb.TYPE, can.parse, mdb.NAME, meta.name||"", mdb.TEXT, (value||"").trimRight(),
                nfs.PATH, can.Option(nfs.PATH), nfs.FILE, can.Option(nfs.FILE), nfs.LINE, can.Option(nfs.LINE),
-            ], function(msg) {
-                can.user.toastSuccess(can)
-            }, true)
+            ], function(msg) { can.user.toastSuccess(can) }, true)
        })
    },
    EnableDrop: function(can, parent, search, target) {
        return can.page.Modify(can, target, { draggable: true,
            ondragstart: function(event) { var target = event.target; can.drop = function(event, tab) {
-                parent.insertBefore(target, tab)
-                can.page.Select(can, parent, search, function(item) {
+                parent.insertBefore(target, tab), can.page.Select(can, parent, search, function(item) {
                    can.page.ClassList.del(can, item, "over")
                })
            } },
@ -320,9 +296,7 @@ Volcanos("onaction", {help: "控件交互", list: ["项目", "收藏"],
                    can.page.ClassList.del(can, item, "over")
                }), can.page.ClassList.add(can, event.target, "over")
            },
-            ondrop: function(event) { event.preventDefault()
-                can.drop(event, event.target)
-            },
+            ondrop: function(event) { event.preventDefault(), can.drop(event, event.target) },
        })
    },
 })
@ -331,9 +305,7 @@ Volcanos("onexport", {help: "导出数据", list: ["文件数", "解析器", "
        return (parseInt(index))+ice.PS+parseInt(total)+" = "+parseInt((index)*100/total)+"%"
    },
    content: function(can) {
-        return can.page.Select(can, can.ui.content, "td.text", function(item) {
-            return item.innerText
-        }).join(ice.NL)+ice.NL
+        return can.page.Select(can, can.ui.content, "td.text", function(item) { return item.innerText }).join(ice.NL)+ice.NL
    },
 })

--- a/plugin/local/team/plan.js
+++ b/plugin/local/team/plan.js
@ -60,17 +60,8 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg,
        }),
    } },
    _profile: function(can, task) {
-        function keys(task, key) { return [task.pod, task.zone, task.id, key].join(".") }
-
-        if (can.sup.task) { if (can.sup.task.pod == task.pod && can.sup.task.id == task.id) { return }
-            can.page.Cache(keys(can.sup.task, chat.PROFILE), can.ui.profile, can.sup.task.id)
-            can.page.Cache(keys(can.sup.task, chat.DISPLAY), can.ui.display, can.sup.task.id)
-        }
-
-        can.sup.task = task, can.Status(task)
-        var profile = can.page.Cache(keys(task, "profile"), can.ui.profile)
-        var display = can.page.Cache(keys(task, "display"), can.ui.display)
-        if (profile || display) { return }
+        if (can.sup.task && can.sup.task.pod == task.pod && can.sup.task.id == task.id) { return }
+        if (can.onmotion.cache(can, function() { return can.sup.task = task, can.Status(task), [task.pod, task.zone, task.id].join(ice.PT) }, can.ui.profile, can.ui.display)) { return }

        task.extra && can.core.Item(can.base.Obj(task.extra), function(key, value) { task["extra."+key] = value }), delete(task.extra)
        var table = can.page.Appends(can, can.ui.profile, [{view: [chat.CONTENT, html.TABLE], list: [{th: ["key", "value"]}]}]).first
--- a/plugin/local/wiki/draw.js
+++ b/plugin/local/wiki/draw.js
@ -84,8 +84,7 @@ Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg,
        return target
    },
    _profile: function(can, target, list) { can.Option("pid", can.onfigure._pid(can, target))
-        can.pid && can.page.Cache(can.pid, can.ui.profile, "some"), can.pid = target.Value("pid")
-        var cache = can.page.Cache(can.pid, can.ui.profile); if (cache) { return }
+        if (can.onmotion.cache(can, function() { return target.Value("pid") }, can.ui.profile)) { return }

        var action = can.page.Append(can, can.ui.profile, [{view: "action"}]).first
        can.onappend._action(can, can.ondetail.list, action, {_engine: function(event, can, button) {
@ -410,8 +409,8 @@ Volcanos("ondetail", {help: "组件详情", list: [cli.START, ice.RUN, ice.COPY,
    },
    run: function(event, can) { var target = event.target
        if (!target.Value("pid")) { can.onfigure._pid(can, target) }
-        can._pid && can.page.Cache(can._pid, can.ui.display, "some"), can._pid = target.Value("pid")
-        var cache = can.page.Cache(can._pid, can.ui.display); if (cache) { return }
+
+        if (can.onmotion.cache(can, function() { return target.Value("pid") }, can.ui.display)) { return }

        can.onmotion.clear(can, can.ui.display), can.svg.Value("pid", target.Value("pid"))
        var index = target.Value(mdb.INDEX); index && can.onappend.plugin(can, {type: chat.STORY, index: index, args: target.Value(ctx.ARGS)}, function(sub) {
--- a/plugin/local/wiki/word.js
+++ b/plugin/local/wiki/word.js
@ -3,7 +3,7 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, cb, target
        if (msg.Length() > 0) { return can.onappend.table(can, msg) }

        can.page.Modify(can, target, msg.Result())
-        can.page.Select(can, target, ".story", function(item) { var data = item.dataset||{}
+        can.page.Select(can, target, wiki.ITEM, function(item) { var data = item.dataset||{}
            can.core.CallFunc([can.onimport, data.type], [can, data, item])
            can.page.Modify(can, item, {style: can.base.Obj(data.style)})
        })
@ -17,17 +17,12 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, cb, target
            if (can.core.Value(can, list[0])) { return can.core.CallFunc([can, list[0]], list.slice(1)) }
            if (!link || link == can.Option(nfs.PATH)) { return false }

-            can.page.Cache(can.Option(nfs.PATH), can._output, can._output.scrollTop+1)
-            can.Option(nfs.PATH, link), can.user.mod.isCmd && can.user.title(item.meta.name)
-            var position = can.page.Cache(can.Option(nfs.PATH), can._output)
-            if (position) { can._output.scrollTo(0, position-1); return true }
-
-            can.sup.Update(event, [link])
-            return true
+            if (can.onmotion.cache(can, function() { can.user.mod.isCmd && can.user.title(item.meta.name); return can.Option(nfs.PATH, link) })) { return }
+            return can.sup.Update(event, [link])
        }, nav), can.sup._navmenu = nav

        can.getActionSize(function(msg) { 
-            can.page.Modify(can, nav, {style: {height: can.Conf(html.HEIGHT)+(can.user.mod.isCmd? msg.Option(html.MARGIN_Y): 0)}})
+            can.page.style(can, nav, html.HEIGHT, can.Conf(html.HEIGHT)+(can.user.mod.isCmd? msg.Option(html.MARGIN_Y): 0))
            can.Conf(html.WIDTH, can.Conf(html.WIDTH)-nav.offsetWidth-(can.user.mod.isCmd? 10: 20))
            can.page.Modify(can, can._output, {style: kit.Dict(
                html.HEIGHT, can.sup._navmenu.offsetHeight, html.MAX_WIDTH, can.Conf(html.WIDTH),
@ -36,14 +31,14 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, cb, target
        })
    },
    premenu: function(can, data, target) {
-        can.page.Select(can, can._output, "h2.story, h3.story", function(item) {
+        can.page.Select(can, can._output, can.page.Keys(wiki.H2, wiki.H3), function(item) {
            can.page.Append(can, target, [{text: [item.innerHTML, html.LI, item.tagName], onclick: function() {
                item.scrollIntoView()
            }}]), item.onclick = function(event) { target.scrollIntoView() }
        })
    },
    title: function(can, data, target) {
-        can.user.mod.isCmd && can.user.title(data.text)
+        can.user.mod.isCmd && target.tagName == "H1" && can.user.title(data.text)
    },
    spark: function(can, data, target) {
        if (data[mdb.NAME] == html.INNER) { return can.onmotion.copy(can, target) }
@ -63,7 +58,7 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, cb, target
        can.page.Select(can, target, html.TD, function(item) { can.onmotion.copy(can, item) })
    },
    field: function(can, data, target, width) { var item = can.base.Obj(data.meta)
-        can.onappend._init(can, item, ["/plugin/state.js"], function(sub) {
+        can.onappend._init(can, item, [chat.PLUGIN_STATE_JS], function(sub) {
            sub.run = function(event, cmds, cb, silent) {
                can.run(event, can.misc.concat([ctx.ACTION, chat.STORY, data.type, data.name, data.text], cmds), cb, true)
            }
@ -71,7 +66,7 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, cb, target
            sub.Conf(html.WIDTH, item.width = (width||can.Conf(html.WIDTH))-20)

            can.core.Value(item, "auto.cmd") && can.core.Timer300ms(function() {
-                var msg = sub.request({}, can.core.Value(item, "opts")); msg.Option("_handle", ice.TRUE)
+                var msg = sub.request({}, can.core.Value(item, "opts")); msg.Option(ice.MSG_HANDLE, ice.TRUE)
                sub.Update(msg._event, [ctx.ACTION, can.core.Value(item, "auto.cmd")])
            })
        }, can._output, target)
@ -97,7 +92,7 @@ Volcanos("onkeypop", {help: "键盘交互", list: [],
 })
 Volcanos("onaction", {help: "控件交互", list: [],
    play: function(event, can) { var list = [], current = []
-        can.page.Select(can, can._output, ".story", function(item) {
+        can.page.Select(can, can._output, wiki.ITEM, function(item) {
            switch (item.tagName) {
                case "H1":
                case "H2":
@ -119,11 +114,11 @@ Volcanos("onaction", {help: "控件交互", list: [],
                can.keylist = can.onkeypop._parse(event, can, "normal", can.keylist)
            }})), can.onkeypop._build(can)

-            can.page.Modify(can, sub._target, {style: {background: document.body.style.background}})
-            sub.ui = sub.page.Append(sub, sub._output, [{view: chat.PROJECT}, {view: chat.CONTENT}])
-            sub.page.Modify(sub, sub._output, {style: {height: window.innerHeight-93}})
-            sub.page.Modify(sub, sub._output, {style: {width: window.innerWidth-40}})
+            sub.page.style(sub, sub._target, html.BACKGROUND, document.body.style.background)
+            sub.page.style(sub, sub._output, html.HEIGHT, window.innerHeight-4*html.PLUGIN_MARGIN-2*html.ACTION_HEIGHT)
+            sub.page.style(sub, sub._output, html.WIDTH, window.innerWidth-4*html.PLUGIN_MARGIN)

+            sub.ui = sub.page.Append(sub, sub._output, [{view: chat.PROJECT}, {view: chat.CONTENT}])
            can.core.List(sub.list = list, function(page, index) {
                can.onappend.item(can, html.ITEM, {name: page[0].innerHTML}, function(event) {
                    can.ondetail.show(sub, index) 
@ -135,7 +130,7 @@ Volcanos("onaction", {help: "控件交互", list: [],
                        case chat.FIELD: item = can.onappend.field(can, chat.STORY, can.base.Obj(data.meta), sub.ui.content).first; break
                        default: item = item.cloneNode(true)
                    }
-                    return can.core.CallFunc([can.onimport, data.type], [sub, data, item, window.innerWidth-40]), item
+                    return can.core.CallFunc([can.onimport, data.type], [sub, data, item, window.innerWidth-4*html.PLUGIN_MARGIN]), item
                }), }])
            }), can.onmotion.hidden(can, sub.ui.project), can.ondetail.show(sub, 0) 

@ -150,10 +145,10 @@ Volcanos("onaction", {help: "控件交互", list: [],
 Volcanos("ondetail", {help: "交互操作", list: ["删除"], _init: function(can, msg, list, cb, target) {
    },
    show: function(sub, which) { sub.page.Modify(sub, sub.ui.content, {className: chat.CONTENT})
-        sub.page.Select(sub, sub.ui.content, "div.page", function(page, index) {
+        sub.page.Select(sub, sub.ui.content, wiki.DIV_PAGE, function(page, index) {
            if (index == which || page == which) {
-                sub.page.Select(sub, page, "h1,h2,h3", function(item) { sub.Action("菜单", item.innerHTML) })
-                sub.onmotion.select(sub, sub.ui.project, "div.item", index)
+                sub.page.Select(sub, page, can.page.Keys(html.H1, html.H2, html.H3), function(item) { sub.Action("菜单", item.innerHTML) })
+                sub.onmotion.select(sub, sub.ui.project, html.DIV_ITEM, index)
                sub.Status(mdb.PAGE, index+1+ice.PS+sub.list.length)
                sub.page.ClassList.add(sub, page, html.SHOW)
            } else {
@ -162,21 +157,18 @@ Volcanos("ondetail", {help: "交互操作", list: ["删除"], _init: function(ca
        })
    },
    next: function(sub) {
-        sub.page.Select(sub, sub.ui.content, "div.page.show", function(page) {
-            page.nextSibling? sub.sup.ondetail.show(sub, page.nextSibling):
-                sub.user.toast(sub, "end")
+        sub.page.Select(sub, sub.ui.content, can.core.Keys(wiki.DIV_PAGE, ice.SHOW), function(page) {
+            page.nextSibling? sub.sup.ondetail.show(sub, page.nextSibling): sub.user.toast(sub, cli.END)
        })
    },
    prev: function(sub) {
-        sub.page.Select(sub, sub.ui.content, "div.page.show", function(page) {
-            page.previousSibling? sub.sup.ondetail.show(sub, page.previousSibling):
-                sub.user.toast(sub, "end")
+        sub.page.Select(sub, sub.ui.content, can.core.Keys(wiki.DIV_PAGE, ice.SHOW), function(page) {
+            page.previousSibling? sub.sup.ondetail.show(sub, page.previousSibling): sub.user.toast(sub, cli.END)
        })
    },
    flash: function(sub) {
-        sub.core.Next(sub.page.Select(sub, sub.ui.content, "div.page"), function(page, next) {
-            sub.core.Timer(500, function() { next() })
-            sub.sup.ondetail.show(sub, page)
+        sub.core.Next(sub.page.Select(sub, sub.ui.content, wiki.DIV_PAGE), function(page, next) {
+            sub.sup.ondetail.show(sub, page), sub.core.Timer(500, function() { next() })
        })
    },
    grid: function(sub) { sub.page.Modify(sub, sub.ui.content, {className: "content grid"}) },
--- a/plugin/state.js
+++ b/plugin/state.js
@ -80,7 +80,7 @@ Volcanos("onaction", {help: "交互操作", list: [
        can.Update(event, [ctx.ACTION, button].concat(can.Input([], true)))
    },
    "共享工具": function(event, can) { var meta = can.Conf()
-        can.onmotion.share(event, can, [{name: chat.TITLE, value: meta.name}], [
+        can.onmotion.share(event, can, [{name: chat.TITLE, value: meta.name}, {name: chat.TOPIC, values: [cli.WHITE, cli.BLACK]}], [
            mdb.NAME, meta.index, mdb.TEXT, JSON.stringify(can.Input([], true)),
        ])
    },
--- a/plugin/story/spide.js
+++ b/plugin/story/spide.js
@ -1,5 +1,4 @@
 Volcanos("onimport", {help: "导入数据", list: [], _init: function(can, msg, list, cb, target) {
-        can.misc.Log("what------", can.Conf())
        can.onmotion.clear(can), can.base.isFunc(cb) && cb(msg)
        if (msg.Length() == 0) { return }

--- a/proto.js
+++ b/proto.js
@ -60,6 +60,8 @@ var cli = {
    OPEN: "open", CLOSE: "close", BEGIN: "begin", END: "end",
    START: "start", STOP: "stop", DONE: "done", ERROR: "error",
    CLEAR: "clear", REFRESH: "refresh",
+    EXEC: "exec",
+    MAIN: "main",

    RED: "red", GREEN: "green", BLUE: "blue",
    YELLOW: "yellow", CYAN: "cyan", PURPLE: "purple", MAGENTA: "magenta",
@ -113,6 +115,11 @@ var wiki = {
    FIELD: "field", SHELL: "shell", LOCAL: "local", PARSE: "parse",

    NAVMENU: "navmenu", PREMENU: "premenu",
+
+    ITEM: ".story",
+    H2: "h2.story",
+    H3: "h3.story",
+    DIV_PAGE: "div.page",
 }
 var chat = {
    LIB: "lib", PAGE: "page", PANEL: "panel", PLUGIN: "plugin", OUTPUT: "output", INPUT: "input", UPLOAD: "upload",
@ -135,8 +142,14 @@ var chat = {
    SCROLL: "scroll", LEFT: "left", TOP: "top", RIGHT: "right", BOTTOM: "bottom",
    HEADER: "header", FOOTER: "footer",

+    TABS: "tabs", DIV_TABS: "div.tabs",
+
    SSO: "sso",

+    PLUGIN_STATE_JS: "/plugin/state.js",
+    PLUGIN_INPUT_JS: "/plugin/input.js",
+    PLUGIN_TABLE_JS: "/plugin/table.js",
+
    libs: ["/lib/base.js", "/lib/core.js", "/lib/misc.js", "/lib/page.js", "/lib/user.js"],
    panel_list: [
        {name: "Header", help: "标题栏", pos: "head", state: ["time", "usernick", "avatar"]},
@ -162,6 +175,14 @@ var chat = {
        "/plugin/local/team/plan.js",
        "/plugin/input/province.js",
    ],
+    ACTION_LAYOUT_FMT: `
+fieldset.Action.grid>div.output fieldset.plugin {
+    width:_width; height:_height;
+}
+fieldset.Action.grid>div.output fieldset.plugin>div.output {
+    width:_width; height:_height;
+}
+`,
 }
 var team = {
    TASK: "task", PLAN: "plan",
@ -178,11 +199,16 @@ var html = {
    FIELDSET: "fieldset", LEGEND: "legend", OPTION: "option", ACTION: "action", OUTPUT: "output", STATUS: "status",
    FORM_OPTION: "form.option", DIV_ACTION: "div.action", DIV_OUTPUT: "div.output", DIV_STATUS: "div.status",
    FIELDSET_PANEL: "fieldset.panel", FIELDSET_PLUGIN: "fieldset.plugin", FIELDSET_STORY: "fieldset.story",
-    FIELDSET_FLOAT: "fieldset.float", FIELDSET_AUTO: "fieldset.auto",
+
+    FIELDSET_HEAD: "fieldset.head", FIELDSET_FOOT: "fieldset.foot",
+    FIELDSET_LEFT: "fieldset.left", FIELDSET_MAIN: "fieldset.main",
+    FIELDSET_AUTO: "fieldset.auto", FIELDSET_FLOAT: "fieldset.float",
+
    OPTION_ARGS: "select.args,input.args,textarea.args",
    INPUT_ARGS: "input.args,textarea.args",
    DIV_ITEM: "div.item", DIV_FLOAT: "div.float",

+    INPUT_BUTTON: "input[type=button]",
    UPLOAD: "upload", USERNAME: "username", PASSWORD: "password",
    INPUT: "input", TEXT: "text", TEXTAREA: "textarea", SELECT: "select", BUTTON: "button",
    FORM: "form", FILE: "file", SPACE: "space", CLICK: "click", SUBMIT: "submit", CANCEL: "cancel",
@ -190,17 +216,20 @@ var html = {
    TABLE: "table", TR: "tr", TH: "th", TD: "td", BR: "br", UL: "ul", LI: "li",
    A: "a", LABEL: "label", INNER: "inner", TITLE: "title",

-    CLASS: "class", BLOCK: "block", NONE: "none", FLOAT: "float", CLEAR: "clear",
+    CLASS: "class", FLOAT: "float", CLEAR: "clear", BOTH: "both",
+    BACKGROUND: "background", SELECT: "select", HIDDEN: "hidden",
+    DISPLAY: "display", BLOCK: "block", NONE: "none",
    STROKE_WIDTH: "stroke-width", STROKE: "stroke", FILL: "fill", FONT_SIZE: "font-size", MONOSPACE: "monospace",
    SCROLL: "scroll", HEIGHT: "height", WIDTH: "width", LEFT: "left", TOP: "top", RIGHT: "right", BOTTOM: "bottom",
    MAX_HEIGHT: "max-height", MAX_WIDTH: "max-width", MARGIN_X: "margin-x", MARGIN_Y: "margin-y",
    PLUGIN_MARGIN: 10, ACTION_HEIGHT: 26, ACTION_MARGIN: 200,
-    HIDDEN: "hidden", SELECT: "select",
+
    FIXED: "fixed",

    WSS: "wss", SVG: "svg", CANVAS: "canvas", IFRAME: "iframe", CHROME: "chrome",
    LIST: "list", ITEM: "item", MENU: "menu", NODE: "node",
    HIDE: "hide", SHOW: "show",
+    H1: "h1", H2: "h2", H3: "h3",
 }
 var lang = {
    STRING: "string", NUMBER: "number",
@ -286,6 +315,7 @@ var Volcanos = shy("火山架", {iceberg: "/chat/", volcano: "/frame.js", args:
        get: function(name, key, cb) {
            return can.search({}, [can.core.Keys(name, "onexport", key)], cb)
        },
+        setHeader: function(key, value) { return can.set("Header", key, value) },
        getHeader: function(key, cb) { return can.get("Header", key, cb) },
        getAction: function(key, cb) { return can.get("Action", key, cb) },
        getActionSize: function(cb) { return can.get("Action", "size", cb) },