adapt more apps

Makefile

@@ -54,13 +54,13 @@ coffees= 	src/core/core.coffee \
 
 packages = CoreServices ActivityMonitor Files Setting ShowCase MarkOn# Files  MarketPlace Preview NotePad wTerm
 
-main: initd build_coffees build_themes schemes libs  build_packages languages
+main: initd build_coffees build_themes libs  build_packages languages
 	- cp src/index.html $(BUILDDIR)/
 
 initd:
 	- mkdir -p $(BUILDDIR)
 
-lite: build_coffees build_themes schemes build_packages
+lite: build_coffees build_themes build_packages
 #%.js: %.coffee
 #		coffee --compile $< 
 
@@ -78,11 +78,6 @@ libs:
 	@echo "$(BLUE)Copy lib files$(NC)"
 	cp -rf src/libs/* $(BUILDDIR)/scripts/
 
-schemes:
-	@echo "$(BLUE)Copy schemes files$(NC)"
-	- mkdir -p $(BUILDDIR)/resources/schemes
-	cp src/core/schemes/* $(BUILDDIR)/resources/schemes/
-
 testdata:
 	@echo "$(BLUE)Copy JSON test files$(NC)"
 	- mkdir -p $(BUILDDIR)/resources/jsons
@@ -97,7 +92,11 @@ genlang:
 	read -r -p "Enter locale: " LOCAL;\
 		./src/core/languages/gen.sh ./src ./src/core/languages/$$LOCAL.json
 build_themes: antos_themes_build
-	cp -r src/themes/system $(BUILDDIR)/resources/themes/
+	-rm -rf $(BUILDDIR)/resources/themes/system/*
+	-mkdir -p $(BUILDDIR)/resources/themes/system
+	cp -r src/themes/system/fonts $(BUILDDIR)/resources/themes/system
+	cp -r src/themes/system/wp $(BUILDDIR)/resources/themes/system
+	for f in src/themes/system/*.css; do (cat "$${f}"; echo) >> $(BUILDDIR)/resources/themes/system/system.css;done
 
 antos_themes_build:
 	@echo "$(BLUE)Building themes name: antos$(NC)"
@@ -106,7 +105,6 @@ antos_themes_build:
 	for f in src/themes/antos/*.css; do (cat "$${f}"; echo) >> $(BUILDDIR)/resources/themes/antos/antos.css;done
 	-mkdir -p $(BUILDDIR)/resources/themes/antos/fonts
 	cp -rf src/themes/antos/fonts/* $(BUILDDIR)/resources/themes/antos/fonts
-	cp src/themes/antos/wp* $(BUILDDIR)/resources/themes/antos/
 
 
 build_packages:
@@ -142,7 +140,7 @@ uglify:
 	# npm install uglifycss -g
 	# uglify the css
 	uglifycss  --output $(BUILDDIR)/resources/themes/antos/antos.css $(BUILDDIR)/resources/themes/antos/antos.css
-	uglifycss  --output $(BUILDDIR)/resources/themes/system/font-awesome.css $(BUILDDIR)/resources/themes/system/font-awesome.css
+	uglifycss  --output $(BUILDDIR)/resources/themes/system/system.css $(BUILDDIR)/resources/themes/system/system.css
 	#uglify each packages
 
 	for d in $(packages); do\

src/core/Announcerment.coffee

@@ -52,10 +52,10 @@ class Announcer
             for evt in names
                 continue unless me.observable[evt]
                 me.observable[evt].one.forEach (f) ->
-                    f data
+                    f d
                 me.observable[evt].one = new Set()
                 me.observable[evt].many.forEach (f) ->
-                    f data
+                    f d
         
         if evtName is "*"
             trig k, data for k, v of me.observable when k isnt "*"

src/core/BaseDialog.coffee

@@ -274,7 +274,7 @@ class SelectionDialog extends BasicDialog
         (@find "btnOk").set "onbtclick", (e) ->
             data = (me.find "list").get "selectedItem"
             return me.notify __("Please select an item") unless data
-            me.handle(data) if me.handle
+            me.handle(data.get("data")) if me.handle
             me.quit()
         
         (@find "btnCancel").set "onbtclick", (e) ->
@@ -357,6 +357,7 @@ class FileDialog extends BasicDialog
         me = @
         fileview.set "fetch", (path) ->
             new Promise (resolve, reject) ->
+                return resolve() unless path
                 path.asFileHandle().read()
                     .then (d) ->
                         return reject d if d.error

src/core/gui.coffee

@@ -36,12 +36,12 @@ Ant.OS.GUI =
         app.main()
         app.show()
     loadScheme: (path, app, parent) ->
-        path.asFileHandle().read().then (x) ->
+        path.asFileHandle().read()
+            .then (x) ->
                 return null unless x
                 Ant.OS.GUI.htmlToScheme x, app, parent
-        #, (e, s) ->
+            .catch (e) ->
-        #    Ant.OS.announcer.osfail "Cannot load scheme file: #{path} for #{app.name} (#{app.pid})", e, s
+                Ant.OS.announcer.oserror __("Cannot load scheme: {0}", path), e
-
     clearTheme: () ->
          $ "head link#ostheme"
             .attr "href", ""
@@ -83,9 +83,9 @@ Ant.OS.GUI =
         Ant.OS.GUI.loadApp app
             .then (a) ->
                 return Ant.OS.PM.createProcess srv, Ant.OS.APP[srv] if Ant.OS.APP[srv]
-            .catch (e, s) ->
+            .catch (e) ->
                 Ant.OS.announcer.trigger "srvroutineready", srv
-                Ant.OS.announcer.osfail __("Cannot read service script: {0}", srv), e, s
+                Ant.OS.announcer.osfail __("Cannot read service script: {0}", srv), e
 
     appsByMime: (mime) ->
         metas = ( v for k, v of Ant.OS.setting.system.packages when v and v.app )
@@ -101,7 +101,7 @@ Ant.OS.GUI =
                         return false
                     return false
             catch e
-                Ant.OS.announcer.osfail __("Error find app by mimes {0}", mime), e, mime
+                Ant.OS.announcer.osfail __("Error find app by mimes {0}", mime), e
 
         ( f m, i if m ) for m, i in mimes
         return apps
@@ -315,8 +315,9 @@ Ant.OS.GUI =
         # desktop default file manager
         desktop = $ Ant.OS.GUI.workspace
         desktop[0].fetch = () ->
+            file = Ant.OS.setting.desktop.path.asFileHandle()
             fn = () ->
-                fp.read().then (d) ->
+                file.read().then (d) ->
                     return Ant.OS.announcer.osfail d.error, (Ant.OS.API.throwe "OS.VFS"), d.error if d.error
                     items = []
                     $.each d.result,  (i, v) ->
@@ -328,12 +329,12 @@ Ant.OS.GUI =
                     desktop[0].set "data", items
                     desktop[0].refresh()
 
-            fp.onready()
+            file.onready()
                 .then () -> fn()
                 .catch ( e ) -> # try to create the path
-                    console.log "#{fp.path} not found"
+                    console.log "#{file.path} not found"
-                    name = fp.basename
+                    name = file.basename
-                    fp.parent().asFileHandle().mk(name).then (r) ->
+                    file.parent().asFileHandle().mk(name).then (r) ->
                         ex = Ant.OS.API.throwe "OS.VFS"
                         if r.error then Ant.OS.announcer.osfail d.error, ex, d.error else fn()
             
@@ -398,10 +399,7 @@ Ant.OS.GUI =
         return new Ant.OS.GUI.BasicDialog conf.name, conf.layout
         
     login: () ->
-        Ant.OS.API.resource "schemes/login.html"
+        scheme = $.parseHTML Ant.OS.GUI.schemes.login
-            .then (x) ->
-                return null unless x
-                scheme = $.parseHTML x
         ($ "#wrapper").append scheme
         ($ "#btlogin").click () ->
             data =
@@ -415,8 +413,6 @@ Ant.OS.GUI =
                     ($ "#login_error").html "Login: server error"
         ($ "#txtpass").keyup (e) ->
             ($ "#btlogin").click() if e.which is 13
-            .catch (e) ->
-                alert __("System fail: Cannot init login screen")
     
     startAntOS: (conf) ->
         # clean up things
@@ -469,4 +465,11 @@ Ant.OS.GUI.schemes.ws = """
 """
 
 Ant.OS.GUI.schemes.login = """
+<div id = "login_form">
+    <p>Welcome to AntOS, please identify</p>
+    <input id = "txtuser" type = "text" value = "demo" />
+    <input id = "txtpass" type = "password" value = "demo" />
+    <button id = "btlogin">Login</button>
+    <div id = "login_error"></div>
+</div>
 """

src/core/schemes/dm.html

@@ -1,8 +0,0 @@
-
-<afx-sys-panel id = "syspanel"></afx-sys-panel>
-<div id = "workspace">
-    <afx-apps-dock id="sysdock"></afx-apps-dock>
-    <afx-float-list id = "desktop" dir="vertical" ></afx-float-list>
-</div>
-<afx-menu id="contextmenu" data-id="contextmenu" context="true" style="display:none;"></afx-menu>
-<afx-label id="systooltip" data-id="systooltip" style="display:none;position:absolute;"></afx-label>

src/core/schemes/login.html

@@ -1,78 +0,0 @@
-<!--
-    Since nothing is loaded, the login form is a standalone element, 
-    it deserves it own unique style
-    For now, it can not be themed !!!
--->
-<style>
-    body, html{
-        background-color: rgba(215,215,215,0.7);
-    }
-    #login_form{
-        width:300px;
-        height: 200px;
-        display: block;
-        border:1px solid #a6a6a6;
-        border-radius: 6px;
-        box-shadow: 1px 1px 1px #9f9F9F;
-        position: absolute;
-        margin: auto;
-        top:0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-        font-family:Verdana, Geneva, Tahoma, sans-serif;
-        font-size: 13px;
-        text-align: center;
-        background-color: white;
-        color: #414339;
-    } 
-    
-    #login_form p{
-        display: inline-block;
-        background-color:#dfdfdf;
-        border-bottom: 1px solid #a6a6a6;
-        padding:10px;
-        width: calc(100% - 20px);
-        border-top-left-radius: 6px;
-        border-top-right-radius: 6px;
-        font-weight: bold;
-        margin:0;
-        
-    }
-    #login_form input {
-        width: 250px;
-        outline: none;
-        margin-top:10px;
-        border-radius: 6px;
-        box-sizing: border-box;
-        font-size: 13px;
-        padding: 5px;
-        border: 1px solid #a6a6a6;
-        background-color: white;
-        color: #414339;
-    }
-    #login_form button{
-        margin-top:10px;
-        width: 250px;
-        height: 30px;
-        background-color: #2786F3;
-        color: white;
-        border: 1px solid #dedede;
-        border-radius: 6px;
-        font-family: Verdana, Geneva, Tahoma, sans-serif;
-        font-size: 13px;
-        padding:5px;
-    }
-    #login_error{
-        padding:3px;
-        color:red;
-        font-weight: normal;
-    }
-</style>
-<div id = "login_form">
-    <p>Welcome to AntOS, please identify</p>
-    <input id = "txtuser" type = "text" value = "demo" />
-    <input id = "txtpass" type = "password" value = "demo" />
-    <button id = "btlogin">Login</button>
-    <span id = "login_error"></span>
-</div>

src/core/settings.coffee

@@ -20,7 +20,7 @@
     Ant.OS.setting.applications = conf.applications if conf.applications
     Ant.OS.setting.appearance = conf.appearance if conf.appearance
     Ant.OS.setting.appearance.wp = {
-        url: "os://resources/themes/system/wp/wp2.jpg",
+        url: "os://resources/themes/system/wp/wp3.jpg",
         size: "cover",
         repeat: "repeat"
     } unless Ant.OS.setting.appearance.wp

src/core/tags/FileViewTag.coffee

@@ -27,6 +27,7 @@ class FileViewTag extends Ant.OS.GUI.BaseTag
         $(@refs.status).hide()
 
     __showhidden__: (v) ->
+        return unless @get "data"
         @switchView()
 
     __path__: (v) ->
@@ -35,6 +36,7 @@ class FileViewTag extends Ant.OS.GUI.BaseTag
         return unless @get "fetch"
         @get("fetch")(v)
             .then (data) ->
+                return unless data
                 me.set "data", data
                 me.refs.status.set("text", " ") if me.get "status"
             .catch (e) ->
@@ -172,6 +174,7 @@ class FileViewTag extends Ant.OS.GUI.BaseTag
         @refs.treeview.set "fetch", (v) ->
             new Promise (resolve, reject) ->
                 return resolve undefined unless me.get("fetch")
+                return resolve undefined unless v.get("data").path
                 me.get("fetch")(v.get("data").path)
                     .then (d) -> resolve me.getTreeData(d.sort me.sortByType)
                     .catch (e) -> reject e

src/core/tags/LabelTag.coffee

@@ -11,6 +11,9 @@ class LabelTag extends Ant.OS.GUI.BaseTag
 
     mount: () ->
 
+    update: () ->
+        @set "text", @get("text")
+
     __class__: (v) ->
         $(@root).removeClass()
         $(@root).addClass v if v

src/core/tags/ListViewTag.coffee

@@ -155,6 +155,14 @@ class ListViewTag extends Ant.OS.GUI.BaseTag
 
     __buttons__: (v) ->
         return if @get "dropdown"
+        return unless v.length > 0
+        for item in v
+            $(@refs.btlist).show()
+            bt = $("<afx-button>").appendTo @refs.btlist
+            bt[0].uify @observable
+            bt[0].set "*", item
+            item.domel = bt[0]
+
 
     __data__: (data) ->
         $( @refs.mlist).empty()
@@ -203,6 +211,7 @@ class ListViewTag extends Ant.OS.GUI.BaseTag
 
     mount: () ->
         me = @
+        $(@refs.btlist).hide()
         @observable.on "resize", (e) -> me.calibrate()
         @calibrate()
 

src/core/tags/TabContainerTag.coffee

@@ -5,10 +5,12 @@ class TabContainerTag extends Ant.OS.GUI.BaseTag
         @setopt "selectedTab", undefined
         @setopt "tabbarwidth", undefined
         @setopt "tabbarheight", undefined
+        @setopt "ontabselect", () ->
         me = @
         @refs.bar.set "ontabselect", (e) ->
             data = e.data.item.get "data"
             me.set "selectedTab", data
+            me.get("ontabselect") { data: data, id: me.aid() }
 
     __selectedTab: (v) ->
         return unless v

src/core/tags/TreeViewTag.coffee

@@ -28,8 +28,11 @@ class TreeViewItemPrototype extends Ant.OS.GUI.BaseTag
             .removeClass()
         if(v)
             if @get("fetch")
-                @get("fetch")(@root).then (d) ->
+                @get("fetch")(@root)
+                    .then (d) ->
+                        return unless d
                         me.set "nodes", d
+                    .catch (e) -> Ant.OS.announcer.oserror e
             $(@refs.childnodes).show()
         else
             $(@refs.childnodes).hide()

src/core/tags/tag.coffee

@@ -11,9 +11,9 @@ class Ant.OS.GUI.BaseTag
         @root.get = (k) -> me.get k
         @root.aid = () -> me.aid()
         @root.calibrate = () -> me.calibrate()
-        @root.update = () -> me.update()
-        @mounted = false
         @root.sync = () -> me.sync()
+        @mounted = false
+        @root.setup = () -> me.setup()
         @refs = {}
         @setopt "data-id", (Math.floor(Math.random() * 100000) + 1).toString()
         @setopt "tooltip", undefined
@@ -61,6 +61,7 @@ class Ant.OS.GUI.BaseTag
         @get "data-id"
     
     calibrate: () ->
+
     update: () ->
     
     get: (opt) ->
@@ -68,6 +69,11 @@ class Ant.OS.GUI.BaseTag
         @opts[opt]
 
     sync: () ->
+        @update()
+        $(@root).children().each () -> @update()
+        @root
+
+    setup: () ->
         return if @mounted
         @mounted = true
         @mount()
@@ -107,10 +113,15 @@ Element.prototype.mkui = (observable) ->
 
 
 Element.prototype.mount = () ->
-    return @sync() if @sync
+    return @setup() if @setup
     $(@).children().each () -> @mount()
     @
 
+Element.prototype.update = () ->
+    return @sync() if @sync
+    $(@).children().each () -> @update()
+    @
+
 Element.prototype.uify = (observable) ->
     @mkui(observable)
     @mount()

src/index.html

@@ -23,9 +23,8 @@
         <title>AntOS webOS</title>
         <meta charset="UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1">
-        <link href="resources/themes/system/font-awesome.css" rel="stylesheet">
+        <link href="resources/themes/system/system.css" rel="stylesheet">
         <link id="ostheme" rel="stylesheet" href="">
-        <!--link href="theme/antos/style.css" rel="stylesheet"-->
         <script src="scripts/jquery-3.2.1.min.js"></script>
         <script src="scripts/antos.js"></script>
     </head>

src/packages/CoreServices/PushNotification.coffee

@@ -72,14 +72,12 @@ class PushNotification extends this.OS.GUI.BaseService
             .css "bottom", "0"
             .hide()
 
-    pushout: (s, o, mfeed) ->
+    pushout: (s, o) ->
         d = {
             text: "[#{s}] #{o.name} (#{o.id}): #{o.data.m}",
             icon: o.data.icon,
             iconclass: o.data.iconclass,
             closable: true }
-        #console.log o.data.s
-        #console.log o.data.e
         @mlist.unshift d
         @notifeed d
 

src/packages/Setting/AppearanceHandle.coffee

@@ -16,7 +16,7 @@
 # You should have received a copy of the GNU General Public License
 #along with this program. If not, see https://www.gnu.org/licenses/.
 
-class AppearanceHandler extends SettingHandler
+class AppearanceHandle extends SettingHandle
     constructor:(scheme, parent) ->
         super(scheme, parent)
         me = @
@@ -27,23 +27,27 @@ class AppearanceHandler extends SettingHandler
         @themelist = @find "theme-list"
         @syswp = undefined
         @wplist.set "onlistselect", (e) ->
-            $(me.wpreview).css("background-image", "url(#{me.parent._api.handler.get}/#{e.data.path})" )
+            data = e.data.item.get("data")
+            $(me.wpreview)
+                .css("background-image", "url(#{data.path.asFileHandle().getlink()})" )
                 .css("background-size", "cover")
-            me.parent.systemsetting.appearance.wp.url = e.data.path
+            me.parent.systemsetting.appearance.wp.url = data.path
             me.parent._gui.wallpaper()
 
         @wplist.set "buttons", [
             {
                 text: "+", onbtclick: (e) ->
-                    me.parent.openDialog "FileDiaLog", (d, n, p) ->
+                    me.parent.openDialog("FileDialog", {
-                        me.parent.systemsetting.appearance.wps.push p
+                        title: __("Select image file"),
-                        me.render()
+                        mimes: ["image/.*"]
-                    , __("Select image file"), { mimes: ["image/.*"] }
+                    }).then (d) ->
+                        me.parent.systemsetting.appearance.wps.push d.file.path
+                        me.wplist.set "data", me.getwplist()
             }
         ]
         
         @wpsize.set "onlistselect", (e) ->
-            me.parent.systemsetting.appearance.wp.size = e.data.text
+            me.parent.systemsetting.appearance.wp.size = e.data.item.get("data").text
             me.parent._gui.wallpaper()
 
         sizes = [
@@ -51,8 +55,7 @@ class AppearanceHandler extends SettingHandler
             { text: "auto", selected: me.parent.systemsetting.appearance.wp.size is "auto" },
             { text: "contain", selected: me.parent.systemsetting.appearance.wp.size is "contain" }
         ]
-        @wpsize.set "items", sizes
+        @wpsize.set "data", sizes
-        
         
         repeats = [
             { text: "repeat", selected: me.parent.systemsetting.appearance.wp.repeat is "repeat" },
@@ -60,37 +63,37 @@ class AppearanceHandler extends SettingHandler
             { text: "repeat-y", selected: me.parent.systemsetting.appearance.wp.repeat is "repeat-y" },
             { text: "no-repeat", selected: me.parent.systemsetting.appearance.wp.repeat is "no-repeat" }
         ]
-        @wprepeat.set "items", repeats
         @wprepeat.set "onlistselect", (e) ->
-            me.parent.systemsetting.appearance.wp.repeat = e.data.text
+            me.parent.systemsetting.appearance.wp.repeat = e.data.item.get("data").text
             me.parent._gui.wallpaper()
+        @wprepeat.set "data", repeats
 
-        @themelist.set "items" , [{ text: "antos", selected: true }]
+        @themelist.set "data" , [{ text: "antos", selected: true }]
         
-    render: () ->
-        me = @
         if not @syswp
             path = "os://resources/themes/system/wp"
-            path.asFileHandler().read (d) ->
+            path.asFileHandle().read()
-                me.parent.error __("Cannot read wallpaper list from {0}", path) if d.error
+                .then (d) ->
+                    return me.parent.error __("Cannot read wallpaper list from {0}", path) if d.error
                     for v in d.result
                         v.text = v.filename
-                    v.selected = true if v.path is me.parent.systemsetting.appearance.wp.url
                         v.iconclass = "fa fa-file-image-o"
                     me.syswp = d.result
-                me.wplist.set "items", me.getwplist()
+                    me.wplist.set "data", me.getwplist()
+                .catch (e) -> me.parent.error e.stack
         else
             
-            me.wplist.set "items", me.getwplist()
+            me.wplist.set "data", me.getwplist()
     
     getwplist: () ->
         list = []
         for v in @parent.systemsetting.appearance.wps
-            file = v.asFileHandler()
+            file = v.asFileHandle()
             list.push
                 text: file.basename,
                 path: file.path
                 selected: file.path is @parent.systemsetting.appearance.wp.url,
                 iconclass: "fa fa-file-image-o"
         list = list.concat @syswp
+        v.selected = v.path is @parent.systemsetting.appearance.wp.url for v in list
         return list

src/packages/Setting/LocaleHandle.coffee

@@ -16,24 +16,24 @@
 # You should have received a copy of the GNU General Public License
 #along with this program. If not, see https://www.gnu.org/licenses/.
 
-class LocaleHandler extends SettingHandler
+class LocaleHandle extends SettingHandle
-    constructor:(scheme, parent) ->
+    constructor: (scheme, parent) ->
         super(scheme, parent)
         me = @
         @lglist = @find "lglist"
         @localelist = undefined
         @lglist.set "onlistselect", (e) ->
-            me.parent._api.setLocale e.data.text
+            me.parent._api.setLocale e.data.item.get("data").text
-    render: () ->
-        me = @
         if not @localelist
             path = "os://resources/languages"
-            path.asFileHandler().read (d) ->
+            path.asFileHandle().read()
+            .then (d) ->
                 return me.parent.error __("Cannot fetch system locales: {0}", d.error) if d.derror
                 for v in d.result
                     v.text = v.filename.replace /\.json$/g, ""
                     v.selected = v.text is me.parent.systemsetting.system.locale
                 me.localelist = d.result
-                me.lglist.set "items", me.localelist
+                me.lglist.set "data", me.localelist
+            .catch (e) -> me.parent.error e.stack
         else
-            me.lglist.set "items", me.localelist
+            me.lglist.set "data", me.localelist

src/packages/Setting/Makefile

@@ -1,10 +1,10 @@
-coffee_files = main.coffee AppearanceHandler.coffee VFSHandler.coffee LocaleHandler.coffee StartupHandler.coffee
+coffee_files = main.coffee AppearanceHandle.coffee VFSHandle.coffee LocaleHandle.coffee StartupHandle.coffee
 
 jsfiles = 
 
 cssfiles = main.css
 
-copyfiles = scheme.html package.json schemes
+copyfiles = scheme.html package.json
 
 
 PKG_NAME=Setting

src/packages/Setting/StartupHandle.coffee

@@ -16,8 +16,8 @@
 # You should have received a copy of the GNU General Public License
 #along with this program. If not, see https://www.gnu.org/licenses/.
 
-class StartupHandler extends SettingHandler
+class StartupHandle extends SettingHandle
-    constructor:(scheme, parent) ->
+    constructor: (scheme, parent) ->
         super(scheme, parent)
         me = @
         @srvlist = @find "srvlist"
@@ -28,19 +28,22 @@ class StartupHandler extends SettingHandler
                     services = []
                     for k, v of me.parent.systemsetting.system.packages
                         if v.services
-                            srvs = ({ text: "#{k}/#{x}", iconclass:"fa fa-tasks" } for x in v.services)
+                            srvs = ({ text: "#{k}/#{x}", iconclass: "fa fa-tasks" } for x in v.services)
                             services = services.concat srvs
-                    me.parent.openDialog me.mkdialog(), (d) ->
+                    me.parent.openDialog("SelectionDialog", {
-                       me.parent.systemsetting.system.startup.services.push d
+                        title: "__(Add service)",
-                       me.render()
+                        data: services
-                    , "__(Add service)", services
+                    }).then (d) ->
+                       me.parent.systemsetting.system.startup.services.push d.text
+                       me.refresh()
             },
             {
                 text: "-", onbtclick: (e) ->
-                    selidx = me.srvlist.get "selidx"
+                    item = me.srvlist.get "selectedItem"
-                    return unless selidx >= 0
+                    return unless item
-                    me.parent.systemsetting.system.startup.services.splice selidx,1
+                    selidx = $(item).index()
-                    me.render()
+                    me.parent.systemsetting.system.startup.services.splice selidx, 1
+                    me.refresh()
             }
         ]
 
@@ -48,23 +51,27 @@ class StartupHandler extends SettingHandler
             {
                 text: "+", onbtclick: (e) ->
                     apps = ( { text: k, iconclass: v.iconclass } for k, v of  me.parent.systemsetting.system.packages )
-                    me.parent.openDialog me.mkdialog(), (d) ->
+                    me.parent.openDialog("SelectionDialog", {
-                       me.parent.systemsetting.system.startup.apps.push d
+                        title: "__(Add application)",
-                       me.render()
+                        data: apps
-                    , "__(Add application)", apps
+                    }).then (d) ->
+                       me.parent.systemsetting.system.startup.apps.push d.text
+                       me.refresh()
             },
             {
                 text: "-", onbtclick: (e) ->
-                    selidx = me.applist.get "selidx"
+                    item = me.applist.get "selectedItem"
-                    return unless selidx >= 0
+                    return unless item
-                    me.parent.systemsetting.system.startup.apps.splice selidx,1
+                    selidx = $(item).index()
-                    me.render()
+                    me.parent.systemsetting.system.startup.apps.splice selidx, 1
+                    me.refresh()
             }
         ]
+        @refresh()
        
-    render: () ->
+    refresh: () ->
-        @srvlist.set "items", ( { text:v } for v in @parent.systemsetting.system.startup.services )
+        @srvlist.set "data", ( { text:v } for v in @parent.systemsetting.system.startup.services )
-        @applist.set "items", ( { text:v } for v in @parent.systemsetting.system.startup.apps )
+        @applist.set "data", ( { text:v } for v in @parent.systemsetting.system.startup.apps )
         
 
     mkdialog: () ->

src/packages/Setting/VFSHandle.coffee

@@ -0,0 +1,150 @@
+# Copyright 2017-2018 Xuan Sang LE <xsang.le AT gmail DOT com>
+
+# AnTOS Web desktop is is licensed under the GNU General Public
+# License v3.0, see the LICENCE file for more information
+
+# This program is free software: you can redistribute it and/or
+# modify it under the terms of the GNU General Public License as
+# published by the Free Software Foundation, either version 3 of 
+# the License, or (at your option) any later version.
+
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+# General Public License for more details.
+
+# You should have received a copy of the GNU General Public License
+#along with this program. If not, see https://www.gnu.org/licenses/.
+
+class VFSSettingDialog extends this.OS.GUI.BasicDialog
+    constructor: () ->
+        super "VFSSettingDialog", VFSSettingDialog.scheme
+    
+    init: () ->
+        me = @
+        $(@find("txtPath")).click (e) ->
+            me.openDialog("FileDialog", {
+                title: "__(Select a directory)",
+                mimes: ["dir"],
+                hidden: true
+            })
+            .then (d) ->
+                (me.find "txtPath").value = d.file.path
+
+        @find("btnOk").set "onbtclick", (e) ->
+            data = {
+                path: (me.find "txtPath").value,
+                name: (me.find "txtName").value
+            }
+            return me.error __("Please enter mount point name") unless data.name and data.name isnt ""
+            return me .error __("Please select a directory") unless data.path and data.path isnt ""
+            me.handle(data) if me.handle
+            me.quit()
+        
+        (@find "btnCancel").set "onbtclick", (e) ->
+            me.quit()
+
+        return unless @data
+        (@find "txtName").value = @data.text if @data.text
+        (@find "txtPath").value = @data.path if @data.path
+
+VFSSettingDialog.scheme = """
+<afx-app-window  width='250' height='180' apptitle = "__(Mount Points)">
+    <afx-vbox>
+        <afx-hbox>
+            <div data-width = "10" />
+            <afx-vbox>
+                <div data-height="10" />
+                <afx-label data-height="30" text = "__(Name)" />
+                <input type = "text" data-id= "txtName" />
+                <div data-height="3" />
+                <afx-label data-height="30" text = "__(Path)" />
+                <input type = "text" data-id= "txtPath" />
+                <div data-height="10" />
+                <afx-hbox data-height="30">
+                    <div />
+                    <afx-button data-id = "btnOk" text = "__(Ok)" data-width = "40" />
+                    <afx-button data-id = "btnCancel" text = "__(Cancel)" data-width = "50" />
+                </afx-hbox>
+            </afx-vbox>
+            <div data-width = "10" />
+        </afx-hbox>
+    </afx-vbox>
+</afx-app-window>
+"""
+
+class VFSHandle extends SettingHandle
+    constructor: (scheme, parent) ->
+        super(scheme, parent)
+        me = @
+        @mplist = @find "mplist"
+        @dpath = @find "dpath"
+        @ppath = @find "ppath"
+        @mplist.set "buttons", [
+            {
+                text: "+",
+                onbtclick: (e) ->
+                    me.parent.openDialog(new VFSSettingDialog(), {
+                        title: "__(Add mount point)"
+                    })
+                    .then (d) ->
+                        me.parent.systemsetting.VFS.mountpoints.push {
+                            text: d.name, path: d.path, iconclass: "fa fa-folder", type: "fs"
+                        }
+                        me.refresh()
+            },
+            {
+                text: "-",
+                onbtclick: (e) ->
+                    item = me.mplist.get "selectedItem"
+                    return unless item
+                    selidx = $(item).index()
+                    me.parent.openDialog("YesNoDialog", {
+                        title: "__(Remove)",
+                        text: __("Remove: {0}?", item.get("data").text)
+                    }).then (d) ->
+                        return unless d
+                        me.parent.systemsetting.VFS.mountpoints.splice selidx, 1
+                        me.refresh()
+            },
+            {
+                text: "",
+                iconclass: "fa fa-pencil",
+                onbtclick: (e) ->
+                    sel = me.mplist.get "selectedItem"
+                    return unless sel
+                    me.parent.openDialog(new VFSSettingDialog(), {
+                        title: "__(Edit mount point)",
+                        text: sel.get("data").text,
+                        path: sel.get("data").path
+                    }).then (d) ->
+                        sel.get("data").text = d.name
+                        sel.get("data").path = d.path
+                        me.refresh()
+            }
+        ]
+        (@find "btndpath").set 'onbtclick', (e) ->
+            me.parent.openDialog("FileDialog", {
+                title: "__(Select a directory)",
+                mimes: ["dir"],
+                hidden: true
+            }).then (d) ->
+                me.parent.systemsetting.desktop.path = d.file.path
+                me.parent._gui.refreshDesktop()
+                me.refresh()
+        
+        (@find "btnppath").set 'onbtclick', (e) ->
+            me.parent.openDialog("FileDialog", {
+                title: "__(Select a directory)",
+                mimes: ["dir"],
+                hidden: true
+            }).then (d) ->
+                me.parent.systemsetting.system.pkgpaths.user = d.file.path
+                me.refresh()
+        me.refresh()
+
+    refresh: () ->
+        me = @
+        @mplist.set "data", @parent.systemsetting.VFS.mountpoints
+        @dpath.set "text", @parent.systemsetting.desktop.path
+        @ppath.set "text", @parent.systemsetting.system.pkgpaths.user

src/packages/Setting/VFSHandler.coffee

@@ -1,117 +0,0 @@
-# Copyright 2017-2018 Xuan Sang LE <xsang.le AT gmail DOT com>
-
-# AnTOS Web desktop is is licensed under the GNU General Public
-# License v3.0, see the LICENCE file for more information
-
-# This program is free software: you can redistribute it and/or
-# modify it under the terms of the GNU General Public License as
-# published by the Free Software Foundation, either version 3 of 
-# the License, or (at your option) any later version.
-
-# This program is distributed in the hope that it will be useful,
-# but WITHOUT ANY WARRANTY; without even the implied warranty of
-# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
-# General Public License for more details.
-
-# You should have received a copy of the GNU General Public License
-#along with this program. If not, see https://www.gnu.org/licenses/.
-
-class VFSHandler extends SettingHandler
-    constructor:(scheme, parent) ->
-        super(scheme, parent)
-        me = @
-        @mplist = @find "mplist"
-        @dpath = @find "dpath"
-        @ppath = @find "ppath"
-        @mplist.set "buttons", [
-            {
-                text: "+",
-                onbtclick: (e) ->
-                    me.parent.openDialog me.mkdialog(), (d) ->
-                        me.parent.systemsetting.VFS.mountpoints.push {
-                            text: d.name, path: d.path, iconclass: "fa fa-folder", type: "fs"
-                        }
-                        me.render()
-                    , "__(Add mount point)"
-            },
-            {
-                text: "-",
-                onbtclick: (e) ->
-                    selidx = me.mplist.get "selidx"
-                    sel = me.mplist.get "selected"
-                    return unless selidx >= 0
-                    me.parent.openDialog "YesNoDialog", (d) ->
-                        return unless d
-                        me.parent.systemsetting.VFS.mountpoints.splice selidx, 1
-                        me.render()
-                    , "__(Remove)", { text: __("Remove: {0}?", sel.text) }
-            },
-            {
-                text: "",
-                iconclass: "fa fa-pencil",
-                onbtclick: (e) ->
-                    sel = me.mplist.get "selected"
-                    return unless sel
-                    me.parent.openDialog me.mkdialog(), (d) ->
-                        d.el.text = d.name
-                        d.el.path = d.path 
-                        me.render()
-                    , "__(Edit mount point)", sel
-            }
-        ]
-        (@find "btndpath").set 'onbtclick', (e) ->
-            me.parent.openDialog "FileDiaLog", (d, n, p) ->
-                me.parent.systemsetting.desktop.path = p
-                me.parent._gui.refreshDesktop()
-                me.render()
-            , "__(Select a directory)", { mimes: ["dir"], hidden: true }
-        
-        (@find "btnppath").set 'onbtclick', (e) ->
-            me.parent.openDialog "FileDiaLog", (d, n, p) ->
-                me.parent.systemsetting.system.pkgpaths.user = p
-                me.render()
-            , "__(Select a directory)", { mimes: ["dir"], hidden: true }
-    render: () ->
-        me = @
-        @mplist.set "items", @parent.systemsetting.VFS.mountpoints
-        @dpath.set "text", @parent.systemsetting.desktop.path
-        @ppath.set "text", @parent.systemsetting.system.pkgpaths.user
-
-    mkdialog: () ->
-        return @parent._gui.mkdialog {
-            name: "MountPointDialog",
-            layout: {
-                tags: [
-                    { tag: "afx-label", att: 'text="__(Name)" data-height="20"' },
-                    { tag: "input", att: "type='text' data-height='25'" },
-                    { tag: "afx-label", att: 'text="__(Path)" data-height="20"' },
-                    { tag: "input", att: "type='text' data-height='25'" }
-                ],
-                width: 250,
-                height: 150,
-                resizable: false,
-                buttons: [
-                    {
-                        label: "__(Ok)", onclick: (d) ->
-                            data = {
-                                name: (d.find "content1").value,
-                                path: (d.find "content3").value,
-                                el: d.data
-                            }
-                            return d.error __("Please enter mount point name") unless data.name and data.name isnt ""
-                            return d.error __("Please select a directory") unless data.path and data.path isnt ""
-                            d.handler(data) if d.handler
-                            d.quit()
-                    },
-                    { label: "__(Cancel)", onclick: (d) -> d.quit() }
-                ],
-                filldata: (dia) ->
-                    $(dia.find "content3").click (e) ->
-                        dia.openDialog "FileDiaLog", (d, n, p) ->
-                            (dia.find "content3").value = p
-                        , "__(Select a directory)", { mimes: ["dir"], hidden: true }
-                    return unless dia.data
-                    (dia.find "content1").value = dia.data.text if dia.data.text
-                    (dia.find "content3").value = dia.data.path if dia.data.path
-            }
-        }

src/packages/Setting/main.coffee

@@ -16,15 +16,13 @@
 # You should have received a copy of the GNU General Public License
 #along with this program. If not, see https://www.gnu.org/licenses/.
 
-class SettingHandler
+class SettingHandle
-    constructor:(@scheme, @parent) ->
+    constructor: (@scheme, @parent) ->
 
     find: (id) -> ($ "[data-id='#{id}']", @scheme)[0] if @scheme
 
     render: () ->
 
-
-
 class Setting extends this.OS.GUI.BaseApplication
     constructor: (args) ->
         super "Setting", args
@@ -32,39 +30,18 @@ class Setting extends this.OS.GUI.BaseApplication
     main: () ->
         me = @
         @container = @find "container"
-        @container.setTabs [ 
+
-            {
+        new AppearanceHandle @find("appearance"), @
-                text: "__(Appearance)",
+        new VFSHandle @find("vfs"), @
-                iconclass: "fa fa-paint-brush",
+        new LocaleHandle @find("locale"), @
-                url: "#{@path()}/schemes/appearance.html",
+        new StartupHandle @find("startup"), @
-                handler: (sch) ->
+
-                    new AppearanceHandler sch, me
-            },
-            {
-                text: "__(VFS)",
-                iconclass: "fa fa-inbox" ,
-                url: "#{@path()}/schemes/vfs.html" ,
-                handler: (sch) ->
-                    new VFSHandler sch, me
-            },
-            {
-                text: "__(Languages)",
-                iconclass: "fa fa-globe",
-                url: "#{@path()}/schemes/locale.html",
-                handler: (sch) ->
-                    new LocaleHandler sch, me
-            },
-            {
-                text: "__(Startup)",
-                iconclass: "fa fa-cog",
-                url: "#{@path()}/schemes/startup.html",
-                handler: (sch) ->
-                    new StartupHandler sch,me
-            }
-        ]
         (@find "btnsave").set "onbtclick", (e) ->
-            me._api.setting  (d) ->
+            me._api.setting()
+                .then (d) ->
                     return me.error __("Cannot save system setting: {0}", d.error) if d.error
                     me.notify __("System setting saved")
+                .catch (e) ->
+                    me.error __("Cannot save system setting: {0}", e.stack)
 Setting.singleton = true
 this.OS.register "Setting", Setting

src/packages/Setting/main.css

@@ -1,4 +1,4 @@
-afx-app-window[data-id = "setting-window"] afx-tab-container afx-tab-bar afx-list-view > div > ul > li{
+afx-app-window[data-id = "setting-window"] afx-tab-container afx-tab-bar afx-list-view > div > ul  li{
     float:none;
     border-radius: 0;
     font-weight: bold;
@@ -6,8 +6,8 @@ afx-app-window[data-id = "setting-window"] afx-tab-container afx-tab-bar afx-lis
     padding-bottom: 3px;
     border:0;
 }
-afx-app-window[data-id = "setting-window"] afx-tab-container  div[data-ref="container"]{
+afx-app-window[data-id = "setting-window"] afx-tab-bar{
-    border-left: 1px solid #cbcbcb;
+    border-right: 1px solid #cbcbcb;
 }
 
 afx-app-window[data-id = "setting-window"] afx-label.header{
@@ -17,39 +17,39 @@ afx-app-window[data-id = "setting-window"] div.footer{
     border-right: 1px solid #cbcbcb;
 }
 /*APPEARANCE*/
-afx-app-window[data-id = "setting-window"] afx-vbox[data-id="appearance"] div[data-id = "wp-preview"]{
+afx-app-window[data-id = "setting-window"] afx-hbox[data-id="appearance"] div[data-id = "wp-preview"]{
     display: block;
     border:1px solid #cbcbcb;
     border-radius: 10px;
 }
 
-afx-app-window[data-id = "setting-window"] afx-vbox[data-id="appearance"] afx-list-view[data-id="wplist"]
+afx-app-window[data-id = "setting-window"] afx-hbox[data-id="appearance"] afx-list-view[data-id="wplist"]
 {
     border:1px solid #cbcbcb;
     padding:2px;
 }
-afx-app-window[data-id = "setting-window"] afx-vbox[data-id="appearance"] afx-resizer{
+afx-app-window[data-id = "setting-window"] afx-hbox[data-id="appearance"] afx-resizer{
     border:0;
     background-color: transparent;
 }
 /*VFS*/
-afx-app-window[data-id = "setting-window"] afx-vbox[data-id="vfs"] afx-list-view[data-id="mplist"]
+afx-app-window[data-id = "setting-window"] afx-hbox[data-id="vfs"] afx-list-view[data-id="mplist"]
 {
     border: 1px solid #cbcbcb;
 }
 
-afx-app-window[data-id = "setting-window"] afx-vbox[data-id="vfs"] afx-button.btnsel button{
+afx-app-window[data-id = "setting-window"] afx-hbox[data-id="vfs"] afx-button.btnsel button{
     border-radius: 0;
     padding-top:2px;
     padding-bottom: 2px;
 }
 /*LANGUAGES*/
-afx-app-window[data-id = "setting-window"] afx-vbox[data-id="locale"] afx-list-view[data-id="lglist"]
+afx-app-window[data-id = "setting-window"] afx-hbox[data-id="locale"] afx-list-view[data-id="lglist"]
 {
     border: 1px solid #cbcbcb;
 }
 /*STARTUP*/
-afx-app-window[data-id = "setting-window"] afx-vbox[data-id="startup"] afx-list-view
+afx-app-window[data-id = "setting-window"] afx-hbox[data-id="startup"] afx-list-view
 {
     border: 1px solid #cbcbcb;
 }

src/packages/Setting/scheme.html

@@ -1,6 +1,83 @@
 <afx-app-window data-id = "setting-window" apptitle="Setting" width="600" height="400">
    <afx-vbox>
-        <afx-tab-container data-id = "container" barwidth="120" bar="left"></afx-tab-container>
+        <afx-tab-container data-id = "container" dir = "row" tabbarwidth= "120">
+
+            <afx-hbox tabname="__(Appearance)" data-id="appearance" iconclass = "fa fa-paint-brush">
+                <div data-width="10"></div>
+                <afx-vbox>
+                    <div data-height="5"></div>
+                    <afx-label text = "__(Wallpaper)" iconclass = "fa fa-image" class = "header" data-height="23"></afx-label>
+                    <afx-hbox>
+                        <afx-list-view data-width="150" data-id="wplist"></afx-list-view>
+                        <afx-resizer data-width="2"></afx-resizer>
+                        <afx-vbox>
+                            <div data-id = "wp-preview"></div>
+                            <div data-height="5"></div>
+                            <afx-hbox data-height="25">
+                                <afx-list-view data-id = "wpsize"  dropdown="true"></afx-list-view>
+                                <div data-width="5"></div>
+                                <afx-list-view data-id = "wprepeat"  dropdown="true"></afx-list-view>
+                            </afx-hbox>
+                        </afx-vbox>
+                    </afx-hbox>
+                    <div data-height="5"></div>
+                    <afx-label text = "__(Theme)" iconclass = "fa fa-window-restore" class = "header" data-height="23"></afx-label>
+                    <afx-list-view data-height="30" data-id="theme-list" dropdown="true"></afx-list-view>
+                    <div data-height="5"></div>
+                </afx-vbox>
+                <div data-width="10"></div>
+            </afx-hbox>
+            
+            <afx-hbox data-id="vfs" tabname = "__(VFS)" iconclass = "fa fa-inbox">
+                <div data-width="10"></div>
+                <afx-vbox>
+                    <div data-height="5"></div>
+                    <afx-label text = "__(Mount points)" iconclass = "fa fa-folder" class = "header" data-height="23"></afx-label>
+                    <afx-list-view  data-id="mplist"></afx-list-view>
+                    <div data-height="5"></div>
+                    <afx-label text = "__(Desktop path)" iconclass = "fa fa-desktop" class = "header" data-height="23"></afx-label>
+                    <afx-hbox data-height = "25" >
+                        <div data-width="16"></div>
+                        <afx-label data-id="dpath"></afx-label>
+                        <afx-button text="" iconclass = "fa fa-arrow-up" data-id="btndpath" data-width="20" class="btnsel"></afx-button>
+                    </afx-hbox>
+                    <div data-height="5"></div>
+                    <afx-label text = "__(Local packages path)" iconclass = "fa fa-cube" class = "header" data-height="23"></afx-label>
+                    <afx-hbox data-height = "25" >
+                        <div data-width="16"></div>
+                        <afx-label data-id="ppath"></afx-label>
+                        <afx-button text="" data-id="btnppath" iconclass = "fa fa-arrow-up" data-width="20" class="btnsel"></afx-button>
+                        </afx-hbox>
+                    <div data-height="10"></div>
+                </afx-vbox>
+                <div data-width="10"></div>
+            </afx-hbox>
+            
+            <afx-hbox data-id="locale" tabname = "__(Languages)"iconclass = "fa fa-globe">
+                <div data-width="10"></div>
+                <afx-vbox>
+                    <div data-height="5"></div>
+                    <afx-label text = "__(System locale)" iconclass = "fa fa-globe" class = "header" data-height="23"></afx-label>
+                    <afx-list-view  data-id="lglist"></afx-list-view>
+                    <div data-height="10"></div>
+                </afx-vbox>
+                <div data-width="10"></div>
+            </afx-hbox>
+
+            <afx-hbox data-id="startup" tabname = "__(Startup)" iconclass = "fa fa-cog">
+                <div data-width="10"></div>
+                <afx-vbox>
+                    <afx-label text = "__(Startup services)" iconclass = "fa fa-tasks" class = "header" data-height="23"></afx-label>
+                    <afx-list-view  data-id="srvlist"></afx-list-view>
+                    <div data-height="5"></div>
+                    <afx-label text = "__(Startup applications)" iconclass = "fa fa-adn" class = "header" data-height="23"></afx-label>
+                    <afx-list-view  data-id="applist"></afx-list-view>
+                    <div data-height="10"></div>
+                </afx-vbox>
+                <div data-width="10"></div>
+            </afx-hbox>
+
+        </afx-tab-container>
         <afx-hbox  data-height="35">
             <div data-width = "120" class = "footer"></div>
             <div style="text-align:right" >

src/packages/Setting/schemes/appearance.html

@@ -1,27 +0,0 @@
-<afx-vbox data-id="appearance">
-    <div data-height="5"></div>
-    <afx-hbox>
-        <div data-width="10"></div>
-        <afx-vbox>
-            <afx-label text = "__(Wallpaper)" iconclass = "fa fa-image" class = "header" data-height="23"></afx-label>
-            <afx-hbox>
-                <afx-list-view data-width="150" data-id="wplist"></afx-list-view>
-                <afx-resizer data-width="5"></afx-resizer>
-                <afx-vbox>
-                    <div data-id = "wp-preview"></div>
-                    <div data-height="5"></div>
-                    <afx-hbox data-height="25">
-                        <afx-list-view data-id = "wpsize"  dropdown="true"></afx-list-view>
-                        <div data-width="5"></div>
-                        <afx-list-view data-id = "wprepeat"  dropdown="true"></afx-list-view>
-                    </afx-hbox>
-                </afx-vbox>
-            </afx-hbox>
-            <div data-height="5"></div>
-            <afx-label text = "__(Theme)" iconclass = "fa fa-window-restore" class = "header" data-height="23"></afx-label>
-            <afx-list-view data-height="30" data-id="theme-list" dropdown="true"></afx-list-view>
-            <div data-height="5"></div>
-        </afx-vbox>
-        <div data-width="10"></div>
-    </afx-hbox>
-</afx-vbox>

src/packages/Setting/schemes/locale.html

@@ -1,12 +0,0 @@
-<afx-vbox data-id="locale">
-    <div data-height="5"></div>
-    <afx-hbox>
-        <div data-width="10"></div>
-        <afx-vbox>
-            <afx-label text = "__(System locale)" iconclass = "fa fa-globe" class = "header" data-height="23"></afx-label>
-            <afx-list-view  data-id="lglist"></afx-list-view>
-            <div data-height="10"></div>
-        </afx-vbox>
-        <div data-width="10"></div>
-    </afx-hbox>
-</afx-vbox>

src/packages/Setting/schemes/startup.html

@@ -1,15 +0,0 @@
-<afx-vbox data-id="startup">
-    <div data-height="5"></div>
-    <afx-hbox>
-        <div data-width="10"></div>
-        <afx-vbox>
-            <afx-label text = "__(Startup services)" iconclass = "fa fa-tasks" class = "header" data-height="23"></afx-label>
-            <afx-list-view  data-id="srvlist"></afx-list-view>
-            <div data-height="5"></div>
-            <afx-label text = "__(Startup applications)" iconclass = "fa fa-adn" class = "header" data-height="23"></afx-label>
-            <afx-list-view  data-id="applist"></afx-list-view>
-            <div data-height="10"></div>
-        </afx-vbox>
-        <div data-width="10"></div>
-    </afx-hbox>
-</afx-vbox>

src/packages/Setting/schemes/vfs.html

@@ -1,26 +0,0 @@
-<afx-vbox data-id="vfs">
-    <div data-height="5"></div>
-    <afx-hbox>
-        <div data-width="10"></div>
-        <afx-vbox>
-            <afx-label text = "__(Mount points)" iconclass = "fa fa-folder" class = "header" data-height="23"></afx-label>
-            <afx-list-view  data-id="mplist"></afx-list-view>
-            <div data-height="5"></div>
-            <afx-label text = "__(Desktop path)" iconclass = "fa fa-desktop" class = "header" data-height="23"></afx-label>
-            <afx-hbox data-height = "25" >
-                <div data-width="16"></div>
-                <afx-label data-id="dpath"></afx-label>
-                <afx-button text="" iconclass = "fa fa-arrow-up" data-id="btndpath" data-width="20" class="btnsel"></afx-button>
-            </afx-hbox>
-            <div data-height="5"></div>
-            <afx-label text = "__(Local packages path)" iconclass = "fa fa-cube" class = "header" data-height="23"></afx-label>
-            <afx-hbox data-height = "25" >
-                <div data-width="16"></div>
-                <afx-label data-id="ppath"></afx-label>
-                <afx-button text="" data-id="btnppath" iconclass = "fa fa-arrow-up" data-width="20" class="btnsel"></afx-button>
-                </afx-hbox>
-            <div data-height="10"></div>
-        </afx-vbox>
-        <div data-width="10"></div>
-    </afx-hbox>
-</afx-vbox>

src/packages/ShowCase/coffees/main.coffee

@@ -8,13 +8,13 @@ class ShowCase extends this.OS.GUI.BaseApplication
         
         bt = @find 'bttest'
         bt.set "onbtclick", (e) ->
-            console.log "btclicked"
+            me.notify "btclicked"
         
         @observable.on "btclick", (e) ->
-            console.log "button clicked"
+            me.notify "button clicked"
 
         @observable.on "menuselect", (e) ->
-            console.log e.id
+            me.notify e.id
 
         list = @find 'list'
 
@@ -27,19 +27,15 @@ class ShowCase extends this.OS.GUI.BaseApplication
             { text: "some thing 5" }
         ]
         list.unshift { text: "shifted el" }
-        list.set "onlistselect", (e) -> console.log(e.data.items)
+        list.set "onlistselect", (e) -> me.notify(e.data.items)
-        @observable.on "itemclose", (e) ->
-            console.log "remove", list.get("data")
-            console.log list[0].get "selectedItem"
-            console.log list[0].get "selectedItems"
 
         sw = @find 'switch'
         sw.set "onchange", (e) ->
-            console.log e.data
+            me.notify e.data
         
         spin = @find 'spin'
         spin.set "onchange", (e) ->
-            console.log e.data
+            me.notify e.data
 
         menu = @find 'menu'
         menu.set "items", @menu()
@@ -50,9 +46,9 @@ class ShowCase extends this.OS.GUI.BaseApplication
         
         grid = @find 'grid'
         grid.set "oncelldbclick", (e) ->
-            console.log  "on dbclick", e
+            me.notify  "on dbclick", e
         grid.set "onrowselect", (e) ->
-            console.log  "on rowselect", e.data.items
+            me.notify  "on rowselect", e.data.items
         
         @observable.on "cellselect", (e) ->
             console.log  "observable", e
@@ -104,25 +100,25 @@ class ShowCase extends this.OS.GUI.BaseApplication
         tree = @find 'tree'
         tree.set "data", tdata
         tree.set "ontreeselect", (e) ->
-            console.log e.data.item.get "treepath"
+            me.notify e.data.item.get "treepath"
         tree.set "ontreedbclick", (e) ->
-            console.log "treedbclick", e
+            me.notify "treedbclick", e
         @observable.on "treedbclick", (e) ->
-            console.log "observable treedbclick", e
+            me.notify "observable treedbclick", e
         
         slider = @find 'slider'
-        slider.set "onchanging", (v) ->
+        slider.set "onchange", (v) ->
-            console.log v
+            me.notify v
 
         cal = @find 'cal'
         cal.set "ondateselect", (e) ->
-            console.log e
+            me.notify e
         
         pk = @find 'cpk'
         pk.set "oncolorselect", (e) ->
-            console.log e
+            me.notify e
         pk.set "oncolorselect", (e) ->
-            console.log e
+            me.notify e
 
         fileview = @find 'fileview'
         fileview.set "fetch", (path) ->
@@ -144,7 +140,7 @@ class ShowCase extends this.OS.GUI.BaseApplication
             { text: "tree" }
         ]
         viewoption.set "onlistselect", (e) ->
-            console.log e.data.item.get("data").text
+            me.notify e.data.item.get("data").text
             fileview.set "view", e.data.item.get("data").text
 
         dllist = @find "dialoglist"
@@ -172,17 +168,17 @@ class ShowCase extends this.OS.GUI.BaseApplication
                             label: "enter value"
                         })
                         .then (d) ->
-                            console.log d
+                            me.notify d
                 when "calendar"
                     me.openDialog("CalendarDialog", {
                             title: "Calendar"
                     })
                         .then (d) ->
-                            console.log d
+                            me.notify d
                 when "colorpicker"
                     me.openDialog("ColorPickerDialog")
                         .then (d) ->
-                            console.log d
+                            me.notify d
                 when "info"
                     me.openDialog("InfoDialog", {
                         title: "Info application",
@@ -197,7 +193,7 @@ class ShowCase extends this.OS.GUI.BaseApplication
                             text: "Do you realy want to delete file ?"
                         })
                         .then (d) ->
-                            console.log d
+                            me.notify d
                 when "selection"
                     me.openDialog("SelectionDialog", {
                             title: "Select data ?",
@@ -208,7 +204,7 @@ class ShowCase extends this.OS.GUI.BaseApplication
                             ]
                         })
                         .then (d) ->
-                            console.log d
+                            me.notify d.text
                 when "about"
                     me.openDialog("AboutDialog" )
                         .then (d) ->
@@ -220,13 +216,13 @@ class ShowCase extends this.OS.GUI.BaseApplication
                             file: "Untitled".asFileHandle()
                         })
                         .then (f, name) ->
-                            console.log f, name
+                            me.notify f, name
                 else return
                     
 
 
     mnFile: () ->
-        #console.log file
+        #me.notify file
         me = @
         arr = {
             text: "__(File)",
@@ -238,7 +234,7 @@ class ShowCase extends this.OS.GUI.BaseApplication
                 { text: "__(Download)", dataid: "#{@name}-download" },
                 { text: "__(Share file)", dataid: "#{@name}-share", shortcut: 'C-S' },
                 { text: "__(Properties)", dataid: "#{@name}-info", shortcut: 'C-I' }
-            ], onchildselect: (e) -> console.log "child", e
+            ], onchildselect: (e) -> me.notify "child", e
         }
         return arr
     mnEdit: () ->

src/themes/antos/afx-app-window.css

@@ -1,29 +1,18 @@
 afx-app-window div.afx-window-wrapper{
     border:1px solid #a6a6a6;
-    /*box-shadow: 1px 1px 1px #cbcbcb;*/
     box-shadow: 1px 1px 1px #9f9F9F;
     border-radius: 5px;
     background-color:#dfdfdf;
-    padding:0;
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    height: 100%;
 }
 afx-app-window.unactive > div.afx-window-wrapper{
     background-color: #f6f6f6;
 }
 
 afx-app-window ul.afx-window-top{
-    margin: 0;
-    padding: 0;
-    width: 100%;
-    padding:0;
     height: 20px;
     border-bottom: 1px solid #a6a6a6;
 }
 afx-app-window ul.afx-window-top li{
-    list-style: none;
     margin-left: 3px;
     margin-top:4px;
     
@@ -48,8 +37,6 @@ afx-app-window ul li.afx-window-maximize{
 
 afx-app-window ul li.afx-window-title{
     margin-top:1px;
-    float:none;
-    overflow: hidden;
     padding-left: 5px;
     padding-right: 5px;
     text-align: center;
@@ -57,16 +44,7 @@ afx-app-window ul li.afx-window-title{
 
 afx-app-window div.afx-window-content
 {
-    overflow: hidden;
-    width: 100%;
     background-color: white;
-    flex-grow: 1;
     border-bottom-left-radius: 5px;
     border-bottom-right-radius: 5px;
 }
-
-afx-app-window div.afx-window-grip{
-    height: 10px;
-    width: 10px;
-    background-color: transparent;
-}

src/themes/antos/afx-button.css

@@ -1,5 +1,4 @@
 afx-button button{
-    outline: none;
     padding: 4px;
     border: 1px solid #a6a6a6;
     background-color: #f6F6F6;
@@ -16,7 +15,6 @@ afx-button i.icon-style {
     width: 16px;
     height: 16px;
     display: inline-block;
-    float:left;
 }
 afx-button button:active, afx-button button.btactive {
     background-color: #2786F3;

src/themes/antos/afx-dock.css

@@ -1,16 +1,13 @@
 afx-apps-dock{
-    float: left;
     bottom: 3px;
     top: 3px;
     width: 32px;
     background-color:#e7e7e7;
-    position: absolute;
     padding:2px;
     padding-top: 5px;
     border-top-right-radius: 5px;
     border-bottom-right-radius: 5px;
     border:1px solid #a6a6a6;
-    overflow: hidden;
     box-shadow: 1px 1px 1px #9f9F9F;
 }
 afx-apps-dock afx-button button{

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

@@ -1,21 +1,12 @@
-afx-file-view {
-    position: relative;
-}
 afx-file-view afx-label.status{
-    position: absolute;
-    bottom: 1px;
-    left:0px;
     padding:3px;
     right: 0px;
     height: 15px;
     background-color: #f6F6F6;
     border-top: 1px solid #cbcbcb;
     color:#414339;
-    transform: translateZ(0);
 }
 afx-file-view afx-list-view > div.list-container > ul  li{
-    float:left;
-    display: block;
     width:70px;
     height: 60px;
     background-color: transparent;
@@ -38,7 +29,6 @@ afx-file-view afx-list-view i.dir:before{
 afx-file-view afx-list-view i{
     width: 32px;
     height: 32px;
-    display: block;
     margin-left: 19px;
 }
 
@@ -77,7 +67,6 @@ afx-file-view afx-grid-view i.dir:before{
     font-weight: normal;
 }
 afx-file-view afx-grid-view i{
-    display: inline-block;
     margin-right: 5px;
 }
 afx-file-view afx-grid-view afx-grid-row.afx-grid-row-selected  i:before{
@@ -106,14 +95,7 @@ afx-file-view afx-tree-view .afx-tree-view-folder-open:before{
     color:#76D2F9;
     font-size: 16px;
 }
-afx-file-view afx-tree-view{
+
-    margin:0;
-    overflow: hidden;
-    background-color: transparent;
-}
-afx-file-view afx-tree-view .afx_tree_item_odd{
-    background-color: transparent;
-}
 afx-file-view afx-tree-view .afx-tree-view-item:before{
     content: "\f016"; 
     font-family: "FontAwesome";
@@ -122,18 +104,7 @@ afx-file-view afx-tree-view .afx-tree-view-item:before{
     font-style: normal;
     font-weight: normal;
 }
-afx-file-view afx-tree-view div{
+
-    overflow: hidden;
-    white-space: nowrap;
-    background-color: transparent;
-    padding:0;
-}
-afx-file-view  div.treecontainer{
-    display: block;
-    overflow: auto;
-    padding:0;
-    margin:0;
-}
 afx-file-view afx-tree-view div.afx_tree_item_selected, afx-file-view afx-tree-view div.afx_tree_item_selected:hover{
     background-color: transparent;
     color:#414339;

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

@@ -1,9 +1,3 @@
-afx-grid-view afx-grid-row afx-grid-cell{
-    user-select:none;
-    -webkit-user-select:none;
-    cursor:default;
-}
-
 afx-grid-view afx-grid-row:nth-child(even) afx-grid-cell
 {
     background-color: #f5F5F5;
@@ -22,9 +16,4 @@ afx-grid-view afx-grid-row.afx-grid-row-selected afx-grid-cell.afx-grid-cell-sel
 
 afx-grid-view .grid_row_header afx-grid-cell{
     border-right: 2px solid #e5e5e5;
-    user-select:none;
-    -webkit-user-select:none;
-    cursor:default;
-    font-weight: bold;
-    border-right:0;
 }

src/themes/antos/afx-label.css

@@ -1,7 +1,6 @@
 afx-label  i.icon-style {
     width: 16px;
     height: 16px;
-    float: left;
 }
 
 afx-label  i

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

@@ -1,41 +1,10 @@
-afx-list-view{
-    overflow:hidden;
-    /*padding: 5px;*/
-    display: block;
-}
-/*
-afx-list-view div.list-container{
-    width: 100%;
-    height: 100%;
-    display: inline-block;
-    position: relative;
-    background-color: red;
-}*/
-afx-list-view afx-list-item
-{
-    display: contents;
-}
-afx-list-view > div.list-container{
-    overflow: auto;
-}
-afx-list-view > div.list-container >  ul{
-    margin:0;
-    padding: 0;
-}
-
 afx-list-view  > div.list-container > ul  li{
-    margin:0;
-    padding:0;
-    list-style: none;
     padding: 5px;
     padding-top:3px;
     padding-bottom: 3px;
     padding-right: 10px;
     color: #414339;
     background-color: white;
-    position: relative;
-    -webkit-user-select:none;
-    cursor:default;
 }
 afx-list-view > div.list-container > ul afx-list-item:nth-child(even) li{
     background-color:#f5F5F5;
@@ -43,19 +12,12 @@ afx-list-view > div.list-container > ul afx-list-item:nth-child(even) li{
 afx-list-view  i.closable{
     width: 16px;
     height: 16px;
-    display: inline-block;
-    position:absolute;
-    top:0px;
-    right:2px;
-    cursor: pointer;
 }
+
 afx-list-view  i.closable:before{
-    content: "\f00d"; 
-    font-family: "FontAwesome";
     font-size: 10px;
     margin-left: 10px;
     color: #414339;
-    font-style: normal;
 }
 
 afx-list-view  > div.list-container > ul  li > i {
@@ -67,45 +29,15 @@ afx-list-view > div.list-container > ul > afx-list-item > li.selected{
     color:white;
 }
 
-/*
-afx-list-view.dropdown div.list-container{
-    position: relative;
-    display: inline-block;
-}
-
-afx-list-view.dropdown div.list-container ul{
-    position:absolute;
-    top:100%;
-    left:0;
-    display: none;
-    border:1px solid red;
-}*/
-
-afx-list-view.dropdown {
-    padding:0;
-    margin: 0;
-}
-afx-list-view.dropdown > div.list-container{
-    overflow: visible;
-}
-afx-list-view.dropdown > div.list-container > ul{
-    max-height: 150px;
-    overflow-y: auto;
-    overflow-x: hidden;
-    background-color: white;
-}
 afx-list-view.dropdown > div.list-container > ul{
     border:1px solid #a6a6a6;
     box-shadow: 1px 1px 1px #9f9F9F;
     border-radius: 3px;
-    /*padding:2px;*/
+    max-height: 150px;
+    background-color: white;
     border-top-left-radius: 0px;
     z-index: 10;
 }
-afx-list-view.dropdown > div.list-container > ul  li{
-    display: inline-block;
-    width:100%;
-}
 
 afx-list-view.dropdown div.list-container div{
     color: #414339;
@@ -147,12 +79,7 @@ afx-list-view ul.complex-content li{
 afx-list-view  > div.list-container > ul  li.selected ul.complex-content li{
     color:white;
 }
-/*
+
-afx-list-view  div.button_container {
-    padding-top:2px;
-    border-top:1px solid #cbcbcb;
-}
-*/
 afx-list-view  div.button_container afx-button{
     margin-right: 2px;
 }

src/themes/antos/afx-menu.css

@@ -1,27 +1,6 @@
 
-afx-menu {
-    position:relative;
-    display:inline-block;
-    z-index: 100000;
-}
 afx-menu a{
-    text-decoration: none;
     color: #414339;
-    display: flex;
-    width: 100%;
-    height: 100%;
-    flex-direction: row;
-}
-afx-menu a afx-label{
-    flex:1;
-}
-afx-menu ul{
-    padding:0;
-    margin: 0;
-    display:inline-block;
-}
-afx-menu ul li{
-    white-space:nowrap;
 }
 afx-menu afx-switch span{
     width: 20px;
@@ -30,7 +9,6 @@ afx-menu afx-switch span{
     /*margin-top:5px;*/
 }
 afx-menu span.shortcut{
-   width:40px;
    text-align: right;
 }
 afx-menu li:hover > a afx-switch span:before{
@@ -47,44 +25,15 @@ afx-menu afx-menu ul {
     background-color: #e7e7e7;
 }
 afx-menu ul  li /*, afx-menu ul >afx-menu-entry > li*/{
-    list-style:none;
-    margin:0;
-    position: relative;
-    float: left;
     padding:3px;
     padding-left: 5px;
     padding-right: 5px;
-    cursor:default;
-}
-afx-menu ul  li.fix_padding{
-    padding-top:1px;
-    padding-bottom: 0;
-    padding-left: 5px;
-    padding-right: 5px;
-}
-
-afx-menu afx-menu ul  li.fix_padding{
-    padding:3px;
-    padding-left: 5px;
-    padding-right: 5px;
-} 
-afx-menu  afx-menu {
-    top:100%;
-    left:0;
-    position: absolute;
-    display:none;
 }
 afx-menu  afx-menu i{
     margin-right: 5px;
 }
 afx-menu  afx-menu li{
-    float:none;
     min-width: 150px;
-    cursor:default;
-}
-afx-menu  afx-menu afx-menu, afx-menu  ul.context afx-menu{
-    top:-4px;
-    left: 100%;
 }
 
 afx-menu li:hover  {
@@ -94,20 +43,6 @@ afx-menu li:hover > a {
     color: white;
 }
 
-afx-menu afx-menu   li:hover > afx-menu, ul.context  li:hover > afx-menu
-{
-    display: block;
-}
-afx-menu li.afx-corner-fix{
-    height: 3px;
-    padding: 0;
-    margin: 0;
-    background-color: transparent;
-}
-afx-menu li.afx-corner-fix:hover{
-    background-color: transparent;
-}
-
 afx-menu afx-menu .afx_submenu:before, afx-menu  ul.context  .afx_submenu:before{
     content: "\f054"; 
     font-family: "FontAwesome";
@@ -119,17 +54,12 @@ afx-menu afx-menu .afx_submenu:before, afx-menu  ul.context  .afx_submenu:before
  }
 
  afx-menu ul.context{
-    position: absolute;
-    z-index: 1000000;
-    padding: 0;
     border:1px solid #a6a6a6;
     border-radius: 5px;
     border-top-left-radius: 0px;
-    /*box-shadow: 2px 2px 2px #cbcbcb;*/
     box-shadow: 1px 1px 1px #9f9F9F;
     background-color: #e7e7e7;
  }
  afx-menu  ul.context li{
-     clear:float;
     min-width: 150px;
  }

src/themes/antos/afx-nspinner.css

@@ -1,21 +1,6 @@
-afx-nspinner{
-    display: flex;
-    flex-direction: row;
-}
-afx-nspinner ul{
-    padding:0;
-    margin: 0;
-    list-style: none;
-}
-afx-nspinner input{
-    margin: 0;
-}
 afx-nspinner ul li{
-    display: block;
     border: 1px solid #a6a6a6;
     width: 100%;
-    padding:0;
-    margin: 0;
     color: #414339;
 }
 
@@ -34,16 +19,8 @@ afx-nspinner ul li:hover{
     color:#116cD6;
 }
 afx-nspinner ul li.incr i:before{
-    content: "\f0d8"; 
-    font-family: "FontAwesome";
     font-size: 16px;
-    font-style: normal;
-
 }
 afx-nspinner ul li.decr i:before{
-    content: "\f0d7"; 
-    font-family: "FontAwesome";
     font-size: 16px;
-    font-style: normal;
-
 }

src/themes/antos/afx-resizer.css

@@ -1,3 +1,3 @@
 afx-resizer {
-    background-color: #a6a6a6;
+    background-color: #cbcbcb;
 }

src/themes/antos/afx-slider.css

@@ -1,30 +1,16 @@
-afx-slider{
+
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
 afx-slider div.container{
-    display: block;
-    border:0;
     border-radius: 3px;
     height: 5px;
     background-color: #e6e6e6;
-    position: relative;
-    padding:0;
-    cursor: pointer;
 }
 
 afx-slider div.progress {
-    padding:0;
-    margin: 0;
-    display: block;
     background-color: #116cd6;
-    border:0;
     border-radius: 3px;
 }
 
 afx-slider div.dragpoint {
-    display: block;
     width: 20px;
     height: 20px;
     border:1px solid #6b6b6b;

src/themes/antos/afx-switch.css

@@ -1,8 +1,6 @@
 afx-switch span{
-    display: inline-block;
     width: 30px;
     height:24px;
-    cursor: pointer;
     font-size: 24px;
     font-family: "FontAwesome";
 }

src/themes/antos/afx-sys-panel.css

@@ -1,24 +1,10 @@
-
-afx-sys-panel{
-    padding:0;
-    margin: 0;
-}
 afx-sys-panel > div{
-     width: 100%;
-     height: 23px;
-     margin:0;
-     padding: 0;
      background-color: #e7e7e7;
      border-bottom: 1px solid #9c9C9C;
      box-shadow: 1px 1px 1px #9F9F9F;
-     position:absolute;
+     height: 22px;
  }
-afx-sys-panel .afx-panel-os-menu {
+
-    padding:0;
-    margin: 0;
-    float:left;
-    margin-right: 10px;
-}
 afx-sys-panel .afx-panel-os-menu li
 {
     font-weight: bold;
@@ -29,22 +15,15 @@ afx-sys-panel .afx-panel-os-menu li
 afx-sys-panel .afx-panel-os-menu a {
     color: white;
 }
-afx-sys-panel .afx-panel-os-stray{
-    float:right;
-    position: relative;
-}
 
 afx-sys-panel afx-menu.afx-panel-os-stray afx-menu  {
-    right: 0;
     left: calc(100% - 170px);
-    position: absolute;
-    
 }
 
-
 afx-sys-panel afx-menu.afx-panel-os-stray afx-menu li.afx_submenu a{
     margin-left: 10px;
 }
+
 afx-sys-panel afx-menu.afx-panel-os-stray afx-menu li.afx_submenu:before {
     content: "\f054"; 
     font-family: "FontAwesome";
@@ -55,11 +34,6 @@ afx-sys-panel afx-menu.afx-panel-os-stray afx-menu li.afx_submenu:before {
     left:5px;
     top:25%;
  }
-afx-sys-panel afx-menu.afx-panel-os-stray afx-menu  afx-menu{
-    left: -100%;
-    right: 100%;
-    top:-4px;
-}
 afx-sys-panel afx-menu.afx-panel-os-stray afx-menu ul{
     border:1px solid #a6a6a6;
     border-radius: 5px;
@@ -72,11 +46,8 @@ afx-sys-panel afx-menu.afx-panel-os-stray afx-menu li{
 afx-sys-panel afx-overlay
 {
     background-color: #e7e7e7;
-    overflow-y: auto;
-    overflow-x: hidden;
     border: 1px solid #9c9C9C;
     width: 250px;
-    margin: 0;
 }
 afx-sys-panel afx-list-view[data-id="applist"]
 {
@@ -94,10 +65,6 @@ afx-sys-panel afx-list-view[data-id="applist"] > div.list-container > ul li
 
 afx-sys-panel afx-hbox[data-id="btlist"]  afx-button button
 {
-    width: 100%;
-    height: 100%;
-    border-radius: 0;
-    border: 0px;
     border-left: 1px solid #afafaf;
 }
 

src/themes/antos/afx-tab-bar.css

@@ -1,16 +1,3 @@
-afx-tab-bar {
-    display: block;
-    width: 100%;
-    
-}
-afx-tab-bar afx-list-view {
-    padding:0;
-    margin:0;
-}
-afx-tab-bar afx-list-view > div.list-container > ul afx-list-item:nth-child(even) li
-{
-    background-color: transparent;
-}
 
 afx-tab-bar afx-list-view > div.list-container > ul > afx-list-item > li.selected
 {
@@ -19,7 +6,6 @@ afx-tab-bar afx-list-view > div.list-container > ul > afx-list-item > li.selecte
 }
 
 afx-tab-bar afx-list-view  > div.list-container > ul  li{
-    float:left;
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
     padding-bottom: 2px;

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

@@ -1,35 +1,15 @@
 afx-tree-view{
     color: #414339;
     padding:3px;
-    overflow: auto;
-    display: block;
-}
-afx-tree-view afx-tree-view{
-    padding:0;
-    overflow: hidden;
-    display: block;
-}
-afx-tree-view ul{
-    margin:0;
-    padding:0;
-}
-afx-tree-view li{
-    list-style: none;
-    margin:0;
-    padding: 0;
 }
 afx-tree-view div{
     padding:3px;
     background-color: white;
-    -webkit-user-select:none;
-    cursor:default;
 }
+
 afx-tree-view i.icon-style {
     width: 16px;
     height: 16px;
-    display: inline-block;
-    float:left;
-    margin-right: 3px;
 }
 afx-tree-view div.afx_tree_item_selected{
     background-color: #116cd6;
@@ -39,22 +19,14 @@ afx-tree-view div.afx_tree_item_selected:hover{
     background-color: #116cd6;
     color:white;
 }
-/*
+
-afx-tree-view div:hover{
-    background-color: #f5F5F5;
-    color: #414339;
-}*/
 afx-tree-view .afx_folder_item{
     font-weight: bold;
 }
 afx-tree-view .afx-tree-view-folder-open:before{
-    content: "\f147"; 
-    font-family: "FontAwesome";
     font-size: 13px;
 }
 afx-tree-view .afx-tree-view-folder-close:before{
-    content: "\f196"; 
-    font-family: "FontAwesome";
     font-size: 13px;   
 }
 

src/themes/antos/antos.css

@@ -1,64 +1,25 @@
 html,body{
-    margin: 0;
-    padding: 0;
     font-family: "Ubuntu";
     font-size: 13px;
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
 }
-/*
-*:fullscreen, *:-webkit-full-screen, *:-moz-full-screen {
-    background-color: transparent;
-    background: transparent;
-}*/
-#wrapper{
-    margin: 0;
-    padding: 0;
-    min-height:100%; 
-    overflow:hidden;
-}
-
-.afx-clear{
-    clear:both;
-    background-color: transparent;
-    border: 0;
-    height: 1px;
-}
-
 #workspace {
-    width: 100%;
-    position: absolute;
-    bottom: 0;
     top: 24px;
 }
 
 #desktop{
-    position: absolute;
     top:3px;
-    bottom: 0;
-    margin: 0;
     left: 40px;
-    right: 0;
-    user-select:none;
-    cursor: default;
-    padding:0px;
 }
 #desktop > div > ul afx-list-item {
-    display:block;
-    background-color:transparent;
-    text-align: center;
     width: 70px;
     color: white;
     padding:3px;
 }
 
 #desktop > div > ul afx-list-item li.selected {
-    display:block;
     background-color: #116cd6;
     color:white;
     border-radius: 6px;
-    text-align: center;
     width: 70px;
     color: white;
     padding:3px;
@@ -73,10 +34,7 @@ html,body{
     font-style: normal;
     font-weight: normal;
 }
-#desktop > div > ul afx-list-item span{
+
-    width: 100%;
-    word-wrap: break-word;
-}
 #desktop > div > ul afx-list-item i.dir:before{
     display: block;
     content: "\f07b\a"; 
@@ -92,11 +50,10 @@ html,body{
     border-radius: 3px;
     padding-left:3px;
     padding-right:3px;
-    /*box-shadow: 2px 2px 2px #cbcbcb;*/
     box-shadow: 1px 1px 1px #9f9F9F;
     background-color: #e7e7e7;
-    z-index: 1000000;
 }
+
 input {
     outline: none;
     padding: 2px;

src/themes/system/afx-app-window.css

@@ -0,0 +1,34 @@
+afx-app-window div.afx-window-wrapper{
+    padding:0;
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    height: 100%;
+}
+
+afx-app-window ul.afx-window-top{
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    padding:0;
+}
+afx-app-window ul.afx-window-top li{
+    list-style: none;
+}
+
+afx-app-window ul li.afx-window-title{
+    float:none;
+    overflow: hidden;
+}
+
+afx-app-window div.afx-window-content
+{
+    overflow: hidden;
+    width: 100%;
+    flex-grow: 1;
+}
+afx-app-window div.afx-window-grip{
+    height: 10px;
+    width: 10px;
+    background-color: transparent;
+}

src/themes/system/afx-button.css

@@ -0,0 +1,7 @@
+afx-button button{
+    outline: none;
+}
+
+afx-button i.icon-style {
+    float: left;
+}

src/themes/system/afx-dock.css

@@ -0,0 +1,5 @@
+afx-apps-dock{
+    float: left;
+    position: absolute;
+    overflow: hidden;
+}

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

@@ -0,0 +1,46 @@
+afx-file-view {
+    position: relative;
+}
+afx-file-view afx-label.status{
+    position: absolute;
+    bottom: 1px;
+    left:0px;
+    transform: translateZ(0);
+}
+afx-file-view afx-list-view > div.list-container > ul  li{
+    float:left;
+    display: block;
+}
+
+afx-file-view afx-list-view i{
+    display: block;
+}
+
+afx-file-view afx-grid-view i{
+    display: inline-block;
+}
+
+
+afx-file-view afx-tree-view{
+    margin:0;
+    overflow: hidden;
+    background-color: transparent;
+}
+
+afx-file-view afx-tree-view .afx_tree_item_odd{
+    background-color: transparent;
+}
+
+afx-file-view afx-tree-view div{
+    overflow: hidden;
+    white-space: nowrap;
+    background-color: transparent;
+    padding:0;
+}
+
+afx-file-view  div.treecontainer{
+    display: block;
+    overflow: auto;
+    padding:0;
+    margin:0;
+}

src/themes/system/afx-grid-view.css

@@ -0,0 +1,12 @@
+afx-grid-view afx-grid-row afx-grid-cell{
+    user-select:none;
+    -webkit-user-select:none;
+    cursor:default;
+}
+
+afx-grid-view .grid_row_header afx-grid-cell{
+    user-select:none;
+    -webkit-user-select:none;
+    cursor:default;
+    font-weight: bold;
+}

src/themes/system/afx-label.css

@@ -0,0 +1,3 @@
+afx-label  i.icon-style {
+    float: left;
+}

src/themes/system/afx-list-view.css

@@ -0,0 +1,56 @@
+afx-list-view{
+    overflow:hidden;
+    display: block;
+}
+
+afx-list-view afx-list-item
+{
+    display: contents;
+}
+afx-list-view > div.list-container{
+    overflow: auto;
+}
+afx-list-view > div.list-container >  ul{
+    margin:0;
+    padding: 0;
+}
+
+afx-list-view  > div.list-container > ul  li{
+    margin:0;
+    padding:0;
+    list-style: none;
+    position: relative;
+    -webkit-user-select:none;
+    cursor:default;
+}
+
+afx-list-view  i.closable{
+    display: inline-block;
+    position:absolute;
+    top:0px;
+    right:2px;
+    cursor: pointer;
+}
+
+afx-list-view  i.closable:before{
+    content: "\f00d"; 
+    font-family: "FontAwesome";
+    font-style: normal;
+}
+
+afx-list-view.dropdown {
+    padding:0;
+    margin: 0;
+}
+afx-list-view.dropdown > div.list-container{
+    overflow: visible;
+}
+afx-list-view.dropdown > div.list-container > ul{
+    overflow-y: auto;
+    overflow-x: hidden;
+}
+
+afx-list-view.dropdown > div.list-container > ul  li{
+    display: inline-block;
+    width:100%;
+}

src/themes/system/afx-menu.css

@@ -0,0 +1,87 @@
+
+afx-menu {
+    position:relative;
+    display:inline-block;
+    z-index: 100000;
+}
+afx-menu a{
+    text-decoration: none;
+    display: flex;
+    width: 100%;
+    height: 100%;
+    flex-direction: row;
+}
+afx-menu a afx-label{
+    flex:1;
+}
+afx-menu ul{
+    padding:0;
+    margin: 0;
+    display:inline-block;
+}
+afx-menu ul li{
+    white-space:nowrap;
+}
+
+afx-menu span.shortcut{
+   text-align: right;
+}
+
+afx-menu ul  li {
+    list-style:none;
+    margin:0;
+    position: relative;
+    float: left;
+    cursor:default;
+}
+afx-menu ul  li.fix_padding{
+    padding-top:1px;
+    padding-bottom: 0;
+    padding-left: 5px;
+    padding-right: 5px;
+}
+
+afx-menu afx-menu ul  li.fix_padding{
+    padding:3px;
+    padding-left: 5px;
+    padding-right: 5px;
+} 
+afx-menu  afx-menu {
+    top:100%;
+    left:0;
+    position: absolute;
+    display:none;
+}
+
+afx-menu  afx-menu li{
+    float:none;
+    cursor:default;
+}
+afx-menu  afx-menu afx-menu, afx-menu  ul.context afx-menu{
+    top:-4px;
+    left: 100%;
+}
+
+afx-menu afx-menu   li:hover > afx-menu, ul.context  li:hover > afx-menu
+{
+    display: block;
+}
+afx-menu li.afx-corner-fix{
+    height: 3px;
+    padding: 0;
+    margin: 0;
+    background-color: transparent;
+}
+afx-menu li.afx-corner-fix:hover{
+    background-color: transparent;
+}
+
+
+ afx-menu ul.context{
+    position: absolute;
+    z-index: 1000000;
+    padding: 0;
+ }
+ afx-menu  ul.context li{
+    clear:float;
+ }

src/themes/system/afx-nspinner.css

@@ -0,0 +1,30 @@
+afx-nspinner{
+    display: flex;
+    flex-direction: row;
+}
+afx-nspinner ul{
+    padding:0;
+    margin: 0;
+    list-style: none;
+}
+afx-nspinner input{
+    margin: 0;
+}
+afx-nspinner ul li{
+    display: block;
+    padding:0;
+    margin: 0;
+}
+
+afx-nspinner ul li.incr i:before{
+    content: "\f0d8"; 
+    font-family: "FontAwesome";
+    font-style: normal;
+
+}
+afx-nspinner ul li.decr i:before{
+    content: "\f0d7"; 
+    font-family: "FontAwesome";
+    font-style: normal;
+
+}

src/themes/system/afx-slider.css

@@ -0,0 +1,23 @@
+afx-slider{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+afx-slider div.container{
+    display: block;
+    border:0;
+    position: relative;
+    padding:0;
+    cursor: pointer;
+}
+
+afx-slider div.progress {
+    padding:0;
+    margin: 0;
+    display: block;
+    border:0;
+}
+
+afx-slider div.dragpoint {
+    display: block;
+}

src/themes/system/afx-switch.css

@@ -0,0 +1,4 @@
+afx-switch span{
+    display: inline-block;
+    cursor: pointer;
+}

src/themes/system/afx-sys-panel.css

@@ -0,0 +1,48 @@
+
+afx-sys-panel{
+    padding:0;
+    margin: 0;
+}
+afx-sys-panel > div{
+     width: 100%;
+     margin:0;
+     padding: 0;
+     position:absolute;
+ }
+afx-sys-panel .afx-panel-os-menu {
+    padding:0;
+    margin: 0;
+    float:left;
+    margin-right: 5px;
+}
+
+afx-sys-panel .afx-panel-os-stray{
+    float:right;
+    position: relative;
+}
+
+afx-sys-panel afx-menu.afx-panel-os-stray afx-menu  {
+    right: 0;
+    position: absolute;
+}
+
+afx-sys-panel afx-menu.afx-panel-os-stray afx-menu  afx-menu{
+    left: -100%;
+    right: 100%;
+    top:-4px;
+}
+
+afx-sys-panel afx-overlay
+{
+    overflow-y: auto;
+    overflow-x: hidden;
+    margin: 0;
+}
+
+afx-sys-panel afx-hbox[data-id="btlist"]  afx-button button
+{
+    width: 100%;
+    height: 100%;
+    border-radius: 0;
+    border: 0px;
+}

src/themes/system/afx-tab-bar.css

@@ -0,0 +1,18 @@
+afx-tab-bar {
+    display: block;
+    width: 100%;
+    
+}
+afx-tab-bar afx-list-view {
+    padding:0;
+    margin:0;
+}
+afx-tab-bar afx-list-view > div.list-container > ul afx-list-item:nth-child(even) li
+{
+    background-color: transparent;
+}
+
+
+afx-tab-bar afx-list-view  > div.list-container > ul  li{
+    float:left;
+}

src/themes/system/afx-tree-view.css

@@ -0,0 +1,35 @@
+afx-tree-view{
+    overflow: auto;
+    display: block;
+}
+afx-tree-view afx-tree-view{
+    padding:0;
+    overflow: hidden;
+    display: block;
+}
+afx-tree-view ul{
+    margin:0;
+    padding:0;
+}
+afx-tree-view li{
+    list-style: none;
+    margin:0;
+    padding: 0;
+}
+afx-tree-view div{
+    -webkit-user-select:none;
+    cursor:default;
+}
+afx-tree-view i.icon-style {
+    float:left;
+    margin-right: 3px;
+}
+
+afx-tree-view .afx-tree-view-folder-open:before{
+    content: "\f147"; 
+    font-family: "FontAwesome";
+}
+afx-tree-view .afx-tree-view-folder-close:before{
+    content: "\f196"; 
+    font-family: "FontAwesome";
+}

src/themes/system/antos.css

@@ -0,0 +1,123 @@
+html,body{
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+}
+body
+{
+    background-image: url("wp/wp2.jpg");
+    background-size: "cover";
+    background-repeat: "repeat";
+}
+#wrapper{
+    margin: 0;
+    padding: 0;
+    min-height:100%; 
+    overflow:hidden;
+}
+
+.afx-clear{
+    clear:both;
+    background-color: transparent;
+    border: 0;
+    height: 1px;
+}
+
+#workspace {
+    width: 100%;
+    position: absolute;
+    bottom: 0;
+}
+
+#desktop{
+    position: absolute;
+    bottom: 0;
+    margin: 0;
+    right: 0;
+    user-select:none;
+    cursor: default;
+    padding:0px;
+}
+#desktop > div > ul afx-list-item {
+    display:block;
+    background-color:transparent;
+    text-align: center;
+}
+
+#desktop > div > ul afx-list-item li.selected {
+    display:block;
+    text-align: center;
+}
+
+#desktop > div > ul afx-list-item span{
+    width: 100%;
+    word-wrap: break-word;
+}
+
+#systooltip {
+    z-index: 1000000;
+}
+
+#login_form{
+    width:300px;
+    height: 200px;
+    display: block;
+    border:1px solid #a6a6a6;
+    border-radius: 6px;
+    box-shadow: 1px 1px 1px #9f9F9F;
+    position: absolute;
+    margin: auto;
+    top:0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    font-family:Verdana, Geneva, Tahoma, sans-serif;
+    font-size: 13px;
+    text-align: center;
+    background-color: white;
+    color: #414339;
+} 
+
+#login_form p{
+    display: inline-block;
+    background-color:#dfdfdf;
+    border-bottom: 1px solid #a6a6a6;
+    padding:10px;
+    width: calc(100% - 20px);
+    border-top-left-radius: 6px;
+    border-top-right-radius: 6px;
+    font-weight: bold;
+    margin:0;
+    
+}
+#login_form input {
+    width: 250px;
+    outline: none;
+    margin-top:10px;
+    border-radius: 6px;
+    box-sizing: border-box;
+    font-size: 13px;
+    padding: 5px;
+    border: 1px solid #a6a6a6;
+    background-color: white;
+    color: #414339;
+}
+#login_form button{
+    margin-top:10px;
+    width: 250px;
+    height: 30px;
+    background-color: #2786F3;
+    color: white;
+    border: 1px solid #dedede;
+    border-radius: 6px;
+    font-family: Verdana, Geneva, Tahoma, sans-serif;
+    font-size: 13px;
+    padding:5px;
+}
+#login_error{
+    padding:3px;
+    color:red;
+    font-weight: normal;
+}