add more tags

Makefile

@@ -43,6 +43,8 @@ coffees= 	src/core/core.coffee \
 			src/core/tags/FloatListTag.coffee \
 			src/core/tags/CalendarTag.coffee \
 			src/core/tags/ColorPickerTag.coffee \
+			src/core/tags/FileViewTag.coffee \
+			src/core/tags/OverlayTag.coffee \
         	src/antos.coffee
  
 
@@ -85,13 +87,13 @@ testdata:
 	cp src/core/handlers/jsons/* $(BUILDDIR)/resources/jsons
 build_tags:
 	@echo "$(BLUE)Building tag files$(NC)"
-	-mkdir $(BUILDDIR)/resources
+	-mkdir -p $(BUILDDIR)/resources
 	-rm $(BUILDDIR)/resources/antos_tags.js
 	for f in src/core/tags/*.tag; do (cat "$${f}"; echo) >> $(BUILDDIR)/resources/antos_tags.js; done
 
 languages:
-	-mkdir $(BUILDDIR)/resources
+	-mkdir -p $(BUILDDIR)/resources
-	-mkdir $(BUILDDIR)/resources/languages
+	-mkdir -p $(BUILDDIR)/resources/languages
 	cp src/core/languages/*.json $(BUILDDIR)/resources/languages/
 
 genlang:
@@ -111,7 +113,7 @@ antos_themes_build:
 
 
 build_packages:
-	- mkdir $(BUILDDIR)/packages
+	- mkdir -p $(BUILDDIR)/packages
 	- for d in $(packages); do ( test -d $(BUILDDIR)/packages/$$d && rm -rf $(BUILDDIR)/packages/$$d/* ); done
 	for d in $(packages); do (cd src/packages/$$d; make);done
 	for d in $(packages); do ( test -d $(BUILDDIR)/packages/$$d || mkdir -p $(BUILDDIR)/packages/$$d && cp -rf src/packages/$$d/build/* $(BUILDDIR)/packages/$$d/);done

src/core/tags/AppDockTag.coffee

@@ -0,0 +1,29 @@
+class AppDockTag extends Ant.OS.GUI.BaseTag
+    constructor: (r, o) ->
+        super r, o
+        @setopt "selectedApp"
+        @setopt "onappselect", (e) ->
+        @setopt "items", []
+        me = @
+        @root.newapp = (a) -> me.addApp a
+
+    addApp: (item) ->
+        @items.push item
+        @set "selectedApp", item.app
+        el = $("<afx-button>")
+        el.appendTo @root
+        el[0].uify @observable
+        el[0].set "*", item
+        el.attr "tooltip", "cr:#{item.app.title()}"
+        me = @
+        el[0].set "onbtclick", (e) ->
+            e.id = me.aid()
+            e.data.app = item
+            me.get("onappselect") e
+        for v  in self.items
+            v.app.blur()
+    
+    removeApp: (a) ->
+
+    mount: () ->
+        Ant.OS.announcer.trigger "sysdockloaded"

src/core/tags/FileViewTag.coffee

@@ -6,11 +6,10 @@ class FileViewTag extends Ant.OS.GUI.BaseTag
         @setopt "selectedFile", undefined
         @setopt "view", "list"
         @setopt "data", []
-        @setopt "path", "home:///"
         @setopt "status", true
         @setopt "showhidden", false
         @setopt "fetch", undefined
-        @setopt "chdir", undefined
+        @setopt "path", undefined
         @preventUpdate = false
         @header = [
             { text: "__(File name)" },
@@ -20,7 +19,25 @@ class FileViewTag extends Ant.OS.GUI.BaseTag
 
     view: () -> @get "view"
     
+    __view__: (v) ->
+        @switchView()
 
+    __path__: (v) ->
+        return unless v
+        me = @
+        return unless @get "fetch"
+        @get("fetch")(v)
+            .then (data) ->
+                me.set "data", data
+                me.refs.status.set("text", " ") if me.get "status"
+            .catch (e) ->
+                # this should be handled by the OS
+                console.error e
+    
+    __data__: (v) ->
+        return unless v
+        @refreshData()
+    
     sortByType: (a, b) ->
         if a.type < b.type
             -1
@@ -40,8 +57,196 @@ class FileViewTag extends Ant.OS.GUI.BaseTag
         $(@refs.gridview).css("width", w + "px")
         $(@refs.treecontainer).css("width", w + "px")
 
+    refreshList: () ->
+        items = []
+        me = @
+        $.each @get("data"), (i, v) ->
+            return if v.filename[0] is '.' and not me.get("showhidden")
+            v.text = v.filename
+            v.text = v.text.substring(0, 9) + "..." if v.text.length > 10
+            v.iconclass = if v.iconclass then v.iconclass else v.type
+            v.icon = v.icon
+            items.push(v)
+        @refs.listview.set "data", items
+
+    refreshGrid: () ->
+        rows = []
+        me = @
+        $.each @get("data"), (i, v) ->
+            return if v.filename[0] is '.' and not me.get("showhidden")
+            v.text = v.filename
+            v.iconclass = if v.iconclass then v.iconclass else v.type
+            row = [
+                v,
+                {
+                    text: v.mime,
+                    data: v
+                },
+                {
+                    text: v.size,
+                    data: v
+                }
+            ]
+            rows.push(row)
+        @refs.gridview.set "rows", rows
+
+    refreshTree: () ->
+        #@treeview.root.set("selectedItem", null)
+        tdata = {}
+        tdata.name = @get "path"
+        tdata.path = tdata.name
+        tdata.open = true
+        tdata.nodes = @getTreeData( @get("data"))
+        @refs.treeview.set("data", tdata)
+
+    getTreeData: (data) ->
+        nodes = []
+        me = @
+        $.each data, (i, v) ->
+            return if v.filename[0] is '.' and not me.get("showhidden")
+            v.name = v.filename
+            if v.type is 'dir'
+                v.nodes = []
+                v.open = false
+            v.iconclass = if v.iconclass then v.iconclass else v.type
+            v.icon = v.icon
+            nodes.push(v)
+        return nodes
+
+    refreshData: () ->
+        return unless @get("data")
+        @get("data").sort(@sortByType)
+        switch @get("view")
+            when "icon"
+                @refreshList()
+            when "list"
+                @refreshGrid()
+            else
+                @refreshTree()
+                
     switchView: () ->
-        
+        $(@refs.listview).hide()
+        $(@refs.gridview).hide()
+        $(@refs.treecontainer).hide()
+        @set "selectedFile", undefined
+        switch @get "view"
+            when 'icon'
+                $(@refs.listview).show()
+            when 'list'
+                $(@refs.gridview).show()
+            else
+                $(@refs.treecontainer).show()
+        @refreshData()
+        @calibrate()
+        @refs.status.set("text", " ") if @get "status"
+
+    fileselect: (e) ->
+        if @get "status"
+            @refs.status.set "text", __(
+                "Selected: {0} ({1} bytes)",
+                e.filename,
+                if e.size then e.size else "0" )
+        evt  = { id: @aid(), data: e }
+        @get("onfileselect") evt
+        @observable.trigger "fileselect", evt
+
+    filedbclick: (e) ->
+        if e.type is "dir"
+            @set "path", e.path
+        else
+            evt  = { id: @aid(), data: e }
+            @get("onfileopen") evt
+            @observable.trigger "fileopen", evt
+
+    mount: () ->
+        me = @
+        @observable.on "resize", (e) -> me.calibrate()
+        @refs.treeview.set "fetch", (v) ->
+            new Promise (resolve, reject) ->
+                return resolve undefined unless me.get("fetch")
+                me.get("fetch")(v.get("data").path)
+                    .then (d) -> resolve me.getTreeData(d.sort me.sortByType)
+                    .catch (e) -> reject e
+        @refs.gridview.set "header", @header
+        # even handles
+        @refs.listview.set "onlistselect", (e) ->
+            me.fileselect e.data.item.get("data")
+        @refs.gridview.set "onrowselect", (e) ->
+            me.fileselect $(e.data.item).children()[0].get("data")
+        @refs.treeview.set "ontreeselect", (e) ->
+            me.fileselect e.data.item.get("data")
+        # dblclick
+        @refs.listview.set "onlistdbclick", (e) ->
+            me.filedbclick e.data.item.get("data")
+        @refs.gridview.set "oncelldbclick", (e) ->
+            me.filedbclick e.data.item.get("data")
+        @refs.treeview.set "ontreedbclick", (e) ->
+            me.filedbclick e.data.item.get("data")
+        @switchView()
+        ### self.refs.listview.onlistselect = function(data)
+        {
+            data.id = self.rid
+            self.root.observable.trigger("fileselect",data)
+        }
+        self.refs.listview.onlistdbclick = function(data)
+        {
+            data.id = self.rid
+            self.root.observable.trigger("filedbclick",data)
+        }
+        self.refs.gridview.root.observable = self.root.observable
+        self.refs.gridview.ongridselect = function(d)
+        {
+            var data = {id:self.rid, data:self.data[d.data.child[3].idx], idx:d.data.child[3].idx}
+            self.root.observable.trigger("fileselect",data)
+        }
+        self.refs.gridview.ongriddbclick = function(d)
+        {
+            var data = {id:self.rid, data:self.data[d.data.child[3].idx], idx:d.data.child[3].idx}
+            self.root.observable.trigger("filedbclick",data)
+        }
+        self.refs.treeview.ontreeselect = function(d)
+        {
+            if(!d) return;
+            var data;
+            var el = d;
+            if(d.treepath == 0)// select the root
+            {
+                el = self.path.asFileHandler()
+                el.size = 0
+                el.filename = el.path
+            }
+            var data = {id:self.rid, data:el}
+            self.root.observable.trigger("fileselect",data)
+        }
+        self.refs.treeview.ontreedbclick = function(d)
+        {
+            if(!d || d.treepath == 0) return;
+            var data = {id:self.rid, data:d}
+            self.root.observable.trigger("filedbclick",data)
+        }
+        self.root.observable.on("fileselect", function(e){
+            if(e.id != self.rid) return
+            self.selectedFile = e.data
+            if(self.onfileselect)
+                self.onfileselect(e.data)
+            if(self.refs.stbar)
+                self.refs.stbar.root.set("text", __("Selected: {0} ({1} bytes)", e.data.filename,  e.data.size?e.data.size:"0"))//.html()
+        })
+        self.root.observable.on("filedbclick", function(e){
+            if(e.id != self.rid ) return
+            if(e.data.type != "dir" && self.onfileopen)
+                self.onfileopen(e.data)
+            else if(self.chdir && e.data.type == "dir")
+                self.chdir(e.data.path)
+        })
+        calibre_size()
+        self.root.observable.on("resize", function(e){
+            calibre_size()
+        })
+        self.root.observable.on("calibrate", function(e){
+            calibre_size()
+        })
+        }) ###
 
     layout: () ->
         [
@@ -51,4 +256,6 @@ class FileViewTag extends Ant.OS.GUI.BaseTag
                 { el: "afx-tree-view", ref: "treeview" }
             ] },
             { el: "afx-label", class: "status", ref: "status" }
-        ]
+        ]
+
+Ant.OS.GUI.define "afx-file-view", FileViewTag

src/core/tags/GridViewTag.coffee

@@ -186,7 +186,7 @@ class GridViewTag extends Ant.OS.GUI.BaseTag
 
     layout: () ->
         [
-            { el: "div", ref: "header" },
+            { el: "div", ref: "header", class: "grid_row_header" },
             { el: "div", ref: "container", children: [
                 { el: "div", ref: "grid" }
             ] }

src/core/tags/ListViewTag.coffee

@@ -170,6 +170,11 @@ class ListViewTag extends Ant.OS.GUI.BaseTag
         @get("onlistselect") evt
         @observable.trigger "listselect", evt
 
+    mount: () ->
+        me = @
+        @observable.on "resize", (e) -> me.calibrate()
+        @calibrate()
+
     iclose: (e) ->
         return unless e.item
         evt = { id: @aid(), data: e }
@@ -188,13 +193,9 @@ class ListViewTag extends Ant.OS.GUI.BaseTag
             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)
@@ -208,8 +209,6 @@ class ListViewTag extends Ant.OS.GUI.BaseTag
             @calibrate()
         else
             $(@refs.current).hide()
-            @observable.off "calibrate", calib
-            @observable.off "resize", calib
             $(document).off "click", drop
             $(@refs.current).off "click", show
 

src/core/tags/OverlayTag.coffee

@@ -0,0 +1,34 @@
+class OverlayTag extends Ant.OS.GUI.BaseTag
+    constructor: (r, o) ->
+        super r, o
+        @setopt "width", 200
+        @setopt "height", 400
+    
+    __width__: (v) ->
+        @calibrate()
+    
+    __height__: (v) ->
+        @calibrate()
+
+    mount: () ->
+        $(@root)
+            .css("position", "absolute")
+        @calibrate()
+
+    calibrate: () ->
+        $(@root)
+            .css("width", @get("width") + "px")
+            .css("height", @get("height") + "px")
+        @observable.trigger "resize", {
+            id: @aid(),
+            data: {
+                w: @get("width"),
+                h: @get("height")
+            }
+        }
+
+    layout: () ->
+        [{
+            el: "div", ref: "yield"
+        }]
+Ant.OS.GUI.define "afx-overlay", OverlayTag

src/core/tags/TabContainerTag.coffee

@@ -35,7 +35,7 @@ class TabContainerTag extends Ant.OS.GUI.BaseTag
         me = @
         $(@children).each () ->
             item = {}
-            item.text = $(@).attr "title" if $(@).attr "title"
+            item.text = $(@).attr "tabname" if $(@).attr "tabname"
             item.icon = $(@).attr "icon" if $(@).attr "icon"
             item.iconclass = $(@).attr "iconclass" if $(@).attr "iconclass"
             item.container = @

src/core/tags/TreeViewTag.coffee

@@ -2,7 +2,7 @@ class TreeViewItemPrototype extends Ant.OS.GUI.BaseTag
     constructor: (r, o) ->
         super r, o
         @setopt "data", undefined
-        @setopt "nodes", []
+        @setopt "nodes", undefined
         @setopt "treeroot", undefined
         @setopt "indent", 0
         @setopt "toggle", false
@@ -15,6 +15,7 @@ class TreeViewItemPrototype extends Ant.OS.GUI.BaseTag
     __data__: (v) ->
         return unless v
         @set "nodes", v.nodes if v.nodes
+        @set "open", v.open
 
     __selected__: (v) ->
         $(@refs.wrapper).removeClass()
@@ -22,13 +23,13 @@ class TreeViewItemPrototype extends Ant.OS.GUI.BaseTag
     
     __open__: (v) ->
         me = @
+        return unless @is_folder()
         $(@refs.toggle)
             .removeClass()
-        return unless @is_folder()
         if(v)
             if @get("fetch")
-                @get("fetch") @root, (d) ->
+                @get("fetch")(@root).then (d) ->
-                    me.set "data", d
+                    me.set "nodes", d
             $(@refs.childnodes).show()
         else
             $(@refs.childnodes).hide()
@@ -50,11 +51,12 @@ class TreeViewItemPrototype extends Ant.OS.GUI.BaseTag
                 .css("width", v * 15 + "px" )
 
     is_folder: () ->
-        return @get("nodes") and @get("nodes").length > 0
+        if @get("nodes") then true else false
     
 
     __nodes__: (nodes) ->
-        return unless @get("nodes") and @get("nodes").length > 0
+        return unless nodes
+        # return unless @get("nodes") and @get("nodes").length > 0
         $(@refs.childnodes).empty()
         $(@refs.wrapper).addClass("afx_folder_item")
         root = @get("treeroot")
@@ -66,6 +68,7 @@ class TreeViewItemPrototype extends Ant.OS.GUI.BaseTag
             root.indexcounter++
             el[0].set "itemindex", root.indexcounter
             el[0].set "treepath", "#{@get("treepath")}/#{el[0].aid()}"
+            el[0].set "fetch", @get("fetch")
             el[0].set "data", v
 
 
@@ -90,6 +93,7 @@ class TreeViewItemPrototype extends Ant.OS.GUI.BaseTag
         $(@refs.toggle)
             .css "display", "inline-block"
             .css "width", "15px"
+            .addClass "afx-tree-view-item"
             .click (e) ->
                 me.set "open", not me.get("open")
                 e.preventDefault()
@@ -144,6 +148,7 @@ class TreeViewTag extends Ant.OS.GUI.BaseTag
         @setopt "ontreeselect", () ->
         @setopt "ontreedbclick", () ->
         @setopt "selectedItem", undefined
+        @setopt "fetch", undefined
         @setopt "treepath", @aid()
         @indexcounter = 0
     
@@ -176,8 +181,9 @@ class TreeViewTag extends Ant.OS.GUI.BaseTag
         el[0].set "indent", @get("indent")
         el[0].set "itemindex", @get "itemindex"
         el[0].set "treepath", @get("treepath")
-        el[0].set "data", v
         el[0].set "open", @get("open")
+        el[0].set "fetch", @get("fetch")
+        el[0].set "data", v
 
 Ant.OS.GUI.define "afx-tree-view", TreeViewTag
 Ant.OS.GUI.define "afx-tree-view-item-proto", TreeViewItemPrototype

src/core/tags/afx-apps-dock.tag

@@ -60,7 +60,7 @@
             window.OS.announcer.trigger("sysdockloaded")
         })
         
-        self.root.contextmenuHandler = function(e, m) 
+        self.root.contextmenuHandle = function(e, m) 
         {
             if(e.target == self.root) return;
             var appidx = $(e.target).closest( "afx-button" ).attr("appindex")

src/packages/ShowCase/coffees/main.coffee

@@ -40,7 +40,7 @@ class ShowCase extends this.OS.GUI.BaseApplication
                 <afx-menu data-height="30" data-id="menu" />
                 <afx-tab-container data-id="tabctn" tabbarheight= "30">
 
-                    <afx-hbox title="Widgets">
+                    <afx-hbox tabname="Widgets">
                         <afx-vbox data-width="150">
                             <afx-tree-view data-id="tree" />
                             <afx-slider data-id="slider" data-height="30" value="50"/>
@@ -64,15 +64,21 @@ class ShowCase extends this.OS.GUI.BaseApplication
                             </afx-hbox>
                         </afx-vbox>
                     </afx-hbox>
-                    <afx-hbox title="Virtual desktop">
+                    <afx-hbox tabname="Virtual desktop">
                         <afx-float-list1 data-id = "flist"/>
                     </afx-hbox>
-                    <afx-hbox title="Calendar">
+                    <afx-hbox tabname="Calendar">
                         <afx-calendar-view data-id = "cal"/>
                     </afx-hbox>
-                    <afx-hbox title="Color picker">
+                    <afx-hbox tabname="Color picker">
                         <afx-color-picker data-id = "cpk"/>
                     </afx-hbox>
+                    <afx-hbox tabname="File view">
+                        <afx-vbox>
+                            <afx-file-view data-id = "fileview"/>
+                            <afx-list-view data-id = "viewoption" data-height="30" dropdown="true" />
+                        </afx-vbox>
+                    </afx-hbox>
                 </afx-tab-container>
             </afx-vbox>
         </afx-app-window>
@@ -213,6 +219,32 @@ class ShowCase extends this.OS.GUI.BaseApplication
         pk = $ "[data-id='cpk']", scheme[0]
         pk[0].set "oncolorselect", (e) ->
             console.log e
+        pk[0].set "oncolorselect", (e) ->
+            console.log e
+
+        fileview = $("[data-id='fileview']", scheme[0])[0]
+        fileview.set "fetch", (path) ->
+            new Promise (resolve, reject) ->
+                dir = path.asFileHandle()
+                dir.read (d) ->
+                    p = dir.parent().asFileHandle()
+                    p.filename = "[..]"
+                    p.type = "dir"
+                    return reject d.error if d.error
+                    d.result.unshift p
+                    resolve d.result
+        fileview.set "path", "home:///"
+
+        viewoption =  $("[data-id='viewoption']", scheme[0])[0]
+        viewoption.set "data", [
+            { text: "icon" },
+            { text: "list" },
+            { text: "tree" }
+        ]
+        viewoption.set "onlistselect", (e) ->
+            console.log e.data.item.get("data").text
+            fileview.set "view", e.data.item.get("data").text
+
 
     mnFile: () ->
         #console.log file

src/themes/antos/afx-file-view.css

@@ -13,7 +13,7 @@ afx-file-view afx-label.status{
     color:#414339;
     transform: translateZ(0);
 }
-afx-file-view afx-list-view > div.list-container > ul > li{
+afx-file-view afx-list-view > div.list-container > ul  li{
     float:left;
     display: block;
     width:70px;
@@ -24,7 +24,7 @@ afx-file-view afx-list-view > div.list-container > ul > li{
     margin-right: 5px;
     margin-bottom: 5px;
 }
-afx-file-view afx-list-view > div.list-container > ul > li:nth-child(odd){
+afx-file-view afx-list-view > div.list-container > ul afx-list-item:nth-child(even) li {
     background-color: transparent;
 }
 afx-file-view afx-list-view i.dir:before{
@@ -52,7 +52,7 @@ afx-file-view afx-list-view i.file:before{
     font-weight: normal;
 }
 
-afx-file-view afx-list-view > div.list-container > ul > li.selected, afx-file-view afx-list-view div.list-container > ul  li.selected  i:before {
+afx-file-view afx-list-view > div.list-container > ul > afx-list-item > li.selected, afx-file-view afx-list-view div.list-container > ul  li.selected  i:before {
     background-color: #116cd6;
     color:white;
     border-radius: 6px;
@@ -83,10 +83,10 @@ afx-file-view afx-grid-view i{
 afx-file-view afx-grid-view afx-grid-row.selected i:before{
     color:white;
 }
-afx-file-view afx-grid-view afx-grid-row.grid_row_header{
+afx-file-view afx-grid-view .grid_row_header{
     background-color: #dfdfdf;
 }
-afx-file-view afx-grid-view afx-grid-row.grid_row_header div{
+afx-file-view afx-grid-view .grid_row_header afx-grid-cell{
     border-top: 1px solid #a6a6a6;
     border-right: 1px solid #a6a6a6;
 }
@@ -101,18 +101,17 @@ afx-file-view afx-tree-view .afx-tree-view-folder-open:before{
     content: "\f07c"; 
     font-family: "FontAwesome";
     color:#76D2F9;
-    font-size: 16px;   
+    font-size: 16px;
 }
 afx-file-view afx-tree-view{
     margin:0;
     overflow: hidden;
-    display: inline-block;
     background-color: transparent;
 }
 afx-file-view afx-tree-view .afx_tree_item_odd{
     background-color: transparent;
 }
-afx-file-view afx-tree-view i.file:before{
+afx-file-view afx-tree-view .afx-tree-view-item:before{
     content: "\f016"; 
     font-family: "FontAwesome";
     font-size: 16px;
@@ -153,8 +152,4 @@ afx-file-view afx-tree-view div.afx_tree_item_selected i.file:before{
 
 afx-file-view afx-tree-view .afx_folder_item{
     font-weight: normal;
-}
+}
-
-afx-file-view afx-tree-view afx-tree-view{
-    display: inline-block;
-}