@dualbox/editor 1.0.32 → 1.0.35

package/js/src/GraphEditor.js

@@ -1,10 +1,10 @@
-import _ from 'lodash';
+import _ from "lodash";
 
-import GraphModel from './m/GraphModel';
-import GraphView from './v/GraphView';
-import GraphController from './c/GraphController';
-import AppParser from '@dualbox/dualbox-lib-appparser';
-import jsplumbjs from 'jsplumb';
+import GraphModel from "./m/GraphModel";
+import GraphView from "./v/GraphView";
+import GraphController from "./c/GraphController";
+import AppParser from "@dualbox/dualbox-lib-appparser";
+import jsplumbjs from "jsplumb";
 
 //import fa from '@dualbox/dualbox-lib-font-awesome';
 //console.log('FontAwesome loaded: ' + fa);
@@ -15,241 +15,244 @@ import jsplumbjs from 'jsplumb';
  *  Main class of the Graph Editor
  */
 class DualboxEditor {
-    // div: selector or jquery div
-    constructor(div, attrs) {
-        this.div = $(div);
-        this.div.addClass('main-editor-div');
-        this.attrs = attrs;
-
-        // export itself top window
-        window.dualboxEditor = this;
-
-        this.rootAppName = attrs.name ? attrs.name : "Application";
-
-        // MVC model
-        this.m = new GraphModel(this);
-        this.v = new GraphView(this, div, attrs);
-        this.c = new GraphController(this);
-
-        // bind links
-        this.v.m = this.c.m = this.m;
-        this.v.c = this.m.c = this.c;
-        this.c.v = this.m.v = this.v;
-
-        // cache for packages
-        this.packages = {};
-        this.DualBox = null; // local dualbox, for editor use
-
-        // the function to search for modules
-        // attr.search signature: search( text, cb )
-        // callback signature: cb( err, packages ), packages is an array of package.json
-        this.search = (text, type) => {
-            return new Promise((resolve, reject) => {
-                attrs.search(text, (err, packages) => {
-                    if (err) {
-                        reject(err);
-                    }
-                    else {
-                        // cache packages in this.packages
-                        _.each(packages, (r) => {
-                            if (!this.packages[r.name]) {
-                                this.packages[r.name] = r;
-                            }
-                        });
-
-                        if (type) {
-                            packages = _.filter(packages, o => {
-                                return o.name.startsWith('@dualbox/dualbox-' + type)
-                                    || (type == "module" && o.name.startsWith('dualbox-core'))
-                            })
-                        }
-                        resolve(packages);
-                    }
-                });
+  // div: selector or jquery div
+  constructor(div, attrs) {
+    this.div = $(div);
+    this.div.addClass("main-editor-div");
+    this.attrs = attrs;
+
+    // export itself top window
+    window.dualboxEditor = this;
+
+    this.rootAppName = attrs.name ? attrs.name : "Application";
+
+    // MVC model
+    this.m = new GraphModel(this);
+    this.v = new GraphView(this, div, attrs);
+    this.c = new GraphController(this);
+
+    // bind links
+    this.v.m = this.c.m = this.m;
+    this.v.c = this.m.c = this.c;
+    this.c.v = this.m.v = this.v;
+
+    // cache for packages
+    this.packages = {};
+    this.DualBox = null; // local dualbox, for editor use
+
+    // the function to search for modules
+    // attr.search signature: search( text, cb )
+    // callback signature: cb( err, packages ), packages is an array of package.json
+    this.search = (text, type) => {
+      return new Promise((resolve, reject) => {
+        attrs.search(text, (err, packages) => {
+          if (err) {
+            reject(err);
+          } else {
+            // cache packages in this.packages
+            _.each(packages, r => {
+              if (!this.packages[r.name]) {
+                this.packages[r.name] = r;
+              }
             });
-        }
 
-        this.types = [];
-        this.getRootTypes = function () {
-            if (_.isEmpty(this.types)) {
-                return new Promise((resolve, reject) => {
-                    this.search('dualbox-type-').then((packages) => {
-                        this.types = _.filter(packages, (p) => {
-                            var isType = p.name.startsWith('@dualbox/dualbox-type');
-                            var hasTypeDef = _.get(p, "dualbox.type");
-
-                            if (isType && !hasTypeDef) {
-                                console.error('Type package ' + p.name + ' has no dualbox Type description.\n'
-                                    + 'Type was not imported');
-                            }
-                            return isType && hasTypeDef;
-                        });
-                        resolve(this.types);
-                    }).catch((e) => {
-                        reject(e);
-                    });
-                });
-            }
-            else {
-                return Promise.resolve(this.types);
+            if (type) {
+              packages = _.filter(packages, o => {
+                return (
+                  o.name.startsWith("@dualbox/dualbox-" + type) ||
+                  (type == "module" && o.name.startsWith("dualbox-core"))
+                );
+              });
             }
-        };
-
-        this.getAvailableTypes = async function () {
-            var types = await this.getRootTypes();
-            return _.map(types, t => _.get(t, "dualbox.type.name"));
-        }
-
+            resolve(packages);
+          }
+        });
+      });
+    };
 
-        // the function to find module by name and version (with cache)
-        // signature: find( name, version ), return a Promise which, when resolved, is a package.json
-        this.loadPackage = (name, version) => {
-            version = version || "*";
-
-            return new Promise((resolve, reject) => {
-                if (name.startsWith('dualbox-core')) {
-                    var pkg = null;
-                    _.each(this.DualBox.core, (corePackage) => {
-                        if (corePackage.name == name) {
-                            pkg = corePackage;
-                            return false;
-                        }
-                    })
-
-                    if (pkg) {
-                        this.packages[name] = pkg;
-                        resolve(pkg);
-                    }
-                    else {
-                        reject("Couldn't resolve core package: " + name);
-                    }
-                    return;
+    this.types = [];
+    this.getRootTypes = function() {
+      if (_.isEmpty(this.types)) {
+        return new Promise((resolve, reject) => {
+          this.search("dualbox-type-")
+            .then(packages => {
+              this.types = _.filter(packages, p => {
+                var isType = p.name.startsWith("@dualbox/dualbox-type");
+                var hasTypeDef = _.get(p, "dualbox.type");
+
+                if (isType && !hasTypeDef) {
+                  console.error(
+                    "Type package " +
+                      p.name +
+                      " has no dualbox Type description.\n" +
+                      "Type was not imported"
+                  );
                 }
+                return isType && hasTypeDef;
+              });
+              resolve(this.types);
+            })
+            .catch(e => {
+              reject(e);
+            });
+        });
+      } else {
+        return Promise.resolve(this.types);
+      }
+    };
 
-                var loadScript = (pkg, cb) => {
-                    if (attrs.load) {
-                        attrs.load(pkg.name, pkg.version, cb);
-                    }
-                    else {
-                        // Local editor. Bind the callback on the local script load
-                        var script = $('script[data-pkg="' + pkg.name + '"]');
-                        if (!script) {
-                            throw "Couldn't find script in the current document: " + pkg.name + ". Did you forget gulp link-editor ?";
-                        }
-
-                        if (script.attr('data-loaded') === "true") {
-                            cb();
-                            return;
-                        }
-                        else {
-                            script[0].addEventListener("error", function () {
-                                throw "Failed to load script " + pkg.name;
-                            });
-
-                            var timeout = setTimeout(function () {
-                                cb("Failed to load " + pkg.name + " after 5 seconds");
-                            }, 5000)
-                            script[0].addEventListener("load", () => {
-                                clearTimeout(timeout);
-                                cb()
-                            });
-                        }
-                    }
-                }
+    this.getAvailableTypes = async function() {
+      var types = await this.getRootTypes();
+      return _.map(types, t => _.get(t, "dualbox.type.name"));
+    };
 
-                // we need to find the package.json and make sure the script is loaded
-                if (this.packages[name]) {
-                    try {
-                        loadScript(this.packages[name], (err) => {
-                            if (err) reject(err)
-                            else resolve(this.packages[name]);
-                        });
-                    }
-                    catch (e) {
-                        reject(e);
-                    }
-                }
-                else {
-                    // mark the package as beeing resolved
-                    attrs.find(name, version, (err, result) => {
-                        if (err) {
-                            reject(err);
-                        }
-                        else {
-                            this.packages[name] = result; // cache result
-                            loadScript(this.packages[name], (err) => {
-                                if (err) reject(err)
-                                else resolve(result);
-                            });
-                        }
-                    });
-                }
-            })
+    // the function to find module by name and version (with cache)
+    // signature: find( name, version ), return a Promise which, when resolved, is a package.json
+    this.loadPackage = (name, version) => {
+      version = version || "*";
+
+      return new Promise((resolve, reject) => {
+        if (name.startsWith("dualbox-core")) {
+          var pkg = null;
+          _.each(this.DualBox.core, corePackage => {
+            if (corePackage.name == name) {
+              pkg = corePackage;
+              return false;
+            }
+          });
+
+          if (pkg) {
+            this.packages[name] = pkg;
+            resolve(pkg);
+          } else {
+            reject("Couldn't resolve core package: " + name);
+          }
+          return;
         }
 
-        // the function to require a dualbox module
-        this.require = (name, version, cb) => {
-            return require(name); // TODO: local only for now
+        var loadScript = (pkg, cb) => {
+          if (attrs.load) {
+            attrs.load(pkg.name, pkg.version, cb);
+          } else {
+            // Local editor. Bind the callback on the local script load
+            var script = $('script[data-pkg="' + pkg.name + '"]');
+            if (!script) {
+              throw "Couldn't find script in the current document: " +
+                pkg.name +
+                ". Did you forget gulp link-editor ?";
+            }
+
+            if (script.attr("data-loaded") === "true") {
+              cb();
+              return;
+            } else {
+              script[0].addEventListener("error", function() {
+                throw "Failed to load script " + pkg.name;
+              });
+
+              var timeout = setTimeout(function() {
+                cb("Failed to load " + pkg.name + " after 5 seconds");
+              }, 5000);
+              script[0].addEventListener("load", () => {
+                clearTimeout(timeout);
+                cb();
+              });
+            }
+          }
         };
 
+        var onLoadedScript = err => {
+          if (err) {
+            reject(err);
+          } else {
+            require(name); // make sure the package is required at least once
+            resolve(this.packages[name]);
+          }
+        };
 
-        // Safety when the user leave the page,
-        // if not already defined externally
-        if (!window.onbeforeunload) {
-            window.onbeforeunload = function () {
-                return "Unsaved changes will be lost, are you sure you want to leave the editor?";
+        // we need to find the package.json and make sure the script is loaded
+        if (this.packages[name]) {
+          try {
+            loadScript(this.packages[name], onLoadedScript);
+          } catch (e) {
+            reject(e);
+          }
+        } else {
+          // mark the package as beeing resolved
+          attrs.find(name, version, (err, result) => {
+            if (err) {
+              reject(err);
+            } else {
+              this.packages[name] = result; // cache result
+              loadScript(this.packages[name], onLoadedScript);
             }
+          });
         }
+      });
+    };
 
-        this.loadCorePackages();
+    // the function to require a dualbox module
+    this.require = (name, version, cb) => {
+      return require(name); // TODO: local only for now
+    };
 
-        if (attrs.json) {
-            this.onReady(() => {
-                var p = this.setApp(attrs.json);
-                if (attrs.onLoaded) {
-                    p.then(attrs.onLoaded);
-                }
-            });
-        }
+    // Safety when the user leave the page,
+    // if not already defined externally
+    if (!window.onbeforeunload) {
+      window.onbeforeunload = function() {
+        return "Unsaved changes will be lost, are you sure you want to leave the editor?";
+      };
     }
 
-    // call cb when the editor is initialized
-    onReady(cb) {
-        this.v.onReady(cb);
-    }
+    this.loadCorePackages();
 
-    async loadCorePackages() {
-        var onError = function (err) {
-            console.error(err);
+    if (attrs.json) {
+      this.onReady(() => {
+        var p = this.setApp(attrs.json);
+        if (attrs.onLoaded) {
+          p.then(attrs.onLoaded);
         }
-
-        await this.loadPackage('@dualbox/dualbox');
-        this.DualBox = window.DualBox = this.require('@dualbox/dualbox');
-        _.each(this.DualBox.core, async (corePackage) => {
-            await this.loadPackage(corePackage.name);
-        });
-    }
-
-    setApp(json) {
-        return this.c.load(json);
-    }
-
-    getApp() {
-        this.m.get();
+      });
     }
+  }
 
-    // load all packages needed in the json
-    // return a Promise
-    loadPackages(json) {
-        var promises = []; // array of promises
-        this.promises = promises;
+  // call cb when the editor is initialized
+  onReady(cb) {
+    this.v.onReady(cb);
+  }
 
-        var parser = new AppParser(json);
-        parser.eachPackage((name, version) => {
-            promises.push(this.loadPackage(name, version));
-        });
+  async loadCorePackages() {
+    var onError = function(err) {
+      console.error(err);
+    };
 
-        /*
+    await this.loadPackage("@dualbox/dualbox");
+    this.DualBox = window.DualBox = this.require("@dualbox/dualbox");
+    _.each(this.DualBox.core, async corePackage => {
+      await this.loadPackage(corePackage.name);
+    });
+  }
+
+  setApp(json) {
+    return this.c.load(json);
+  }
+
+  getApp() {
+    this.m.get();
+  }
+
+  // load all packages needed in the json
+  // return a Promise
+  loadPackages(json) {
+    var promises = []; // array of promises
+    this.promises = promises;
+
+    var parser = new AppParser(json);
+    parser.eachComponent((name, version) => {
+      promises.push(this.loadPackage(name, version));
+    });
+
+    /*
         // also load core nodes
         promises.push(this.loadPackage('dualbox-core-if', '*'));
         promises.push(this.loadPackage('dualbox-core-value', '*'));
@@ -259,24 +262,23 @@ class DualboxEditor {
         promises.push(this.loadPackage('dualbox-core-switch', '*'));
         */
 
-        return Promise.all(promises);
-    }
+    return Promise.all(promises);
+  }
 
-    // sync version of this.loadPackage. Will crash if the package has not been loaded yet
-    getPackage(name, version) {
-        if (this.packages[name] === undefined) {
-            throw "Package " + name + " has not been loaded yet.";
-        }
-        return this.packages[name];
-    };
+  // sync version of this.loadPackage. Will crash if the package has not been loaded yet
+  getPackage(name, version) {
+    if (this.packages[name] === undefined) {
+      throw "Package " + name + " has not been loaded yet.";
+    }
+    return this.packages[name];
+  }
 }
 
 // try to export in window if in browser context
 try {
-    window.DualboxEditor = DualboxEditor;
-}
-catch (e) {
-    console.log('Could not export to window: ' + e);
+  window.DualboxEditor = DualboxEditor;
+} catch (e) {
+  console.log("Could not export to window: " + e);
 }
 
 //export default DualboxEditor;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dualbox/editor",
-  "version": "1.0.32",
+  "version": "1.0.35",
   "description": "Editor of Dualbox apps",
   "browser": "js/dist/GraphEditor.js",
   "main": "js/dist/GraphEditor.js",
@@ -31,7 +31,7 @@
     "@babel/cli": "^7.2.3",
     "@babel/core": "^7.2.2",
     "@babel/preset-env": "^7.0.0-beta.46",
-    "@dualbox/dualbox-lib-appparser": "1.0.9",
+    "@dualbox/dualbox-lib-appparser": "1.0.10",
     "@dualbox/dualbox-lib-bootstrap": "^1.0.14",
     "@dualbox/dualbox-lib-font-awesome": "5.6.3",
     "@fortawesome/fontawesome-free": "^5.4.1",