@dualbox/editor 1.0.1 → 1.0.3

package/js/src/v/templates/searchResults.js

@@ -0,0 +1,176 @@
+const _ = require('lodash');
+const swal = require('sweetalert2');
+const utils = require('../Utils');
+
+jQuery.fn.outerHTML = function() {
+    return jQuery('<div />').append(this.eq(0).clone()).html();
+};
+
+var buildInputsDescription = function(inputs) {
+    var result = $('<table/>', {
+        class: 'table table-striped table-desc',
+        style: 'width: auto; font-size: 12px;'
+    }).append(
+        $('<thead/>').append(
+            $('<tr/>').append(
+                $('<th/>').append('name'),
+                $('<th/>').append('type'),
+                $('<th/>').append('desc'),
+                $('<th/>').append('default'),
+                $('<th/>').append('default')
+            )
+        )
+    );
+
+    var tbody = $('<tbody/>');
+    _.each( inputs, (inputDesc, inputName) => {
+        tbody.append( $('<tr/>').append(
+            $('<td/>').append(inputName),
+            $('<td/>').append($('<span/>', { 'class':'badge badge-secondary', 'style':'font-weight: bold;' }).append(utils.htmlentities(inputDesc.type))),
+            $('<td/>').append(inputDesc.desc),
+            $('<td/>').append(inputDesc.value),
+            $('<td/>').append( inputDesc.const ? "True" : "False" )
+        ));
+    });
+
+    result.append(tbody);
+    return result.outerHTML();
+}
+
+var buildOutputsDescription = function(outputs) {
+    var result = $('<table/>', {
+        class: 'table table-striped table-desc',
+        style: 'width: auto; font-size: 12px;'
+    }).append(
+        $('<thead/>').append(
+            $('<tr/>').append(
+                $('<th/>').append('name'),
+                $('<th/>').append('type'),
+                $('<th/>').append('desc')
+            )
+        )
+    );
+
+    var tbody = $('<tbody/>');
+    _.each( outputs, (outputDesc, outputName) => {
+        tbody.append( $('<tr/>').append(
+            $('<td/>').append(outputName),
+            $('<td/>').append($('<span/>', { class:'badge badge-secondary' }).append(utils.htmlentities(outputDesc.type))),
+            $('<td/>').append(outputDesc.desc)
+        ));
+    });
+
+    result.append(tbody);
+    return result.outerHTML();
+}
+
+var buildAttributesDescription = function(attrs) {
+    var result = $('<table/>', {
+        class: 'table table-striped table-desc',
+        style: 'width: auto; font-size: 12px;'
+    }).append(
+        $('<thead/>').append(
+            $('<tr/>').append(
+                $('<th/>').append('name'),
+                $('<th/>').append('type'),
+                $('<th/>').append('desc'),
+                $('<th/>').append('default')
+            )
+        )
+    );
+
+    var tbody = $('<tbody/>');
+    _.each( attrs, (attrDesc, attrName) => {
+        tbody.append( $('<tr/>').append(
+            $('<td/>').append(attrName),
+            $('<td/>').append($('<span/>', { class:'badge badge-secondary' }).append(utils.htmlentities(attrDesc.type || "*"))),
+            $('<td/>').append(attrDesc.desc),
+            $('<td/>').append(attrDesc.value)
+        ));
+    });
+
+    result.append(tbody);
+    return result.outerHTML();
+}
+
+
+
+
+var TemplateBinds = function(view) {
+    var buildExampleDiv = function(name, desc) {
+        var exampleDiv = $('<div/>', { 'class' : 'dualbox-graph-canvas', 'style': 'overflow: visible;' }).append();
+        return exampleDiv.outerHTML();
+    }
+
+    // on result click, change the description on the right of the panel
+    $('.node-result').click(function() {
+        $('.node-result').removeClass('selected');
+        $(this).addClass('selected');
+
+        var pkgName = $(this).data('package');
+        var pkgShortName = $(this).data('short-name').trim();
+
+        var pkg = _.find( view.e.searchResults, { 'name' : pkgName });
+        if( pkg ) {
+            pkg.shortName = pkgShortName;
+            $('.module-name').text(pkgShortName);
+            $('.module-show-description').show();
+            $('.module-long-description').text(pkg.description);
+
+            // Add the example div
+            $('.module-signature').html("");
+            $('.module-signature').append(
+                $('<div/>', {
+                    'class' : 'dualbox-graph-canvas',
+                    'style': 'overflow: visible; padding-left: 80px; padding-right: 80px; background-color: transparent; border: none;'
+                })
+            )
+            view.templateMgr.appendTemplate($('.module-signature .dualbox-graph-canvas'),
+                "graphNode",
+                { pkg: pkg, id: pkgShortName, n: view.m.createExampleNode(pkg.name, pkgShortName), example: true, utils: view.utils },
+                () => {
+                    // remove the "position: absolute;" that messes up the display
+                    $('.module-signature .dualbox-graph-canvas .card').css('position', 'static');
+                }
+            );
+        }
+        else {
+            swal("Oups", "can't find package named '" + pkgName + "'", "error");
+            return;
+        }
+
+        if( pkg.dualbox ) {
+            // show input desc
+            if( !_.isEmpty(pkg.dualbox.input) ) {
+                $('.module-show-inputs').show();
+                $('.module-inputs').html( buildInputsDescription(pkg.dualbox.input) );
+            }
+            else {
+                $('.module-show-inputs').hide();
+            }
+
+            // show output desc
+            if( !_.isEmpty(pkg.dualbox.output) ) {
+                $('.module-show-outputs').show();
+                $('.module-outputs').html( buildOutputsDescription(pkg.dualbox.output) );
+            }
+            else {
+                $('.module-show-outputs').hide();
+            }
+
+            // show attributes desc
+            if( !_.isEmpty(pkg.dualbox.attr) ) {
+                $('.module-show-attributes').show();
+                $('.module-attributes').html( buildAttributesDescription(pkg.dualbox.attr) );
+            }
+            else {
+                $('.module-show-attributes').hide();
+            }
+        }
+        else {
+            swal("Oups", "No dualbox description found in package '" + pkgName + "'", "error");
+        }
+    });
+}
+
+module.exports = TemplateBinds;

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "@dualbox/editor",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Editor of Dualbox apps",
+  "browser": "js/dist/GraphEditor.js",
   "main": "js/dist/GraphEditor.js",
   "directories": {
     "lib": "lib"
@@ -40,7 +41,7 @@
   "files": [
     "css/*",
     "html/*",
-    "js/dist/*",
+    "js/*",
     "lib/*"
   ]
 }