From 69849db99a0bac881a4cd2a2eeddcf6479c947a0 Mon Sep 17 00:00:00 2001
From: Xuan Sang LE <xsang.le@gmail.com>
Date: Wed, 31 Jan 2018 18:19:02 +0100
Subject: [PATCH] add resizer

---
 src/core/gui.coffee               |  7 +--
 src/core/tags/afx-file-view.js    |  3 ++
 src/core/tags/afx-hbox.js         |  4 ++
 src/core/tags/afx-resizer.js      | 83 +++++++++++++++++++++++++++++++
 src/core/tags/afx-vbox.js         |  3 ++
 src/packages/DummyApp/scheme.html |  3 ++
 src/packages/Files/main.coffee    |  2 +-
 src/packages/Files/main.css       |  7 ++-
 src/packages/Files/scheme.html    |  3 +-
 src/packages/NotePad/main.coffee  | 51 +++++++++++++++++++
 src/packages/NotePad/main.css     |  8 ++-
 src/packages/NotePad/scheme.html  |  3 +-
 src/themes/antos/afx-resizer.css  |  4 ++
 13 files changed, 171 insertions(+), 10 deletions(-)
 create mode 100644 src/core/tags/afx-resizer.js
 create mode 100644 src/themes/antos/afx-resizer.css

diff --git a/src/core/gui.coffee b/src/core/gui.coffee
index 2f59f3b..98711fd 100644
--- a/src/core/gui.coffee
+++ b/src/core/gui.coffee
@@ -266,7 +266,7 @@ self.OS.GUI =
                 desktop[0].fetch()
                 _courrier.observable.on "VFS", (d) ->
                     desktop[0].fetch() if d.data.file.hash() is fp.hash() or d.data.file.parent().hash() is fp.hash()
-                    _courrier.ostrigger "desktoploaded"
+                _courrier.ostrigger "desktoploaded"
             # mount it
             riot.mount desktop
         , (e, s) ->
@@ -367,10 +367,11 @@ self.OS.GUI =
                 _GUI.pushServices [
                     "CoreServices/PushNotification",
                     "CoreServices/Spotlight",
-                    #"CoreServices/Calendar"
+                    "CoreServices/Calendar"
                 ]
 
         # startup application here
         _courrier.observable.one "desktoploaded", () ->
-            #_GUI.launch "DummyApp"
+            console.log "startup app"
+            _GUI.launch "DummyApp"
             #_GUI.launch "NotePad"
\ No newline at end of file
diff --git a/src/core/tags/afx-file-view.js b/src/core/tags/afx-file-view.js
index 3e171f8..6ed984c 100644
--- a/src/core/tags/afx-file-view.js
+++ b/src/core/tags/afx-file-view.js
@@ -204,6 +204,9 @@
             self.root.observable.on("resize", function(e){
                 calibre_size()
             })
+            self.root.observable.on("calibrate", function(e){
+                calibre_size()
+            })
         })
     </script>
 </afx-file-view>
\ No newline at end of file
diff --git a/src/core/tags/afx-hbox.js b/src/core/tags/afx-hbox.js
index 5133378..1247bde 100644
--- a/src/core/tags/afx-hbox.js
+++ b/src/core/tags/afx-hbox.js
@@ -17,6 +17,10 @@
                     self.root.observable.on("resize", function(w,h){
                         calibrate_size()
                     })
+                    self.root.observable.on("calibrate", function(){
+                        console.log("calibrate")
+                        calibrate_size()
+                    })
                 }
         })
         var calibrate_size = function()
diff --git a/src/core/tags/afx-resizer.js b/src/core/tags/afx-resizer.js
new file mode 100644
index 0000000..e007ee7
--- /dev/null
+++ b/src/core/tags/afx-resizer.js
@@ -0,0 +1,83 @@
+<afx-resizer>
+    <script>
+        var self = this
+        self.dir = "hz"
+        self.resizable = undefined
+        self.parent = undefined
+        self.minsize = 0
+        self.on("mount", function(){
+            //self.parent = $(self.root).parent().parent()
+            var tagname = $(self.parent.root).prop("tagName")
+            self.resizable = $(self.root).prev().length == 1 ?  $(self.root).prev()[0]: undefined
+            if(tagname == "AFX-HBOX")
+            {
+                self.dir = "hz"
+                $(self.root).css("cursor", "col-resize")
+                if(self.resizable)
+                {
+                    self.minsize = parseInt($(self.resizable).attr("min-width"))
+                }
+            }
+            else if(tagname == "AFX-VBOX")
+            {
+                self.dir = "ve"
+                $(self.root).css("cursor", "row-resize")
+                if(self.resizable)
+                {
+                    self.minsize = parseInt($(self.resizable).attr("min-height"))
+                }
+            }
+            else
+            {
+                //$(self.root).css("cursor", "normal")
+                self.dir = "none"
+            }
+            
+            enable_dragging()
+        })
+
+    var enable_dragging = function()
+        {
+            $(self.root)
+                .css("user-select","none")
+            $(self.root).on("mousedown", function(e){
+                e.preventDefault()
+
+                $(window).on("mousemove", function(evt){
+                    if(!self.resizable) return
+                    if(self.dir == "hz")
+                        horizontalResize(evt)
+                    else if (self.dir == "ve")
+                        verticalResize(evt)
+                })
+                $(window).on("mouseup", function(evt){
+                    //console.log("unbind mouse up")
+                    $(window).unbind("mousemove", null)
+                })
+            })
+        }
+
+    var horizontalResize = function(e)
+    {
+        if(!self.resizable) return
+        var offset = $(self.resizable).offset()
+        w = Math.round(e.clientX - offset.left)
+        if(w < self.minsize) w = self.minsize
+        $(self.resizable).attr("data-width", w.toString())
+        self.parent.root.observable.trigger("calibrate")
+    }
+
+    var verticalResize = function(e)
+    {
+        //console.log("vboz")
+        if(!self.resizable) return
+        var offset = $(self.resizable).offset()
+        //console.log($(self.resizable).innerHeight())
+        //console.log(e.clientY, offset.top)
+        h = Math.round(e.clientY - offset.top)
+        if(h < self.minsize) h = minsize
+        $(self.resizable).attr("data-height", h.toString())
+        self.parent.root.observable.trigger("calibrate")
+    }
+    </script>
+</afx-resizer>
diff --git a/src/core/tags/afx-vbox.js b/src/core/tags/afx-vbox.js
index 6b1b772..91c829e 100644
--- a/src/core/tags/afx-vbox.js
+++ b/src/core/tags/afx-vbox.js
@@ -19,6 +19,9 @@
                 self.root.observable.on("resize", function(w,h){
                     calibrate_size()
                 })
+                self.root.observable.on("calibrate", function(){
+                    calibrate_size()
+                })
             }
         })
 
diff --git a/src/packages/DummyApp/scheme.html b/src/packages/DummyApp/scheme.html
index 0637c42..695e84d 100644
--- a/src/packages/DummyApp/scheme.html
+++ b/src/packages/DummyApp/scheme.html
@@ -1,13 +1,16 @@
 <afx-app-window apptitle="Preview" width="650" height="500">
     <afx-hbox>
+        <afx-switch enable= true data-width="50"></afx-switch>
         <afx-vbox>
             <afx-tab-container data-height = "50" data-id="mytabs" closable = true></afx-tab-container>
             <afx-tree-view data-id="mytree"> </afx-tree-view>
         </afx-vbox>
+        <afx-resizer data-width = "5" ></afx-resizer>
         <afx-vbox>
             <afx-button data-height="30" text="Read more" iconclass="fa fa-camera-retro fa-lg" id="button"></afx-button>
             <afx-switch enable= true data-height="30"></afx-switch>
             <afx-calendar-view></afx-calendar-view>
+            <afx-resizer data-height = "5" ></afx-resizer>
             <afx-color-picker></afx-color-picker>
             <afx-list-view data-id = "mylist" dropdown = "true" width="200" data-height = "40"></afx-list-view>
         </afx-vbox>
diff --git a/src/packages/Files/main.coffee b/src/packages/Files/main.coffee
index 6fcc54a..e2854cc 100644
--- a/src/packages/Files/main.coffee
+++ b/src/packages/Files/main.coffee
@@ -18,7 +18,7 @@ class Files extends this.OS.GUI.BaseApplication
             m.set "items", [ me.mnFile(), me.mnEdit() ]
             m.set "onmenuselect", (evt) ->
                 me._gui.launch evt.item.data.app, evt.item.data.args if evt.item.data.app
-            m.show(e)
+            m.show e
         #@on "fileselect", (d) -> console.log d
         @view.set "onfileopen", (e) ->
             return unless e
diff --git a/src/packages/Files/main.css b/src/packages/Files/main.css
index eaeda08..417349f 100644
--- a/src/packages/Files/main.css
+++ b/src/packages/Files/main.css
@@ -3,11 +3,14 @@ afx-app-window[data-id ='files-app-window'] afx-list-view{
 }
 afx-app-window[data-id ='files-app-window'] afx-list-view[data-id='favouri']{
     background-color: #f6F6F6;
-    border-right: 1px solid #cbcbcb;
+    border-right: 0;
     border-top:1px solid #A6A6A6;
     padding:0;
 }
-
+afx-app-window[data-id ='files-app-window'] afx-resizer{
+    background-color: transparent;
+    border-left: 1px solid #cbcbcb;
+}
 afx-app-window[data-id ='files-app-window'] afx-list-view[data-id='favouri'] li{
     background-color: transparent;
 }
diff --git a/src/packages/Files/scheme.html b/src/packages/Files/scheme.html
index d153af9..40a0888 100644
--- a/src/packages/Files/scheme.html
+++ b/src/packages/Files/scheme.html
@@ -6,8 +6,9 @@
                 <div data-width = "5"></div>
             </afx-hbox>
             <afx-hbox>
-                <afx-list-view data-id = "favouri" data-width = "150">
+                <afx-list-view data-id = "favouri" data-width = "150" min-width="100">
                 </afx-list-view>
+                <afx-resizer data-width = "3" ></afx-resizer>
                 <afx-file-view data-id = "fileview"></afx-file-view>
             </afx-hbox>
         </afx-vbox>
diff --git a/src/packages/NotePad/main.coffee b/src/packages/NotePad/main.coffee
index 7df949f..79b5bdb 100644
--- a/src/packages/NotePad/main.coffee
+++ b/src/packages/NotePad/main.coffee
@@ -20,6 +20,12 @@ class NotePad extends this.OS.GUI.BaseApplication
         @.editor.completers.push { getCompletions: ( editor, session, pos, prefix, callback ) -> }
         @.editor.getSession().setUseWrapMode true
 
+        @fileview.contextmenuHandler = (e, m) ->
+            m.set "items", me.contextMenu()
+            m.set "onmenuselect", (evt) ->
+                me.contextAction evt
+            m.show e
+
         @mlist = @find "modelist"
         @modes = ace.require "ace/ext/modelist"
         ldata = []
@@ -78,6 +84,9 @@ class NotePad extends this.OS.GUI.BaseApplication
         @fileview.set "onfileopen", (e) ->
             return if e.type is "dir"
             me.open e.path.asFileHandler()
+        @subscribe "VFS", (d) ->
+            p = (me.fileview.get "path").asFileHandler()
+            me.chdir p.path if  d.data.file.hash()  is p.hash() or d.data.file.parent().hash() is p.hash()
         @location.set "onlistselect", (e) ->
             me.chdir e.data.path
         @location.set "items", ( i for i in @systemsetting.VFS.mountpoints when i.type isnt "app" )
@@ -107,6 +116,48 @@ class NotePad extends this.OS.GUI.BaseApplication
             file.cache = d or ""
             me.newtab file
 
+    contextMenu: () ->
+        [
+            { text: "New file", dataid: "#{@name}-mkf" },
+            { text: "New folder", dataid: "#{@name}-mkd" },
+            { text: "Delete", dataid: "#{@name}-rm" }
+            { text: "Refresh", dataid: "#{@name}-refresh" }
+        ]
+
+    contextAction: (e) ->
+        me = @
+        file = @fileview.get "selectedFile"
+        dir = if file then file.path.asFileHandler() else (@fileview.get "path").asFileHandler()
+        dir = dir.parent().asFileHandler() if file and file.type isnt "dir"
+        switch e.item.data.dataid
+
+            when "#{@name}-mkd"
+                @openDialog "PromptDialog",
+                    (d) ->
+                        dir.mk d, (r) ->
+                             me.error "Fail to create #{d}: #{r.error}" if r.error
+                    , "New folder"
+            
+            when "#{@name}-mkf"
+                @openDialog "PromptDialog",
+                    (d) ->
+                        fp = "#{dir.path}/#{d}".asFileHandler()
+                        fp.write "", (r) ->
+                            me.error "Fail to create #{d}: #{r.error}" if r.error
+                    , "New file"
+            when "#{@name}-rm"
+                return unless file
+                @openDialog "YesNoDialog",
+                    (d) ->
+                        return unless d
+                        file.path.asFileHandler()
+                            .remove (r) ->
+                                me.error "Fail to delete #{file.filename}: #{r.error}" if r.error
+                , "Delete" ,
+                { iconclass: "fa fa-question-circle", text: "Do you really want to delete: #{file.filename} ?" }
+            when "#{@name}-refresh"
+                @.chdir ( @fileview.get "path" )
+
     save: (file) ->
         me = @
         file.write (file.getb64 "text/plain"), (d) ->
diff --git a/src/packages/NotePad/main.css b/src/packages/NotePad/main.css
index 1a6ad9e..b954f4c 100644
--- a/src/packages/NotePad/main.css
+++ b/src/packages/NotePad/main.css
@@ -6,7 +6,11 @@ afx-app-window[data-id="notepad"] afx-list-view {
 afx-app-window[data-id="notepad"] afx-list-view div.list-container{
     z-index: 10;
 }
-
+afx-app-window[data-id="notepad"] afx-resizer{
+    z-index: 11;
+    background-color: transparent;
+    border-right: 1px solid #a6a6a6;
+}
 afx-app-window[data-id="notepad"] span[data-id="editorstat"]{
     padding:5px;
     display: inline-block;
@@ -29,7 +33,7 @@ afx-tab-container[data-id="tabarea"] afx-list-view li {
 afx-tab-container[data-id="tabarea"] afx-list-view{
     padding:0;
     margin: 0;
-    border-left: 1px solid #a6a6a6;
+    border-left: 0;
     border-bottom: 1px solid #a6a6a6;
 }
 /*afx-tab-container[data-id="tabarea"] afx-list-view i.closable:before{
diff --git a/src/packages/NotePad/scheme.html b/src/packages/NotePad/scheme.html
index cdf04e6..adff6eb 100644
--- a/src/packages/NotePad/scheme.html
+++ b/src/packages/NotePad/scheme.html
@@ -1,9 +1,10 @@
 <afx-app-window apptitle="" width="600" height="400" data-id="notepad">
     <afx-hbox>
-        <afx-vbox data-width = "175" data-id = "sidebar">
+        <afx-vbox data-width = "172" data-id = "sidebar" min-width="172">
             <afx-list-view data-id = "location" dropdown = "true" data-height= "30" width = "150"></afx-list-view>
             <afx-file-view data-id = "fileview" view='tree' status = false></afx-file-view>
         </afx-vbox>
+        <afx-resizer data-width = "3" ></afx-resizer>
         <afx-vbox>
             <afx-tab-container data-id="tabarea" data-height="26" closable = true></afx-tab-container>
             <div data-id="datarea"></div>
diff --git a/src/themes/antos/afx-resizer.css b/src/themes/antos/afx-resizer.css
new file mode 100644
index 0000000..357220e
--- /dev/null
+++ b/src/themes/antos/afx-resizer.css
@@ -0,0 +1,4 @@
+afx-resizer {
+    display: block;
+    background-color: #a6a6a6;
+}
\ No newline at end of file