From fda39d8e6d0f7ad74b19fcee42f5b58f1ac9c020 Mon Sep 17 00:00:00 2001 From: shy Date: Sat, 27 Apr 2024 09:20:46 +0800 Subject: [PATCH] add some --- frame.js | 5 ++-- index.css | 26 ++++++++++++++++----- panel/header.js | 3 ++- plugin/input/color.js | 54 +++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 78 insertions(+), 10 deletions(-) create mode 100644 plugin/input/color.js diff --git a/frame.js b/frame.js index 71e0cb75..cc3e672e 100644 --- a/frame.js +++ b/frame.js @@ -557,8 +557,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { } return {className: option.indexOf(key) > -1? ice.MSG_OPTION: key == ctx.ACTION? ctx.ACTION: "", text: [ msg.IsDetail() && key == mdb.KEY? can.user.trans(can, _value, null, html.INPUT): _value, html.TD, - ], onclick: function(event) { var target = event.target - if (onclick()) { return } + ], onclick: function(event) { if (onclick()) { return } var target = event.target if (key == cli.QRCODE && can.page.tagis(event.target, html.IMG)) { can.user.opens(event.target.title) } if (can.page.tagis(target, html.INPUT) && target.type == html.BUTTON) { can.requestAction(request(event), target.name) meta && meta[target.name]? can.user.input(event, can, meta[target.name], function(args) { run(event, target.name, args) }, data): run(event, target.name) @@ -613,7 +612,7 @@ Volcanos(chat.ONAPPEND, {_init: function(can, meta, list, cb, target, field) { }) } else { can.page.Select(can, code, html.INPUT_BUTTON, function(target) { target.onclick = function(event) { if (can.page.ClassList.has(can, target, "disable")) { return } can.page.ClassList.add(can, target, "disable") - can.misc.Event(event, can, function(msg) { can.Update(can.request(event, can.Option()), [ctx.ACTION, target.name], function(msg) { + can.misc.Event(event, can, function(msg) { can.Update(can.request(event, can.Option(), {_toast: target.name}), [ctx.ACTION, target.name], function(msg) { can.page.ClassList.del(can, target, "disable") can.page.ClassList.del(can, can._fields, "form") can.page.ClassList.del(can, can._fields, "output") diff --git a/index.css b/index.css index 12350144..106e585b 100644 --- a/index.css +++ b/index.css @@ -1,9 +1,19 @@ /* variable */ @media (prefers-color-scheme: light) { body { --plugin-bg-color:white; --plugin-fg-color:black; } +body { + --code-keyword:darkblue; --code-comment:green; + --code-function:darkcyan; --code-constant:gray; --code-string:brown; + --code-package:blue; --code-datatype:cornflowerblue; --code-object:purple; +} } @media (prefers-color-scheme: dark) { body { --plugin-bg-color:black; --plugin-fg-color:silver; } +body { + --code-keyword:royalblue; --code-comment:green; + --code-function:lightgreen; --code-constant:gray; --code-string:orange; + --code-package:lightskyblue; --code-datatype:lavender; --code-object:silver; +} } body.light { --plugin-bg-color:white; --plugin-fg-color:black; @@ -18,9 +28,12 @@ body.dark { --code-package:lightskyblue; --code-datatype:lavender; --code-object:silver; } body { + --shadow-color:var(--disable-fg-color); --border-color:var(--disable-fg-color); + --notice-color:blue; --danger-color:red; + --code-bg-color:black; --code-fg-color:silver; - --notice-bg-color:blue; --notice-fg-color:white; - --danger-bg-color:red; --danger-fg-color:var(--notice-fg-color); + --notice-bg-color:var(--notice-color); --notice-fg-color:white; + --danger-bg-color:var(--danger-color); --danger-fg-color:var(--notice-fg-color); --disable-fg-color:gray; --progress-bg-color:var(--danger-bg-color); --hover-bg-color:#5066b961; --hover-fg-color:var(--notice-fg-color); --body-font-family:sans-serif; --code-font-family:monospace; @@ -30,7 +43,7 @@ body { body { --body-bg-color:var(--panel-bg-color); --body-fg-color:var(--plugin-fg-color); --legend-bg-color:var(--plugin-bg-color); --legend-fg-color:var(--plugin-fg-color); - --input-bg-color:var(--output-bg-color); --input-fg-color: var(--output-fg-color); + --input-bg-color:var(--plugin-bg-color); --input-fg-color: var(--output-fg-color); --output-bg-color:var(--plugin-bg-color); --output-fg-color:var(--plugin-fg-color); --th-bg-color:var(--legend-bg-color); --th-fg-color:var(--legend-fg-color); --tr-hover-bg-color:var(--hover-bg-color); --td-hover-bg-color:var(--hover-bg-color); @@ -42,11 +55,11 @@ body { --panel-hover-bg-color:var(--hover-bg-color); --panel-hover-fg-color:var(--hover-fg-color); --action-output-bg-color:var(--output-bg-color); - --box-shadow:var(--body-fg-color) 0px 0px 10px; --notice-box-shadow:var(--notice-bg-color) 0px 0px 10px; + --box-shadow:var(--shadow-color) 0px 0px 10px; --notice-box-shadow:var(--notice-bg-color) 0px 0px 10px; --plugin-box-shadow:var(--box-shadow); --legend-box-shadow:var(--box-shadow); --input-box-shadow:var(--box-shadow); --th-box-shadow:var(--box-shadow); --keyword-box-shadow:var(--box-shadow); - --box-border:var(--disable-fg-color) solid 1px; --box-notice:var(--notice-bg-color) solid 1px; --box-danger:var(--danger-bg-color) solid 1px; - --box-border3:var(--disable-fg-color) solid 3px; --box-notice3:var(--notice-bg-color) solid 3px; --box-danger3:var(--danger-bg-color) solid 3px; + --box-border:var(--border-color) solid 1px; --box-notice:var(--notice-bg-color) solid 1px; --box-danger:var(--danger-bg-color) solid 1px; + --box-border3:var(--border-color) solid 3px; --box-notice3:var(--notice-bg-color) solid 3px; --box-danger3:var(--danger-bg-color) solid 3px; --plugin-border:var(--box-border); --input-border:var(--box-border); --status-border:var(--box-border); --plugin-radius:var(--plugin-padding); --button-radius:var(--input-padding); @@ -794,6 +807,7 @@ fieldset.xterm.float>form.option>div.item.hash input { width:var(--form-width); fieldset.iframe.float>form.option>div.item.hash input { width:var(--form-width); } fieldset.iframe>form.option>div.item.hash input { width:var(--form-width); } fieldset.inner.float>div.status { display:none; } +fieldset.web.chat.color table.content { border-collapse:collapse; } fieldset.user>form.option>div.item.username input { width:var(--form-width); } fieldset.offer>div.output>table.content tr.invite { background-color:var(--notice-bg-color); color:var(--notice-fg-color); } fieldset.apply>div.output>table.content.detail.apply tr.action td.action { background-color:var(--notice-bg-color); color:var(--notice-fg-color); } diff --git a/panel/header.js b/panel/header.js index 4de76eae..21ed6d92 100644 --- a/panel/header.js +++ b/panel/header.js @@ -50,6 +50,7 @@ Volcanos(chat.ONIMPORT, {_init: function(can, msg, target) { can.user.info.background = background, can.onimport._background(can, msg), can.user.toastSuccess(can) }) }, theme: function(can, theme) { theme && theme != ice.AUTO && can.runAction({}, chat.THEME, [theme]) + theme && can.require(["/chat/theme/"+theme+".css"]) theme && can.misc.localStorage(can, "can.theme", can._theme = theme == ice.AUTO? "": theme) && can.onengine.signal(can, chat.ONTHEMECHANGE, can.request(event, {theme: theme})) theme = can.onexport.theme(can); var list = [html.LIGHT, html.WHITE] var change = can.page.ClassList.has(can, document.body, theme); can.user.theme(can, theme), change || can.onimport._const(can) @@ -97,7 +98,7 @@ Volcanos(chat.ONACTION, {_init: function(can) {}, // can.page.requireModules(can, [msg.Option("icon.lib")]) can.ui.diy = can.base.Obj(msg.Option("diy"))||{}, can.__theme = can.onimport._theme(can, can.page.theme(function(theme) { can.onengine.signal(can, chat.ONTHEMECHANGE, can.request(event, {theme: can.__theme = can.onimport._theme(can, theme)})) - })), can.onimport.theme(can) + })), can.onimport.theme(can, can.misc.Search(can, "theme")||"") can.onaction._menus[3] = [aaa.LANGUAGE, ice.AUTO].concat(can.core.List(msg["language.list"], function(item) { return can.base.trimSuffix(item, nfs._JS) })) can.onaction._menus[2] = [chat.THEME, ice.AUTO].concat(can.core.List(msg["theme.list"], function(item) { return can.base.trimSuffix(item, nfs._CSS) })) can.require(can.core.List(msg["theme.list"], function(item) { return nfs.SRC_TEMPLATE+web.CHAT_HEADER+"/theme/"+item }), function() { diff --git a/plugin/input/color.js b/plugin/input/color.js new file mode 100644 index 00000000..460d5770 --- /dev/null +++ b/plugin/input/color.js @@ -0,0 +1,54 @@ +Volcanos(chat.ONFIGURE, {color: { + _load: function(event, can, cb, target, name, value) { + if (target._done && target.value) { return can.onmotion.hidden(can, can._target, can.Status("total") > 0)} target._done = true + can.onmotion.focus(can, target), can.onmotion.hidden(can, can._target) + can.runAction(event, mdb.INPUTS, [name, value||""], function(msg) { + name == ctx.INDEX && can.core.Item(can.onengine.plugin.meta, function(key) { msg.Push(ctx.INDEX, can.core.Keys(ice.CAN, key)) }) + can._show(can, msg, cb, target, name) + }) + }, + _show: function(can, msg, cb, target, name) { + if (msg.Length() == 0 || msg.Length() == 1 && msg.Append(name) == target.value && target.value != "") { return can.onmotion.hidden(can) } + if (can.base.isIn(msg.append[msg.append.length-1], ctx.ACTION, "cb")) { msg.append = msg.append.slice(0, -1) } var list = {} + msg.Option(ice.TABLE_CHECKBOX, "") + can.onmotion.clear(can), can.onappend.table(can, msg, function(value, key, index, item) { value = item[key] + if (msg.append.length == 1 && index < 100 && list[value]) { return } list[value] = true + return {text: [value, html.TD, value == ""? html.HR: ""], style: msg.append && msg.append.length == 1? kit.Dict(html.MIN_WIDTH, target.offsetWidth-16): {}, onclick: function(event) { + can.page.style(can, target, html.BACKGROUND_COLOR, value) + can.close(); if (msg.cb && msg.cb[index]) { return msg.cb[index](value) } + var _cb = can.Conf("select"); if (_cb) { return _cb(target.value = value) } can.base.isFunc(cb) && cb(can, value, target.value) + }, _init: function(target) { + if (key == mdb.NAME) { + can.page.style(can, target.parentNode, html.BACKGROUND_COLOR, value) + } + }} + }) + can.showIcons = function(value, icons, title) { can.ui = can.ui||{} + if (!can.ui.img) { + can.ui.img = can.page.insertBefore(can, [{type: html.IMG}], target) + can.ui.span = can.page.insertBefore(can, [{type: html.SPAN}], target) + can.onappend.style(can, mdb.ICONS, can.page.parentNode(can, target, html.TR)) + can.page.style(can, target, html.COLOR, html.TRANSPARENT) + target._clear = function() { can.ui.img.src = can.misc.Resource(can, "usr/icons/icebergs.png"), can.ui.span.innerHTML = "" } + } + can.ui.img.src = can.misc.Resource(can, icons), can.ui.span.innerText = title||value + target.value = value, can.onmotion.hidden(can, can._target) + } + can.core.CallFunc([can.oninputs, "_show"], {event: event, can: can, msg: msg, target: target, name: name}) + var style = msg.Option(ice.MSG_DISPLAY)? can.base.ParseURL(msg.Option(ice.MSG_DISPLAY)).style||name: name + can.core.CallFunc([can.sup.sub, "oninputs", style], {event: event, can: can, msg: msg, target: target, name: name}) + can.layout(msg) + }, + onfocus: function(event, can, meta, target, cbs, mod) { meta._force && mod.onclick(event, can, meta, target, cbs) }, + onclick: function(event, can, meta, target, cbs) { (target.value == "" || meta._force) && cbs(function(sub, cb) { if (sub.Status(mdb.TOTAL) > 0) { return } + sub.sup = can._fields? can.sup: can + meta.msg && meta.msg.Length() > 0? sub._show(sub, meta.msg, cb, target, meta.name): sub._load(event, sub, cb, target, meta.name, target.value) + }) }, + onblur: function(event, can, sub, cb) { sub && can.onmotion.delay(can, sub.close, 300) }, + onkeyup: function(event, can, meta, cb, target, sub, last) { if (event.key == code.TAB) { return } + if (event.key == code.ENTER) { return meta._enter && (!can.page.tagis(event.target, html.TEXTAREA) || event.ctrlKey) && meta._enter(event, target.value)? sub && sub.close(): last(event) } + if (!sub) { return } can.onmotion.toggle(can, sub._target, true) + sub.hidden() || can.onkeymap.selectCtrlN(event, can, sub._output, "tr:not(.hidden)>td:first-child", function(td) { return meta.select && (sub.close(), meta.select(target.value = td.innerText)), cb(sub, td.innerText, target.value), td }) + || can.onmotion.delayOnce(can, function() { can.onkeymap.selectInputs(event, sub, function() { sub._load(event, sub, cb, target, meta.name) }, target) }, target.value.length < 3? 500: 150) + }, +}})