From 74534e976c8808803efd798a3994a74357d4bfb2 Mon Sep 17 00:00:00 2001 From: lxsang Date: Thu, 14 May 2020 23:08:57 +0200 Subject: [PATCH] functional command palette --- Makefile | 2 +- src/core/api.coffee | 3 + src/core/tags/ListViewTag.coffee | 8 ++ src/core/vfs.coffee | 2 +- src/packages/CodePad/assets/scheme.html | 5 +- .../CodePad/coffees/CommandPalette.coffee | 43 +++++++- src/packages/CodePad/coffees/main.coffee | 102 ++++++++++++++++-- src/packages/CodePad/css/main.css | 21 ++++ src/themes/antos/afx-list-view.css | 4 +- src/themes/antos/afx-sys-panel.css | 4 +- 10 files changed, 179 insertions(+), 15 deletions(-) diff --git a/Makefile b/Makefile index 4986d04..92cacc9 100644 --- a/Makefile +++ b/Makefile @@ -52,7 +52,7 @@ coffees= src/core/core.coffee \ -packages = CoreServices ActivityMonitor Files Setting ShowCase MarkOn# Files MarketPlace Preview NotePad wTerm +packages = CoreServices ActivityMonitor Files Setting ShowCase MarkOn CodePad# Files MarketPlace Preview NotePad wTerm main: initd build_coffees build_themes libs build_packages languages - cp src/index.html $(BUILDDIR)/ diff --git a/src/core/api.coffee b/src/core/api.coffee index d029102..52c4f03 100644 --- a/src/core/api.coffee +++ b/src/core/api.coffee @@ -29,6 +29,9 @@ class FormatedString hash: () -> @__().hash() + match: (t) -> + @__().match t + asBase64: () -> @__().asBase64() diff --git a/src/core/tags/ListViewTag.coffee b/src/core/tags/ListViewTag.coffee index 755d78e..2d2126f 100644 --- a/src/core/tags/ListViewTag.coffee +++ b/src/core/tags/ListViewTag.coffee @@ -200,6 +200,14 @@ class ListViewTag extends Ant.OS.GUI.BaseTag @set "selectedItem", e.item @set "selectedItems", [e.item] e.items = [e.item] + #scroll element + li = $(e.item).children()[0] + offset = $(@refs.container).offset() + top = $(@refs.container).scrollTop() + if ($(li).offset().top + $(li).height() > $(@refs.container).height() + offset.top) + $(@refs.container).scrollTop(top + $(@refs.container).height() - $(li).height()) + else if ($(li).offset().top < offset.top) + $(@refs.container).scrollTop(top - $(@refs.container).height() + $(li).height()) if @get "dropdown" @refs.drlabel.set "*", e.item.get "data" diff --git a/src/core/vfs.coffee b/src/core/vfs.coffee index 693f65f..502c1dd 100644 --- a/src/core/vfs.coffee +++ b/src/core/vfs.coffee @@ -106,7 +106,7 @@ class BaseFileHandle me.info = d.result me.ready = true resolve(d.result) - .catch (e) -> resolve e + .catch (e) -> reject e read: (t) -> me = @ diff --git a/src/packages/CodePad/assets/scheme.html b/src/packages/CodePad/assets/scheme.html index 44e2978..34ecef8 100644 --- a/src/packages/CodePad/assets/scheme.html +++ b/src/packages/CodePad/assets/scheme.html @@ -4,7 +4,10 @@ -
+ + +
+ diff --git a/src/packages/CodePad/coffees/CommandPalette.coffee b/src/packages/CodePad/coffees/CommandPalette.coffee index 5cd2ba9..a7e2160 100644 --- a/src/packages/CodePad/coffees/CommandPalette.coffee +++ b/src/packages/CodePad/coffees/CommandPalette.coffee @@ -7,16 +7,55 @@ class CommandPalette extends this.OS.GUI.BasicDialog offset = $(".afx-window-content", @parent.scheme).offset() pw = @parent.scheme.get("width") / 5 @scheme.set "width", 3 * pw - $(@scheme).offset { top: offset.top, left: offset.left + pw } + $(@scheme).offset { top: offset.top - 2, left: offset.left + pw } cb = (e) -> if ($ e.target).closest(me.scheme).length > 0 $(me.find "searchbox").focus() else $(document).unbind "mousedown", cb me.quit() - $(document).on "mousedown", cb $(me.find "searchbox").focus() + @cmdlist = @find("container") + @cmdlist.set "data", @data if @data + $(@cmdlist).click (e) -> + me.selectCommand() + + @searchbox = @find "searchbox" + ($ @searchbox).keyup (e) -> + me.search e + + search: (e) -> + switch e.which + when 37 + e.preventDefault() + when 38 + @cmdlist.selectPrev() + e.preventDefault() + when 39 + e.preventDefault() + when 40 + @cmdlist.selectNext() + e.preventDefault() + when 13 + e.preventDefault() + @selectCommand() + else + text = @searchbox.value + @cmdlist.set "data", @data if text.length is 2 + return if text.length < 3 + result = [] + term = new RegExp text, 'i' + result.push v for v in @data when v.text.match term + @cmdlist.set "data", result + + + selectCommand: () -> + el = @cmdlist.get "selectedItem" + return unless el + @quit() + @handle { data: { item: el } } if @handle + CommandPalette.scheme = """ + @child = [] + @select = (e) -> + + addAction: (v) -> + @child.push v + @ + + addActions: (list) -> + @addAction v for v in list + + onchildselect: (f) -> + @select = f + @ + + run: (root) -> + me = @ + root.openDialog(new CommandPalette(), @child) + .then (d) -> + data = d.data.item.get("data") + return data.run root if data.run + me.select d, root + +CMDMenu.fromMenu = (mn) -> + m = new CMDMenu mn.text, mn.shortcut + m.onchildselect mn.onchildselect + for v in mn.child + if v.child + m.addAction CMDMenu.fromMenu v + else + m.addAction v + m + class CodePad extends this.OS.GUI.BaseApplication constructor: (args) -> super "CodePad", args @@ -30,26 +64,80 @@ class CodePad extends this.OS.GUI.BaseApplication fontSize: "9pt" } #themes = ace.require "ace/ext/themelist" - #console.log themes.themesByName.monokai.theme @editor.setTheme "ace/theme/monokai" - #console.log themes @editor.completers.push { getCompletions: ( editor, session, pos, prefix, callback ) -> } @editor.getSession().setUseWrapMode true @on "resize", () -> me.editor.resize() @on "focus", () -> me.editor.focus() + @spotlight = new CMDMenu __("Command palette") + @bindKey "ALT-P", () -> me.spotlight.run me @find("datarea").contextmenuHandle = (e, m) -> m.set "items", [{ text: __("Command palete"), onmenuselect: (e) -> - me.showCmdPalette() + me.spotlight.run me }] m.show e + @initCommandPalete() @editor.resize() - showCmdPalette: () -> - @openDialog(new CommandPalette(), { - - }).then (d) -> + addAction: (action) -> + @spotlight.addAction action + @ + + addActions: (list) -> + @spotlight.addActions list + @ + + initCommandPalete: () -> + themes = ace.require "ace/ext/themelist" + cmdtheme = new CMDMenu __("Change theme") + cmdtheme.addAction { text: v.caption, theme: v.theme } for k, v of themes.themesByName + cmdtheme.onchildselect (d, r) -> + data = d.data.item.get("data") + r.editor.setTheme data.theme + r.editor.focus() + @spotlight.addAction cmdtheme + + modes = ace.require "ace/ext/modelist" + cmdmode = new CMDMenu __("Change language mode") + cmdmode.addAction { text: v.name, mode: v.mode } for v in modes.modes + cmdmode.onchildselect (d, r) -> + data = d.data.item.get("data") + r.editor.session.setMode data.mode + r.editor.focus() + @spotlight.addAction cmdmode + @addAction CMDMenu.fromMenu @fileMenu() + + fileMenu: () -> + me = @ + { + text: __("File"), + child: [ + { text: __("New"), dataid: "new", shortcut: "A-N" }, + { text: __("Open"), dataid: "open", shortcut: "A-O" }, + { text: __("Save"), dataid: "save", shortcut: "C-S" }, + { text: __("Save as"), dataid: "saveas", shortcut: "A-W" } + ], + onchildselect: (e, r) -> + console.log e.data.item.get "data" + } + + + menu: () -> + me = @ + menu = [ + @fileMenu() + { + text: "__(View)", + child: [ + { text: "__(Command Palette)", dataid: "cmdpalette", shortcut: "A-P" } + ], + onchildselect: (e, r) -> + me.spotlight.run me + } + ] + menu CodePad.dependencies = [ "ace/ace", diff --git a/src/packages/CodePad/css/main.css b/src/packages/CodePad/css/main.css index aa9d0a6..bd01cbd 100644 --- a/src/packages/CodePad/css/main.css +++ b/src/packages/CodePad/css/main.css @@ -1,6 +1,9 @@ afx-app-window[data-id = "notepad"] .afx-window-wrapper afx-file-view{ background-color:#272822; } +afx-app-window[data-id = "notepad"] div.afx-window-content { + background-color:#2d2d2d; +} afx-app-window[data-id = "notepad"] afx-resizer { background-color:#272822; border-right: 1px solid #37373d; @@ -36,7 +39,24 @@ afx-app-window[data-id = "cmd-win"] .afx-window-wrapper{ background-color: transparent; box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.65); } +afx-app-window[data-id = "cmd-win"] .afx-window-wrapper afx-list-view ul afx-list-item:nth-child(even) li +{ + background-color: transparent; +} +afx-app-window[data-id = "cmd-win"] .afx-window-wrapper afx-list-view afx-list-item li{ + background-color: transparent; + color:#afafaf; +} +afx-app-window[data-id = "cmd-win"] .afx-window-wrapper div.list-container > ul li:hover{ + background-color: #37373d; +} +afx-app-window[data-id = "cmd-win"] .afx-window-wrapper afx-list-view ul afx-list-item:nth-child(even) li.selected, +afx-app-window[data-id = "cmd-win"] .afx-window-wrappe dafx-list-viewafx-list-view ul li.selected +{ + background-color: #116cd6; + color:white; +} afx-app-window[data-id = "cmd-win"] .afx-window-top{ height: 0; border:0; @@ -47,6 +67,7 @@ afx-app-window[data-id = "cmd-win"] input{ font-size: 12px; color:#afafaf; background-color:#272822; + padding-left: 5px; margin: 3px; } diff --git a/src/themes/antos/afx-list-view.css b/src/themes/antos/afx-list-view.css index 17ef4ab..1f3e905 100644 --- a/src/themes/antos/afx-list-view.css +++ b/src/themes/antos/afx-list-view.css @@ -34,7 +34,7 @@ afx-list-view.dropdown > div.list-container > ul{ box-shadow: 1px 1px 1px #9f9F9F; border-radius: 3px; max-height: 150px; - background-color: white; + background-color: transparent; border-top-left-radius: 0px; z-index: 10; } @@ -45,7 +45,7 @@ afx-list-view.dropdown div.list-container div{ padding-bottom: 3px; border:1px solid #a6a6a6; border-radius: 3px; - background-color: white; + background-color: transparent; height: 17px; } afx-list-view.dropdown div.list-container div > afx-label{ diff --git a/src/themes/antos/afx-sys-panel.css b/src/themes/antos/afx-sys-panel.css index 34a8a6b..a93a298 100644 --- a/src/themes/antos/afx-sys-panel.css +++ b/src/themes/antos/afx-sys-panel.css @@ -68,7 +68,9 @@ afx-sys-panel afx-hbox[data-id="btlist"] afx-button button border-left: 1px solid #afafaf; } -afx-sys-panel afx-list-view[data-id="applist"] > div.list-container > ul li:hover, +afx-sys-panel afx-list-view[data-id="applist"] > div.list-container > ul li:hover{ + background-color: #cecece; +} afx-sys-panel afx-list-view[data-id="applist"] > div.list-container > ul li.selected { background-color: #116cd6;