webgme-engine/src/plugin/coreplugins/VisualizerGenerator/Templates/Templates.js

WebGME server and Client API without a GUI

/*eslint-disable*/
/* Generated file based on ejs templates */
define([], function() {
    return {
    "Control.js.ejs": "/*globals define, WebGMEGlobal*/\r\n/**\r\n * Generated by VisualizerGenerator <%= version %> from webgme on <%= date %>.\r\n */\r\n\r\ndefine([\r\n    'js/Constants',\r\n    'js/Utils/GMEConcepts',\r\n    'js/NodePropertyNames'\r\n], function (\r\n    CONSTANTS,\r\n    GMEConcepts,\r\n    nodePropertyNames\r\n) {\r\n\r\n    'use strict';\r\n\r\n    function <%= visualizerID %>Control(options) {\r\n\r\n        this._logger = options.logger.fork('Control');\r\n\r\n        this._client = options.client;\r\n\r\n        // Initialize core collections and variables\r\n        this._widget = options.widget;\r\n\r\n        this._currentNodeId = null;\r\n        this._currentNodeParentId = undefined;\r\n\r\n        this._initWidgetEventHandlers();\r\n\r\n        this._logger.debug('ctor finished');\r\n    }\r\n\r\n    <%= visualizerID %>Control.prototype._initWidgetEventHandlers = function () {\r\n        this._widget.onNodeClick = function (id) {\r\n            // Change the current active object\r\n            WebGMEGlobal.State.registerActiveObject(id);\r\n        };\r\n    };\r\n\r\n    /* * * * * * * * Visualizer content update callbacks * * * * * * * */\r\n    // One major concept here is with managing the territory. The territory\r\n    // defines the parts of the project that the visualizer is interested in\r\n    // (this allows the browser to then only load those relevant parts).\r\n    <%= visualizerID %>Control.prototype.selectedObjectChanged = function (nodeId) {\r\n        var desc = this._getObjectDescriptor(nodeId),\r\n            self = this;\r\n\r\n        self._logger.debug('activeObject nodeId \\'' + nodeId + '\\'');\r\n\r\n        // Remove current territory patterns\r\n        if (self._currentNodeId) {\r\n            self._client.removeUI(self._territoryId);\r\n        }\r\n\r\n        self._currentNodeId = nodeId;\r\n        self._currentNodeParentId = undefined;\r\n\r\n        if (typeof self._currentNodeId === 'string') {\r\n            // Put new node's info into territory rules\r\n            self._selfPatterns = {};\r\n            self._selfPatterns[nodeId] = {children: 0};  // Territory \"rule\"\r\n\r\n            self._widget.setTitle(desc.name.toUpperCase());\r\n\r\n            if (typeof desc.parentId === 'string') {\r\n                self.$btnModelHierarchyUp.show();\r\n            } else {\r\n                self.$btnModelHierarchyUp.hide();\r\n            }\r\n\r\n            self._currentNodeParentId = desc.parentId;\r\n\r\n            self._territoryId = self._client.addUI(self, function (events) {\r\n                self._eventCallback(events);\r\n            });\r\n\r\n            // Update the territory\r\n            self._client.updateTerritory(self._territoryId, self._selfPatterns);\r\n\r\n            self._selfPatterns[nodeId] = {children: 1};\r\n            self._client.updateTerritory(self._territoryId, self._selfPatterns);\r\n        }\r\n    };\r\n\r\n    // This next function retrieves the relevant node information for the widget\r\n    <%= visualizerID %>Control.prototype._getObjectDescriptor = function (nodeId) {\r\n        var node = this._client.getNode(nodeId),\r\n            objDescriptor;\r\n        if (node) {\r\n            objDescriptor = {\r\n                id: node.getId(),\r\n                name: node.getAttribute(nodePropertyNames.Attributes.name),\r\n                childrenIds: node.getChildrenIds(),\r\n                parentId: node.getParentId(),\r\n                isConnection: GMEConcepts.isConnection(nodeId)\r\n            };\r\n        }\r\n\r\n        return objDescriptor;\r\n    };\r\n\r\n    /* * * * * * * * Node Event Handling * * * * * * * */\r\n    <%= visualizerID %>Control.prototype._eventCallback = function (events) {\r\n        var i = events ? events.length : 0,\r\n            event;\r\n\r\n        this._logger.debug('_eventCallback \\'' + i + '\\' items');\r\n\r\n        while (i--) {\r\n            event = events[i];\r\n            switch (event.etype) {\r\n\r\n            case CONSTANTS.TERRITORY_EVENT_LOAD:\r\n                this._onLoad(event.eid);\r\n                break;\r\n            case CONSTANTS.TERRITORY_EVENT_UPDATE:\r\n                this._onUpdate(event.eid);\r\n                break;\r\n            case CONSTANTS.TERRITORY_EVENT_UNLOAD:\r\n                this._onUnload(event.eid);\r\n                break;\r\n            default:\r\n                break;\r\n            }\r\n        }\r\n\r\n        this._logger.debug('_eventCallback \\'' + events.length + '\\' items - DONE');\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._onLoad = function (gmeId) {\r\n        var description = this._getObjectDescriptor(gmeId);\r\n        this._widget.addNode(description);\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._onUpdate = function (gmeId) {\r\n        var description = this._getObjectDescriptor(gmeId);\r\n        this._widget.updateNode(description);\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._onUnload = function (gmeId) {\r\n        this._widget.removeNode(gmeId);\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._stateActiveObjectChanged = function (model, activeObjectId) {\r\n        if (this._currentNodeId === activeObjectId) {\r\n            // The same node selected as before - do not trigger\r\n        } else {\r\n            this.selectedObjectChanged(activeObjectId);\r\n        }\r\n    };\r\n\r\n    /* * * * * * * * Visualizer life cycle callbacks * * * * * * * */\r\n    <%= visualizerID %>Control.prototype.destroy = function () {\r\n        this._detachClientEventListeners();\r\n        this._removeToolbarItems();\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._attachClientEventListeners = function () {\r\n        this._detachClientEventListeners();\r\n        WebGMEGlobal.State.on('change:' + CONSTANTS.STATE_ACTIVE_OBJECT, this._stateActiveObjectChanged, this);\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._detachClientEventListeners = function () {\r\n        WebGMEGlobal.State.off('change:' + CONSTANTS.STATE_ACTIVE_OBJECT, this._stateActiveObjectChanged);\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype.onActivate = function () {\r\n        this._attachClientEventListeners();\r\n        this._displayToolbarItems();\r\n\r\n        if (typeof this._currentNodeId === 'string') {\r\n            WebGMEGlobal.State.registerActiveObject(this._currentNodeId, {suppressVisualizerFromNode: true});\r\n        }\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype.onDeactivate = function () {\r\n        this._detachClientEventListeners();\r\n        this._hideToolbarItems();\r\n    };\r\n\r\n    /* * * * * * * * * * Updating the toolbar * * * * * * * * * */\r\n    <%= visualizerID %>Control.prototype._displayToolbarItems = function () {\r\n\r\n        if (this._toolbarInitialized === true) {\r\n            for (var i = this._toolbarItems.length; i--;) {\r\n                this._toolbarItems[i].show();\r\n            }\r\n        } else {\r\n            this._initializeToolbar();\r\n        }\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._hideToolbarItems = function () {\r\n\r\n        if (this._toolbarInitialized === true) {\r\n            for (var i = this._toolbarItems.length; i--;) {\r\n                this._toolbarItems[i].hide();\r\n            }\r\n        }\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._removeToolbarItems = function () {\r\n\r\n        if (this._toolbarInitialized === true) {\r\n            for (var i = this._toolbarItems.length; i--;) {\r\n                this._toolbarItems[i].destroy();\r\n            }\r\n        }\r\n    };\r\n\r\n    <%= visualizerID %>Control.prototype._initializeToolbar = function () {\r\n        var self = this,\r\n            toolBar = WebGMEGlobal.Toolbar;\r\n\r\n        this._toolbarItems = [];\r\n\r\n        this._toolbarItems.push(toolBar.addSeparator());\r\n\r\n        /************** Go to hierarchical parent button ****************/\r\n        this.$btnModelHierarchyUp = toolBar.addButton({\r\n            title: 'Go to parent',\r\n            icon: 'glyphicon glyphicon-circle-arrow-up',\r\n            clickFn: function (/*data*/) {\r\n                WebGMEGlobal.State.registerActiveObject(self._currentNodeParentId);\r\n            }\r\n        });\r\n        this._toolbarItems.push(this.$btnModelHierarchyUp);\r\n        this.$btnModelHierarchyUp.hide();\r\n\r\n        /************** Checkbox example *******************/\r\n\r\n        this.$cbShowConnection = toolBar.addCheckBox({\r\n            title: 'toggle checkbox',\r\n            icon: 'gme icon-gme_diagonal-arrow',\r\n            checkChangedFn: function (data, checked) {\r\n                self._logger.debug('Checkbox has been clicked!');\r\n            }\r\n        });\r\n        this._toolbarItems.push(this.$cbShowConnection);\r\n\r\n        this._toolbarInitialized = true;\r\n    };\r\n\r\n    return <%= visualizerID %>Control;\r\n});\r\n",
    "Panel.js.ejs": "/*globals define, _, WebGMEGlobal*/\r\n/**\r\n * Generated by VisualizerGenerator <%= version %> from webgme on <%= date %>.\r\n */\r\n\r\ndefine([\r\n    'js/PanelBase/PanelBaseWithHeader',\r\n    'js/PanelManager/IActivePanel',\r\n    'js/Widgets/<%= visualizerID %>/<%= visualizerID %>Widget',\r\n    './<%= visualizerID %>Control'\r\n], function (\r\n    PanelBaseWithHeader,\r\n    IActivePanel,\r\n    <%= visualizerID %>Widget,\r\n    <%= visualizerID %>Control\r\n) {\r\n    'use strict';\r\n\r\n    function <%= visualizerID %>Panel(layoutManager, params) {\r\n        var options = {};\r\n        //set properties from options\r\n        options[PanelBaseWithHeader.OPTIONS.LOGGER_INSTANCE_NAME] = '<%= visualizerID %>Panel';\r\n        options[PanelBaseWithHeader.OPTIONS.FLOATING_TITLE] = true;\r\n\r\n        //call parent's constructor\r\n        PanelBaseWithHeader.apply(this, [options, layoutManager]);\r\n\r\n        this._client = params.client;\r\n\r\n        //initialize UI\r\n        this._initialize();\r\n\r\n        this.logger.debug('ctor finished');\r\n    }\r\n\r\n    //inherit from PanelBaseWithHeader\r\n    _.extend(<%= visualizerID %>Panel.prototype, PanelBaseWithHeader.prototype);\r\n    _.extend(<%= visualizerID %>Panel.prototype, IActivePanel.prototype);\r\n\r\n    <%= visualizerID %>Panel.prototype._initialize = function () {\r\n        var self = this;\r\n\r\n        //set Widget title\r\n        this.setTitle('');\r\n\r\n        this.widget = new <%= visualizerID %>Widget(this.logger, this.$el);\r\n\r\n        this.widget.setTitle = function (title) {\r\n            self.setTitle(title);\r\n        };\r\n\r\n        this.control = new <%= visualizerID %>Control({\r\n            logger: this.logger,\r\n            client: this._client,\r\n            widget: this.widget\r\n        });\r\n\r\n        this.onActivate();\r\n    };\r\n\r\n    /* OVERRIDE FROM WIDGET-WITH-HEADER */\r\n    /* METHOD CALLED WHEN THE WIDGET'S READ-ONLY PROPERTY CHANGES */\r\n    <%= visualizerID %>Panel.prototype.onReadOnlyChanged = function (isReadOnly) {\r\n        //apply parent's onReadOnlyChanged\r\n        PanelBaseWithHeader.prototype.onReadOnlyChanged.call(this, isReadOnly);\r\n\r\n    };\r\n\r\n    <%= visualizerID %>Panel.prototype.onResize = function (width, height) {\r\n        this.logger.debug('onResize --> width: ' + width + ', height: ' + height);\r\n        this.widget.onWidgetContainerResize(width, height);\r\n    };\r\n\r\n    /* * * * * * * * Visualizer life cycle callbacks * * * * * * * */\r\n    <%= visualizerID %>Panel.prototype.destroy = function () {\r\n        this.control.destroy();\r\n        this.widget.destroy();\r\n\r\n        PanelBaseWithHeader.prototype.destroy.call(this);\r\n        WebGMEGlobal.KeyboardManager.setListener(undefined);\r\n        WebGMEGlobal.Toolbar.refresh();\r\n    };\r\n\r\n    <%= visualizerID %>Panel.prototype.onActivate = function () {\r\n        this.widget.onActivate();\r\n        this.control.onActivate();\r\n        WebGMEGlobal.KeyboardManager.setListener(this.widget);\r\n        WebGMEGlobal.Toolbar.refresh();\r\n    };\r\n\r\n    <%= visualizerID %>Panel.prototype.onDeactivate = function () {\r\n        this.widget.onDeactivate();\r\n        this.control.onDeactivate();\r\n        WebGMEGlobal.KeyboardManager.setListener(undefined);\r\n        WebGMEGlobal.Toolbar.refresh();\r\n    };\r\n\r\n    return <%= visualizerID %>Panel;\r\n});\r\n",
    "styles/Styles.css.ejs": "/**\r\n * This file is for any css that you may want for this visualizer.\r\n *\r\n * Ideally, you would use the scss file also provided in this directory \r\n * and then generate this file automatically from that. However, you can \r\n * simply write css if you prefer\r\n */\r\n\r\n.<%= widgetClass %> {\r\n  outline: none; }\r\n",
    "styles/Styles.scss.ejs": "/**\r\n * This file is for any scss that you may want for this visualizer.\r\n */\r\n\r\n.<%= widgetClass %> {\r\n  outline: none;\r\n}\r\n",
    "Widget.js.ejs": "/*globals define, WebGMEGlobal*/\r\n\r\n/**\r\n * Generated by VisualizerGenerator <%= version %> from webgme on <%= date %>.\r\n */\r\n\r\ndefine(['css!./styles/<%= visualizerID %>Widget.css'], function () {\r\n    'use strict';\r\n\r\n    var WIDGET_CLASS = '<%= widgetClass %>';\r\n\r\n    function <%= visualizerID %>Widget(logger, container) {\r\n        this._logger = logger.fork('Widget');\r\n\r\n        this._el = container;\r\n\r\n        this.nodes = {};\r\n        this._initialize();\r\n\r\n        this._logger.debug('ctor finished');\r\n    }\r\n\r\n    <%= visualizerID %>Widget.prototype._initialize = function () {\r\n        var width = this._el.width(),\r\n            height = this._el.height(),\r\n            self = this;\r\n\r\n        // set widget class\r\n        this._el.addClass(WIDGET_CLASS);\r\n\r\n        // Create a dummy header\r\n        this._el.append('<h3><%= visualizerID %> Events:</h3>');\r\n\r\n        // Registering to events can be done with jQuery (as normal)\r\n        this._el.on('dblclick', function (event) {\r\n            event.stopPropagation();\r\n            event.preventDefault();\r\n            self.onBackgroundDblClick();\r\n        });\r\n    };\r\n\r\n    <%= visualizerID %>Widget.prototype.onWidgetContainerResize = function (width, height) {\r\n        this._logger.debug('Widget is resizing...');\r\n    };\r\n\r\n    // Adding/Removing/Updating items\r\n    <%= visualizerID %>Widget.prototype.addNode = function (desc) {\r\n        if (desc) {\r\n            // Add node to a table of nodes\r\n            var node = document.createElement('div'),\r\n                label = 'children';\r\n\r\n            if (desc.childrenIds.length === 1) {\r\n                label = 'child';\r\n            }\r\n\r\n            this.nodes[desc.id] = desc;\r\n            node.innerHTML = 'Adding node \"' + desc.name + '\" (click to view). It has ' +\r\n                desc.childrenIds.length + ' ' + label + '.';\r\n\r\n            this._el.append(node);\r\n            node.onclick = this.onNodeClick.bind(this, desc.id);\r\n        }\r\n    };\r\n\r\n    <%= visualizerID %>Widget.prototype.removeNode = function (gmeId) {\r\n        var desc = this.nodes[gmeId];\r\n        this._el.append('<div>Removing node \"' + desc.name + '\"</div>');\r\n        delete this.nodes[gmeId];\r\n    };\r\n\r\n    <%= visualizerID %>Widget.prototype.updateNode = function (desc) {\r\n        if (desc) {\r\n            this._logger.debug('Updating node:', desc);\r\n            this._el.append('<div>Updating node \"' + desc.name + '\"</div>');\r\n        }\r\n    };\r\n\r\n    /* * * * * * * * Visualizer event handlers * * * * * * * */\r\n\r\n    <%= visualizerID %>Widget.prototype.onNodeClick = function (/*id*/) {\r\n        // This currently changes the active node to the given id and\r\n        // this is overridden in the controller.\r\n    };\r\n\r\n    <%= visualizerID %>Widget.prototype.onBackgroundDblClick = function () {\r\n        this._el.append('<div>Background was double-clicked!!</div>');\r\n    };\r\n\r\n    /* * * * * * * * Visualizer life cycle callbacks * * * * * * * */\r\n    <%= visualizerID %>Widget.prototype.destroy = function () {\r\n    };\r\n\r\n    <%= visualizerID %>Widget.prototype.onActivate = function () {\r\n        this._logger.debug('<%= visualizerID %>Widget has been activated');\r\n    };\r\n\r\n    <%= visualizerID %>Widget.prototype.onDeactivate = function () {\r\n        this._logger.debug('<%= visualizerID %>Widget has been deactivated');\r\n    };\r\n\r\n    return <%= visualizerID %>Widget;\r\n});\r\n"
}});