menu update

This commit is contained in:
lxsang 2020-03-13 18:36:00 +01:00
parent 45ec9e4792
commit 328a37320e
3 changed files with 126 additions and 28 deletions

View File

@ -12,7 +12,7 @@ class ListViewItemTag extends Ant.OS.GUI.BaseTag
@setopt "closable", false
@setopt "selected", false
class ListItemSimpleTag extends ListViewItemTag
class SimpleListItemTag extends ListViewItemTag
constructor: (r, o) ->
super r, o
mount: () ->
@ -217,4 +217,5 @@ class ListViewTag extends Ant.OS.GUI.BaseTag
]
Ant.OS.GUI.define "afx-list-view", ListViewTag
Ant.OS.GUI.define "afx-list-item", ListItemSimpleTag
Ant.OS.GUI.define "afx-list-item-proto", ListViewItemTag
Ant.OS.GUI.define "afx-list-item", SimpleListItemTag

View File

@ -1,5 +1,27 @@
class MenuEntryTag extends Ant.OS.GUI.BaseTag
constructor: (r, o) ->
super r, o
@setopt "data", {}
@setopt "onmenuselect", () ->
@setopt "children", undefined
@setopt "child", undefined
@setopt "parent", undefined
on_data_changed: (data) ->
@set k, v for k, v of data
on_child_changed: (v) ->
@set "children", v
has_children: () ->
ch = @get "children"
return ch and ch.length > 0
is_root: () ->
return if @get "parent" then false else true
class SimpleMenuEntryTag extends MenuEntryTag
constructor: (r, o) ->
super r, o
@setopt "switch", false
@ -9,11 +31,7 @@ class MenuEntryTag extends Ant.OS.GUI.BaseTag
@setopt "iconclass", undefined
@setopt "text", ""
@setopt "shortcut", undefined
@setopt "children", undefined
@setopt "data", {}
on_data_changed: (data) ->
@set k, v for k, v of data
@setopt "checked", false
on_switch_changed: (v) ->
if @get("radio") or v
@ -27,6 +45,10 @@ class MenuEntryTag extends Ant.OS.GUI.BaseTag
else
$(@refs.switch).hide()
on_checked_changed: (v) ->
return unless @get("radio") or @get("switch")
@refs.switch.set "swon", v
on_color_changed: (v) ->
return unless v
@refs.label.set "color", v
@ -52,23 +74,61 @@ class MenuEntryTag extends Ant.OS.GUI.BaseTag
$(@refs.shortcut).val v
on_children_changed: (v) ->
me = @
$(@refs.container).removeClass("afx_submenu")
return $(@refs.submenu).hide() unless v and v.length > 0
$(@refs.container).addClass("afx_submenu")
$(@refs.submenu)
.show()
.attr("style", "")
@refs.submenu.set "root", false
@refs.submenu.set "parent", @
@refs.submenu.set "items", v
if @is_root()
$(@refs.container).mouseleave (e) ->
$(me.refs.submenu).attr("style", "")
mount: () ->
me = @
@refs.switch.set "enable", false
$(@refs.entry).click (e) -> me.select e
submenuoff: () ->
p = @get "parent"
return $(@refs.submenu).attr("style", "") unless p
p.submenuoff()
reset_radio: () ->
return unless @has_children()
for v in @get "children"
return unless v.domel.get "radio"
v.domel.set "checked", false
select: (e) ->
me = @
e.item = @root
evt = { id: @aid(), data: e }
e.preventDefault()
children = @get("children")
if @is_root() and @has_children()
$(@refs.submenu).show()
else
@submenuoff()
if @get "switch"
@set "checked", !@get "checked"
else if @get "radio"
p = @get "parent"
p.reset_radio() if p
@set "checked", !@get "checked"
@get("onmenuselect") evt
@observable.trigger "menuselect", evt
layout: () ->
[{
el: "li", ref: "container", children: [
{
el: "a", children: [
el: "a", ref: "entry", children: [
{ el: "afx-switch", ref: "switch" },
{ el: "afx-label", ref: "label" },
{ el: "span", class: "shortcut", ref: "shortcut" }
@ -82,7 +142,7 @@ class MenuTag extends Ant.OS.GUI.BaseTag
constructor: (r, o) ->
super r, o
@setopt "context", false
@setopt "root", true
@setopt "parent", undefined
@setopt "contentag", "afx-menu-entry"
@setopt "items", []
@ -93,17 +153,20 @@ class MenuTag extends Ant.OS.GUI.BaseTag
$(@refs.container).addClass("context") if v
on_items_changed: (data) ->
me = @
$(@refs.container).empty()
$("<li>").appendTo(@refs.container).addClass("afx-corner-fix")
for item in data
el = $("<#{@get("contentag")}>").appendTo @refs.container
el[0].uify @observable
el[0].set "data", item
el[0].set "parent", me.get("parent")
item.domel = el[0]
$("<li>").appendTo(@refs.container).addClass("afx-corner-fix")
layout: () ->
[{ el: "ul", ref: "container" }]
Ant.OS.GUI.define "afx-menu", MenuTag
Ant.OS.GUI.define "afx-menu-entry", MenuEntryTag
Ant.OS.GUI.define "afx-menu-entry-proto", MenuEntryTag
Ant.OS.GUI.define "afx-menu-entry", SimpleMenuEntryTag

View File

@ -107,22 +107,56 @@ class ShowCase extends this.OS.GUI.BaseApplication
console.log e.data
menu = $ "[data-id='menu']", scheme[0]
console.log menu[0]
menudata = [
{ text: "__(Refresh)", dataid: "refresh" },
{ text: "__(Sidebar)", dataid: "side" },
{ text: "__(Navigation bar)", dataid: "nav" },
{ text: "__(Hidden files)", dataid: "hidden" },
{ text: "__(Type)", children: [
{ text: "__(Icon view)", dataid: "icon", type: 'icon' },
{ text: "__(List view)", dataid: "list", type: 'list', children: [
{ text: "__(Refresh)" },
{ text: "__(Sidebar)" }
] },
{ text: "__(Tree view)", dataid: "tree", type: 'tree' }
]
}
menu[0].set "items", @menu()
mnFile:() ->
#console.log file
me = @
arr = {
text: "__(File)",
child: [
{ text: "__(New file)", dataid: "#{@name}-mkf", shortcut: 'C-F' },
{ text: "__(New folder)", dataid: "#{@name}-mkdir", shortcut: 'C-D' },
{ text: "__(Open with)", dataid: "#{@name}-open", child: @apps },
{ text: "__(Upload)", dataid: "#{@name}-upload", shortcut: 'C-U' },
{ text: "__(Download)", dataid: "#{@name}-download" },
{ text: "__(Share file)", dataid: "#{@name}-share", shortcut: 'C-S' },
{ text: "__(Properties)", dataid: "#{@name}-info", shortcut: 'C-I' }
], onmenuselect: (e) ->
}
return arr
mnEdit: () ->
me = @
{
text: "__(Edit)",
child: [
{ text: "__(Rename)", dataid: "#{@name}-mv", shortcut: 'C-R' },
{ text: "__(Delete)", dataid: "#{@name}-rm", shortcut: 'C-M' },
{ text: "__(Cut)", dataid: "#{@name}-cut", shortcut: 'C-X' },
{ text: "__(Copy)", dataid: "#{@name}-copy", shortcut: 'C-C' },
{ text: "__(Paste)", dataid: "#{@name}-paste", shortcut: 'C-P' }
], onmenuselect: (e) ->
}
menu: () ->
me = @
menu = [
@mnFile(),
@mnEdit(),
{
text: "__(View)",
child: [
{ text: "__(Refresh)", dataid: "#{@name}-refresh" },
{ text: "__(Sidebar)", switch: true, checked: true },
{ text: "__(Navigation bar)", switch: true, checked: false },
{ text: "__(Hidden files)", switch: true, checked: true, dataid: "#{@name}-hidden" },
{ text: "__(Type)", child: [
{ text: "__(Icon view)", radio: true, checked: true, dataid: "#{@name}-icon", type: 'icon' },
{ text: "__(List view)", radio:true, checked: false, dataid: "#{@name}-list", type: 'list' },
{ text: "__(Tree view)", radio:true, checked: false, dataid: "#{@name}-tree", type: 'tree' }
], onmenuselect: (e) ->
},
], onmenuselect: (e) ->
},
]
menu[0].set "items", menudata
menu
ShowCase.singleton = true
this.OS.register "ShowCase", ShowCase