[desk] break flow before desk, addLink util

client/desk/index.js

@@ -18,6 +18,7 @@ module.exports = class Desk {
 
         let body = document.querySelector('body');
         //this.navbar = new Navbar();
+        frappe.ui.empty(body);
         this.container = frappe.ui.add('div', '', body);
         this.containerRow = frappe.ui.add('div', 'row no-gutters', this.container)
         this.makeColumns(columns);
@@ -100,7 +101,6 @@ module.exports = class Desk {
                 this.menu.setActive();
             }
         })
-
     }
 
     toggleCenter(show) {
@@ -173,5 +173,4 @@ module.exports = class Desk {
             });
         }
     }
-
 }

client/index.js

@@ -6,7 +6,7 @@ const Desk = require('./desk');
 const Observable = require('frappejs/utils/observable');
 
 module.exports = {
-    async start({server, columns = 2}) {
+    async start({server, columns = 2, makeDesk = 1}) {
         window.frappe = frappe;
         frappe.init();
         frappe.registerLibs(common);
@@ -24,6 +24,12 @@ module.exports = {
 
         await frappe.getSingle('SystemSettings');
 
+        if(makeDesk) {
+            this.makeDesk(columns);
+        }
+    },
+
+    async makeDesk(columns) {
         frappe.desk = new Desk(columns);
         await frappe.login();
     },

client/ui/utils.js

@@ -24,5 +24,14 @@ module.exports = {
             }
         });
 
+    },
+
+    addLink(label, parent, action, unhide = true) {
+        const link = frappe.ui.add('button', 'btn btn-sm btn-outline-secondary', parent, label);
+        link.addEventListener('click', action);
+        if (unhide) {
+            parent.classList.remove('hide');
+        }
+        return link;
     }
 }

client/view/form.js

@@ -3,6 +3,7 @@ const controls = require('./controls');
 const FormLayout = require('./formLayout');
 const Observable = require('frappejs/utils/observable');
 const keyboard = require('frappejs/client/ui/keyboard');
+const utils = require('frappejs/client/ui/utils');
 
 module.exports = class BaseForm extends Observable {
     constructor({doctype, parent, submit_label='Submit', container, meta, inline=false}) {
@@ -208,7 +209,7 @@ module.exports = class BaseForm extends Observable {
         this.container.clearLinks();
         for(let link of links) {
             // make the link
-            this.container.addLink(link.label, () => {
+            utils.addLink(link.label, this.container.linksElement, () => {
                 let options = link.action(this);
 
                 if (options) {
@@ -279,9 +280,7 @@ module.exports = class BaseForm extends Observable {
     }
 
     refresh() {
-        for(let control of this.formLayout.controlList) {
+        this.formLayout.refresh();
-            control.refresh();
-        }
         this.trigger('refresh', this);
         this.setLinks();
     }

client/view/formLayout.js

@@ -1,18 +1,30 @@
 const controls = require('./controls');
+const Observable = require('frappejs/utils/observable');
 
-module.exports = class FormLayout {
+module.exports = class FormLayout extends Observable {
-    constructor({fields, layout}) {
+    constructor({fields, layout, events = []}) {
-        this.fields = fields;
+        super();
-        this.layout = layout;
+        Object.assign(this, arguments[0]);
-
         this.controls = {};
         this.controlList = [];
         this.sections = [];
+        this.links = [];
+
+        this.doc = {
+            get(fieldname) {
+                return this[fieldname]
+            },
+
+            set(fieldname, value) {
+                this[fieldname] = value;
+            }
+        };
 
         this.form = document.createElement('div');
         this.form.classList.add('form-body');
 
         this.makeLayout();
+        this.bindEvents(this.doc);
     }
 
     makeLayout() {
@@ -52,4 +64,26 @@ module.exports = class FormLayout {
             }
         }
     }
+
+    async bindEvents(doc) {
+        this.doc = doc;
+        this.controlList.forEach(control => {
+            control.bind(this.doc);
+        });
+        this.refresh();
+    }
+
+    refresh() {
+        this.controlList.forEach(control => {
+            control.refresh();
+        });
+    }
+
+    bindFormEvents() {
+        if (this.events) {
+            for (let key in this.events) {
+                this.on(key, this.events[key]);
+            }
+        }
+    }
 }

client/view/page.js

@@ -37,15 +37,6 @@ module.exports = class Page extends Observable {
             ${message}</span>`;
     }
 
-    addLink(label, action, unhide = true) {
-        const link = frappe.ui.add('button', 'btn btn-sm btn-outline-secondary', this.linksElement, label);
-        link.addEventListener('click', action);
-        if (unhide) {
-            this.linksElement.classList.remove('hide');
-        }
-        return link;
-    }
-
     clearLinks() {
         frappe.ui.empty(this.linksElement);
     }

package.json

@@ -9,31 +9,26 @@
     "start": "nodemon app.js"
   },
   "dependencies": {
+    "autoprefixer": "^7.2.4",
     "awesomplete": "^1.1.2",
     "body-parser": "^1.18.2",
     "bootstrap": "^4.0.0",
     "clusterize.js": "^0.18.0",
     "codemirror": "^5.35.0",
     "commander": "^2.13.0",
+    "eslint": "^4.9.0",
     "express": "^4.16.2",
     "flatpickr": "^4.3.2",
-    "frappe-datatable": "link:../datatable",
+    "frappe-datatable": "^0.0.3",
     "jquery": "^3.3.1",
+    "mocha": "^4.1.0",
     "moment": "^2.20.1",
     "mysql": "^2.15.0",
     "node-fetch": "^1.7.3",
-    "nunjucks": "^3.1.0",
-    "popper.js": "^1.12.9",
-    "showdown": "^1.8.6",
-    "socket.io": "^2.0.4",
-    "sortablejs": "^1.7.0",
-    "sqlite3": "^3.1.13",
-    "walk": "^2.3.9",
-    "autoprefixer": "^7.2.4",
-    "eslint": "^4.9.0",
-    "mocha": "^4.1.0",
     "node-sass": "^4.7.2",
     "nodemon": "^1.14.7",
+    "nunjucks": "^3.1.0",
+    "popper.js": "^1.12.9",
     "precss": "^2.0.0",
     "rollup": "^0.55.1",
     "rollup-plugin-commonjs": "^8.3.0",
@@ -41,7 +36,12 @@
     "rollup-plugin-node-resolve": "^3.0.2",
     "rollup-plugin-postcss": "^1.2.7",
     "rollup-plugin-replace": "^2.0.0",
-    "rollup-plugin-sass": "^0.5.3"
+    "rollup-plugin-sass": "^0.5.3",
+    "showdown": "^1.8.6",
+    "socket.io": "^2.0.4",
+    "sortablejs": "^1.7.0",
+    "sqlite3": "^3.1.13",
+    "walk": "^2.3.9"
   },
   "repository": {
     "type": "git",
@@ -56,6 +56,5 @@
     "url": "https://github.com/frappe/frappejs/issues"
   },
   "homepage": "https://github.com/frappe/frappejs#readme",
-  "devDependencies": {
+  "devDependencies": {}
-  }
 }

yarn.lock

@@ -1317,9 +1317,13 @@ forwarded@~0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/forwarded/-/forwarded-0.1.2.tgz#98c23dab1175657b8c0573e8ceccd91b0ff18c84"
 
-"frappe-datatable@link:../datatable":
+frappe-datatable@^0.0.3:
-  version "0.0.0"
+  version "0.0.3"
-  uid ""
+  resolved "https://registry.yarnpkg.com/frappe-datatable/-/frappe-datatable-0.0.3.tgz#55d3fd7bafdf2a7380efab2ae2aaaa956624fca0"
+  dependencies:
+    clusterize.js "^0.18.0"
+    lodash "^4.17.5"
+    sortablejs "^1.7.0"
 
 fresh@0.5.2:
   version "0.5.2"