diff --git a/frame.js b/frame.js index 2231d19a..da8304dc 100644 --- a/frame.js +++ b/frame.js @@ -147,7 +147,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { var output = can.page.SelectOne(can, field, html.DIV_OUTPUT) var status = can.page.SelectOne(can, field, html.DIV_STATUS) var sub = Volcanos(meta.name, {_root: can._root||can, _follow: can.core.Keys(can._follow, meta.name), _target: field, - _legend: legend, _option: option, _action: action, _output: output, _status: status, _history: [], db: {}, ui: {}, + _legend: legend, _option: option, _action: action, _output: output, _status: status, _history: [], db: {hash: [""]}, ui: {}, Status: function(key, value) { if (can.base.isObject(key)) { return can.core.Item(key, sub.Status), key } try { can.page.Select(can, status, [[[html.SPAN, key]]], function(target) { if (key == web.SPACE && value) { value = can.page.Format(html.A, can.misc.MergePodCmd(can, {pod: value}), value) } @@ -311,7 +311,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { can.misc.Search(can, log.DEBUG) == ice.TRUE && can.base.beginWith(display, "/require/src/") && delete(Volcanos.meta.cache[display]) Volcanos(display, {_root: can._root, _follow: can.core.Keys(can._follow, display), _fields: can._target, _target: output, _path: display||chat.PLUGIN_TABLE_JS, _legend: can._legend, _option: can._option, _action: action||can._action, _output: output, _status: status||can._status, - Update: can.Update, Option: can.Option, Action: can.Action, Status: can.Status, db: {hash:[""], value: {}}, ui: {layout: function() {}}, + Update: can.Update, Option: can.Option, Action: can.Action, Status: can.Status, db: {hash: [""], value: {}}, ui: {layout: function() {}}, }, [display, msg.Option(ice.MSG_DISPLAY_CSS)||undefined, chat.PLUGIN_TABLE_JS], function(sub) { sub.Conf(can.Conf()) sub.db.hash = can.base.getValid(can.isCmdMode()? can.misc.SearchHash(can): [], can.misc.localStorage(can, [sub.ConfSpace()||can.misc.Search(can, ice.POD), sub.ConfIndex(), "hash"]))||[] var last = can.sub; last && can.core.CallFunc([last, "onaction.hidden"], {can: last}) @@ -344,8 +344,8 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { can.onimport.size(can, can.ConfHeight(), can.ConfWidth(), can.Conf("_auto"), can.Mode()) can.isCmdMode() && can.page.style(can, can._output, html.HEIGHT, sub.ConfHeight()) can.onexport.output(sub, msg); if (can.Conf("_output")) { can.Conf("_output")(sub, msg) } - } can.base.isFunc(cb) && cb(msg) - }, target: output}) + } msg.Defer(), can.base.isFunc(cb) && cb(msg) + }, target: output}), msg.Defer() }) }, _status: function(can, list, status, msg) { list && list.Option && (list = list.Option(ice.MSG_STATUS)||list) @@ -475,6 +475,19 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { }}]) } }, + filter: function(can, target, output) { output = output||target + return can.onappend.input(can, {type: html.TEXT, name: web.FILTER, icon: icon.SEARCH, placeholder: "search in n items", onkeydown: function() {}, onkeyup: function(event) { + if (event.key == code.ENTER) { + can.page.Select(can, output, html.DIV_ITEM+":not(.hide)", function(target) { target.click() }) + } else if (event.key == code.ESCAPE) { event.currentTarget.value = "", event.currentTarget.blur() + can.page.Select(can, output, html.DIV_ITEM, function(target) { can.onmotion.toggle(can, target, true) }) + } else { if (can.onkeymap.selectCtrlN(event, can, output, html.DIV_ITEM+":not(.filter):not(.hide)")) { return } + can.page.Select(can, output, html.DIV_ITEM, function(target) { + can.onmotion.toggle(can, target, target.innerText.indexOf(event.currentTarget.value) > -1 || target == event.currentTarget.parentNode) + }) + } + }}, "", target) + }, select: function(can, select, item) { // can.user.trans(can, item.value||item.values[0]) var trans = {}; can.core.List(item.values, function(value) { trans[can.user.trans(can, value, null, html.VALUE)] = value }) return can.page.Append(can, select.parentNode, [{type: html.INPUT, data: {className: html.SELECT, type: html.BUTTON, name: item.name, value: can.user.trans(can, item.value||item.values[0], null, html.VALUE), title: can.user.trans(can, item.name, null, html.VALUE)}, onclick: function(event) { var target = event.target @@ -651,7 +664,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { target.scrollHeight > target.offsetHeight && can.page.style(can, vbar, html.HEIGHT, height, html.RIGHT, -target.scrollLeft, html.VISIBILITY, html.VISIBLE, html.TOP, can.base.Max(target.scrollTop+target.scrollTop/(target.scrollHeight-target.offsetHeight)*(target.offsetHeight-height)-10, target.scrollHeight-height), ) - vbar.innerHTML = `${parseInt(target.scrollTop)}+${target.offsetHeight}/${target.scrollHeight}` + vbar.innerHTML = `${(target.scrollTop*100/(target.scrollHeight-target.offsetHeight)).toFixed(2)}%` var width = can.base.Min(target.offsetWidth*target.offsetWidth/target.scrollWidth, target.offsetWidth/4) target.scrollWidth > target.offsetWidth+10 && can.page.style(can, hbar, html.WIDTH, width, html.BOTTOM, -target.scrollTop, html.VISIBILITY, html.VISIBLE, html.LEFT, target.scrollLeft+target.scrollLeft/(target.scrollWidth-target.offsetWidth)*(target.offsetWidth-width), @@ -659,7 +672,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { hbar.innerHTML = `${target.scrollLeft}+${target.offsetWidth}/${target.scrollWidth}` can.onmotion.delayOnce(can, function() { can.page.style(can, vbar, html.VISIBILITY, html.HIDDEN), can.page.style(can, hbar, html.VISIBILITY, html.HIDDEN) - }, 1000, target._delay_scroll = target._delay_scroll||[]) + }, 3000, target._delay_scroll = target._delay_scroll||[]) }) return vbar }, @@ -724,7 +737,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { if (can.page.isDisplay(target)) { width -= w } } }), can.core.List(list, function(item) { if (can.base.isArray(item)) { layout(type == FLOW? FLEX: FLOW, item, height, width) } }) } - ui.project && can.user.isMobile && can.onmotion.hidden(can, ui.project); if (can.onimport.filter) { ui.filter = can.onimport.filter(can, ui.project) } + ui.project && can.user.isMobile && can.onmotion.hidden(can, ui.project); ui.filter = can.onappend.filter(can, ui.project) ui.display && can.onmotion.hidden(can, ui.display), ui.profile && can.onmotion.hidden(can, ui.profile) ui.layout = function(height, width, delay, cb) { can.onmotion.delay(can, function() { defer = [], layout(type, ui.list, height, width), defer.forEach(function(cb) { cb() }) diff --git a/index.css b/index.css index 927a037c..6f95414d 100644 --- a/index.css +++ b/index.css @@ -221,6 +221,11 @@ div.project div.item.search>input { padding:0 25px; width:100%; } div.project div.expand { margin-right:var(--input-margin); width:5px; float:left; transform: translate(1px, -1px) rotate(0deg); transition:all .5s; } div.project div.expand.open { transform: translate(4px, -1px) rotate(90deg); transition:all .3s; } div.project div.item>div.name { padding:0 var(--input-padding); } +div.project div.item { position:relative; } +div.project div.item>div.icon { hover:var(--hover-bg-color); position:absolute; right:0; } +div.project div.item:not(:hover)>div.icon { display:none; } +div.project div.item>i:last-child { hover:var(--hover-bg-color); position:absolute; right:0; } +div.project div.item:not(:hover)>i:last-child { display:none; } div.project div.zone>div.item { text-align:center; padding:var(--input-padding); display:flex; align-items:center; } div.project div.zone>div.item span:hover { background-color:var(--hover-bg-color); } div.project>div.zone>div.item span:first-child { font-style:italic; font-weight:bold; line-height:var(--action-height); } @@ -575,7 +580,8 @@ kbd { font-family:var(--code-font-family); line-height:var(--code-line-height); kbd:hover { background-color:var(--notice-bg-color); color:var(--notice-fg-color); } table.content { font-family:var(--table-font-family); } table.content th { font-family:var(--input-font-family); font-style:italic; } -body div.code { font-family:var(--table-font-family); padding:var(--table-padding); } +body div.output>div.code { font-family:var(--table-font-family); padding:var(--table-padding); } +body div.content>div.code { font-family:var(--table-font-family); padding:var(--table-padding); } body div.tabs { font-family:var(--code-font-family); } body div.path { font-family:var(--code-font-family); } body div.carte { font-family:var(--code-font-family); } @@ -950,10 +956,10 @@ div.scrollbar { background-color:var(--hover-bg-color); font-size:8px !important; line-height:10px; border-radius:var(--button-radius); position:absolute; visibility:hidden; } -div.scrollbar.vertical { writing-mode:tb; width:10px; right:0; top:0; transition:width .3s 1s; } +div.scrollbar.vertical { writing-mode:tb; width:10px; right:0; top:0; transition:width .3s 1s; cursor:pointer; } div.scrollbar.vertical:hover { width:30px; transition:width .1s; font-size:24px !important; } div.scrollbar.horizon:hover { height:30px; transition:height .1s; font-size:24px !important; } -div.scrollbar.horizon { height:10px; left:0; bottom:0; transition:height .3s 1s; } +div.scrollbar.horizon { height:10px; left:0; bottom:0; transition:height .3s 1s; cursor:pointer; } form.option>div.text>span.value::-webkit-scrollbar { width:0 !important; height:0 !important; } div.project::-webkit-scrollbar { width:0 !important; height:0 !important; } div.project div.list::-webkit-scrollbar { width:0 !important; height:0 !important; } diff --git a/plugin/local/code/inner.css b/plugin/local/code/inner.css index 00209a4c..e901658e 100644 --- a/plugin/local/code/inner.css +++ b/plugin/local/code/inner.css @@ -76,6 +76,11 @@ fieldset.inner.cmd>div.output>div.layout>div.plug>legend { font-style:italic; font-size:var(--legend-font-size); padding:0 var(--input-padding); margin-left:var(--input-margin); margin-right:0; float:right; } +div.input.vimer.find div.action div.item { margin:var(--input-margin); } +div.input.vimer.find div.action div.item.text input { width:var(--project-width) } +div.input.vimer.find div.action div.item.close span { display:none; } +fieldset.inner fieldset.plug.can._plugin.search>form.option>div.item.value input { width:var(--project-width); } +fieldset.inner fieldset.plug.can._plugin.search>form.option>div.item.filter input { width:var(--project-width); } fieldset.inner.cmd>div.output>div.layout>div.plug>legend:hover { box-shadow:var(--notice-box-shadow); color:unset; } fieldset.inner.cmd>div.output>div.layout>div.plug>legend>span.remove { padding:0 var(--input-padding); height:30px; } fieldset.inner.cmd>div.output>div.layout>div.plug>legend>span.remove:hover { background-color:var(--hover-bg-color); } @@ -90,7 +95,7 @@ div.vimer.open.float td:first-child { display:none; } div.vimer.open.float td:nth-child(2) { display:none; } div.vimer.plug.float div.item.text input { width:var(--river-width); } div.layout.flex>input.current { clear:both; } -tr.line>td.line { -webkit-user-select:none; border-right:var(--box-border); } +tr.line>td.line { -webkit-user-select:none; border-right:var(--box-border); cursor:pointer; } tr.line>td.line { text-align:right; line-height:var(--code-line-height); padding:0 var(--button-padding); position:sticky; left:0; } tr.line>td.text { white-space:pre; line-height:var(--code-line-height); padding-left:var(--input-padding); width:100%; } tr.line:hover { background-color:var(--hover-bg-color); } diff --git a/plugin/local/code/inner.js b/plugin/local/code/inner.js index faa0a089..165a7d74 100644 --- a/plugin/local/code/inner.js +++ b/plugin/local/code/inner.js @@ -185,14 +185,11 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, cb) { var paths = can.core.Sp history: function(can, record) { can.base.Eq(record, can.db.history[can.db.history.length-1], mdb.TEXT) || can.db.history.push(record) return can.Status(ice.BACK, can.db.history.length), record }, - project: function(can, path) { - if (can.Conf("style") == "output") { - can.onmotion.hidden(can, can.ui.project) - return - } + project: function(can, path) { if (can.Conf(ctx.STYLE) == html.OUTPUT) { return can.onmotion.hidden(can, can.ui.project) } can.onmotion.clear(can, can.ui.project), can.onimport.zone(can, can.core.Item(can.onfigure, function(name, cb) { - if (can.base.isFunc(cb)) { return {name: name, icon: cb.meta? cb.meta.icon: "", _trans: can.onfigure._trans? can.onfigure._trans[name]||"": "", _toggle: function() { can.onimport.layout(can) }, _init: function(target, zone) { return cb(can, target, zone, path) }} } - }), can.ui.project) }, + if (can.base.isFunc(cb)) { return {name: name, icon: cb.meta? cb.meta.icon: "", _trans: can.onfigure._trans? can.onfigure._trans[name]||"": "", _toggle: function() { can.onimport.layout(can) }, _init: function(target, zone) { return cb(can, target, zone, path) }} } + }), can.ui.project) + }, profile: function(can, msg) { var _msg = can.db.tabview[can.onexport.keys(can)]; _msg.Option(html.WIDTH, msg.Option(html.WIDTH)), border = 1 var height = (can.ui.content._root||can.ui.content).offsetHeight, width = can.onexport.size(can, _msg.Option(html.WIDTH)||0.5, can.ConfWidth()-can.ui.project.offsetWidth)+border if (msg.Result().indexOf("