From 0de9f88dcf4b80ef5c322b3cbb1ed34fa13ddd59 Mon Sep 17 00:00:00 2001 From: lxsang Date: Fri, 28 Feb 2020 18:35:20 +0100 Subject: [PATCH] add more tagesr --- Makefile | 2 + src/core/gui.coffee | 5 +- src/core/tags/ButtonTag.coffee | 48 +++++- src/core/tags/LabelTag.coffee | 13 +- src/core/tags/ListViewTag.coffee | 194 ++++++++++++++++++++++ src/core/tags/ResizerTag.coffee | 2 +- src/core/tags/TileLayoutTags.coffee | 4 +- src/core/tags/WindowTag.coffee | 6 +- src/core/tags/afx-label.tag | 2 +- src/core/tags/tag.coffee | 30 ++-- src/packages/ShowCase/coffees/main.coffee | 24 ++- src/themes/antos/afx-list-view.css | 14 +- 12 files changed, 303 insertions(+), 41 deletions(-) create mode 100644 src/core/tags/ListViewTag.coffee diff --git a/Makefile b/Makefile index 9ace32d..42dd07f 100644 --- a/Makefile +++ b/Makefile @@ -30,6 +30,8 @@ coffees= src/core/core.coffee \ src/core/tags/TileLayoutTags.coffee \ src/core/tags/ResizerTag.coffee \ src/core/tags/LabelTag.coffee \ + src/core/tags/ButtonTag.coffee \ + src/core/tags/ListViewTag.coffee \ src/antos.coffee diff --git a/src/core/gui.coffee b/src/core/gui.coffee index b887329..ab9e5cb 100644 --- a/src/core/gui.coffee +++ b/src/core/gui.coffee @@ -20,6 +20,7 @@ Ant.OS.GUI = subwindows: new Object() dialog: undefined fullscreen: false + workspace: "#desktop" shortcut: ALT: {} CTRL: {} @@ -331,7 +332,7 @@ Ant.OS.GUI = Ant.OS.GUI.showTooltip el, ($(el).attr "tooltip"), e # desktop default file manager - desktop = $ "#desktop" + desktop = $ Ant.OS.GUI.workspace fp = Ant.OS.setting.desktop.path.asFileHandle() desktop[0].fetch = () -> fn = () -> @@ -413,7 +414,7 @@ Ant.OS.GUI = alert __("System fail: Cannot init desktop manager") console.log s, e refreshDesktop: () -> - ($ "#desktop")[0].fetch() + ($ Ant.OS.GUI.workspace)[0].fetch() refreshSystemMenu: () -> Ant.OS.GUI.SYS_MENU[0].child.length = 1 diff --git a/src/core/tags/ButtonTag.coffee b/src/core/tags/ButtonTag.coffee index 8b4c985..ca7266b 100644 --- a/src/core/tags/ButtonTag.coffee +++ b/src/core/tags/ButtonTag.coffee @@ -6,13 +6,55 @@ class ButtonTag extends Ant.OS.GUI.BaseTag @setopt "iconclass", undefined @setopt "text", "" @setopt "enable", true - + @setopt "selected", false + @setopt "toggle", false + @setopt "onbtclick", () -> + + + on_color_changed: (v) -> + console.log @refs + @refs.label.set "color", v + + on_icon_changed: (v) -> + @refs.label.set "icon", v + + on_iconclass_changed: (v) -> + @refs.label.set "iconclass", v + + on_text_changed: (v) -> + @refs.label.set "text", v + + on_enable_changed: (v) -> + $(@refs.button).prop "disabled", !(@get "enable") + + on_selected_changed: (v) -> + $(@button).removeClass() + $(@button).addClass "selected" if v + + mount: () -> + me = @ + @root.trigger = () -> + ($me.refs.button).trigger "click" + + $(@refs.button).click (e) -> + me.btclickhd e + + btclickhd: (e) -> + hd = @get "onbtclick" + if typeof hd is "string" + eval hd + else if hd + hd e + @observable.trigger "btclick", { id: @aid(), data: @root } + if @toggle + @set "selected", !@get "selected" + layout: () -> - { + [{ el: "Button", ref: "button", children: [ { el: "afx-label", ref: "label" } ] - } + }] Ant.OS.GUI.define "afx-button", ButtonTag \ No newline at end of file diff --git a/src/core/tags/LabelTag.coffee b/src/core/tags/LabelTag.coffee index 0245a9a..5bbc065 100644 --- a/src/core/tags/LabelTag.coffee +++ b/src/core/tags/LabelTag.coffee @@ -4,8 +4,12 @@ class LabelTag extends Ant.OS.GUI.BaseTag @setopt "color", undefined @setopt "icon", undefined @setopt "iconclass", undefined + @refs.text = document.createTextNode "" + $(@refs.container).append @refs.text @setopt "text", "" + mount: () -> + on_color_changed: (v) -> return unless v $(@refs.container).css "color", v @@ -32,16 +36,15 @@ class LabelTag extends Ant.OS.GUI.BaseTag on_text_changed: (v) -> - $(@refs.text).text v.__() if v + @refs.text.nodeValue = v.__() if v layout: () -> - { + [{ el: "span", ref: "container", children: [ { el: "i", ref: "iclass" }, - { el: "i", ref: "i", class: "icon-style" }, - { el: "i", ref: "text" } + { el: "i", ref: "i", class: "icon-style" } ] - } + }] Ant.OS.GUI.define "afx-label", LabelTag \ No newline at end of file diff --git a/src/core/tags/ListViewTag.coffee b/src/core/tags/ListViewTag.coffee new file mode 100644 index 0000000..cf8469d --- /dev/null +++ b/src/core/tags/ListViewTag.coffee @@ -0,0 +1,194 @@ +class ListViewItemTag extends Ant.OS.GUI.BaseTag + constructor: (r, o) -> + super r, o + me = @ + @setopt "data", {} + @setopt "oncontextmenu", (e) -> + @setopt "onclick", (e) -> + @setopt "onselect", (e) -> + @setopt "ondbclick", (e) -> + @setopt "onclose", (e) -> + @setopt "index", 0 + @setopt "closable", false + @setopt "selected", false + +class ListItemSimpleTag extends ListViewItemTag + constructor: (r, o) -> + super r, o + mount: () -> + me = @ + @refs.item.oncontextmenu = (e) -> + me.get("oncontextmenu")(e) + + $(@refs.item).click (e) -> + e.item = me.root + me.get("onclick")(e) + + $(@refs.item).dblclick (e) -> + e.item = me.root + me.get("ondbclick")(e) + $(@refs.btcl).click (e) -> + e.item = me.root + me.get("onclose")(e) + + on_closable_changed: (v) -> + if v then $(@refs.btcl).show() else $(@refs.btcl).hide() + + on_selected_changed: (v) -> + $(@refs.item).removeClass() + return unless v + $(@refs.item).addClass "selected" + @get("onselect")({ item: @root }) + + on_data_changed: (v) -> + return unless v + @refs.label.set "class", v.class if v.class + @refs.label.set "color", v.color if v.color + @refs.label.set "iconclass", v.iconclass if v.iconclass + @refs.label.set "icon", v.icon if v.icon + @refs.label.set "text", v.text if v.text + @set "selected", v.selected if v.selected + @set "closable", v.closable if v.closable + + layout: () -> + [{ + el: "li", ref: "item", children: [ + { el: "afx-label", ref: "label" }, + { el: "i", class: "closable", ref: "btcl" } + ] + }] + + +class ListViewTag extends Ant.OS.GUI.BaseTag + constructor: (r, o) -> + super r, o + @setopt "onlistselect", () -> + @setopt "onlistdbclick", () -> + @setopt "onitemclose", () -> + @setopt "buttons", [] + @setopt "data", {} + @setopt "dropdown", false + @setopt "itemtag", "afx-list-item" + @setopt "multiselect", false + @setopt "selectedItem", undefined + @setopt "selectedIndex", -1 + @items = [] + $(@root) + .css "display", "flex" + .css "flex-direction", "column" + + on_buttons_changed: (v) -> + return if @get "dropdown" + + on_data_changed: (data) -> + $( @refs.mlist).empty() + for item in data + el = $("<#{@get "itemtag"}>").appendTo @refs.mlist + el[0].uify @observable + console.log el + me = @ + el[0] + .set "data", item + .set "oncontextmenu", (e) -> + me.icontextmenu e + .set "ondbclick", (e) -> + me.idbclick e + .set "onclick", (e) -> + return if not e.item or e.item is me.selectedItem + e.item.set "selected", true + .set "onselect", (e) -> + me.iselect e + .set "onclose", (e) -> + me.iclose e + + icontextmenu: (e) -> + console.log "context menu", e + idbclick: (e) -> + console.log "db click", e + iselect: (e) -> + return unless e.item + @selectedItem.set "selected", false if @selectedItem + @selectedItem = e.item + @get("onlistselect")(e) + + iclose: (e) -> + console.log "close", e + + on_dropdown_changed: (v) -> + $(@refs.container).removeAttr "style" + $(@refs.mlist).removeAttr "style" + $(@refs.container).css "flex", 1 + $(@root).removeClass() + me = @ + drop = (e) -> + me.dropoff e + show = (e) -> + me.showlist e + calib = (e) -> + me.calibrate e + if v + $(@root).addClass "dropdown" + $(@refs.current).show() + @observable.on "calibrate", calib + @observable.on "resize", calib + $(document).on "click", drop + $(@refs.current).on "click", show + $(@refs.container) + .css "position", "absolute" + .css "display", "inline-block" + $(@refs.mlist) + .css "position", "absolute" + .css "display", "none" + .css "top", "100%" + .css "left", "0" + @calibrate() + else + $(@refs.current).hide() + @observable.off "calibrate", calib + @observable.off "resize", calib + $(document).off "click", drop + $(@refs.current).off "click", show + + showlist: (e) -> + return unless @get "dropdown" + desktoph = $(Ant.OS.GUI.workspace).height() + offset = $(@root).offset().top + $(@refs.mlist).height() + if offset > desktoph + $(@refs.mlist) + .css "top", "-#{$(@refs.mlist).outerHeight()}px" + else + $(@mlist).css "top", "100%" + $(@refs.mlist).show() + + dropoff: (e) -> + $(@refs.mlist).hide() if $(e.target).closest(@refs.container).length is 0 + + + calibrate: (e) -> + return unless @get "dropdown" + w = "#{$(@root).width()}px" + $(@refs.container).css "width", w + $(@refs.current).css "width", w + $(@refs.mlist).css "width", w + + + layout: () -> + [ + { + el: "div", + class: "list-container", + ref: "container", + children: [ + { + el: "div", ref: "current", children: [ + { el: "afx-label", ref: "drlabel" } + ] + }, + { el: "ul", ref: "mlist" } + ] + }, + { el: "div", class: "button_container", ref: "btlist" } + ] + +Ant.OS.GUI.define "afx-list-view", ListViewTag +Ant.OS.GUI.define "afx-list-item", ListItemSimpleTag \ No newline at end of file diff --git a/src/core/tags/ResizerTag.coffee b/src/core/tags/ResizerTag.coffee index 1674af5..03af6fd 100644 --- a/src/core/tags/ResizerTag.coffee +++ b/src/core/tags/ResizerTag.coffee @@ -62,6 +62,6 @@ class ResizerTag extends Ant.OS.GUI.BaseTag @observable.trigger "calibrate", @resizable_el.aid() layout: () -> - return undefined + [] Ant.OS.GUI.define "afx-resizer", ResizerTag \ No newline at end of file diff --git a/src/core/tags/TileLayoutTags.coffee b/src/core/tags/TileLayoutTags.coffee index 7633c04..c84fcbb 100644 --- a/src/core/tags/TileLayoutTags.coffee +++ b/src/core/tags/TileLayoutTags.coffee @@ -19,9 +19,9 @@ class TileLayoutTag extends Ant.OS.GUI.BaseTag layout: () -> - { + [{ el: "div", ref: "yield" - } + }] class HBoxTag extends TileLayoutTag diff --git a/src/core/tags/WindowTag.coffee b/src/core/tags/WindowTag.coffee index 82fe7db..29d4159 100644 --- a/src/core/tags/WindowTag.coffee +++ b/src/core/tags/WindowTag.coffee @@ -4,7 +4,7 @@ class WindowTag extends Ant.OS.GUI.BaseTag @setopt "minimizable", true @setopt "resizable", true @setopt "apptitle", "Untitled" - @setopt "desktop", "#desktop" + @setopt "desktop", Ant.OS.GUI.workspace @setopt "width", 400 @setopt "height", 300 @shown = false @@ -179,7 +179,7 @@ class WindowTag extends Ant.OS.GUI.BaseTag @observable.trigger 'resize', { id: @aid(), w: history.width, h: history.height } layout: () -> - { + [{ el: "div", class: "afx-window-wrapper", children: [ { el: "ul", class: "afx-window-top", children: [ @@ -193,6 +193,6 @@ class WindowTag extends Ant.OS.GUI.BaseTag { el: "div", ref: "yield", class: "afx-window-content" }, { el: "div", ref: "grip", class: "afx-window-grip" } ] - } + }] Ant.OS.GUI.define "afx-app-window", WindowTag \ No newline at end of file diff --git a/src/core/tags/afx-label.tag b/src/core/tags/afx-label.tag index ec010ec..9819f09 100644 --- a/src/core/tags/afx-label.tag +++ b/src/core/tags/afx-label.tag @@ -1,7 +1,7 @@ - + { text?text.__():"" }