Web2d module migration

package.json

@@ -11,8 +11,7 @@
     "devDependencies": {
         "husky": "4",
         "lerna": "^3.16.4",
-        "lint-staged": "^10.5.4",
-        "prettier": "^2.2.1"
+        "lint-staged": "^10.5.4"
     },
     "workspaces": [
         "packages/*"

packages/core-js/README.md

@@ -0,0 +1,11 @@
+# `core-js`
+
+> TODO: description
+
+## Usage
+
+```
+const coreJs = require('core-js');
+
+// TODO: DEMONSTRATE API
+```

packages/core-js/__tests__/core.test.js

@@ -0,0 +1,7 @@
+'use strict';
+
+const coreJs = require('..');
+
+describe('core-js', () => {
+    it('needs tests');
+});

packages/core-js/babel.config.json

@@ -0,0 +1,11 @@
+{
+    "presets": [
+        [
+            "@babel/preset-env",
+            {
+                "corejs": "3.15",
+                "useBuiltIns": "usage"
+            }
+        ]
+    ]
+}

packages/core-js/lib/Functions.js

@@ -0,0 +1,53 @@
+/*
+ Function: $defined
+ Returns true if the passed in value/object is defined, that means is not null or undefined.
+
+ Arguments:
+ obj - object to inspect
+ */
+
+global.$defined = function (obj) {
+    return (obj != undefined);
+};
+
+
+global.$assert = function (assert, message) {
+    if (!$defined(assert) || !assert) {
+        logStackTrace();
+        console.log(message);
+        throw new Error(message);
+    }
+};
+
+Math.sign = function (value) {
+    return (value >= 0) ? 1 : -1;
+};
+
+function logStackTrace(exception) {
+
+    if (!$defined(exception)) {
+        try {
+            throw Error("Unexpected Exception");
+        } catch (e) {
+            exception = e;
+        }
+    }
+    var result = "";
+    if (exception.stack) { //Firefox  and Chrome...
+        result = exception.stack;
+    }
+    else if (window.opera && exception.message) { //Opera
+        result = exception.message;
+    } else {  //IE and Safari
+        result = exception.sourceURL + ': ' + exception.line + "\n\n";
+
+        var currentFunction = arguments.callee.caller;
+        while (currentFunction) {
+            var fn = currentFunction.toString();
+            result = result + "\n" + fn;
+            currentFunction = currentFunction.caller;
+        }
+    }
+    window.errorStack = result;
+    return result;
+}

packages/core-js/lib/Utils.js

@@ -0,0 +1,57 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+core.Utils = {};
+
+core.Utils.innerXML = function (node) {
+    //	summary:
+    //		Implementation of MS's innerXML function.
+    if ($defined(node.innerXML)) {
+        return node.innerXML;
+        //	string
+    } else if ($defined(node.xml)) {
+        return node.xml;
+        //	string
+    } else if ($defined(XMLSerializer)) {
+        return new XMLSerializer().serializeToString(node);
+        //	string
+    }
+};
+
+/**
+ * Cross-browser implementation of creating an XML document object.
+ */
+core.Utils.createDocument = function () {
+    var doc = null;
+    if ($defined(window.ActiveXObject)) {
+        //http://blogs.msdn.com/b/xmlteam/archive/2006/10/23/using-the-right-version-of-msxml-in-internet-explorer.aspx
+        var progIDs = ['Msxml2.DOMDocument.6.0', 'Msxml2.DOMDocument.3.0'];
+        for (var i = 0; i < progIDs.length; i++) {
+            try {
+                doc = new ActiveXObject(progIDs[i]);
+                break;
+            } catch (ex) {}
+        }
+    } else if (window.document.implementation && window.document.implementation.createDocument) {
+        doc = window.document.implementation.createDocument('', '', null);
+    }
+    $assert(doc, 'Parser could not be instantiated');
+
+    return doc;
+};
+

packages/core-js/lib/core.js

@@ -0,0 +1,13 @@
+'use strict';
+
+module.exports = coreJs; // eslint-disable-line
+
+function coreJs() {
+    global.core = require('./header'); // eslint-disable-line
+    require('./Functions'); // eslint-disable-line
+    require('./Utils'); // eslint-disable-line
+    global.Options = require('@wisemapping/mindplot/lib/components/Options');
+    global.BootstrapDialog = require('@wisemapping/mindplot/lib/components/libraries/bootstrap/BootstrapDialog');
+    //require('@wisemapping/mindplot/lib/components/libraries/bootstrap/BootstrapDialog.Request');
+    return global.core; // eslint-disable-line no-undef
+}

packages/core-js/lib/header.js

@@ -0,0 +1,18 @@
+/*
+*    Copyright [2015] [wisemapping]
+*
+*   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+*   It is basically the Apache License, Version 2.0 (the "License") plus the
+*   "powered by wisemapping" text requirement on every single page;
+*   you may not use this file except in compliance with the License.
+*   You may obtain a copy of the license at
+*
+*       http://www.wisemapping.org/license
+*
+*   Unless required by applicable law or agreed to in writing, software
+*   distributed under the License is distributed on an "AS IS" BASIS,
+*   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+*   See the License for the specific language governing permissions and
+*   limitations under the License.
+*/
+export default {}

packages/core-js/package.json

@@ -0,0 +1,40 @@
+{
+    "name": "@wismapping/core-js",
+    "version": "0.0.1",
+    "description": "core-js",
+    "license": "ISC",
+    "main": "lib/core.js",
+    "directories": {
+        "lib": "lib",
+        "test": "__tests__"
+    },
+    "files": [
+        "lib"
+    ],
+    "publishConfig": {
+        "registry": "https://registry.yarnpkg.com"
+    },
+    "repository": {
+        "type": "git",
+        "url": "git+https://ezequielVega@bitbucket.org/lilabyus/wisemapping-frontend.git"
+    },
+    "scripts": {
+        "build": "webpack --config webpack.prod.js",
+        "start": "webpack serve --config webpack.dev.js"
+    },
+    "devDependencies": {
+        "@babel/core": "^7.14.6",
+        "@babel/preset-env": "^7.14.7",
+        "babel-loader": "^8.2.2",
+        "clean-webpack-plugin": "^4.0.0-alpha.0",
+        "core-js": "^3.15.2",
+        "html-webpack-plugin": "^5.3.2",
+        "webpack": "^5.44.0",
+        "webpack-cli": "^4.7.2",
+        "webpack-dev-server": "^3.11.2",
+        "webpack-merge": "^5.8.0"
+    },
+    "dependencies": {
+        "@wisemapping/mindplot": "^0.0.1"
+    }
+}

packages/core-js/webpack.common.js

@@ -0,0 +1,59 @@
+const path = require('path'); // eslint-disable-line
+//const { ProvidePlugin } = require('webpack');
+const { CleanWebpackPlugin } = require('clean-webpack-plugin'); // eslint-disable-line
+
+/** @type {import('webpack').Configuration} */
+module.exports = { // eslint-disable-line 
+    entry: './lib/core.js',
+    output: {
+        path: path.resolve(__dirname, 'dist'), // eslint-disable-line
+        filename: 'core.js',
+        publicPath: '',
+    },
+    module: {
+        rules: [
+            {
+                use: 'babel-loader',
+                test: /.(js|jsx)$/,
+                exclude: /node_modules/,
+            },
+            {
+                type: 'asset',
+                test: /\.(png|svg|jpg|jpeg|gif)$/i,
+            },
+        ],
+    },
+    resolve: {
+        extensions: ['.js', '.jsx', '.json'],
+    },
+    plugins: [new CleanWebpackPlugin()],
+};
+
+/*
+ *{
+        core: [
+            path.resolve(__dirname, '../mindplot/src/main/javascript/Options'),
+            path.resolve(
+                __dirname,
+                '../mindplot/src/main/javascript/libraries/bootstrap/BootstrapDialog'
+            ),
+            path.resolve(
+                __dirname,
+                '../mindplot/src/main/javascript/libraries/bootstrap/BootstrapDialog.Request'
+            ),
+        ],
+    },
+Options: path.resolve(path.join(__dirname, '../mindplot/src/main/javascript/Options')),
+            BootstrapDialog: path.resolve(
+                path.join(
+                    __dirname,
+                    '../mindplot/src/main/javascript/libraries/bootstrap/BootstrapDialog'
+                )
+            ),
+            BootstrapDialogRequest: path.resolve(
+                path.join(
+                    __dirname,
+                    '../mindplot/src/main/javascript/libraries/bootstrap/BootstrapDialog.Request'
+                )
+            ),
+ * */

packages/core-js/webpack.dev.js

@@ -0,0 +1,14 @@
+const { HotModuleReplacementPlugin } = require("webpack");
+const { merge } = require("webpack-merge");
+const common = require("./webpack.common");
+
+/** @type {import('webpack').Configuration} */
+const devConfig = {
+  mode: "development",
+  target: "core",
+  plugins: [new HotModuleReplacementPlugin()],
+  devtool: "eval-source-map" 
+};
+
+module.exports = merge(common, devConfig)
+

packages/core-js/webpack.prod.js

@@ -0,0 +1,16 @@
+const { merge } = require("webpack-merge");
+const common = require("./webpack.common");
+
+/** @type {import('webpack').Configuration} */
+const prodConfig = {
+  mode: "production",
+  devtool: "source-map",
+  optimization: {
+    splitChunks: {
+      chunks: "all",
+    },
+  }
+};
+
+module.exports = merge(common, prodConfig);
+

packages/mindplot/README.md

@@ -0,0 +1,11 @@
+# `mindplot`
+
+> TODO: description
+
+## Usage
+
+```
+const mindplot = require('mindplot');
+
+// TODO: DEMONSTRATE API
+```

packages/mindplot/__tests__/mindplot.test.js

@@ -0,0 +1,7 @@
+'use strict';
+
+const mindplot = require('..');
+
+describe('mindplot', () => {
+    it('needs tests');
+});

packages/mindplot/babel.config.json

@@ -0,0 +1,11 @@
+{
+    "presets": [
+        [
+            "@babel/preset-env",
+            {
+                "corejs": "3.9",
+                "useBuiltIns": "usage"
+            }
+        ]
+    ]
+}

packages/mindplot/lib/components/.gitignore

@@ -0,0 +1 @@
+MessageBundle_*

packages/mindplot/lib/components/ActionDispatcher.js

@@ -0,0 +1,112 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Events = require('./Events').default;
+
+//noinspection JSUnusedLocalSymbols
+const ActionDispatcher = new Class({
+    Implements:[Events],
+    initialize: function(commandContext) {
+        $assert(commandContext, "commandContext can not be null");
+    },
+
+    addRelationship: function(model, mindmap) {
+        throw "method must be implemented.";
+    },
+
+    addTopics: function(models, parentTopicId) {
+        throw "method must be implemented.";
+    },
+
+    deleteEntities: function(topicsIds, relIds) {
+        throw "method must be implemented.";
+    },
+
+    dragTopic: function(topicId, position, order, parentTopic) {
+        throw "method must be implemented.";
+    },
+
+    moveTopic: function(topicId, position) {
+        throw "method must be implemented.";
+    },
+
+    moveControlPoint: function(ctrlPoint, point) {
+        throw "method must be implemented.";
+    },
+
+    changeFontFamilyToTopic: function(topicIds, fontFamily) {
+        throw "method must be implemented.";
+    },
+
+    changeFontStyleToTopic: function(topicsIds) {
+        throw "method must be implemented.";
+    },
+
+    changeFontColorToTopic: function(topicsIds, color) {
+        throw "method must be implemented.";
+    },
+
+    changeFontSizeToTopic : function(topicsIds, size) {
+        throw "method must be implemented.";
+    },
+
+    changeBackgroundColorToTopic: function(topicsIds, color) {
+        throw "method must be implemented.";
+    },
+
+    changeBorderColorToTopic: function(topicsIds, color) {
+        throw "method must be implemented.";
+    },
+
+    changeShapeTypeToTopic : function(topicsIds, shapeType) {
+        throw "method must be implemented.";
+    },
+
+    changeFontWeightToTopic : function(topicsIds) {
+        throw "method must be implemented.";
+    },
+
+    changeTextToTopic : function(topicsIds, text) {
+        throw "method must be implemented.";
+    },
+
+    shrinkBranch : function(topicsIds, collapse) {
+        throw "method must be implemented.";
+    },
+
+    addFeatureToTopic : function(topicId, type, attributes) {
+        throw "method must be implemented.";
+    },
+
+    changeFeatureToTopic : function(topicId, featureId, attributes) {
+        throw "method must be implemented.";
+    },
+
+    removeFeatureFromTopic : function(topicId, featureId) {
+        throw "method must be implemented.";
+    }
+});
+
+ActionDispatcher.setInstance = function(dispatcher) {
+    ActionDispatcher._instance = dispatcher;
+};
+
+ActionDispatcher.getInstance = function() {
+    return ActionDispatcher._instance;
+};
+
+export default ActionDispatcher;

packages/mindplot/lib/components/ActionIcon.js

@@ -0,0 +1,64 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Icon = require('./Icon').default;
+
+const ActionIcon = new Class({
+    Extends:Icon,
+    initialize: function(topic, url) {
+        this.parent(url);
+        this._node = topic;
+    },
+    getNode:function() {
+        return this._node;
+    },
+
+    setPosition:function(x, y) {
+        var size = this.getSize();
+        this.getImage().setPosition(x - size.width / 2, y - size.height / 2);
+    },
+
+    addEvent:function(event, fn) {
+        this.getImage().addEvent(event, fn);
+    },
+
+    addToGroup:function(group) {
+        group.append(this.getImage());
+    },
+
+    setVisibility:function(visible) {
+        this.getImage().setVisibility(visible);
+    },
+
+    isVisible:function() {
+        return this.getImage().isVisible();
+    },
+
+    setCursor:function(cursor) {
+        return this.getImage().setCursor(cursor);
+    },
+
+    moveToBack:function(cursor) {
+        return this.getImage().moveToBack(cursor);
+    },
+
+    moveToFront:function(cursor) {
+        return this.getImage().moveToFront(cursor);
+    }
+});
+
+export default ActionIcon;

packages/mindplot/lib/components/CentralTopic.js

@@ -0,0 +1,83 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js')
+const core = Core();
+const Topic = require('./Topic').default;
+const Shape = require('./util/Shape').default;
+
+const CentralTopic = new Class(/** @lends CentralTopic*/{
+
+    Extends:Topic,
+    /**
+     * @extends mindplot.Topic
+     * @constructs
+     * @param model
+     * @param options
+     */
+    initialize:function (model, options) {
+        this.parent(model, options);
+    },
+
+    _registerEvents:function () {
+        this.parent();
+
+        // This disable the drag of the central topic. But solves the problem of deselecting the nodes when the screen is clicked.
+        this.addEvent('mousedown', function (event) {
+            event.stopPropagation();
+        });
+    },
+
+    /** */
+    workoutIncomingConnectionPoint:function () {
+        return this.getPosition();
+    },
+
+    /** */
+    setCursor:function (type) {
+        type = (type == 'move') ? 'default' : type;
+        this.parent(type);
+    },
+
+    /** */
+    updateTopicShape:function () {
+
+    },
+
+    _updatePositionOnChangeSize:function () {
+
+        // Center main topic ...
+        var zeroPoint = new core.Point(0, 0);
+        this.setPosition(zeroPoint);
+    },
+
+    /** */
+    getShrinkConnector:function () {
+        return null;
+    },
+
+    /** */
+    workoutOutgoingConnectionPoint:function (targetPosition) {
+        $assert(targetPosition, 'targetPoint can not be null');
+        var pos = this.getPosition();
+        var isAtRight = Shape.isAtRight(targetPosition, pos);
+        var size = this.getSize();
+        return Shape.calculateRectConnectionPoint(pos, size, !isAtRight);
+    }
+});
+
+export default CentralTopic;

packages/mindplot/lib/components/Command.js

@@ -0,0 +1,67 @@
+/*
+*    Copyright [2015] [wisemapping]
+*
+*   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+*   It is basically the Apache License, Version 2.0 (the "License") plus the
+*   "powered by wisemapping" text requirement on every single page;
+*   you may not use this file except in compliance with the License.
+*   You may obtain a copy of the license at
+*
+*       http://www.wisemapping.org/license
+*
+*   Unless required by applicable law or agreed to in writing, software
+*   distributed under the License is distributed on an "AS IS" BASIS,
+*   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+*   See the License for the specific language governing permissions and
+*   limitations under the License.
+*/
+
+const Command = new Class(/** @lends mindplot.Command */{
+    /**
+     * @classdesc The command base class for handling do/undo mindmap operations
+     * @constructs
+     */
+    initialize: function()
+    {
+        this._id = Command._nextUUID();
+    },
+
+    /** 
+     * @abstract
+     */
+    execute: function(commandContext)
+    {
+        throw "execute must be implemented.";
+    },
+
+    /** 
+     * Triggered by the undo button - reverses the executed command 
+     * @abstract
+     */
+    undoExecute: function(commandContext)
+    {
+        throw "undo must be implemented.";
+    },
+
+    /** 
+     * Returns the unique id of this command
+     * @returns {Number} command id
+     */
+    getId:function()
+    {
+        return this._id;
+    }
+});
+
+Command._nextUUID = function()
+{
+    if (!$defined(Command._uuid))
+    {
+        Command._uuid = 1;
+    }
+
+    Command._uuid = Command._uuid + 1;
+    return Command._uuid;
+};
+
+export default Command;

packages/mindplot/lib/components/ConnectionLine.js

@@ -0,0 +1,211 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js');
+const core = Core();
+const web2D = require('@wismapping/web2d');
+const web2d = web2D();
+
+const INodeModel,
+    { TopicShape } = require('./model/INodeModel').default;
+const Topic = require('./Topic').default;
+
+const ConnectionLine = new Class({
+    initialize: function (sourceNode, targetNode, lineType) {
+        $assert(targetNode, 'parentNode node can not be null');
+        $assert(sourceNode, 'childNode node can not be null');
+        $assert(sourceNode != targetNode, 'Circular connection');
+
+        this._targetTopic = targetNode;
+        this._sourceTopic = sourceNode;
+
+        var line;
+        var ctrlPoints = this._getCtrlPoints(sourceNode, targetNode);
+        if (targetNode.getType() == INodeModel.CENTRAL_TOPIC_TYPE) {
+            line = this._createLine(lineType, ConnectionLine.CURVED);
+            line.setSrcControlPoint(ctrlPoints[0]);
+            line.setDestControlPoint(ctrlPoints[1]);
+        } else {
+            line = this._createLine(lineType, ConnectionLine.SIMPLE_CURVED);
+            line.setSrcControlPoint(ctrlPoints[0]);
+            line.setDestControlPoint(ctrlPoints[1]);
+        }
+        // Set line styles ...
+        var strokeColor = ConnectionLine.getStrokeColor();
+        line.setStroke(1, 'solid', strokeColor, 1);
+        line.setFill(strokeColor, 1);
+
+        this._line2d = line;
+    },
+
+    _getCtrlPoints: function (sourceNode, targetNode) {
+        var srcPos = sourceNode.workoutOutgoingConnectionPoint(targetNode.getPosition());
+        var destPos = targetNode.workoutIncomingConnectionPoint(sourceNode.getPosition());
+        var deltaX = (srcPos.x - destPos.x) / 3;
+        return [new core.Point(deltaX, 0), new core.Point(-deltaX, 0)];
+    },
+
+    _createLine: function (lineType, defaultStyle) {
+        if (!$defined(lineType)) {
+            lineType = defaultStyle;
+        }
+        lineType = parseInt(lineType);
+        this._lineType = lineType;
+        var line = null;
+        switch (lineType) {
+            case ConnectionLine.POLYLINE:
+                line = new web2d.PolyLine();
+                break;
+            case ConnectionLine.CURVED:
+                line = new web2d.CurvedLine();
+                break;
+            case ConnectionLine.SIMPLE_CURVED:
+                line = new web2d.CurvedLine();
+                line.setStyle(web2d.CurvedLine.SIMPLE_LINE);
+                break;
+            default:
+                line = new web2d.Line();
+                break;
+        }
+        return line;
+    },
+
+    setVisibility: function (value) {
+        this._line2d.setVisibility(value);
+    },
+
+    isVisible: function () {
+        return this._line2d.isVisible();
+    },
+
+    setOpacity: function (opacity) {
+        this._line2d.setOpacity(opacity);
+    },
+
+    redraw: function () {
+        var line2d = this._line2d;
+        var sourceTopic = this._sourceTopic;
+        var sourcePosition = sourceTopic.getPosition();
+
+        var targetTopic = this._targetTopic;
+        var targetPosition = targetTopic.getPosition();
+
+        var sPos, tPos;
+        sPos = sourceTopic.workoutOutgoingConnectionPoint(targetPosition);
+        tPos = targetTopic.workoutIncomingConnectionPoint(sourcePosition);
+
+        line2d.setFrom(tPos.x, tPos.y);
+        line2d.setTo(sPos.x, sPos.y);
+
+        if (line2d.getType() == 'CurvedLine') {
+            var ctrlPoints = this._getCtrlPoints(this._sourceTopic, this._targetTopic);
+            line2d.setSrcControlPoint(ctrlPoints[0]);
+            line2d.setDestControlPoint(ctrlPoints[1]);
+        }
+
+        // Add connector ...
+        this._positionateConnector(targetTopic);
+    },
+
+    _positionateConnector: function (targetTopic) {
+        var targetPosition = targetTopic.getPosition();
+        var offset = Topic.CONNECTOR_WIDTH / 2;
+        var targetTopicSize = targetTopic.getSize();
+        var y, x;
+        if (targetTopic.getShapeType() == TopicShape.LINE) {
+            y = targetTopicSize.height;
+        } else {
+            y = targetTopicSize.height / 2;
+        }
+        y = y - offset;
+
+        var connector = targetTopic.getShrinkConnector();
+        if ($defined(connector)) {
+            if (Math.sign(targetPosition.x) > 0) {
+                x = targetTopicSize.width;
+                connector.setPosition(x, y);
+            } else {
+                x = -Topic.CONNECTOR_WIDTH;
+            }
+            connector.setPosition(x, y);
+        }
+    },
+
+    setStroke: function (color, style, opacity) {
+        this._line2d.setStroke(null, null, color, opacity);
+    },
+
+    addToWorkspace: function (workspace) {
+        workspace.append(this._line2d);
+        this._line2d.moveToBack();
+    },
+
+    removeFromWorkspace: function (workspace) {
+        workspace.removeChild(this._line2d);
+    },
+
+    getTargetTopic: function () {
+        return this._targetTopic;
+    },
+
+    getSourceTopic: function () {
+        return this._sourceTopic;
+    },
+
+    getLineType: function () {
+        return this._lineType;
+    },
+
+    getLine: function () {
+        return this._line2d;
+    },
+
+    getModel: function () {
+        return this._model;
+    },
+
+    setModel: function (model) {
+        this._model = model;
+    },
+
+    getType: function () {
+        return 'ConnectionLine';
+    },
+
+    getId: function () {
+        return this._model.getId();
+    },
+
+    moveToBack: function () {
+        this._line2d.moveToBack();
+    },
+
+    moveToFront: function () {
+        this._line2d.moveToFront();
+    },
+});
+
+ConnectionLine.getStrokeColor = function () {
+    return '#495879';
+};
+
+ConnectionLine.SIMPLE = 0;
+ConnectionLine.POLYLINE = 1;
+ConnectionLine.CURVED = 2;
+ConnectionLine.SIMPLE_CURVED = 3;
+
+export default ConnectionLine;

packages/mindplot/lib/components/ControlPoint.js

@@ -0,0 +1,211 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js')
+const core = Core();
+const web2D = require('@wismapping/web2d')
+const web2d = web2D();
+
+const Shape = require('./util/Shape').default
+const ActionDispatcher = require('./ActionDispatcher').default;
+
+const ControlPoint = new Class({
+    initialize: function () {
+        var control1 = new web2d.Elipse({
+            width: 6,
+            height: 6,
+            stroke: '1 solid #6589de',
+            fillColor: 'gray',
+            visibility: false
+        });
+        control1.setCursor('pointer');
+
+        var control2 = new web2d.Elipse({
+            width: 6,
+            height: 6,
+            stroke: '1 solid #6589de',
+            fillColor: 'gray',
+            visibility: false
+        });
+        control2.setCursor('pointer');
+
+        this._controlPointsController = [control1, control2];
+        this._controlLines = [new web2d.Line({strokeColor: "#6589de", strokeWidth: 1, opacity: 0.3}),
+            new web2d.Line({strokeColor: "#6589de", strokeWidth: 1, opacity: 0.3})];
+
+        this._isBinded = false;
+        var me = this;
+        this._controlPointsController[0].addEvent('mousedown', function (event) {
+            (me._mouseDown)(event, ControlPoint.FROM, me);
+        });
+        this._controlPointsController[0].addEvent('click', function (event) {
+            (me._mouseClick)(event);
+        });
+        this._controlPointsController[0].addEvent('dblclick', function (event) {
+            (me._mouseClick)(event);
+        });
+
+        this._controlPointsController[1].addEvent('mousedown', function (event) {
+            (me._mouseDown)(event, ControlPoint.TO, me);
+        });
+        this._controlPointsController[1].addEvent('click', function (event) {
+            (me._mouseClick)(event);
+        });
+        this._controlPointsController[1].addEvent('dblclick', function (event) {
+            (me._mouseClick)(event);
+        });
+    },
+
+    setLine: function (line) {
+        if ($defined(this._line)) {
+            this._removeLine();
+        }
+        this._line = line;
+        this._createControlPoint();
+        this._endPoint = [];
+        this._orignalCtrlPoint = [];
+        this._orignalCtrlPoint[0] = this._controls[0].clone();
+        this._orignalCtrlPoint[1] = this._controls[1].clone();
+        this._endPoint[0] = this._line.getLine().getFrom().clone();
+        this._endPoint[1] = this._line.getLine().getTo().clone();
+    },
+
+    redraw: function () {
+        if ($defined(this._line))
+            this._createControlPoint();
+    },
+
+    _createControlPoint: function () {
+        this._controls = this._line.getLine().getControlPoints();
+        var pos = this._line.getLine().getFrom();
+        this._controlPointsController[0].setPosition(this._controls[ControlPoint.FROM].x + pos.x, this._controls[ControlPoint.FROM].y + pos.y - 3);
+        this._controlLines[0].setFrom(pos.x, pos.y);
+        this._controlLines[0].setTo(this._controls[ControlPoint.FROM].x + pos.x + 3, this._controls[ControlPoint.FROM].y + pos.y);
+        pos = this._line.getLine().getTo();
+        this._controlLines[1].setFrom(pos.x, pos.y);
+        this._controlLines[1].setTo(this._controls[ControlPoint.TO].x + pos.x + 3, this._controls[ControlPoint.TO].y + pos.y);
+        this._controlPointsController[1].setPosition(this._controls[ControlPoint.TO].x + pos.x, this._controls[ControlPoint.TO].y + pos.y - 3);
+
+    },
+
+    _removeLine: function () {
+
+    },
+
+    _mouseDown: function (event, point, me) {
+        if (!this._isBinded) {
+            this._isBinded = true;
+            this._mouseMoveFunction = function (event) {
+                (me._mouseMoveEvent)(event, point, me);
+            };
+
+            this._workspace.getScreenManager().addEvent('mousemove', this._mouseMoveFunction);
+            this._mouseUpFunction = function (event) {
+                (me._mouseUp)(event, point, me);
+            };
+            this._workspace.getScreenManager().addEvent('mouseup', this._mouseUpFunction);
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        return false;
+    },
+
+    _mouseMoveEvent: function (event, point) {
+        var screen = this._workspace.getScreenManager();
+        var pos = screen.getWorkspaceMousePosition(event);
+
+        var cords;
+        if (point == 0) {
+            cords = Shape.calculateRelationShipPointCoordinates(this._line.getSourceTopic(), pos);
+            this._line.setFrom(cords.x, cords.y);
+            this._line.setSrcControlPoint(new core.Point(pos.x - cords.x, pos.y - cords.y));
+        } else {
+            cords = Shape.calculateRelationShipPointCoordinates(this._line.getTargetTopic(), pos);
+            this._line.setTo(cords.x, cords.y);
+            this._line.setDestControlPoint(new core.Point(pos.x - cords.x, pos.y - cords.y));
+        }
+
+        this._controls[point].x = (pos.x - cords.x);
+        this._controls[point].y = (pos.y - cords.y);
+        this._controlPointsController[point].setPosition(pos.x - 5, pos.y - 3);
+        this._controlLines[point].setFrom(cords.x, cords.y);
+        this._controlLines[point].setTo(pos.x - 2, pos.y);
+        this._line.getLine().updateLine(point);
+
+    },
+
+    _mouseUp: function (event, point) {
+        this._workspace.getScreenManager().removeEvent('mousemove', this._mouseMoveFunction);
+        this._workspace.getScreenManager().removeEvent('mouseup', this._mouseUpFunction);
+
+        var actionDispatcher = ActionDispatcher.getInstance();
+        actionDispatcher.moveControlPoint(this, point);
+        this._isBinded = false;
+    },
+
+    _mouseClick: function (event) {
+        event.preventDefault();
+        event.stopPropagation();
+        return false;
+    },
+
+    setVisibility: function (visible) {
+        if (visible) {
+            this._controlLines[0].moveToFront();
+            this._controlLines[1].moveToFront();
+            this._controlPointsController[0].moveToFront();
+            this._controlPointsController[1].moveToFront();
+        }
+        this._controlPointsController[0].setVisibility(visible);
+        this._controlPointsController[1].setVisibility(visible);
+        this._controlLines[0].setVisibility(visible);
+        this._controlLines[1].setVisibility(visible);
+    },
+
+    addToWorkspace: function (workspace) {
+        this._workspace = workspace;
+        workspace.append(this._controlPointsController[0]);
+        workspace.append(this._controlPointsController[1]);
+        workspace.append(this._controlLines[0]);
+        workspace.append(this._controlLines[1]);
+    },
+
+    removeFromWorkspace: function (workspace) {
+        this._workspace = null;
+        workspace.removeChild(this._controlPointsController[0]);
+        workspace.removeChild(this._controlPointsController[1]);
+        workspace.removeChild(this._controlLines[0]);
+        workspace.removeChild(this._controlLines[1]);
+    },
+
+    getControlPoint: function (index) {
+        return this._controls[index];
+    },
+
+    getOriginalEndPoint: function (index) {
+        return this._endPoint[index];
+    },
+
+    getOriginalCtrlPoint: function (index) {
+        return this._orignalCtrlPoint[index];
+    }
+});
+
+ControlPoint.FROM = 0;
+ControlPoint.TO = 1;
+
+export default ControlPoint;

packages/mindplot/lib/components/DesignerActionRunner.js

@@ -0,0 +1,58 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const DesignerUndoManager = require('./DesignerUndoManager').default;
+const EventBus = require('./layout/EventBus').default;
+
+const DesignerActionRunner = new Class({
+    initialize: function (commandContext, notifier) {
+        $assert(commandContext, "commandContext can not be null");
+
+        this._undoManager = new DesignerUndoManager();
+        this._context = commandContext;
+        this._notifier = notifier;
+    },
+
+    execute: function (command) {
+        $assert(command, "command can not be null");
+        command.execute(this._context);
+        this._undoManager.enqueue(command);
+        this.fireChangeEvent();
+        EventBus.instance.fireEvent(EventBus.events.DoLayout);
+
+    },
+
+    undo: function () {
+        this._undoManager.execUndo(this._context);
+        this.fireChangeEvent();
+        EventBus.instance.fireEvent(EventBus.events.DoLayout);
+    },
+
+    redo: function () {
+        this._undoManager.execRedo(this._context);
+        this.fireChangeEvent();
+        EventBus.instance.fireEvent(EventBus.events.DoLayout);
+
+    },
+
+    fireChangeEvent: function () {
+        var event = this._undoManager.buildEvent();
+        this._notifier.fireEvent("modelUpdate", event);
+    }
+});
+
+export default DesignerActionRunner;

packages/mindplot/lib/components/DesignerKeyboard.js

@@ -0,0 +1,400 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Keyboard = require('./Keyboard').default;
+
+const DesignerKeyboard = new Class({
+    Extends: Keyboard,
+    Static:{
+        register:function (designer) {
+            this._instance = new DesignerKeyboard(designer);
+        },
+
+        getInstance:function () {
+            return this._instance;
+        }
+    },
+
+    initialize:function (designer) {
+        $assert(designer, "designer can not be null");
+        this._registerEvents(designer);
+    },
+
+    _registerEvents:function (designer) {
+
+        // Try with the keyboard ..
+        var model = designer.getModel();
+        this.addShortcut(
+            ['backspace'], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+                designer.deleteSelectedEntities();
+            }
+        );
+        this.addShortcut(
+            ['space'], function() {
+                designer.shrinkSelectedBranch();
+            }
+        );
+        this.addShortcut(
+            ['f2'],function(event) {
+                event.stopPropagation();
+                event.preventDefault();
+                var node = model.selectedTopic();
+                if (node) {
+                    node.showTextEditor();
+                }
+            }
+        );
+        this.addShortcut(
+            ['del'], function(event) {
+                designer.deleteSelectedEntities();
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        );
+        this.addShortcut(
+            ['enter'], function() {
+                designer.createSiblingForSelectedNode();
+            }
+        );
+        this.addShortcut(
+            ['insert'], function(event) {
+                designer.createChildForSelectedNode();
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        );
+        this.addShortcut(
+            ['tab'], function(event) {
+                designer.createChildForSelectedNode();
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        );
+        this.addShortcut(
+            ['meta+enter'], function(event) {
+                event.preventDefault();
+                event.stopPropagation();
+                designer.createChildForSelectedNode();
+            }
+        );
+        this.addShortcut(
+            ['ctrl+z', 'meta+z'], function(event) {
+                event.preventDefault(event);
+                event.stopPropagation();
+                designer.undo();
+            }
+        );
+        this.addShortcut(
+            ['ctrl+c', 'meta+c'], function (event) {
+                event.preventDefault(event);
+                event.stopPropagation();
+                designer.copyToClipboard();
+            }
+        );
+        this.addShortcut(
+            ['ctrl+v', 'meta+v'], function (event) {
+                event.preventDefault(event);
+                event.stopPropagation();
+                designer.pasteClipboard();
+            }
+        );
+        this.addShortcut(
+            ['ctrl+shift+z', 'meta+shift+z', 'ctrl+y', 'meta+y'], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+                designer.redo();
+            }
+        );
+        this.addShortcut(
+            ['ctrl+a', 'meta+a'], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+                designer.selectAll();
+            }
+        );
+        this.addShortcut(
+            ['ctrl+b', 'meta+b'], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+
+                designer.changeFontWeight();
+            }
+        );
+        this.addShortcut(
+            ['ctrl+s', 'meta+s'], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+                $(document).find('#save').trigger('click');
+            }
+        );
+        this.addShortcut(
+            ['ctrl+i', 'meta+i'], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+
+                designer.changeFontStyle();
+            }
+        );
+        this.addShortcut(
+            ['ctrl+shift+a', 'meta+shift+a'], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+
+                designer.deselectAll();
+            }
+        );
+        this.addShortcut(
+            ['meta+=', 'ctrl+='], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+
+                designer.zoomIn();
+            }
+        );
+        this.addShortcut(
+            ['meta+-', 'ctrl+-'], function (event) {
+                event.preventDefault();
+                event.stopPropagation();
+
+                designer.zoomOut();
+            }
+        );
+        var me = this;
+        this.addShortcut(
+            'right', function (event) {
+                var node = model.selectedTopic();
+                if (node) {
+                    if (node.isCentralTopic()) {
+                        me._goToSideChild(designer, node, 'RIGHT');
+                    }
+                    else {
+                        if (node.getPosition().x < 0) {
+                            me._goToParent(designer, node);
+                        }
+                        else if (!node.areChildrenShrunken()) {
+                            me._goToChild(designer, node);
+                        }
+                    }
+                } else {
+                    var centralTopic = model.getCentralTopic();
+                    me._goToNode(designer, centralTopic);
+                }
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        );
+        this.addShortcut(
+            'left', function (event) {
+                var node = model.selectedTopic();
+                if (node) {
+                    if (node.isCentralTopic()) {
+                        me._goToSideChild(designer, node, 'LEFT');
+                    }
+                    else {
+                        if (node.getPosition().x > 0) {
+                            me._goToParent(designer, node);
+                        }
+                        else if (!node.areChildrenShrunken()) {
+                            me._goToChild(designer, node);
+                        }
+                    }
+                } else {
+                    var centralTopic = model.getCentralTopic();
+                    me._goToNode(designer, centralTopic);
+                }
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        );
+        this.addShortcut(
+            'up', function (event) {
+                var node = model.selectedTopic();
+                if (node) {
+                    if (!node.isCentralTopic()) {
+                        me._goToBrother(designer, node, 'UP');
+                    }
+                } else {
+                    var centralTopic = model.getCentralTopic();
+                    me._goToNode(designer, centralTopic);
+                }
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        );
+        this.addShortcut(
+            'down', function (event) {
+                var node = model.selectedTopic();
+                if (node) {
+                    if (!node.isCentralTopic()) {
+                        me._goToBrother(designer, node, 'DOWN');
+                    }
+                } else {
+                    var centralTopic = model.getCentralTopic();
+                    me._goToNode(designer, centralTopic);
+                }
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        );
+        var excludes = ['esc', 'escape', 'f1', 'f3', 'f4', 'f5', 'f6', 'f7', 'f8', 'f9', 'f10', 'f11', 'f12'];
+        
+        $(document).on('keypress', function (event) {
+            var keyCode;
+            // Firefox doesn't skip special keys for keypress event...
+            if (event.key && excludes.contains(event.key.toLowerCase())) {
+                return;
+            }
+            // Sometimes Firefox doesn't contain keyCode value
+            if (event.key && event.keyCode == 0) {
+                keyCode = event.charCode;
+            } else {
+                keyCode = event.keyCode;
+            }
+
+            var specialKey = jQuery.hotkeys.specialKeys[keyCode];
+            if (["enter", "capslock"].indexOf(specialKey) == -1 && !jQuery.hotkeys.shiftNums[keyCode]) {
+                var nodes = designer.getModel().filterSelectedTopics();
+                if (nodes.length > 0) {
+
+                    // If a modifier is press, the key selected must be ignored.
+                    var pressKey = String.fromCharCode(keyCode);
+                    if (event.ctrlKey || event.altKey || event.metaKey) {
+                        return;
+                    }
+                    nodes[0].showTextEditor(pressKey);
+                    event.stopPropagation();
+                }
+            }
+            
+        });
+
+    },
+
+    _goToBrother:function (designer, node, direction) {
+        var parent = node.getParent();
+        if (parent) {
+            var brothers = parent.getChildren();
+
+            var target = node;
+            var y = node.getPosition().y;
+            var x = node.getPosition().x;
+            var dist = null;
+            for (var i = 0; i < brothers.length; i++) {
+                var sameSide = (x * brothers[i].getPosition().x) >= 0;
+                if (brothers[i] != node && sameSide) {
+                    var brother = brothers[i];
+                    var brotherY = brother.getPosition().y;
+                    if (direction == "DOWN" && brotherY > y) {
+                        var distancia = y - brotherY;
+                        if (distancia < 0) {
+                            distancia = distancia * (-1);
+                        }
+                        if (dist == null || dist > distancia) {
+                            dist = distancia;
+                            target = brothers[i];
+                        }
+                    }
+                    else if (direction == "UP" && brotherY < y) {
+                        var distance = y - brotherY;
+                        if (distance < 0) {
+                            distance = distance * (-1);
+                        }
+                        if (dist == null || dist > distance) {
+                            dist = distance;
+                            target = brothers[i];
+                        }
+                    }
+                }
+            }
+            this._goToNode(designer, target);
+        }
+    },
+
+
+    _goToSideChild:function (designer, node, side) {
+        var children = node.getChildren();
+        if (children.length > 0) {
+            var target = children[0];
+            var top = null;
+            for (var i = 0; i < children.length; i++) {
+                var child = children[i];
+                var childY = child.getPosition().y;
+                if (side == 'LEFT' && child.getPosition().x < 0) {
+                    if (top == null || childY < top) {
+                        target = child;
+                        top = childY;
+                    }
+                }
+                if (side == 'RIGHT' && child.getPosition().x > 0) {
+                    if (top == null || childY < top) {
+                        target = child;
+                        top = childY;
+                    }
+                }
+            }
+
+            this._goToNode(designer, target);
+        }
+    },
+
+    _goToParent:function (designer, node) {
+        var parent = node.getParent();
+        if (parent) {
+            this._goToNode(designer, parent);
+        }
+    },
+
+    _goToChild:function (designer, node) {
+        var children = node.getChildren();
+        if (children.length > 0) {
+            var target = children[0];
+            var top = target.getPosition().y;
+            for (var i = 0; i < children.length; i++) {
+                var child = children[i];
+                if (child.getPosition().y < top) {
+                    top = child.getPosition().y;
+                    target = child;
+                }
+            }
+            this._goToNode(designer, target);
+        }
+    },
+
+    _goToNode:function (designer, node) {
+        // First deselect all the nodes ...
+        designer.deselectAll();
+
+        // Give focus to the selected node....
+        node.setOnFocus(true);
+    }
+
+});
+
+DesignerKeyboard.specialKeys = {
+    8: "backspace", 9: "tab", 10: "return", 13: "enter", 16: "shift", 17: "ctrl", 18: "alt", 19: "pause",
+    20: "capslock", 27: "esc", 32: "space", 33: "pageup", 34: "pagedown", 35: "end", 36: "home",
+    37: "left", 38: "up", 39: "right", 40: "down", 45: "insert", 46: "del",
+    96: "0", 97: "1", 98: "2", 99: "3", 100: "4", 101: "5", 102: "6", 103: "7",
+    104: "8", 105: "9", 106: "*", 107: "+", 109: "-", 110: ".", 111 : "/",
+    112: "f1", 113: "f2", 114: "f3", 115: "f4", 116: "f5", 117: "f6", 118: "f7", 119: "f8",
+    120: "f9", 121: "f10", 122: "f11", 123: "f12", 144: "numlock", 145: "scroll", 186: ";", 191: "/",
+    220: "\\", 222: "'", 224: "meta"
+};
+
+export default DesignerKeyboard;

packages/mindplot/lib/components/DesignerModel.js

@@ -0,0 +1,191 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Events = require('./Events').default;
+
+const DesignerModel = new Class(/** @lends DesignerModel */{
+    Implements:[Events],
+    /**
+     * @implements {mindplot.Events}
+     * @constructs
+     * @param {{readOnly: Boolean, zoom: Number, saveOnLoad: Boolean, size: {width: Number, 
+     * height: Number}, viewPort: {width: Number, height: Number}, container: String, 
+     * persistenceManager: String, mapId: String, locale: String}} options
+     * options loaded from json config 
+     * @see {@link ConfigParameters.md}
+     * @see {@link editor.html}
+     */
+    initialize:function (options) {
+        this._zoom = options.zoom;
+        this._topics = [];
+        this._relationships = [];
+    },
+
+    /** @return {Number} zoom between 0.3 (largest text) and 1.9 */
+    getZoom:function () {
+        return this._zoom;
+    },
+
+    /** @param {Number} zoom number between 0.3 and 1.9 to set the zoom to */
+    setZoom:function (zoom) {
+        this._zoom = zoom;
+    },
+
+    /** @return {@link mindplot.Topic[]} all topics */
+    getTopics:function () {
+        return this._topics;
+    },
+
+    /** @return {mindplot.Relationship[]} all relationships */
+    getRelationships:function () {
+        return this._relationships;
+    },
+
+    /** @return {mindplot.CentralTopic} the central topic */
+    getCentralTopic:function () {
+        var topics = this.getTopics();
+        return topics[0];
+    },
+
+    /** @return {mindplot.Topic[]} selected topics */
+    filterSelectedTopics:function () {
+        var result = [];
+        for (var i = 0; i < this._topics.length; i++) {
+            if (this._topics[i].isOnFocus()) {
+                result.push(this._topics[i]);
+            }
+        }
+        return result;
+    },
+
+    /**
+     * @return {mindplot.Relationship[]} selected relationships
+     */
+    filterSelectedRelationships:function () {
+        var result = [];
+        for (var i = 0; i < this._relationships.length; i++) {
+            if (this._relationships[i].isOnFocus()) {
+                result.push(this._relationships[i]);
+            }
+        }
+        return result;
+    },
+
+    /**
+     * @return {Array.<mindplot.Relationship, mindplot.Topic>} all topics and relationships
+     */
+    getEntities:function () {
+        var result = [].append(this._topics);
+        result.append(this._relationships);
+        return result;
+    },
+
+    /**
+     * removes occurrences of the given topic from the topic array
+     * @param {mindplot.Topic} topic the topic to remove
+     */
+    removeTopic:function (topic) {
+        $assert(topic, "topic can not be null");
+        this._topics.erase(topic);
+    },
+
+    /**
+     * removes occurrences of the given relationship from the relationship array
+     * @param {mindplot.Relationship} rel the relationship to remove
+     */
+    removeRelationship:function (rel) {
+        $assert(rel, "rel can not be null");
+        this._relationships.erase(rel);
+    },
+
+    /**
+     * adds the given topic to the topic array
+     * @param {mindplot.Topic} topic the topic to add
+     * @throws will throw an error if topic is null or undefined
+     * @throws will throw an error if the topic's id is not a number
+     */
+    addTopic:function (topic) {
+        $assert(topic, "topic can not be null");
+        $assert(typeof  topic.getId() == "number", "id is not a number:" + topic.getId());
+        this._topics.push(topic);
+    },
+
+    /**
+     * adds the given relationship to the relationship array
+     * @param {mindplot.Relationship} rel the relationship to add
+     * @throws will throw an error if rel is null or undefined
+     */
+    addRelationship:function (rel) {
+        $assert(rel, "rel can not be null");
+        this._relationships.push(rel);
+    },
+
+    /**
+     * @param {Function=} validate a function to validate nodes
+     * @param {String=} errorMsg an error message to display if the validation fails
+     * @return {String} returns an array of the selected (and, if applicable, valid) topics' ids
+     */
+    filterTopicsIds:function (validate, errorMsg) {
+        var result = [];
+        var topics = this.filterSelectedTopics();
+
+
+        var isValid = true;
+        for (var i = 0; i < topics.length; i++) {
+            var selectedNode = topics[i];
+            if ($defined(validate)) {
+                isValid = validate(selectedNode);
+            }
+
+            // Add node only if it's valid.
+            if (isValid) {
+                result.push(selectedNode.getId());
+            } else {
+                $notify(errorMsg);
+            }
+        }
+        return result;
+    },
+
+    /**
+     * @return {mindplot.Topic} the first selected topic if one or more are found by the 
+     * filterSelectedTopics function, null otherwise
+     */
+    selectedTopic:function () {
+        var topics = this.filterSelectedTopics();
+        return (topics.length > 0) ? topics[0] : null;
+    },
+
+    /**
+     * @param {String} id the id of the topic to be retrieved
+     * @return {mindplot.Topic} the topic with the respective id
+     */
+    findTopicById:function (id) {
+        var result = null;
+        for (var i = 0; i < this._topics.length; i++) {
+            var topic = this._topics[i];
+            if (topic.getId() == id) {
+                result = topic;
+                break;
+            }
+        }
+        return result;
+
+    }
+});
+
+export default DesignerModel;

packages/mindplot/lib/components/DesignerUndoManager.js

@@ -0,0 +1,85 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const DesignerUndoManager = new Class({
+    initialize: function(fireChange) {
+        this._undoQueue = [];
+        this._redoQueue = [];
+        this._baseId = 0;
+    },
+
+    enqueue:function(command) {
+        $assert(command, "Command can  not be null");
+        var length = this._undoQueue.length;
+        if (command.discardDuplicated && length > 0) {
+            // Skip duplicated events ...
+            var lastItem = this._undoQueue[length - 1];
+            if (lastItem.discardDuplicated != command.discardDuplicated) {
+                this._undoQueue.push(command);
+            }
+        } else {
+            this._undoQueue.push(command);
+        }
+        this._redoQueue = [];
+    },
+
+    execUndo: function(commandContext) {
+        if (this._undoQueue.length > 0) {
+            var command = this._undoQueue.pop();
+            this._redoQueue.push(command);
+
+            command.undoExecute(commandContext);
+        }
+    },
+
+    execRedo: function(commandContext) {
+        if (this._redoQueue.length > 0) {
+            var command = this._redoQueue.pop();
+            this._undoQueue.push(command);
+            command.execute(commandContext);
+        }
+    },
+
+    buildEvent: function() {
+        return {undoSteps: this._undoQueue.length, redoSteps:this._redoQueue.length};
+    },
+
+    markAsChangeBase: function() {
+        var undoLength = this._undoQueue.length;
+        if (undoLength > 0) {
+            var command = this._undoQueue[undoLength - 1];
+            this._baseId = command.getId();
+        } else {
+            this._baseId = 0;
+        }
+    },
+
+    hasBeenChanged: function() {
+        var result = true;
+        var undoLength= this._undoQueue.length;
+        if (undoLength == 0 && this._baseId == 0) {
+            result = false;
+        } else if (undoLength > 0) {
+            var command = this._undoQueue[undoLength - 1];
+            result = (this._baseId != command.getId());
+        }
+        return result;
+    }
+});
+
+export default DesignerUndoManager;

packages/mindplot/lib/components/DragConnector.js

@@ -0,0 +1,115 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const DragConnector = new Class({
+    initialize:function (designerModel, workspace) {
+        $assert(designerModel, 'designerModel can not be null');
+        $assert(workspace, 'workspace can not be null');
+
+        // this._layoutManager = layoutManager;
+        this._designerModel = designerModel;
+        this._workspace = workspace;
+    },
+
+    checkConnection:function (dragTopic) {
+        var topics = this._designerModel.getTopics();
+
+        // Must be disconnected from their current connection ?.
+        var candidates = this._searchConnectionCandidates(dragTopic);
+        var currentConnection = dragTopic.getConnectedToTopic();
+
+
+        if (currentConnection && (candidates.length == 0 || candidates[0] != currentConnection)) {
+            dragTopic.disconnect(this._workspace);
+        }
+
+        // Finally, connect nodes ...
+        if (!dragTopic.isConnected() && candidates.length > 0) {
+            dragTopic.connectTo(candidates[0]);
+        }
+    },
+
+    _searchConnectionCandidates:function (dragTopic) {
+        var topics = this._designerModel.getTopics();
+        var draggedNode = dragTopic.getDraggedTopic();
+
+        // Drag node connects to the border ...
+        var dragTopicWidth = dragTopic.getSize ? dragTopic.getSize().width : 0; // Hack...
+        var xMouseGap = dragTopic.getPosition().x > 0 ? 0 : dragTopicWidth;
+        var sPos = {x:dragTopic.getPosition().x - xMouseGap, y:dragTopic.getPosition().y};
+
+        // Perform a initial filter to discard topics:
+        //  - Exclude dragged topic
+        //  - Exclude dragTopic pivot
+        //  - Nodes that are collapsed
+        //  - It's not part of the branch dragged itself
+        topics = topics.filter(function (topic) {
+            var result = draggedNode != topic;
+            result = result && topic != draggedNode;
+            result = result && !topic.areChildrenShrunken() && !topic.isCollapsed();
+            result = result && !draggedNode.isChildTopic(topic);
+            return result;
+        });
+
+        // Filter all the nodes that are outside the vertical boundary:
+        //  * The node is to out of the x scope
+        //  * The x distance greater the vertical tolerated distance
+        topics = topics.filter(function (topic) {
+            var tpos = topic.getPosition();
+            // Center topic has different alignment than the rest of the nodes. That's why i need to divide it by two...
+            var txborder = tpos.x + (topic.getSize().width / 2) * Math.sign(sPos.x);
+            var distance = (sPos.x - txborder) * Math.sign(sPos.x);
+            return  distance > 0 && (distance < DragConnector.MAX_VERTICAL_CONNECTION_TOLERANCE);
+
+        });
+
+        // Assign a priority based on the distance:
+        // - Alignment with the targetNode
+        // - Vertical distance
+        // - Horizontal proximity
+        // - It's already connected.
+        var currentConnection = dragTopic.getConnectedToTopic();
+        var me = this;
+        topics = topics.sort(function (a, b) {
+            var aPos = a.getPosition();
+            var bPos = b.getPosition();
+
+            var av = me._isVerticallyAligned(a.getSize(), aPos, sPos);
+            var bv = me._isVerticallyAligned(b.getSize(), bPos, sPos);
+            return  me._proximityWeight(av, a, sPos, currentConnection) - me._proximityWeight(bv, b, sPos, currentConnection);
+
+        });
+        return topics;
+    },
+
+    _proximityWeight:function (isAligned, target, sPos, currentConnection) {
+        var tPos = target.getPosition();
+        return  (isAligned ? 0 : 200    ) + Math.abs(tPos.x - sPos.x) + Math.abs(tPos.y - sPos.y) + (currentConnection == target ? 0 : 100);
+    },
+
+    _isVerticallyAligned:function (targetSize, targetPosition, sourcePosition) {
+
+        return Math.abs(sourcePosition.y - targetPosition.y) < targetSize.height / 2;
+
+    }
+
+});
+
+DragConnector.MAX_VERTICAL_CONNECTION_TOLERANCE = 80;
+
+export default DragConnector

packages/mindplot/lib/components/DragManager.js

@@ -0,0 +1,151 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const DragTopic = require('./DragTopic').default;
+
+const DragManager = new Class({
+    initialize:function(workspace, eventDispatcher) {
+        this._workspace = workspace;
+        this._designerModel = workspace;
+        this._listeners = {};
+        this._isDragInProcess = false;
+        this._eventDispatcher = eventDispatcher;
+        DragTopic.init(this._workspace);
+    },
+
+    add : function(node) {
+        // Add behaviour ...
+        var workspace = this._workspace;
+        var screen = workspace.getScreenManager();
+        var dragManager = this;
+        var me = this;
+        var mouseDownListener = function(event) {
+            if (workspace.isWorkspaceEventsEnabled()) {
+                // Disable double drag...
+                workspace.enableWorkspaceEvents(false);
+
+                // Set initial position.
+                var layoutManager = me._eventDispatcher.getLayoutManager();
+                var dragNode = node.createDragNode(layoutManager);
+
+                // Register mouse move listener ...
+                var mouseMoveListener = dragManager._buildMouseMoveListener(workspace, dragNode, dragManager);
+                screen.addEvent('mousemove', mouseMoveListener);
+
+                // Register mouse up listeners ...
+                var mouseUpListener = dragManager._buildMouseUpListener(workspace, node, dragNode, dragManager);
+                screen.addEvent('mouseup', mouseUpListener);
+
+                // Change cursor.
+                window.document.body.style.cursor = 'move';
+            }
+        };
+        node.addEvent('mousedown', mouseDownListener);
+    },
+
+    remove : function(node) {
+        var nodes = this._topics;
+        var contained = false;
+        var index = -1;
+        for (var i = 0; i < nodes.length; i++) {
+            if (nodes[i] == node) {
+                contained = true;
+                index = i;
+            }
+        }
+    },
+
+    _buildMouseMoveListener : function(workspace, dragNode, dragManager) {
+        var screen = workspace.getScreenManager();
+        var me = this;
+        var result = function(event) {
+
+            if (!me._isDragInProcess) {
+                // Execute Listeners ..
+                var startDragListener = dragManager._listeners['startdragging'];
+                startDragListener(event, dragNode);
+
+                // Add shadow node to the workspace.
+                workspace.append(dragNode);
+
+                me._isDragInProcess = true;
+            }
+
+            var pos = screen.getWorkspaceMousePosition(event);
+            dragNode.setPosition(pos.x, pos.y);
+
+            // Call mouse move listeners ...
+            var dragListener = dragManager._listeners['dragging'];
+            if ($defined(dragListener)) {
+                dragListener(event, dragNode);
+            }
+
+            event.preventDefault();
+
+        };
+        dragManager._mouseMoveListener = result;
+        return result;
+    },
+
+    _buildMouseUpListener : function(workspace, node, dragNode, dragManager) {
+        var screen = workspace.getScreenManager();
+        var me = this;
+        var result = function(event) {
+            $assert(dragNode.isDragTopic, 'dragNode must be an DragTopic');
+
+            // Remove all the events.
+            screen.removeEvent('mousemove', dragManager._mouseMoveListener);
+            screen.removeEvent('mouseup', dragManager._mouseUpListener);
+
+            // Help GC
+            dragManager._mouseMoveListener = null;
+            dragManager._mouseUpListener = null;
+
+            workspace.enableWorkspaceEvents(true);
+            // Change the cursor to the default.
+            window.document.body.style.cursor = 'default';
+
+            if (me._isDragInProcess) {
+
+                // Execute Listeners only if the node has been moved.
+                var endDragListener = dragManager._listeners['enddragging'];
+                endDragListener(event, dragNode);
+
+                // Remove drag node from the workspace.
+                dragNode.removeFromWorkspace(workspace);
+
+                me._isDragInProcess = false;
+            }
+
+
+        };
+        dragManager._mouseUpListener = result;
+        return result;
+    },
+
+    /**
+     * type:
+     *  - startdragging.
+     *  - dragging
+     *  - enddragging
+     */
+    addEvent : function(type, listener) {
+        this._listeners[type] = listener;
+    }
+});
+
+export default DragManager;

packages/mindplot/lib/components/DragPivot.js

@@ -0,0 +1,238 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js')
+const core = Core();
+const web2D = require('@wismapping/web2d')
+const web2d = web2D();
+
+const DragTopic = require('./DragTopic').default;
+const Shape = require('./util/Shape').default;
+const INodeModel = require('./model/INodeModel').default;
+
+const DragPivot = new Class({
+    initialize:function() {
+        this._position = new core.Point();
+        this._size = DragTopic.PIVOT_SIZE;
+
+        this._straightLine = this._buildStraightLine();
+        this._curvedLine = this._buildCurvedLine();
+        this._dragPivot = this._buildRect();
+        this._connectRect = this._buildRect();
+        this._targetTopic = null;
+        this._isVisible = false;
+    },
+
+    isVisible:function() {
+        return this._isVisible;
+    },
+
+    getTargetTopic : function() {
+        return this._targetTopic;
+    },
+
+    _buildStraightLine : function() {
+        var line = new web2d.CurvedLine();
+        line.setStyle(web2d.CurvedLine.SIMPLE_LINE);
+        line.setStroke(1, 'solid', '#CC0033');
+        line.setOpacity(0.4);
+        line.setVisibility(false);
+        return line;
+    },
+
+    _buildCurvedLine : function() {
+        var line = new web2d.CurvedLine();
+        line.setStyle(web2d.CurvedLine.SIMPLE_LINE);
+        line.setStroke(1, 'solid', '#CC0033');
+        line.setOpacity(0.4);
+        line.setVisibility(false);
+        return line;
+    },
+
+
+    _redrawLine : function() {
+        // Update line position.
+        $assert(this.getTargetTopic(), 'Illegal invocation. Target node can not be null');
+
+        var pivotRect = this._getPivotRect();
+
+        // Pivot position has not changed. In this case, position change is not required.
+        var targetTopic = this.getTargetTopic();
+        var position = this._position;
+
+        // Calculate pivot connection point ...
+        var size = this._size;
+        var targetPosition = targetTopic.getPosition();
+        var line = this._getConnectionLine();
+
+        // Update Line position.
+        var isAtRight = Shape.isAtRight(targetPosition, position);
+        var pivotPoint = Shape.calculateRectConnectionPoint(position, size, isAtRight);
+        line.setFrom(pivotPoint.x, pivotPoint.y);
+
+        // Update rect position
+        var cx = position.x - (parseInt(size.width) / 2);
+        var cy = position.y - (parseInt(size.height) / 2);
+        pivotRect.setPosition(cx, cy);
+
+        // Make line visible only when the position has been already changed.
+        // This solve several strange effects ;)
+        var targetPoint = targetTopic.workoutIncomingConnectionPoint(pivotPoint);
+        line.setTo(targetPoint.x, targetPoint.y);
+    },
+
+    setPosition : function(point) {
+        this._position = point;
+        this._redrawLine();
+    },
+
+    getPosition : function() {
+        return this._position;
+    },
+
+    _buildRect : function() {
+        var size = this._size;
+        var rectAttributes = {fillColor:'#CC0033',opacity:0.4,width:size.width,height:size.height,strokeColor:'#FF9933'};
+        var rect = new web2d.Rect(0, rectAttributes);
+        rect.setVisibility(false);
+        return rect;
+    },
+
+    _getPivotRect : function() {
+        return this._dragPivot;
+    },
+
+    getSize : function() {
+        var elem2d = this._getPivotRect();
+        return elem2d.getSize();
+    },
+
+    setVisibility : function(value) {
+        if (this.isVisible() != value) {
+
+            var pivotRect = this._getPivotRect();
+            pivotRect.setVisibility(value);
+
+            var connectRect = this._connectRect;
+            connectRect.setVisibility(value);
+
+            var line = this._getConnectionLine();
+            if (line) {
+                line.setVisibility(value);
+            }
+            this._isVisible = value;
+        }
+    },
+
+    // If the node is connected, validate that there is a line connecting both...
+    _getConnectionLine : function() {
+        var result = null;
+        var parentTopic = this._targetTopic;
+        if (parentTopic) {
+            if (parentTopic.getType() == INodeModel.CENTRAL_TOPIC_TYPE) {
+                result = this._straightLine;
+            } else {
+                result = this._curvedLine;
+            }
+        }
+        return result;
+    },
+
+    addToWorkspace : function(workspace) {
+        var pivotRect = this._getPivotRect();
+        workspace.append(pivotRect);
+
+        var connectToRect = this._connectRect;
+        workspace.append(connectToRect);
+
+        // Add a hidden straight line ...
+        var straighLine = this._straightLine;
+        straighLine.setVisibility(false);
+        workspace.append(straighLine);
+        straighLine.moveToBack();
+
+        // Add a hidden curved line ...
+        var curvedLine = this._curvedLine;
+        curvedLine.setVisibility(false);
+        workspace.append(curvedLine);
+        curvedLine.moveToBack();
+
+        // Add a connect rect ...
+        var connectRect = this._connectRect;
+        connectRect.setVisibility(false);
+        workspace.append(connectRect);
+        connectRect.moveToBack();
+    },
+
+    removeFromWorkspace : function(workspace) {
+        var shape = this._getPivotRect();
+        workspace.removeChild(shape);
+
+        var connectToRect = this._connectRect;
+        workspace.removeChild(connectToRect);
+
+        if ($defined(this._straightLine)) {
+            workspace.removeChild(this._straightLine);
+        }
+
+        if ($defined(this._curvedLine)) {
+            workspace.removeChild(this._curvedLine);
+        }
+    },
+
+    connectTo : function(targetTopic, position) {
+        $assert(!this._outgoingLine, 'Could not connect an already connected node');
+        $assert(targetTopic != this, 'Circular connection are not allowed');
+        $assert(position, 'position can not be null');
+        $assert(targetTopic, 'parent can not be null');
+
+        this._position = position;
+        this._targetTopic = targetTopic;
+
+        // Connected to Rect ...
+        var connectRect = this._connectRect;
+        var targetSize = targetTopic.getSize();
+
+        // Add 4 pixel in order to keep create a rect bigger than the topic.
+        var width = targetSize.width + 4;
+        var height = targetSize.height + 4;
+
+        connectRect.setSize(width, height);
+
+        var targetPosition = targetTopic.getPosition();
+        var cx = Math.ceil(targetPosition.x - (width / 2));
+        var cy = Math.ceil(targetPosition.y - (height / 2));
+        connectRect.setPosition(cx, cy);
+
+        // Change elements position ...
+        var pivotRect = this._getPivotRect();
+        pivotRect.moveToFront();
+        pivotRect.setPosition(position.x, position.y);
+
+        this._redrawLine();
+    },
+
+    disconnect : function(workspace) {
+        $assert(workspace, 'workspace can not be null.');
+        $assert(this._targetTopic, 'There are not connected topic.');
+
+        this.setVisibility(false);
+        this._targetTopic = null;
+    }
+});
+
+export default DragPivot;

packages/mindplot/lib/components/DragTopic.js

@@ -0,0 +1,221 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js')
+const core = Core();
+
+const ActionDispatcher = require('./ActionDispatcher').default
+const DragPivot = require('./DragPivot').default;
+
+const DragTopic = new Class({
+    initialize:function (dragShape, draggedNode, layoutManger) {
+        $assert(dragShape, 'Rect can not be null.');
+        $assert(draggedNode, 'draggedNode can not be null.');
+        $assert(layoutManger, 'layoutManger can not be null.');
+
+        this._elem2d = dragShape;
+        this._order = null;
+        this._draggedNode = draggedNode;
+        this._layoutManager = layoutManger;
+        this._position = new core.Point();
+        this._isInWorkspace = false;
+        this._isFreeLayoutEnabled = false;
+    },
+
+    setOrder:function (order) {
+        this._order = order;
+    },
+
+    setPosition:function (x, y) {
+        // Update drag shadow position ....
+        var position = {x:x, y:y};
+        if (this.isFreeLayoutOn() && this.isConnected()) {
+            var _layoutManager = this._layoutManager;
+            var par = this.getConnectedToTopic();
+            position = _layoutManager.predict(par.getId(), this._draggedNode.getId(), position, true).position;
+        }
+        this._position.setValue(position.x, position.y);
+
+        // Elements are positioned in the center.
+        // All topic element must be positioned based on the innerShape.
+        var draggedNode = this._draggedNode;
+        var size = draggedNode.getSize();
+        var cx = position.x - (position.x > 0 ? 0 : size.width);
+        var cy = Math.ceil(position.y - (size.height / 2));
+        this._elem2d.setPosition(cx, cy);
+
+        // In case is not free, pivot must be draw ...
+        if (this.isConnected() && !this.isFreeLayoutOn()) {
+            var parent = this.getConnectedToTopic();
+            var predict = this._layoutManager.predict(parent.getId(), this._draggedNode.getId(), this.getPosition());
+            if (this._order != predict.order) {
+                var dragPivot = this._getDragPivot();
+                var pivotPosition = predict.position;
+                dragPivot.connectTo(parent, pivotPosition);
+                this.setOrder(predict.order);
+            }
+        }
+    },
+
+    updateFreeLayout:function (event) {
+        var isFreeEnabled = (event.metaKey && Browser.Platform.mac) || (event.ctrlKey && !Browser.Platform.mac);
+        if (this.isFreeLayoutOn() != isFreeEnabled) {
+            var dragPivot = this._getDragPivot();
+            dragPivot.setVisibility(!isFreeEnabled);
+            this._isFreeLayoutEnabled = isFreeEnabled;
+        }
+    },
+
+    setVisibility:function (value) {
+        var dragPivot = this._getDragPivot();
+        dragPivot.setVisibility(value);
+    },
+
+    isVisible:function () {
+        var dragPivot = this._getDragPivot();
+        return dragPivot.isVisible();
+    },
+
+    getInnerShape:function () {
+        return this._elem2d;
+    },
+
+    disconnect:function (workspace) {
+        // Clear connection line ...
+        var dragPivot = this._getDragPivot();
+        dragPivot.disconnect(workspace);
+    },
+
+    connectTo:function (parent) {
+        $assert(parent, 'Parent connection node can not be null.');
+
+        // Where it should be connected ?
+        var predict = designer._eventBussDispatcher._layoutManager.predict(parent.getId(), this._draggedNode.getId(), this.getPosition());
+
+        // Connect pivot ...
+        var dragPivot = this._getDragPivot();
+        var position = predict.position;
+        dragPivot.connectTo(parent, position);
+        dragPivot.setVisibility(true);
+
+        this.setOrder(predict.order);
+    },
+
+    getDraggedTopic:function () {
+        return  this._draggedNode;
+    },
+
+    removeFromWorkspace:function (workspace) {
+        if (this._isInWorkspace) {
+            // Remove drag shadow.
+            workspace.removeChild(this._elem2d);
+
+            // Remove pivot shape. To improve performance it will not be removed. Only the visibility will be changed.
+            var dragPivot = this._getDragPivot();
+            dragPivot.setVisibility(false);
+
+            this._isInWorkspace = false;
+        }
+    },
+
+    isInWorkspace:function () {
+        return this._isInWorkspace;
+    },
+
+    addToWorkspace:function (workspace) {
+        if (!this._isInWorkspace) {
+            workspace.append(this._elem2d);
+            var dragPivot = this._getDragPivot();
+            dragPivot.addToWorkspace(workspace);
+            this._isInWorkspace = true;
+        }
+    },
+
+    _getDragPivot:function () {
+        return DragTopic.__getDragPivot();
+    },
+
+    getPosition:function () {
+        return this._position;
+    },
+
+    isDragTopic:function () {
+        return true;
+    },
+
+    applyChanges:function (workspace) {
+        $assert(workspace, 'workspace can not be null');
+
+
+        var actionDispatcher = ActionDispatcher.getInstance();
+        var draggedTopic = this.getDraggedTopic();
+        var topicId = draggedTopic.getId();
+        var position = this.getPosition();
+
+        if (!this.isFreeLayoutOn()) {
+            var order = null;
+            var parent = null;
+            var isDragConnected = this.isConnected();
+            if (isDragConnected) {
+                var targetTopic = this.getConnectedToTopic();
+                order = this._order;
+                parent = targetTopic;
+            }
+
+            // If the node is not connected, position based on the original drag topic position.
+            actionDispatcher.dragTopic(topicId, position, order, parent);
+        } else {
+            actionDispatcher.moveTopic(topicId, position);
+        }
+    },
+
+    getConnectedToTopic:function () {
+        var dragPivot = this._getDragPivot();
+        return dragPivot.getTargetTopic();
+    },
+
+    isConnected:function () {
+        return this.getConnectedToTopic() != null;
+    },
+
+    isFreeLayoutOn:function () {
+//        return  this._isFreeLayoutEnabled;
+        // Disable free layout ...
+        return false;
+    }
+
+});
+
+DragTopic.PIVOT_SIZE = {width:50, height:6};
+
+DragTopic.init = function (workspace) {
+
+    $assert(workspace, "workspace can not be null");
+    var pivot = DragTopic.__getDragPivot();
+    workspace.append(pivot);
+};
+
+DragTopic.__getDragPivot = function () {
+    var result = DragTopic._dragPivot;
+    if (!$defined(result)) {
+        result = new DragPivot();
+        DragTopic._dragPivot = result;
+    }
+    return result;
+};
+
+export default DragTopic;

packages/mindplot/lib/components/EditorOptions.js

@@ -0,0 +1,27 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const EditorOptions =
+{
+    LayoutManager:"OriginalLayout",
+//    LayoutManager:"FreeMindLayout",
+    textEditor:"TextEditor"
+//    textEditor:"RichTextEditor"
+};
+
+export default EditorOptions;

packages/mindplot/lib/components/EditorProperties.js

@@ -0,0 +1,38 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const EditorProperties = new Class({
+    initialize: function () {
+        this._zoom = 0;
+        this._position = 0;
+    },
+
+    setZoom: function (zoom) {
+        this._zoom = zoom;
+    },
+
+    getZoom: function () {
+        return this._zoom;
+    },
+
+    asProperties: function () {
+        return "zoom=" + this._zoom + "\n";
+    }
+});
+
+export default EditorProperties;

packages/mindplot/lib/components/Events.js

@@ -0,0 +1,43 @@
+const Events = new Class({
+
+    $events: {},
+
+    _removeOn: function (string) {
+        return string.replace(/^on([A-Z])/, function (full, first) {
+            return first.toLowerCase();
+        });
+    },
+
+    addEvent: function (type, fn, internal) {
+        type = this._removeOn(type);
+
+        this.$events[type] = (this.$events[type] || []).include(fn);
+        if (internal) fn.internal = true;
+        return this;
+    },
+
+    fireEvent: function (type, args, delay) {
+        type = this._removeOn(type);
+        var events = this.$events[type];
+        if (!events) return this;
+        args = Array.from(args);
+        _.each(events, function (fn) {
+            if (delay) fn.delay(delay, this, args);
+            else fn.apply(this, args);
+        }, this);
+        return this;
+    },
+
+    removeEvent: function (type, fn) {
+        type = this._removeOn(type);
+        var events = this.$events[type];
+        if (events && !fn.internal) {
+            var index = events.indexOf(fn);
+            if (index != -1) events.splice(index, 1);
+        }
+        return this;
+    }
+
+});
+
+export default Events;

packages/mindplot/lib/components/Icon.js

@@ -0,0 +1,60 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const web2D = require('@wismapping/web2d')
+const web2d = web2D()
+
+const Icon = new Class({
+    initialize: function (url) {
+        $assert(url, 'topic can not be null');
+        this._image = new web2d.Image();
+        this._image.setHref(url);
+        this._image.setSize(Icon.SIZE, Icon.SIZE);
+    },
+
+    getImage: function () {
+        return this._image;
+    },
+
+    setGroup: function (group) {
+        this._group = group;
+    },
+
+    getGroup: function () {
+        return this._group;
+    },
+
+    getSize: function () {
+        return this._image.getSize();
+    },
+
+    getPosition: function () {
+        return this._image.getPosition();
+    },
+
+    addEvent: function (type, fnc) {
+        this._image.addEvent(type, fnc);
+    },
+
+    remove: function () {
+        throw "Unsupported operation";
+    }
+});
+
+Icon.SIZE = 90;
+
+export default Icon;

packages/mindplot/lib/components/IconGroup.js

@@ -0,0 +1,345 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const web2D = require('@wismapping/web2d')
+const web2d = web2D();
+const Icon = require('./Icon');
+
+const IconGroup = new Class(/**@lends IconGroup */{
+    /**
+     * @constructs
+     * @param topicId
+     * @param iconSize
+     * @throws will throw an error if topicId is null or undefined
+     * @throws will throw an error if iconSize is null or undefined
+     */
+    initialize: function (topicId, iconSize) {
+        $assert($defined(topicId), "topicId can not be null");
+        $assert($defined(iconSize), "iconSize can not be null");
+
+        this._icons = [];
+        this._group = new web2d.Group({
+            width: 0,
+            height: iconSize,
+            x: 0,
+            y: 0,
+            coordSizeWidth: 0,
+            coordSizeHeight: 100
+        });
+        this._removeTip = new IconGroup.RemoveTip(this._group, topicId);
+        this.seIconSize(iconSize, iconSize);
+
+        this._registerListeners();
+
+    },
+
+    /** */
+    setPosition: function (x, y) {
+        this._group.setPosition(x, y);
+    },
+
+    /** */
+    getPosition: function () {
+        return this._group.getPosition();
+    },
+
+    /** */
+    getNativeElement: function () {
+        return this._group;
+    },
+
+    /** */
+    getSize: function () {
+        return this._group.getSize();
+    },
+
+    /** */
+    seIconSize: function (width, height) {
+        this._iconSize = {width: width, height: height};
+        this._resize(this._icons.length);
+    },
+
+    /**
+     * @param icon the icon to be added to the icon group
+     * @param {Boolean} remove
+     * @throws will throw an error if icon is not defined
+     */
+    addIcon: function (icon, remove) {
+        $defined(icon, "icon is not defined");
+
+        icon.setGroup(this);
+        this._icons.push(icon);
+
+        // Adjust group and position ...
+        this._resize(this._icons.length);
+        this._positionIcon(icon, this._icons.length - 1);
+
+        var imageShape = icon.getImage();
+        this._group.append(imageShape);
+
+        // Register event for the group ..
+        if (remove) {
+            this._removeTip.decorate(this._topicId, icon);
+        }
+    },
+
+    _findIconFromModel: function (iconModel) {
+        var result = null;
+        _.each(this._icons, function (icon) {
+            var elModel = icon.getModel();
+            if (elModel.getId() == iconModel.getId()) {
+                result = icon;
+            }
+        }, this);
+
+        if (result == null) {
+            throw new Error("Icon can no be found:" + iconModel.getId() + ", Icons:" + this._icons);
+        }
+
+        return result;
+    },
+
+    /** */
+    removeIconByModel: function (featureModel) {
+        $assert(featureModel, "featureModel can not be null");
+
+        var icon = this._findIconFromModel(featureModel);
+        this._removeIcon(icon);
+    },
+
+    _removeIcon: function (icon) {
+        $assert(icon, "icon can not be null");
+
+        this._removeTip.close(0);
+        this._group.removeChild(icon.getImage());
+
+        this._icons.erase(icon);
+        this._resize(this._icons.length);
+        var me = this;
+        // Add all again ...
+        _.each(this._icons, function (elem, i) {
+            me._positionIcon(elem, i);
+        });
+    },
+
+    /** */
+    moveToFront: function () {
+        this._group.moveToFront();
+    },
+
+    _registerListeners: function () {
+        this._group.addEvent('click', function (event) {
+            // Avoid node creation ...
+            event.stopPropagation();
+
+        });
+
+        this._group.addEvent('dblclick', function (event) {
+            event.stopPropagation();
+
+        });
+    },
+
+    _resize: function (iconsLength) {
+        this._group.setSize(iconsLength * this._iconSize.width, this._iconSize.height);
+
+        var iconSize = Icon.SIZE + (IconGroup.ICON_PADDING * 2);
+        this._group.setCoordSize(iconsLength * iconSize, iconSize);
+    },
+
+    _positionIcon: function (icon, order) {
+
+        var iconSize = Icon.SIZE + (IconGroup.ICON_PADDING * 2);
+        icon.getImage().setPosition(iconSize * order + IconGroup.ICON_PADDING, IconGroup.ICON_PADDING);
+    }
+});
+
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+IconGroup.ICON_PADDING = 5;
+
+IconGroup.RemoveTip = new Class(/** @lends IconGroup.RemoveTip */{
+    /**
+     * @classdesc inner class of IconGroup
+     * @constructs
+     * @param container
+     */
+    initialize: function (container) {
+        $assert(container, "group can not be null");
+        this._fadeElem = container;
+    },
+
+
+    /**
+     * @param topicId
+     * @param icon
+     * @throws will throw an error if icon is null or undefined
+     */
+    show: function (topicId, icon) {
+        $assert(icon, 'icon can not be null');
+
+        // Nothing to do ...
+        if (this._activeIcon != icon) {
+            // If there is an active icon, close it first ...
+            if (this._activeIcon) {
+                this.close(0);
+            }
+
+            // Now, let move the position the icon...
+            var pos = icon.getPosition();
+
+            // Register events ...
+            var widget = this._buildWeb2d();
+            widget.addEvent('click', function () {
+                icon.remove();
+            });
+
+            var me = this;
+
+            widget.addEvent('mouseover', function () {
+                me.show(topicId, icon);
+            });
+
+            widget.addEvent('mouseout', function () {
+                me.hide();
+            });
+
+            widget.setPosition(pos.x + 80, pos.y - 50);
+            this._fadeElem.append(widget);
+
+            // Setup current element ...
+            this._activeIcon = icon;
+            this._widget = widget;
+
+        } else {
+            clearTimeout(this._closeTimeoutId);
+        }
+    },
+
+    /** */
+    hide: function () {
+        this.close(200);
+    },
+
+    /**
+     * @param delay
+     */
+    close: function (delay) {
+
+        // This is not ok, trying to close the same dialog twice ?
+        if (this._closeTimeoutId) {
+            clearTimeout(this._closeTimeoutId)
+        }
+
+        var me = this;
+        if (this._activeIcon) {
+            var widget = this._widget;
+            var close = function () {
+                me._activeIcon = null;
+                me._fadeElem.removeChild(widget);
+                me._widget = null;
+                me._closeTimeoutId = null;
+            };
+
+            if (!$defined(delay) || delay == 0) {
+                close();
+            }
+            else {
+                this._closeTimeoutId = close.delay(delay);
+            }
+        }
+    },
+
+    _buildWeb2d: function () {
+        var result = new web2d.Group({
+            width: 10,
+            height: 10,
+            x: 0,
+            y: 0,
+            coordSizeWidth: 10,
+            coordSizeHeight: 10
+        });
+
+        var outerRect = new web2d.Rect(0, {
+            x: 0,
+            y: 0,
+            width: 10,
+            height: 10,
+            stroke: '0',
+            fillColor: 'black'
+        });
+        result.append(outerRect);
+        outerRect.setCursor('pointer');
+
+        var innerRect = new web2d.Rect(0, {
+            x: 1,
+            y: 1,
+            width: 8,
+            height: 8,
+            stroke: '1 solid white',
+            fillColor: 'gray'
+        });
+        result.append(innerRect);
+
+        var line = new web2d.Line({stroke: '1 solid white'});
+        line.setFrom(1, 1);
+        line.setTo(9, 9);
+        result.append(line);
+
+        var line2 = new web2d.Line({stroke: '1 solid white'});
+        line2.setFrom(1, 9);
+        line2.setTo(9, 1);
+        result.append(line2);
+
+        // Some events ...
+        result.addEvent('mouseover', function () {
+            innerRect.setFill('#CC0033');
+        });
+        result.addEvent('mouseout', function () {
+            innerRect.setFill('gray');
+        });
+
+        result.setSize(50, 50);
+        return result;
+    },
+
+    /**
+     * @param topicId
+     * @param icon
+     */
+    decorate: function (topicId, icon) {
+
+        var me = this;
+
+        if (!icon.__remove) {
+            icon.addEvent('mouseover', function () {
+                me.show(topicId, icon);
+            });
+
+            icon.addEvent('mouseout', function () {
+                me.hide();
+            });
+            icon.__remove = true;
+        }
+    }
+
+});
+
+export default IconGroup;

packages/mindplot/lib/components/ImageIcon.js

@@ -0,0 +1,166 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Icon = require('./Icon').default;
+const ActionDispatcher = require('./ActionDispatcher').default;
+
+const ImageIcon = new Class({
+    Extends: Icon,
+    initialize: function (topic, iconModel, readOnly) {
+        $assert(iconModel, 'iconModel can not be null');
+        $assert(topic, 'topic can not be null');
+
+        this._topicId = topic.getId();
+        this._featureModel = iconModel;
+
+        // Build graph image representation ...
+        var iconType = iconModel.getIconType();
+        var imgUrl = this._getImageUrl(iconType);
+        this.parent(imgUrl);
+
+        if (!readOnly) {
+
+            //Icon
+            var image = this.getImage();
+            var me = this;
+            image.addEvent('click', function () {
+
+                var iconType = iconModel.getIconType();
+                var newIconType = me._getNextFamilyIconId(iconType);
+                iconModel.setIconType(newIconType);
+
+                var imgUrl = me._getImageUrl(newIconType);
+                me._image.setHref(imgUrl);
+
+            });
+            this._image.setCursor('pointer');
+        }
+    },
+
+    _getImageUrl: function (iconId) {
+        return "icons/" + iconId + ".png";
+    },
+
+    getModel: function () {
+        return this._featureModel;
+    },
+
+    _getNextFamilyIconId: function (iconId) {
+
+        var familyIcons = this._getFamilyIcons(iconId);
+        $assert(familyIcons != null, "Family Icon not found!");
+
+        var result = null;
+        for (var i = 0; i < familyIcons.length && result == null; i++) {
+            if (familyIcons[i] == iconId) {
+                //Is last one?
+                if (i == (familyIcons.length - 1)) {
+                    result = familyIcons[0];
+                } else {
+                    result = familyIcons[i + 1];
+                }
+                break;
+            }
+        }
+
+        return result;
+    },
+
+    _getFamilyIcons: function (iconId) {
+        $assert(iconId != null, "id must not be null");
+        $assert(iconId.indexOf("_") != -1, "Invalid icon id (it must contain '_')");
+
+        var result = null;
+        for (var i = 0; i < ImageIcon.prototype.ICON_FAMILIES.length; i++) {
+            var family = ImageIcon.prototype.ICON_FAMILIES[i];
+            var iconFamilyId = iconId.substr(0, iconId.indexOf("_"));
+
+            if (family.id == iconFamilyId) {
+                result = family.icons;
+                break;
+            }
+        }
+        return result;
+    },
+
+    remove: function () {
+        var actionDispatcher = ActionDispatcher.getInstance();
+        var featureId = this._featureModel.getId();
+        var topicId = this._topicId;
+        actionDispatcher.removeFeatureFromTopic(topicId, featureId);
+    }
+});
+
+ImageIcon.prototype.ICON_FAMILIES = [
+    {"id": "face", "icons": ["face_plain", "face_sad", "face_crying", "face_smile", "face_surprise", "face_wink"]},
+    {"id": "funy", "icons": ["funy_angel", "funy_devilish", "funy_glasses", "funy_grin", "funy_kiss", "funy_monkey"]},
+    {"id": "conn", "icons": ["conn_connect", "conn_disconnect"]},
+    {
+        "id": "sport",
+        "icons": ["sport_basketball", "sport_football", "sport_golf", "sport_raquet", "sport_shuttlecock", "sport_soccer", "sport_tennis"]
+    },
+    {"id": "bulb", "icons": ["bulb_light_on", "bulb_light_off"]},
+    {"id": "thumb", "icons": ["thumb_thumb_up", "thumb_thumb_down"]},
+    {"id": "tick", "icons": ["tick_tick", "tick_cross"]},
+    {
+        "id": "onoff",
+        "icons": ["onoff_clock", "onoff_clock_red", "onoff_add", "onoff_delete", "onoff_status_offline", "onoff_status_online"]
+    },
+    {
+        "id": "money",
+        "icons": ["money_money", "money_dollar", "money_euro", "money_pound", "money_yen", "money_coins", "money_ruby"]
+    },
+    {"id": "time", "icons": ["time_calendar", "time_clock", "time_hourglass"]},
+    {
+        "id": "number",
+        "icons": ["number_1", "number_2", "number_3", "number_4", "number_5", "number_6", "number_7", "number_8", "number_9"]
+    },
+    {"id": "chart", "icons": ["chart_bar", "chart_line", "chart_curve", "chart_pie", "chart_organisation"]},
+    {"id": "sign", "icons": ["sign_warning", "sign_info", "sign_stop", "sign_help", "sign_cancel"]},
+    {
+        "id": "hard",
+        "icons": ["hard_cd", "hard_computer", "hard_controller", "hard_driver_disk", "hard_ipod", "hard_keyboard", "hard_mouse", "hard_printer"]
+    },
+    {
+        "id": "soft",
+        "icons": ["soft_bug", "soft_cursor", "soft_database_table", "soft_database", "soft_feed", "soft_folder_explore", "soft_rss", "soft_penguin"]
+    },
+    {"id": "arrow", "icons": ["arrow_up", "arrow_down", "arrow_left", "arrow_right"]},
+    {
+        "id": "arrowc",
+        "icons": ["arrowc_rotate_anticlockwise", "arrowc_rotate_clockwise", "arrowc_turn_left", "arrowc_turn_right"]
+    },
+    {"id": "people", "icons": ["people_group", "people_male1", "people_male2", "people_female1", "people_female2"]},
+    {"id": "mail", "icons": ["mail_envelop", "mail_mailbox", "mail_edit", "mail_list"]},
+    {"id": "flag", "icons": ["flag_blue", "flag_green", "flag_orange", "flag_pink", "flag_purple", "flag_yellow"]},
+    {
+        "id": "bullet",
+        "icons": ["bullet_black", "bullet_blue", "bullet_green", "bullet_orange", "bullet_red", "bullet_pink", "bullet_purple"]
+    },
+    {"id": "tag", "icons": ["tag_blue", "tag_green", "tag_orange", "tag_red", "tag_pink", "tag_yellow"]},
+    {
+        "id": "object",
+        "icons": ["object_bell", "object_clanbomber", "object_key", "object_pencil", "object_phone", "object_magnifier", "object_clip", "object_music", "object_star", "object_wizard", "object_house", "object_cake", "object_camera", "object_palette", "object_rainbow"]
+    },
+    {
+        "id": "weather",
+        "icons": ["weather_clear-night", "weather_clear", "weather_few-clouds-night", "weather_few-clouds", "weather_overcast", "weather_severe-alert", "weather_showers-scattered", "weather_showers", "weather_snow", "weather_storm"]
+    },
+    {"id": "task", "icons": ["task_0", "task_25", "task_50", "task_75", "task_100"]}
+];
+
+export default ImageIcon;

packages/mindplot/lib/components/Keyboard.js

@@ -0,0 +1,35 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const Keyboard = new Class({
+
+    initialize: function () {
+    },
+
+    addShortcut: function (shortcuts, callback) {
+        if (!$.isArray(shortcuts)) {
+            shortcuts = [shortcuts];
+        }
+        _.each(shortcuts, function (shortcut) {
+            $(document).bind('keydown', shortcut, callback);
+        });
+    }
+
+});
+
+export default Keyboard;

packages/mindplot/lib/components/LinkIcon.js

@@ -0,0 +1,72 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Icon = require('./Icon').default;
+const LinkIconTooltip = require('./widget/LinkIconTooltip').default;
+
+const LinkIcon = new Class({
+
+    Extends: Icon,
+    initialize: function (topic, linkModel, readOnly) {
+        $assert(topic, 'topic can not be null');
+        $assert(linkModel, 'linkModel can not be null');
+
+        this.parent(LinkIcon.IMAGE_URL);
+        this._linksModel = linkModel;
+        this._topic = topic;
+        this._readOnly = readOnly;
+
+        this._registerEvents();
+    },
+
+    _registerEvents: function () {
+        this._image.setCursor('pointer');
+        this._tip = new LinkIconTooltip(this);
+
+        var me = this;
+        if (!this._readOnly) {
+            // Add on click event to open the editor ...
+            this.addEvent('click', function (event) {
+                me._tip.hide();
+                me._topic.showLinkEditor();
+                event.stopPropagation();
+            });
+            //FIXME: we shouldn't have timeout of that..
+            this.addEvent("mouseleave", function (event) {
+                window.setTimeout(function () {
+                    if (!$("#linkPopover:hover").length) {
+                        me._tip.hide();
+                    }
+                    event.stopPropagation();
+                }, 100)
+            });
+        }
+
+        $(this.getImage()._peer._native).mouseenter(function () {
+            me._tip.show();
+        })
+    },
+
+    getModel: function () {
+        return this._linksModel;
+    }
+});
+LinkIcon.IMAGE_URL = "images/links.png";
+
+export default LinkIcon;
+
+ 

packages/mindplot/lib/components/LocalStorageManager.js

@@ -0,0 +1,64 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const PersistenceManager = require('./PersistenceManager').default;
+
+const LocalStorageManager = new Class({
+        Extends: PersistenceManager,
+        initialize: function (documentUrl, forceLoad) {
+            this.parent();
+            this.documentUrl = documentUrl;
+            this.forceLoad = forceLoad;
+        },
+
+        saveMapXml: function (mapId, mapXml, pref, saveHistory, events) {
+            localStorage.setItem(mapId + "-xml", mapXml);
+        },
+
+        discardChanges: function (mapId) {
+            localStorage.removeItem(mapId + "-xml");
+        },
+
+        loadMapDom: function (mapId) {
+            var xml = localStorage.getItem(mapId + "-xml");
+            if (xml == null || this.forceLoad) {
+                $.ajax({
+                    url: this.documentUrl.replace("{id}", mapId),
+                    headers: {"Content-Type": "text/plain", "Accept": "application/xml"},
+                    type: 'get',
+                    dataType: "text",
+                    async: false,
+                    success: function (response) {
+                        xml = response;
+                    }
+                });
+                // If I could not load it from a file, hard code one.
+                if (xml == null) {
+                    throw new Error("Map could not be loaded");
+                }
+            }
+
+            return jQuery.parseXML(xml);
+        },
+
+        unlockMap: function (mindmap) {
+            // Ignore, no implementation required ...
+        }
+    }
+);
+
+export default LocalStorageManager;

packages/mindplot/lib/components/MainTopic.js

@@ -0,0 +1,170 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js')
+const core = Core();
+const web2D = require('@wismapping/web2d');
+const web2d = web2D();
+
+const Topic = require('./Topic').default;
+const { TopicShape } = require('./model/INodeModel');
+const Shape = require('./util/Shape').default;
+
+const MainTopic = new Class(
+    /** @lends MainTopic */ {
+        Extends: Topic,
+        /**
+         * @extends mindplot.Topic
+         * @constructs
+         * @param model
+         * @param options
+         */
+        initialize: function (model, options) {
+            this.parent(model, options);
+        },
+
+        INNER_RECT_ATTRIBUTES: { stroke: '0.5 solid #009900' },
+
+        _buildDragShape: function () {
+            var innerShape = this._buildShape(this.INNER_RECT_ATTRIBUTES, this.getShapeType());
+            var size = this.getSize();
+            innerShape.setSize(size.width, size.height);
+            innerShape.setPosition(0, 0);
+            innerShape.setOpacity(0.5);
+            innerShape.setCursor('default');
+            innerShape.setVisibility(true);
+
+            var brColor = this.getBorderColor();
+            innerShape.setAttribute('strokeColor', brColor);
+
+            var bgColor = this.getBackgroundColor();
+            innerShape.setAttribute('fillColor', bgColor);
+
+            //  Create group ...
+            var groupAttributes = {
+                width: 100,
+                height: 100,
+                coordSizeWidth: 100,
+                coordSizeHeight: 100,
+            };
+            var group = new web2d.Group(groupAttributes);
+            group.append(innerShape);
+
+            // Add Text ...
+            if (this.getShapeType() != TopicShape.IMAGE) {
+                var textShape = this._buildTextShape(true);
+                var text = this.getText();
+                textShape.setText(text);
+                textShape.setOpacity(0.5);
+                group.append(textShape);
+            }
+            return group;
+        },
+
+        /** */
+        updateTopicShape: function (targetTopic, workspace) {
+            // Change figure based on the connected topic ...
+            var model = this.getModel();
+            var shapeType = model.getShapeType();
+            if (!targetTopic.isCentralTopic()) {
+                if (!$defined(shapeType)) {
+                    // Get the real shape type ...
+                    shapeType = this.getShapeType();
+                    this._setShapeType(shapeType, false);
+                }
+            }
+        },
+
+        /** */
+        disconnect: function (workspace) {
+            this.parent(workspace);
+            var size = this.getSize();
+
+            var model = this.getModel();
+            var shapeType = model.getShapeType();
+            if (!$defined(shapeType)) {
+                // Change figure ...
+                shapeType = this.getShapeType();
+                this._setShapeType(TopicShape.ROUNDED_RECT, false);
+            }
+            var innerShape = this.getInnerShape();
+            innerShape.setVisibility(true);
+        },
+
+        _updatePositionOnChangeSize: function (oldSize, newSize) {
+            var xOffset = Math.round((newSize.width - oldSize.width) / 2);
+            var pos = this.getPosition();
+            if ($defined(pos)) {
+                if (pos.x > 0) {
+                    pos.x = pos.x + xOffset;
+                } else {
+                    pos.x = pos.x - xOffset;
+                }
+                this.setPosition(pos);
+            }
+        },
+
+        /** */
+        workoutIncomingConnectionPoint: function (sourcePosition) {
+            return Shape.workoutIncomingConnectionPoint(this, sourcePosition);
+        },
+
+        /** */
+        workoutOutgoingConnectionPoint: function (targetPosition) {
+            $assert(targetPosition, 'targetPoint can not be null');
+            var pos = this.getPosition();
+            var isAtRight = Shape.isAtRight(targetPosition, pos);
+            var size = this.getSize();
+
+            var result;
+            if (this.getShapeType() == TopicShape.LINE) {
+                result = new core.Point();
+                var groupPosition = this._elem2d.getPosition();
+                var innerShareSize = this.getInnerShape().getSize();
+
+                if (innerShareSize) {
+                    var magicCorrectionNumber = 0.3;
+                    if (!isAtRight) {
+                        result.x = groupPosition.x + innerShareSize.width - magicCorrectionNumber;
+                    } else {
+                        result.x = groupPosition.x + magicCorrectionNumber;
+                    }
+                    result.y = groupPosition.y + innerShareSize.height;
+                } else {
+                    // Hack: When the size has not being defined. This is because the node has not being added.
+                    // Try to do our best ...
+                    if (!isAtRight) {
+                        result.x = pos.x + size.width / 2;
+                    } else {
+                        result.x = pos.x - size.width / 2;
+                    }
+                    result.y = pos.y + size.height / 2;
+                }
+            } else {
+                result = Shape.calculateRectConnectionPoint(
+                    pos,
+                    size,
+                    isAtRight,
+                    true
+                );
+            }
+            return result;
+        },
+    }
+);
+
+export default MainTopic;

packages/mindplot/lib/components/Messages.js

@@ -0,0 +1,45 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const Messages = new Class({
+    Static: {
+        init: function (locale) {
+            locale = $defined(locale) ? locale : 'en';
+            var bundle = Messages.BUNDLES[locale];
+            if (bundle == null && locale.indexOf("_") != -1) {
+                // Try to locate without the specialization ...
+                locale = locale.substring(0, locale.indexOf("_"));
+                bundle = Messages.BUNDLES[locale];
+            }
+            Messages.__bundle = bundle;
+        }
+    }
+});
+
+$msg = function (key) {
+    if (!Messages.__bundle) {
+        Messages.init('en');
+    }
+
+    var msg = Messages.__bundle[key];
+    return msg ? msg : key;
+};
+
+Messages.BUNDLES = {};
+
+export default Messages;

packages/mindplot/lib/components/MultilineTextEditor.js

@@ -0,0 +1,316 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Events = require('./Events').default;
+const ActionDispatcher = require('./ActionDispatcher').default;
+
+const MultilineTextEditor = new Class({
+    Extends: Events,
+    initialize: function () {
+        this._topic = null;
+        this._timeoutId = -1;
+    },
+
+    _buildEditor: function () {
+
+        var result = $('<div></div>')
+            .attr('id', 'textContainer')
+            .css({
+                display: "none",
+                zIndex: "8",
+                overflow: "hidden",
+                border: "0 none"
+            });
+
+
+        var textareaElem = $('<textarea tabindex="-1" value="" wrap="off" ></textarea>')
+            .css({
+                border: "1px gray dashed",
+                background: "rgba(98, 135, 167, .3)",
+                outline: '0 none',
+                resize: 'none',
+                overflow: "hidden"
+            });
+
+        result.append(textareaElem);
+        return result;
+    },
+
+    _registerEvents: function (containerElem) {
+        var textareaElem = this._getTextareaElem();
+        var me = this;
+        textareaElem.on('keydown', function (event) {
+            switch (jQuery.hotkeys.specialKeys[event.keyCode]) {
+                case 'esc':
+                    me.close(false);
+                    break;
+                case 'enter':
+                    if (event.metaKey || event.ctrlKey) {
+
+                        // Add return ...
+                        var text = textareaElem.val();
+                        var cursorPosition = text.length;
+                        if (textareaElem.selectionStart) {
+                            cursorPosition = textareaElem.selectionStart;
+                        }
+
+                        var head = text.substring(0, cursorPosition);
+                        var tail = "";
+                        if (cursorPosition < text.length) {
+                            tail = text.substring(cursorPosition, text.length);
+                        }
+                        textareaElem.val(head + "\n" + tail);
+
+                        // Position cursor ...
+                        if (textareaElem[0].setSelectionRange) {
+                            textareaElem.focus();
+                            textareaElem[0].setSelectionRange(cursorPosition + 1, cursorPosition + 1);
+                        } else if (textareaElem.createTextRange) {
+                            var range = textareaElem.createTextRange();
+                            range.moveStart('character', cursorPosition + 1);
+                            range.select();
+                        }
+
+                    }
+                    else {
+                        me.close(true);
+                    }
+                    break;
+                case 'tab':
+                    event.preventDefault();
+                    var start = $(this).get(0).selectionStart;
+                    var end = $(this).get(0).selectionEnd;
+
+                    // set textarea value to: text before caret + tab + text after caret
+                    $(this).val($(this).val().substring(0, start) + "\t" + $(this).val().substring(end));
+
+                    // put caret at right position again
+                    $(this).get(0).selectionStart = $(this).get(0).selectionEnd = start + 1;
+                    break;
+            }
+            event.stopPropagation();
+        });
+
+        textareaElem.on('keypress', function (event) {
+            event.stopPropagation();
+        });
+
+        textareaElem.on('keyup', function (event) {
+            var text = me._getTextareaElem().val();
+            me.fireEvent('input', [event, text]);
+            me._adjustEditorSize();
+        });
+
+        // If the user clicks on the input, all event must be ignored ...
+        containerElem.on('click', function (event) {
+            event.stopPropagation();
+        });
+        containerElem.on('dblclick', function (event) {
+            event.stopPropagation();
+        });
+        containerElem.on('mousedown', function (event) {
+            event.stopPropagation();
+        });
+    },
+
+    _adjustEditorSize: function () {
+
+        if (this.isVisible()) {
+            var textElem = this._getTextareaElem();
+
+            var lines = textElem.val().split('\n');
+            var maxLineLength = 1;
+            _.each(lines, function (line) {
+                if (maxLineLength < line.length)
+                    maxLineLength = line.length;
+            });
+
+            textElem.attr('cols', maxLineLength);
+            textElem.attr('rows', lines.length);
+
+            this._containerElem.css({
+                width: (maxLineLength + 3) + 'em',
+                height: textElem.height()
+            });
+        }
+    },
+
+    isVisible: function () {
+        return $defined(this._containerElem) && this._containerElem.css('display') == 'block';
+    },
+
+    _updateModel: function () {
+
+        if (this._topic.getText() != this._getText()) {
+            var text = this._getText();
+            var topicId = this._topic.getId();
+
+            var actionDispatcher = ActionDispatcher.getInstance();
+            actionDispatcher.changeTextToTopic([topicId], text);
+        }
+    },
+
+    show: function (topic, text) {
+        // Close a previous node editor if it's opened ...
+        if (this._topic) {
+            this.close(false);
+        }
+
+        this._topic = topic;
+        if (!this.isVisible()) {
+            //Create editor ui
+            var containerElem = this._buildEditor();
+            $('body').append(containerElem);
+
+            this._containerElem = containerElem;
+            this._registerEvents(containerElem);
+            this._showEditor(text);
+        }
+    },
+
+    _showEditor: function (defaultText) {
+
+        var topic = this._topic;
+
+        // Hide topic text ...
+        topic.getTextShape().setVisibility(false);
+
+        // Set Editor Style
+        var nodeText = topic.getTextShape();
+        var font = nodeText.getFont();
+        font.size = nodeText.getHtmlFontSize();
+        font.color = nodeText.getColor();
+        this._setStyle(font);
+        var me = this;
+        // Set editor's initial size
+        var displayFunc = function () {
+            // Position the editor and set the size...
+            var textShape = topic.getTextShape();
+
+            me._containerElem.css('display', 'block');
+
+            //FIXME: Im not sure if this is best way...
+            var shapePosition = textShape.getNativePosition();
+            me._containerElem.offset(shapePosition);
+
+            // Set editor's initial text ...
+            var text = $defined(defaultText) ? defaultText : topic.getText();
+            me._setText(text);
+
+            // Set the element focus and select the current text ...
+            var inputElem = me._getTextareaElem();
+            me._positionCursor(inputElem, !$defined(defaultText));
+
+        };
+
+        this._timeoutId = displayFunc.delay(10);
+    },
+
+    _setStyle: function (fontStyle) {
+        var inputField = this._getTextareaElem();
+        if (!$defined(fontStyle.font)) {
+            fontStyle.font = "Arial";
+        }
+        if (!$defined(fontStyle.style)) {
+            fontStyle.style = "normal";
+        }
+        if (!$defined(fontStyle.weight)) {
+            fontStyle.weight = "normal";
+        }
+        if (!$defined(fontStyle.size)) {
+            fontStyle.size = 12;
+        }
+        var style = {
+            fontSize: fontStyle.size + "px",
+            fontFamily: fontStyle.font,
+            fontStyle: fontStyle.style,
+            fontWeight: fontStyle.weight,
+            color: fontStyle.color
+        };
+        inputField.css(style);
+        this._containerElem.css(style);
+    },
+
+    _setText: function (text) {
+        var textareaElem = this._getTextareaElem();
+        textareaElem.val(text);
+        this._adjustEditorSize();
+    },
+
+    _getText: function () {
+        return this._getTextareaElem().val();
+    },
+
+    _getTextareaElem: function () {
+        return this._containerElem.find('textarea');
+    },
+
+    _positionCursor: function (textareaElem, selectText) {
+        textareaElem.focus();
+        var lengh = textareaElem.val().length;
+        if (selectText) {
+            // Mark text as selected ...
+            if (textareaElem.createTextRange) {
+                var rang = textareaElem.createTextRange();
+                rang.select();
+                rang.move("character", lengh);
+            }
+            else {
+                textareaElem[0].setSelectionRange(0, lengh);
+            }
+
+        } else {
+            // Move the cursor to the last character ..
+            if (textareaElem.createTextRange) {
+                var range = textareaElem.createTextRange();
+                range.move("character", lengh);
+            } else {
+                if (Browser.ie11) {
+                    textareaElem[0].selectionStart = lengh;
+                    textareaElem[0].selectionEnd = lengh;
+                } else {
+                    textareaElem.selectionStart = lengh;
+                    textareaElem.selectionEnd = lengh;
+                }
+                textareaElem.focus();
+            }
+        }
+
+    },
+
+    close: function (update) {
+        if (this.isVisible() && this._topic) {
+            // Update changes ...
+            clearTimeout(this._timeoutId);
+
+            if (!$defined(update) || update) {
+                this._updateModel();
+            }
+
+            // Let make the visible text in the node visible again ...
+            this._topic.getTextShape().setVisibility(true);
+
+            // Remove it form the screen ...
+            this._containerElem.remove();
+            this._containerElem = null;
+            this._timeoutId = -1;
+        }
+        this._topic = null;
+    }
+});
+
+export default MultilineTextEditor;

packages/mindplot/lib/components/NodeGraph.js

@@ -0,0 +1,222 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Topic = require('./Topic').default
+const DragTopic = require('./DragTopic').default;
+const INodeModel = require('./model/INodeModel').default;
+const CentralTopic = require('./CentralTopic').default;
+const MainTopic = require('./MainTopic').default;
+
+const NodeGraph = new Class(/** @lends NodeGraph */{
+    /**
+     * @constructs
+     * @param {mindplot.model.NodeModel} nodeModel
+     * @param {Object<Number, String, Boolean>} options
+     * @throws will throw an error if nodeModel is null or undefined
+     */
+    initialize: function (nodeModel, options) {
+        $assert(nodeModel, "model can not be null");
+
+        this._options = options;
+        this._mouseEvents = true;
+        this.setModel(nodeModel);
+        this._onFocus = false;
+        this._size = {width: 50, height: 20};
+    },
+
+    /** @return true if option is set to read-only */
+    isReadOnly: function () {
+        return this._options.readOnly;
+    },
+
+    /** @return model type */
+    getType: function () {
+        var model = this.getModel();
+        return model.getType();
+    },
+
+    /**
+     * @param {String} id
+     * @throws will throw an error if the topic id is not a number
+     */
+    setId: function (id) {
+        $assert(typeof  topic.getId() == "number", "id is not a number:" + id);
+        this.getModel().setId(id);
+    },
+
+    _set2DElement: function (elem2d) {
+        this._elem2d = elem2d;
+    },
+
+    /**
+     * @return 2D element
+     * @throws will throw an error if the element is null or undefined within node graph
+     */
+    get2DElement: function () {
+        $assert(this._elem2d, 'NodeGraph has not been initialized properly');
+        return this._elem2d;
+    },
+
+    /** @abstract */
+    setPosition: function (point, fireEvent) {
+        throw "Unsupported operation";
+    },
+
+    /** */
+    addEvent: function (type, listener) {
+        var elem = this.get2DElement();
+        elem.addEvent(type, listener);
+    },
+
+    /** */
+    removeEvent: function (type, listener) {
+        var elem = this.get2DElement();
+        elem.removeEvent(type, listener);
+    },
+
+    /** */
+    fireEvent: function (type, event) {
+        var elem = this.get2DElement();
+        elem.trigger(type, event);
+    },
+
+    /** */
+    setMouseEventsEnabled: function (isEnabled) {
+        this._mouseEvents = isEnabled;
+    },
+
+    /** */
+    isMouseEventsEnabled: function () {
+        return this._mouseEvents;
+    },
+
+    /** @return {Object<Number>} size*/
+    getSize: function () {
+        return this._size;
+    },
+
+    /** @param {Object<Number>} size*/
+    setSize: function (size) {
+        this._size.width = parseInt(size.width);
+        this._size.height = parseInt(size.height);
+    },
+
+    /**
+     * @return {mindplot.model.NodeModel} the node model
+     */
+    getModel: function () {
+        $assert(this._model, 'Model has not been initialized yet');
+        return this._model;
+    },
+
+    /**
+     * @param {mindplot.NodeModel} model the node model
+     * @throws will throw an error if model is null or undefined
+     */
+    setModel: function (model) {
+        $assert(model, 'Model can not be null');
+        this._model = model;
+    },
+
+    /** */
+    getId: function () {
+        return this._model.getId();
+    },
+
+    /** */
+    setOnFocus: function (focus) {
+        if (this._onFocus != focus) {
+
+            this._onFocus = focus;
+            var outerShape = this.getOuterShape();
+            if (focus) {
+                outerShape.setFill(Topic.OUTER_SHAPE_ATTRIBUTES_FOCUS.fillColor);
+                outerShape.setOpacity(1);
+
+            } else {
+                outerShape.setFill(Topic.OUTER_SHAPE_ATTRIBUTES.fillColor);
+                outerShape.setOpacity(0);
+            }
+            this.setCursor('move');
+
+            // In any case, always try to hide the editor ...
+            this.closeEditors();
+
+            // Fire event ...
+            this.fireEvent(focus ? 'ontfocus' : 'ontblur', this);
+
+        }
+    },
+
+    /** @return {Boolean} true if the node graph is on focus */
+    isOnFocus: function () {
+        return this._onFocus;
+    },
+
+    /** */
+    dispose: function (workspace) {
+        this.setOnFocus(false);
+        workspace.removeChild(this);
+    },
+
+    /** */
+    createDragNode: function (layoutManager) {
+        var dragShape = this._buildDragShape();
+        return new DragTopic(dragShape, this, layoutManager);
+    },
+
+    _buildDragShape: function () {
+        $assert(false, '_buildDragShape must be implemented by all nodes.');
+    },
+
+    /** */
+    getPosition: function () {
+        var model = this.getModel();
+        return model.getPosition();
+    }
+});
+
+/**
+ * creates a new topic from the given node model
+ * @memberof mindplot.Nodegraph
+ * @param {mindplot.model.NodeModel} nodeModel
+ * @param {Object} options
+ * @throws will throw an error if nodeModel is null or undefined
+ * @throws will throw an error if the nodeModel's type is null or undefined
+ * @throws will throw an error if the node type cannot be recognized as either central or main
+ * topic type
+ * @return {mindplot.CentralTopic|mindplot.MainTopic} the new topic
+ */
+NodeGraph.create = function (nodeModel, options) {
+    $assert(nodeModel, 'Model can not be null');
+
+    var type = nodeModel.getType();
+    $assert(type, 'Node model type can not be null');
+
+    var result;
+    if (type == INodeModel.CENTRAL_TOPIC_TYPE) {
+        result = new CentralTopic(nodeModel, options);
+    } else if (type == INodeModel.MAIN_TOPIC_TYPE) {
+        result = new MainTopic(nodeModel, options);
+    } else {
+        $assert(false, "unsupported node type:" + type);
+    }
+
+    return result;
+};
+
+export default NodeGraph;

packages/mindplot/lib/components/NoteIcon.js

@@ -0,0 +1,84 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Icon = require('./Icon').default;
+const FloatingTip = require('./widget/FloatingTip').default;
+
+const NoteIcon = new Class({
+    Extends: Icon,
+    initialize: function (topic, noteModel, readOnly) {
+        $assert(topic, 'topic can not be null');
+
+        this.parent(NoteIcon.IMAGE_URL);
+        this._linksModel = noteModel;
+        this._topic = topic;
+        this._readOnly = readOnly;
+
+        this._registerEvents();
+    },
+
+    _registerEvents: function () {
+        this._image.setCursor('pointer');
+        var me = this;
+
+        if (!this._readOnly) {
+            // Add on click event to open the editor ...
+            this.addEvent('click', function (event) {
+                me._topic.showNoteEditor();
+                event.stopPropagation();
+            });
+        }
+        this._tip = new FloatingTip($(me.getImage()._peer._native), {
+            title: $msg('NOTE'),
+            container: 'body',
+            // Content can also be a function of the target element!
+            content: function () {
+                return me._buildTooltipContent();
+            },
+            html: true,
+            placement: 'bottom',
+            destroyOnExit: true
+        });
+
+    },
+
+    _buildTooltipContent: function () {
+        if ($("body").find("#textPopoverNote").length == 1) {
+            var text = $("body").find("#textPopoverNote");
+            text.text(this._linksModel.getText());
+        } else {
+            var result = $('<div id="textPopoverNote"></div>').css({padding: '5px'});
+
+            var text = $('<div></div>').text(this._linksModel.getText())
+                .css({
+                    'white-space': 'pre-wrap',
+                    'word-wrap': 'break-word'
+                }
+            );
+            result.append(text);
+            return result;
+        }
+    },
+
+    getModel: function () {
+        return this._linksModel;
+    }
+});
+
+NoteIcon.IMAGE_URL = "images/notes.png";
+
+export default NoteIcon

packages/mindplot/lib/components/Options.js

@@ -0,0 +1,15 @@
+const Options = new Class({
+
+    setOptions: function () {
+        var options = this.options = Object.merge.apply(null, [{}, this.options].append(arguments));
+        if (this.addEvent) for (var option in options) {
+            if (typeOf(options[option]) != 'function' || !(/^on[A-Z]/).test(option)) continue;
+            this.addEvent(option, options[option]);
+            delete options[option];
+        }
+        return this;
+    }
+
+});
+
+export default Options;

packages/mindplot/lib/components/PersistenceManager.js

@@ -0,0 +1,88 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js')
+const core = Core();
+const XMLSerializerFactory = require('./persistence/XMLSerializerFactory');
+
+const PersistenceManager = new Class({
+    Static: {
+        loadFromDom: function (mapId, mapDom) {
+            $assert(mapId, "mapId can not be null");
+            $assert(mapDom, "mapDom can not be null");
+
+            var serializer = XMLSerializerFactory.getSerializerFromDocument(mapDom);
+            return serializer.loadFromDom(mapDom, mapId);
+        }
+    },
+
+    initialize: function () {
+
+    },
+
+    save: function (mindmap, editorProperties, saveHistory, events, sync) {
+        $assert(mindmap, "mindmap can not be null");
+        $assert(editorProperties, "editorProperties can not be null");
+
+        var mapId = mindmap.getId();
+        $assert(mapId, "mapId can not be null");
+
+        var serializer = XMLSerializerFactory.getSerializerFromMindmap(mindmap);
+        var domMap = serializer.toXML(mindmap);
+        var mapXml = core.Utils.innerXML(domMap);
+
+        var pref = JSON.stringify(editorProperties);
+        try {
+            this.saveMapXml(mapId, mapXml, pref, saveHistory, events, sync);
+        } catch (e) {
+            console.log(e);
+            events.onError(this._buildError());
+        }
+    },
+
+    load: function (mapId) {
+        $assert(mapId, "mapId can not be null");
+        var domDocument = this.loadMapDom(mapId);
+        return PersistenceManager.loadFromDom(mapId, domDocument);
+    },
+
+    discardChanges: function (mapId) {
+        throw new Error("Method must be implemented");
+    },
+
+    loadMapDom: function (mapId) {
+        throw new Error("Method must be implemented");
+    },
+
+    saveMapXml: function (mapId, mapXml, pref, saveHistory, events, sync) {
+        throw new Error("Method must be implemented");
+    },
+
+    unlockMap: function (mindmap) {
+        throw new Error("Method must be implemented");
+    }
+});
+
+PersistenceManager.init = function (instance) {
+    PersistenceManager._instance = instance;
+};
+
+PersistenceManager.getInstance = function () {
+    return PersistenceManager._instance;
+};
+
+export default PersistenceManager;

packages/mindplot/lib/components/Relationship.js

@@ -0,0 +1,345 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js')
+const core = Core();
+
+const web2D = require('@wismapping/web2d')
+const web2d = web2D();
+
+const ConnectionLine = require('./ConnectionLine').default;
+const ControlPoint = require('./ControlPoint').default;
+
+const INodeModel = require('./model/INodeModel').default;
+
+const Shape = require('./util/Shape').default
+
+const Relationship = new Class({
+    Extends: ConnectionLine,
+    Static: {
+        getStrokeColor: function () {
+            return '#9b74e6';
+        },
+        type: "Relationship"
+    },
+    initialize: function (sourceNode, targetNode, model) {
+        $assert(sourceNode, "sourceNode can not be null");
+        $assert(targetNode, "targetNode can not be null");
+
+        this.parent(sourceNode, targetNode, model.getLineType());
+        this.setModel(model);
+
+        var strokeColor = Relationship.getStrokeColor();
+
+        this._line2d.setIsSrcControlPointCustom(false);
+        this._line2d.setIsDestControlPointCustom(false);
+        this._line2d.setCursor('pointer');
+        this._line2d.setStroke(1, 'solid', strokeColor);
+        this._line2d.setDashed(4, 2);
+        this._focusShape = this._createLine(this.getLineType(), ConnectionLine.SIMPLE_CURVED);
+        this._focusShape.setStroke(2, "solid", "#3f96ff");
+
+        var ctrlPoints = this._line2d.getControlPoints();
+        this._focusShape.setSrcControlPoint(ctrlPoints[0]);
+        this._focusShape.setDestControlPoint(ctrlPoints[1]);
+        this._focusShape.setVisibility(false);
+        this._onFocus = false;
+        this._isInWorkspace = false;
+        this._controlPointsController = new ControlPoint();
+
+        this._startArrow = new web2d.Arrow();
+        this._startArrow.setStrokeColor(strokeColor);
+        this._startArrow.setStrokeWidth(2);
+        this.setShowStartArrow(true);
+
+        // Share style is disable ...
+        if (this._showEndArrow) {
+            this._endArrow = new web2d.Arrow();
+            this._endArrow.setStrokeColor(strokeColor);
+            this._endArrow.setStrokeWidth(2);
+        }
+
+        // Position the line ...
+        if ($defined(model.getSrcCtrlPoint())) {
+            var srcPoint = model.getSrcCtrlPoint().clone();
+            this.setSrcControlPoint(srcPoint);
+        }
+        if ($defined(model.getDestCtrlPoint())) {
+            var destPoint = model.getDestCtrlPoint().clone();
+            this.setDestControlPoint(destPoint);
+        }
+    },
+
+    setStroke: function (color, style, opacity) {
+        this.parent(color, style, opacity);
+        this._startArrow.setStrokeColor(color);
+    },
+
+    redraw: function () {
+        var line2d = this._line2d;
+        var sourceTopic = this._sourceTopic;
+        var sourcePosition = sourceTopic.getPosition();
+
+        var targetTopic = this._targetTopic;
+        var targetPosition = targetTopic.getPosition();
+        if (targetTopic.getType() == INodeModel.CENTRAL_TOPIC_TYPE) {
+            targetPosition = Shape.workoutIncomingConnectionPoint(targetTopic, sourcePosition);
+        }
+
+        var sPos, tPos;
+        this._line2d.setStroke(2);
+        var ctrlPoints = this._line2d.getControlPoints();
+        if (!this._line2d.isDestControlPointCustom() && !this._line2d.isSrcControlPointCustom()) {
+
+            var defaultPoints = Shape.calculateDefaultControlPoints(sourcePosition, targetPosition);
+            ctrlPoints[0].x = defaultPoints[0].x;
+            ctrlPoints[0].y = defaultPoints[0].y;
+
+            ctrlPoints[1].x = defaultPoints[1].x;
+            ctrlPoints[1].y = defaultPoints[1].y;
+        }
+        var spoint = new core.Point();
+        spoint.x = parseInt(ctrlPoints[0].x) + parseInt(sourcePosition.x);
+        spoint.y = parseInt(ctrlPoints[0].y) + parseInt(sourcePosition.y);
+
+        var tpoint = new core.Point();
+        tpoint.x = parseInt(ctrlPoints[1].x) + parseInt(targetPosition.x);
+        tpoint.y = parseInt(ctrlPoints[1].y) + parseInt(targetPosition.y);
+
+        sPos = Shape.calculateRelationShipPointCoordinates(sourceTopic, spoint);
+        tPos = Shape.calculateRelationShipPointCoordinates(targetTopic, tpoint);
+
+        line2d.setFrom(sPos.x, sPos.y);
+        line2d.setTo(tPos.x, tPos.y);
+
+        line2d.moveToFront();
+
+        //Positionate Arrows
+        this._positionArrows();
+
+        // Add connector ...
+        this._positionateConnector(targetTopic);
+
+        if (this.isOnFocus()) {
+            this._refreshShape();
+        }
+        this._focusShape.moveToBack();
+        this._controlPointsController.redraw();
+    },
+
+    _positionArrows: function () {
+        var tpos = this._line2d.getTo();
+        var spos = this._line2d.getFrom();
+
+        this._startArrow.setFrom(spos.x, spos.y);
+        this._startArrow.moveToBack();
+
+        if (this._endArrow) {
+            this._endArrow.setFrom(tpos.x, tpos.y);
+            this._endArrow.moveToBack();
+        }
+
+        if (this._line2d.getType() == "CurvedLine") {
+            var controlPoints = this._line2d.getControlPoints();
+            this._startArrow.setControlPoint(controlPoints[0]);
+            if (this._endArrow) {
+                this._endArrow.setControlPoint(controlPoints[1]);
+            }
+        } else {
+            this._startArrow.setControlPoint(this._line2d.getTo());
+            if (this._endArrow) {
+                this._endArrow.setControlPoint(this._line2d.getFrom());
+            }
+        }
+
+        if (this._showEndArrow) {
+            this._endArrow.setVisibility(this.isVisible());
+        }
+        this._startArrow.setVisibility(this.isVisible() && this._showStartArrow);
+    },
+
+    addToWorkspace: function (workspace) {
+        workspace.append(this._focusShape);
+        workspace.append(this._controlPointsController);
+
+        this._controlPointControllerListener = this._initializeControlPointController.bind(this);
+        this._line2d.addEvent('click', this._controlPointControllerListener);
+        this._isInWorkspace = true;
+
+        workspace.append(this._startArrow);
+        if (this._endArrow)
+            workspace.append(this._endArrow);
+
+        this.parent(workspace);
+        this._positionArrows();
+        this.redraw();
+
+    },
+
+    _initializeControlPointController: function () {
+        this.setOnFocus(true);
+    },
+
+    removeFromWorkspace: function (workspace) {
+        workspace.removeChild(this._focusShape);
+        workspace.removeChild(this._controlPointsController);
+        this._line2d.removeEvent('click', this._controlPointControllerListener);
+        this._isInWorkspace = false;
+        workspace.removeChild(this._startArrow);
+        if (this._endArrow)
+            workspace.removeChild(this._endArrow);
+
+        this.parent(workspace);
+    },
+
+    getType: function () {
+        return Relationship.type;
+    },
+
+    setOnFocus: function (focus) {
+        // Change focus shape
+        if (this.isOnFocus() != focus) {
+            if (focus) {
+                this._refreshShape();
+                this._controlPointsController.setLine(this);
+            }
+            this._focusShape.setVisibility(focus);
+
+            this._controlPointsController.setVisibility(focus);
+            this._onFocus = focus;
+            this.fireEvent(focus ? 'ontfocus' : 'ontblur', this);
+        }
+    },
+
+    _refreshShape: function () {
+        var sPos = this._line2d.getFrom();
+        var tPos = this._line2d.getTo();
+        var ctrlPoints = this._line2d.getControlPoints();
+        this._focusShape.setFrom(sPos.x, sPos.y);
+        this._focusShape.setTo(tPos.x, tPos.y);
+        var shapeCtrlPoints = this._focusShape.getControlPoints();
+        shapeCtrlPoints[0].x = ctrlPoints[0].x;
+        shapeCtrlPoints[0].y = ctrlPoints[0].y;
+        shapeCtrlPoints[1].x = ctrlPoints[1].x;
+        shapeCtrlPoints[1].y = ctrlPoints[1].y;
+        this._focusShape.updateLine();
+    },
+
+    addEvent: function (type, listener) {
+        // Translate to web 2d events ...
+        if (type == 'onfocus') {
+            type = 'mousedown';
+        }
+
+        var line = this._line2d;
+        line.addEvent(type, listener);
+    },
+
+    isOnFocus: function () {
+        return this._onFocus;
+    },
+
+    isInWorkspace: function () {
+        return this._isInWorkspace;
+    },
+
+    setVisibility: function (value) {
+        this.parent(value);
+        if (this._showEndArrow)
+            this._endArrow.setVisibility(this._showEndArrow);
+        this._startArrow.setVisibility(this._showStartArrow && value);
+    },
+
+    setOpacity: function (opacity) {
+        this.parent(opacity);
+        if (this._showEndArrow)
+            this._endArrow.setOpacity(opacity);
+        if (this._showStartArrow)
+            this._startArrow.setOpacity(opacity);
+    },
+
+    setShowEndArrow: function (visible) {
+        this._showEndArrow = visible;
+        if (this._isInWorkspace)
+            this.redraw();
+    },
+
+    setShowStartArrow: function (visible) {
+        this._showStartArrow = visible;
+        if (this._isInWorkspace)
+            this.redraw();
+    },
+
+    setFrom: function (x, y) {
+        $assert($defined(x), "x must be defined");
+        $assert($defined(y), "y must be defined");
+
+        this._line2d.setFrom(x, y);
+        this._startArrow.setFrom(x, y);
+    },
+
+    setTo: function (x, y) {
+        $assert($defined(x), "x must be defined");
+        $assert($defined(y), "y must be defined");
+
+        this._line2d.setTo(x, y);
+        if (this._endArrow)
+            this._endArrow.setFrom(x, y);
+    },
+
+    setSrcControlPoint: function (control) {
+        this._line2d.setSrcControlPoint(control);
+        this._startArrow.setControlPoint(control);
+    },
+
+    setDestControlPoint: function (control) {
+        this._line2d.setDestControlPoint(control);
+        if (this._showEndArrow)
+            this._endArrow.setControlPoint(control);
+    },
+
+    getControlPoints: function () {
+        return this._line2d.getControlPoints();
+    },
+
+    isSrcControlPointCustom: function () {
+        return this._line2d.isSrcControlPointCustom();
+    },
+
+    isDestControlPointCustom: function () {
+        return this._line2d.isDestControlPointCustom();
+    },
+
+    setIsSrcControlPointCustom: function (isCustom) {
+        this._line2d.setIsSrcControlPointCustom(isCustom);
+    },
+
+    setIsDestControlPointCustom: function (isCustom) {
+        this._line2d.setIsDestControlPointCustom(isCustom);
+    },
+
+    getId: function () {
+        return this._model.getId();
+    },
+
+    fireEvent: function (type, event) {
+        var elem = this._line2d;
+        elem.trigger(type, event);
+    }
+});
+
+export default Relationship;

packages/mindplot/lib/components/RelationshipPivot.js

@@ -0,0 +1,167 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js')
+const core = Core();
+const web2D = require('@wismapping/web2d')
+const web2d = web2D();
+const INodeModel = require('./model/INodeModel').default
+const Shape = require('./util/Shape').default;
+
+const RelationshipPivot = new Class({
+    initialize: function (workspace, designer) {
+        $assert(workspace, "workspace can not be null");
+        $assert(designer, "designer can not be null");
+        this._workspace = workspace;
+        this._designer = designer;
+
+        //FIXME: the aim of the migration is remove .bind mootools method, please remove these!
+        this._mouseMoveEvent = this._mouseMove.bind(this);
+        this._onClickEvent = this._cleanOnMouseClick.bind(this);
+        this._onTopicClick = this._connectOnFocus.bind(this);
+
+    },
+
+    start: function (sourceTopic, targetPos) {
+        $assert(sourceTopic, "sourceTopic can not be null");
+        $assert(targetPos, "targetPos can not be null");
+
+        this.dispose();
+        this._sourceTopic = sourceTopic;
+        if (sourceTopic != null) {
+            this._workspace.enableWorkspaceEvents(false);
+
+            var sourcePos = sourceTopic.getPosition();
+            var strokeColor = Relationship.getStrokeColor();
+
+            this._pivot = new web2d.CurvedLine();
+            this._pivot.setStyle(web2d.CurvedLine.SIMPLE_LINE);
+
+            var fromPos = this._calculateFromPosition(sourcePos);
+            this._pivot.setFrom(fromPos.x, fromPos.y);
+
+            this._pivot.setTo(targetPos.x, targetPos.y);
+            this._pivot.setStroke(2, 'solid', strokeColor);
+            this._pivot.setDashed(4, 2);
+
+            this._startArrow = new web2d.Arrow();
+            this._startArrow.setStrokeColor(strokeColor);
+            this._startArrow.setStrokeWidth(2);
+            this._startArrow.setFrom(sourcePos.x, sourcePos.y);
+
+            this._workspace.append(this._pivot);
+            this._workspace.append(this._startArrow);
+
+            this._workspace.addEvent('mousemove', this._mouseMoveEvent);
+            this._workspace.addEvent('click', this._onClickEvent);
+
+            // Register focus events on all topics ...
+            var model = this._designer.getModel();
+            var topics = model.getTopics();
+            _.each(topics, function (topic) {
+                topic.addEvent('ontfocus', this._onTopicClick);
+            }.bind(this));
+        }
+
+    },
+
+    dispose: function () {
+        var workspace = this._workspace;
+
+        if (this._isActive()) {
+            workspace.removeEvent('mousemove', this._mouseMoveEvent);
+            workspace.removeEvent('click', this._onClickEvent);
+
+            var model = this._designer.getModel();
+            var topics = model.getTopics();
+            var me = this;
+            _.each(topics, function (topic) {
+                topic.removeEvent('ontfocus', me._onTopicClick);
+            });
+
+            workspace.removeChild(this._pivot);
+            workspace.removeChild(this._startArrow);
+            workspace.enableWorkspaceEvents(true);
+
+            this._sourceTopic = null;
+            this._pivot = null;
+            this._startArrow = null;
+        }
+    },
+
+    _mouseMove: function (event) {
+        var screen = this._workspace.getScreenManager();
+        var pos = screen.getWorkspaceMousePosition(event);
+
+        // Leave the arrow a couple of pixels away from the cursor.
+        var sourcePosition = this._sourceTopic.getPosition();
+        var gapDistance = Math.sign(pos.x - sourcePosition.x) * 5;
+
+        var sPos = this._calculateFromPosition(pos);
+        this._pivot.setFrom(sPos.x, sPos.y);
+
+        // Update target position ...
+        this._pivot.setTo(pos.x - gapDistance, pos.y);
+
+        var controlPoints = this._pivot.getControlPoints();
+        this._startArrow.setFrom(pos.x - gapDistance, pos.y);
+        this._startArrow.setControlPoint(controlPoints[1]);
+
+        event.stopPropagation();
+        return false;
+    },
+
+    _cleanOnMouseClick: function (event) {
+
+        // The user clicks on a desktop on in other element that is not a node.
+        this.dispose();
+        event.stopPropagation();
+    },
+
+    _calculateFromPosition: function (toPosition) {
+
+        // Calculate origin position ...
+        var sourcePosition = this._sourceTopic.getPosition();
+        if (this._sourceTopic.getType() == INodeModel.CENTRAL_TOPIC_TYPE) {
+            sourcePosition = Shape.workoutIncomingConnectionPoint(this._sourceTopic, toPosition);
+        }
+        var controlPoint = Shape.calculateDefaultControlPoints(sourcePosition, toPosition);
+
+        var spoint = new core.Point();
+        spoint.x = parseInt(controlPoint[0].x) + parseInt(sourcePosition.x);
+        spoint.y = parseInt(controlPoint[0].y) + parseInt(sourcePosition.y);
+        return Shape.calculateRelationShipPointCoordinates(this._sourceTopic, spoint);
+    },
+
+    _connectOnFocus: function (event, targetTopic) {
+        var sourceTopic = this._sourceTopic;
+        var mindmap = this._designer.getMindmap();
+
+        // Avoid circular connections ...
+        if (targetTopic.getId() != sourceTopic.getId()) {
+            var relModel = mindmap.createRelationship(targetTopic.getId(), sourceTopic.getId());
+            this._designer._actionDispatcher.addRelationship(relModel);
+        }
+        this.dispose();
+    },
+
+    _isActive: function () {
+        return this._pivot != null;
+    }
+});
+
+export default RelationshipPivot;

packages/mindplot/lib/components/RestPersistenceManager.js

@@ -0,0 +1,166 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const PersistenceManager = require('./PersistenceManager').default;
+
+const RESTPersistenceManager = new Class({
+        Extends: PersistenceManager,
+        initialize: function (options) {
+            this.parent();
+            $assert(options.documentUrl, "documentUrl can not be null");
+            $assert(options.revertUrl, "revertUrl can not be null");
+            $assert(options.lockUrl, "lockUrl can not be null");
+            $assert(options.session, "session can not be null");
+            $assert(options.timestamp, "timestamp can not be null");
+
+            this.documentUrl = options.documentUrl;
+            this.revertUrl = options.revertUrl;
+            this.lockUrl = options.lockUrl;
+            this.timestamp = options.timestamp;
+            this.session = options.session;
+        },
+
+        saveMapXml: function (mapId, mapXml, pref, saveHistory, events, sync) {
+
+            var data = {
+                id: mapId,
+                xml: mapXml,
+                properties: pref
+            };
+
+            var persistence = this;
+            var query = "minor=" + !saveHistory;
+            query = query + "&timestamp=" + this.timestamp;
+            query = query + "&session=" + this.session;
+
+            if (!persistence.onSave) {
+
+                // Mark save in process and fire a event unlocking the save ...
+                persistence.onSave = true;
+                persistence.clearTimeout = setTimeout(function () {
+                    persistence.clearTimeout = null;
+                    persistence.onSave = false;
+                }, 10000);
+
+                $.ajax({
+                    url: this.documentUrl.replace("{id}", mapId) + "?" + query,
+                    type: 'put',
+                    dataType: "json",
+                    data: JSON.stringify(data),
+                    contentType: "application/json; charset=utf-8",
+                    async: !sync,
+
+                    success: function (data, textStatus, jqXHRresponseText) {
+                        persistence.timestamp = data;
+                        events.onSuccess();
+                    },
+                    error: function (jqXHR, textStatus, errorThrown) {
+                        events.onError(persistence._buildError());
+                    },
+                    complete: function () {
+                        // Clear event timeout ...
+                        if (persistence.clearTimeout) {
+                            clearTimeout(persistence.clearTimeout);
+                        }
+                        persistence.onSave = false;
+                    },
+                    fail: function (xhr, textStatus) {
+
+                        var responseText = xhr.responseText;
+                        var userMsg = {severity: "SEVERE", message: $msg('SAVE_COULD_NOT_BE_COMPLETED')};
+
+                        var contentType = xhr.getResponseHeader("Content-Type");
+                        if (contentType != null && contentType.indexOf("application/json") != -1) {
+                            var serverMsg = null;
+                            try {
+                                serverMsg = $.parseJSON(responseText);
+                                serverMsg = serverMsg.globalSeverity ? serverMsg : null;
+                            } catch (e) {
+                                // Message could not be decoded ...
+                            }
+                            userMsg = persistence._buildError(serverMsg);
+
+                        } else {
+                            if (this.status == 405) {
+                                userMsg = {severity: "SEVERE", message: $msg('SESSION_EXPIRED')};
+                            }
+                        }
+                        events.onError(userMsg);
+                        persistence.onSave = false;
+                    }
+                });
+            }
+        },
+
+        discardChanges: function (mapId) {
+            $.ajax({
+                url: this.revertUrl.replace("{id}", mapId),
+                async: false,
+                method: 'post',
+                headers: {"Content-Type": "application/json; charset=utf-8", "Accept": "application/json"}
+            });
+        },
+
+        unlockMap: function (mindmap) {
+            var mapId = mindmap.getId();
+            $.ajax({
+                url: this.lockUrl.replace("{id}", mapId),
+                async: false,
+                method: 'put',
+                headers: {"Content-Type": "text/plain"},
+                data: "false"
+            });
+        },
+
+        _buildError: function (jsonSeverResponse) {
+            var message = jsonSeverResponse ? jsonSeverResponse.globalErrors[0] : null;
+            var severity = jsonSeverResponse ? jsonSeverResponse.globalSeverity : null;
+
+            if (!message) {
+                message = $msg('SAVE_COULD_NOT_BE_COMPLETED');
+            }
+
+            if (!severity) {
+                severity = "INFO";
+            }
+            return {severity: severity, message: message};
+        },
+
+        loadMapDom: function (mapId) {
+            // Let's try to open one from the local directory ...
+            var xml;
+            $.ajax({
+                url: this.documentUrl.replace("{id}", mapId) + "/xml",
+                method: 'get',
+                async: false,
+                headers: {"Content-Type": "text/plain", "Accept": "application/xml"},
+                success: function (responseText) {
+                    xml = responseText;
+                }
+            });
+
+            // If I could not load it from a file, hard code one.
+            if (xml == null) {
+                throw new Error("Map could not be loaded");
+            }
+
+            return xml;
+        }
+    }
+);
+
+export default RESTPersistenceManager;

packages/mindplot/lib/components/ScreenManager.js

@@ -0,0 +1,153 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Core = require('@wismapping/core-js');
+const core = Core();
+
+const ScreenManager = new Class({
+    initialize: function (divElement) {
+        $assert(divElement, "can not be null");
+        this._divContainer = divElement;
+        this._padding = {x: 0, y: 0};
+
+        // Ignore default click event propagation. Prevent 'click' event on drag.
+        this._clickEvents = [];
+        this._divContainer.bind('click', function (event) {
+            event.stopPropagation()
+        });
+
+        this._divContainer.bind('dblclick', function (event) {
+            event.stopPropagation();
+            event.preventDefault();
+        });
+    },
+
+    setScale: function (scale) {
+        $assert(scale, 'Screen scale can not be null');
+        this._scale = scale;
+    },
+
+    addEvent: function (event, listener) {
+        if (event == 'click')
+            this._clickEvents.push(listener);
+        else
+            this._divContainer.bind(event, listener);
+    },
+
+    removeEvent: function (event, listener) {
+        if (event == 'click') {
+            this._clickEvents.remove(listener);
+        }
+        else {
+            this._divContainer.unbind(event, listener);
+        }
+    },
+
+    fireEvent: function (type, event) {
+        if (type == 'click') {
+            _.each(this._clickEvents, function (listener) {
+                listener(type, event);
+            });
+        }
+        else {
+            this._divContainer.trigger(type, event);
+        }
+    },
+
+    _getElementPosition: function (elem) {
+        // Retrieve current element position.
+        var elementPosition = elem.getPosition();
+        var x = elementPosition.x;
+        var y = elementPosition.y;
+
+        // Add workspace offset.
+        x = x - this._padding.x;
+        y = y - this._padding.y;
+
+        // Scale coordinate in order to be relative to the workspace. That's coord/size;
+        x = x / this._scale;
+        y = y / this._scale;
+
+        // Remove decimal part..
+        return {x: x, y: y};
+    },
+
+    getWorkspaceIconPosition: function (e) {
+        // Retrieve current icon position.
+        var image = e.getImage();
+        var elementPosition = image.getPosition();
+        var imageSize = e.getSize();
+
+        //Add group offset
+        var iconGroup = e.getGroup();
+        var group = iconGroup.getNativeElement();
+        var coordOrigin = group.getCoordOrigin();
+        var groupSize = group.getSize();
+        var coordSize = group.getCoordSize();
+
+        var scale = {x: coordSize.width / parseInt(groupSize.width), y: coordSize.height / parseInt(groupSize.height)};
+
+        var x = (elementPosition.x - coordOrigin.x - (parseInt(imageSize.width) / 2)) / scale.x;
+        var y = (elementPosition.y - coordOrigin.y - (parseInt(imageSize.height) / 2)) / scale.y;
+
+        //Retrieve iconGroup Position
+        var groupPosition = iconGroup.getPosition();
+        x = x + groupPosition.x;
+        y = y + groupPosition.y;
+
+        //Retrieve topic Position
+        var topic = iconGroup.getTopic();
+        var topicPosition = this._getElementPosition(topic);
+        topicPosition.x = topicPosition.x - (parseInt(topic.getSize().width) / 2);
+
+        // Remove decimal part..
+        return {x: x + topicPosition.x, y: y + topicPosition.y};
+    },
+
+    getWorkspaceMousePosition: function (event) {
+        // Retrieve current mouse position.
+        var x = event.clientX;
+        var y = event.clientY;
+
+        //FIXME: paulo: why? Subtract div position.
+        /*var containerPosition = this.getContainer().position();
+         x = x - containerPosition.x;
+         y = y - containerPosition.y;*/
+
+        // Scale coordinate in order to be relative to the workspace. That's coordSize/size;
+        x = x * this._scale;
+        y = y * this._scale;
+
+        // Add workspace offset.
+        x = x + this._padding.x;
+        y = y + this._padding.y;
+
+        // Remove decimal part..
+        return new core.Point(x, y);
+    },
+
+    getContainer: function () {
+        return this._divContainer;
+    },
+
+    setOffset: function (x, y) {
+        this._padding.x = x;
+        this._padding.y = y;
+    }
+});
+
+export default ScreenManager;

packages/mindplot/lib/components/ShrinkConnector.js

@@ -0,0 +1,114 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const web2D = require('@wismapping/web2d')
+const web2d = web2D();
+
+const Topic = require('./Topic').default
+const ActionDispatcher = require('./ActionDispatcher').default;
+
+const ShirinkConnector = new Class({
+    initialize: function (topic) {
+
+        var ellipse = new web2D.Elipse(Topic.prototype.INNER_RECT_ATTRIBUTES);
+        this._ellipse = ellipse;
+        ellipse.setFill('rgb(62,118,179)');
+
+        ellipse.setSize(Topic.CONNECTOR_WIDTH, Topic.CONNECTOR_WIDTH);
+        ellipse.addEvent('click', function (event) {
+            var model = topic.getModel();
+            var collapse = !model.areChildrenShrunken();
+
+            var topicId = topic.getId();
+            var actionDispatcher = ActionDispatcher.getInstance();
+            actionDispatcher.shrinkBranch([topicId], collapse);
+
+            event.stopPropagation();
+
+        });
+
+        ellipse.addEvent('mousedown', function (event) {
+            // Avoid node creation ...
+            event.stopPropagation();
+        });
+
+        ellipse.addEvent('dblclick', function (event) {
+            // Avoid node creation ...
+            event.stopPropagation();
+        });
+
+        ellipse.addEvent('mouseover', function (event) {
+
+            ellipse.setFill('rgb(153, 0, 255)');
+        });
+        var me = this;
+        ellipse.addEvent('mouseout', function (event) {
+            var color = topic.getBackgroundColor();
+            me.setFill(color);
+        });
+
+        ellipse.setCursor('default');
+        this._fillColor = '#f7f7f7';
+        var model = topic.getModel();
+        this.changeRender(model.areChildrenShrunken());
+
+    },
+
+    changeRender: function (isShrink) {
+        var elipse = this._ellipse;
+        if (isShrink) {
+            elipse.setStroke('2', 'solid');
+        } else {
+            elipse.setStroke('1', 'solid');
+        }
+    },
+
+    setVisibility: function (value) {
+        this._ellipse.setVisibility(value);
+    },
+
+    setOpacity: function (opacity) {
+        this._ellipse.setOpacity(opacity);
+    },
+
+    setFill: function (color) {
+        this._fillColor = color;
+        this._ellipse.setFill(color);
+    },
+
+    setAttribute: function (name, value) {
+        this._ellipse.setAttribute(name, value);
+    },
+
+    addToWorkspace: function (group) {
+        group.append(this._ellipse);
+    },
+
+    setPosition: function (x, y) {
+        this._ellipse.setPosition(x, y);
+    },
+
+    moveToBack: function () {
+        this._ellipse.moveToBack();
+    },
+
+    moveToFront: function () {
+        this._ellipse.moveToFront();
+    }
+});
+
+export default ShirinkConnector;

packages/mindplot/lib/components/StandaloneActionDispatcher.js

@@ -0,0 +1,381 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const ActionDispatcher = require('./ActionDispatcher').default;
+const DesignerActionRunner = require('./DesignerActionRunner').default;
+const AddTopicCommand = require('./commands/AddTopicCommand').default;
+const AddRelationshipCommand = require('./commands/AddRelationshipCommand').default;
+const AddFeatureToTopicCommand = require('./commands/AddFeatureToTopicCommand').default;
+const DeleteCommand = require('./commands/DeleteCommand').default;
+const RemoveFeatureFromTopicCommand = require('./commands/RemoveFeatureFromTopicCommand').default;
+const DragTopicCommand = require('./commands/DragTopicCommand').default;
+const GenericFunctionCommand = require('./commands/GenericFunctionCommand').default;
+const MoveControlPointCommand = require('./commands/MoveControlPointCommand').default;
+const ChangeFeatureToTopicCommand = require('./commands/ChangeFeatureToTopicCommand').default;
+const NodeModel = require('./model/NodeModel').default;
+
+const StandaloneActionDispatcher = new Class(
+    /** @lends StandaloneActionDispatcher */ {
+        Extends: ActionDispatcher,
+        /**
+         * @extends mindplot.ActionDispatcher
+         * @constructs
+         * @param {mindplot.CommandContext} commandContext
+         */
+        initialize: function (commandContext) {
+            this.parent(commandContext);
+            this._actionRunner = new DesignerActionRunner(commandContext, this);
+        },
+
+        /** */
+        addTopics: function (models, parentTopicsId) {
+            var command = new AddTopicCommand(models, parentTopicsId);
+            this.execute(command);
+        },
+
+        /** */
+        addRelationship: function (model) {
+            var command = new AddRelationshipCommand(model);
+            this.execute(command);
+        },
+
+        /** */
+        deleteEntities: function (topicsIds, relIds) {
+            var command = new DeleteCommand(topicsIds, relIds);
+            this.execute(command);
+        },
+
+        /** */
+        dragTopic: function (topicId, position, order, parentTopic) {
+            var command = new DragTopicCommand(topicId, position, order, parentTopic);
+            this.execute(command);
+        },
+
+        /** */
+        moveTopic: function (topicId, position) {
+            $assert($defined(topicId), 'topicsId can not be null');
+            $assert($defined(position), 'position can not be null');
+
+            var commandFunc = function (topic, value) {
+                var result = topic.getPosition();
+                EventBus.instance.fireEvent(EventBus.events.NodeMoveEvent, {
+                    node: topic.getModel(),
+                    position: value,
+                });
+                return result;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicId, position);
+            this.execute(command);
+        },
+
+        /** */
+        moveControlPoint: function (ctrlPoint, point) {
+            var command = new MoveControlPointCommand(ctrlPoint, point);
+            this.execute(command);
+        },
+
+        /** */
+        changeFontStyleToTopic: function (topicsIds) {
+            var commandFunc = function (topic) {
+                var result = topic.getFontStyle();
+                var style = result == 'italic' ? 'normal' : 'italic';
+                topic.setFontStyle(style, true);
+                return result;
+            };
+            var command = new GenericFunctionCommand(commandFunc, topicsIds);
+            this.execute(command);
+        },
+
+        /** */
+        changeTextToTopic: function (topicsIds, text) {
+            $assert($defined(topicsIds), 'topicsIds can not be null');
+
+            var commandFunc = function (topic, value) {
+                var result = topic.getText();
+                topic.setText(value);
+                return result;
+            };
+            commandFunc.commandType = 'changeTextToTopic';
+
+            var command = new GenericFunctionCommand(commandFunc, topicsIds, text);
+            this.execute(command);
+        },
+
+        /** */
+        changeFontFamilyToTopic: function (topicIds, fontFamily) {
+            $assert(topicIds, 'topicIds can not be null');
+            $assert(fontFamily, 'fontFamily can not be null');
+
+            var commandFunc = function (topic, fontFamily) {
+                var result = topic.getFontFamily();
+                topic.setFontFamily(fontFamily, true);
+
+                topic._adjustShapes();
+                return result;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicIds, fontFamily);
+            this.execute(command);
+        },
+
+        /** */
+        changeFontColorToTopic: function (topicsIds, color) {
+            $assert(topicsIds, 'topicIds can not be null');
+            $assert(color, 'color can not be null');
+
+            var commandFunc = function (topic, color) {
+                var result = topic.getFontColor();
+                topic.setFontColor(color, true);
+                return result;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicsIds, color);
+            command.discardDuplicated = 'fontColorCommandId';
+            this.execute(command);
+        },
+
+        /** */
+        changeBackgroundColorToTopic: function (topicsIds, color) {
+            $assert(topicsIds, 'topicIds can not be null');
+            $assert(color, 'color can not be null');
+
+            var commandFunc = function (topic, color) {
+                var result = topic.getBackgroundColor();
+                topic.setBackgroundColor(color);
+                return result;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicsIds, color);
+            command.discardDuplicated = 'backColor';
+            this.execute(command);
+        },
+
+        /** */
+        changeBorderColorToTopic: function (topicsIds, color) {
+            $assert(topicsIds, 'topicIds can not be null');
+            $assert(color, 'topicIds can not be null');
+
+            var commandFunc = function (topic, color) {
+                var result = topic.getBorderColor();
+                topic.setBorderColor(color);
+                return result;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicsIds, color);
+            command.discardDuplicated = 'borderColorCommandId';
+            this.execute(command);
+        },
+
+        /** */
+        changeFontSizeToTopic: function (topicsIds, size) {
+            $assert(topicsIds, 'topicIds can not be null');
+            $assert(size, 'size can not be null');
+
+            var commandFunc = function (topic, size) {
+                var result = topic.getFontSize();
+                topic.setFontSize(size, true);
+
+                topic._adjustShapes();
+                return result;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicsIds, size);
+            this.execute(command);
+        },
+
+        /** */
+        changeShapeTypeToTopic: function (topicsIds, shapeType) {
+            $assert(topicsIds, 'topicsIds can not be null');
+            $assert(shapeType, 'shapeType can not be null');
+
+            var commandFunc = function (topic, shapeType) {
+                var result = topic.getShapeType();
+                topic.setShapeType(shapeType, true);
+                return result;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicsIds, shapeType);
+            this.execute(command);
+        },
+
+        /** */
+        changeFontWeightToTopic: function (topicsIds) {
+            $assert(topicsIds, 'topicsIds can not be null');
+
+            var commandFunc = function (topic) {
+                var result = topic.getFontWeight();
+                var weight = result == 'bold' ? 'normal' : 'bold';
+                topic.setFontWeight(weight, true);
+
+                topic._adjustShapes();
+                return result;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicsIds);
+            this.execute(command);
+        },
+
+        /** */
+        shrinkBranch: function (topicsIds, collapse) {
+            $assert(topicsIds, 'topicsIds can not be null');
+
+            var commandFunc = function (topic, isShrink) {
+                topic.setChildrenShrunken(isShrink);
+                return !isShrink;
+            };
+
+            var command = new GenericFunctionCommand(commandFunc, topicsIds, collapse);
+            this.execute(command, false);
+        },
+
+        /** */
+        addFeatureToTopic: function (topicId, featureType, attributes) {
+            var command = new AddFeatureToTopicCommand(topicId, featureType, attributes);
+            this.execute(command);
+        },
+
+        /** */
+        changeFeatureToTopic: function (topicId, featureId, attributes) {
+            var command = new ChangeFeatureToTopicCommand(topicId, featureId, attributes);
+            this.execute(command);
+        },
+
+        /** */
+        removeFeatureFromTopic: function (topicId, featureId) {
+            var command = new RemoveFeatureFromTopicCommand(topicId, featureId);
+            this.execute(command);
+        },
+
+        /** */
+        execute: function (command) {
+            this._actionRunner.execute(command);
+        },
+    }
+);
+
+const CommandContext = new Class(
+    /** @lends CommandContext */ {
+        /**
+         * @constructs
+         * @param {mindplot.Designer} designer
+         */
+        initialize: function (designer) {
+            $assert(designer, 'designer can not be null');
+            this._designer = designer;
+        },
+
+        /** */
+        findTopics: function (topicsIds) {
+            $assert($defined(topicsIds), 'topicsIds can not be null');
+            if (!(topicsIds instanceof Array)) {
+                topicsIds = [topicsIds];
+            }
+
+            var designerTopics = this._designer.getModel().getTopics();
+            var result = designerTopics.filter(function (topic) {
+                return topicsIds.contains(topic.getId());
+            });
+
+            if (result.length != topicsIds.length) {
+                var ids = designerTopics.map(function (topic) {
+                    return topic.getId();
+                });
+                $assert(
+                    result.length == topicsIds.length,
+                    'Could not find topic. Result:' +
+                        result +
+                        ', Filter Criteria:' +
+                        topicsIds +
+                        ', Current Topics: [' +
+                        ids +
+                        ']'
+                );
+            }
+            return result;
+        },
+
+        /** */
+        deleteTopic: function (topic) {
+            this._designer.removeTopic(topic);
+        },
+
+        /** */
+        createTopic: function (model) {
+            $assert(model, 'model can not be null');
+            return this._designer.nodeModelToNodeGraph(model);
+        },
+
+        /** */
+        createModel: function () {
+            var mindmap = this._designer.getMindmap();
+            return mindmap.createNode(NodeModel.MAIN_TOPIC_TYPE);
+        },
+
+        /** */
+        addTopic: function (topic) {
+            var mindmap = this._designer.getMindmap();
+            return mindmap.addBranch(topic.getModel());
+        },
+
+        /** */
+        connect: function (childTopic, parentTopic) {
+            childTopic.connectTo(parentTopic, this._designer._workspace);
+        },
+
+        /** */
+        disconnect: function (topic) {
+            topic.disconnect(this._designer._workspace);
+        },
+
+        /** */
+        addRelationship: function (model) {
+            $assert(model, 'model cannot be null');
+            return this._designer.addRelationship(model);
+        },
+
+        /** */
+        deleteRelationship: function (relationship) {
+            this._designer.deleteRelationship(relationship);
+        },
+
+        /** */
+        findRelationships: function (relIds) {
+            $assert($defined(relIds), 'relId can not be null');
+            if (!(relIds instanceof Array)) {
+                relIds = [relIds];
+            }
+
+            var designerRel = this._designer.getModel().getRelationships();
+            return designerRel.filter(function (rel) {
+                return relIds.contains(rel.getId());
+            });
+        },
+
+        /** */
+        moveTopic: function (topic, position) {
+            $assert(topic, 'topic cannot be null');
+            $assert(position, 'position cannot be null');
+            EventBus.instance.fireEvent(EventBus.events.NodeMoveEvent, {
+                node: topic.getModel(),
+                position: position,
+            });
+        },
+    }
+);
+
+export {StandaloneActionDispatcher, CommandContext}

packages/mindplot/lib/components/TextEditor.js

@@ -0,0 +1,270 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const web2D = require('@wismapping/web2d')
+const web2d = web2D()
+
+const ActionDispatcher = require('./ActionDispatcher').default 
+
+//FIXME: Not used!
+const TextEditor = new Class({
+    initialize: function (topic) {
+        this._topic = topic;
+    },
+
+    _buildEditor: function () {
+
+        this._size = {width: 500, height: 100};
+        var result = new Element('div');
+        result.setStyles({
+                position: "absolute",
+                display: "none",
+                zIndex: "8",
+                width: "500px",
+                height: "100px"
+            }
+        );
+
+
+        var inputContainer = new Element('div');
+        inputContainer.setStyles({
+            border: "none",
+            overflow: "auto"
+        });
+        inputContainer.inject(result);
+
+        var inputText = new Element('input',
+            {
+                type: "text",
+                tabindex: '-1',
+                value: ""
+            }
+        );
+        inputText.setStyles({
+            border: "none",
+            background: "transparent"
+        });
+        inputText.inject(inputContainer);
+
+        var spanContainer = new Element('div');
+        spanContainer.setStyle('visibility', "hidden");
+        spanContainer.inject(result);
+
+        var spanElem = new Element('span', {tabindex: "-1"});
+        spanElem.setStyle('white-space', "nowrap");
+        spanElem.setStyle('nowrap', 'nowrap');
+        spanElem.inject(spanContainer);
+
+
+        return result;
+    },
+
+    _registerEvents: function (divElem) {
+        var inputElem = this._getTextareaElem();
+        var spanElem = this._getSpanElem();
+        var me = this;
+
+        divElem.addEvent('keydown', function (event) {
+            switch (event.key) {
+                case 'esc':
+                    me.close(false);
+                    break;
+                case 'enter':
+                    me.close(true);
+                    break;
+                default:
+                    spanElem.innerHTML = inputElem.value;
+                    var size = inputElem.value.length + 1;
+                    inputElem.size = size;
+                    if (spanElem.offsetWidth > (parseInt(divElem.style.width) - 100)) {
+                        divElem.style.width = (spanElem.offsetWidth + 100) + "px";
+                    }
+                    break;
+            }
+            event.stopPropagation();
+        });
+
+        // If the user clicks on the input, all event must be ignored ...
+        divElem.addEvent('click', function (event) {
+            event.stopPropagation();
+        });
+        divElem.addEvent('dblclick', function (event) {
+            event.stopPropagation();
+        });
+        divElem.addEvent('mousedown', function (event) {
+            event.stopPropagation();
+        });
+    },
+
+    isVisible: function () {
+        return $defined(this._containerElem) && this._containerElem.getStyle('display') == 'block';
+    },
+
+    _updateModel: function () {
+
+        if (this._topic.getText() != this._getText()) {
+            var text = this._getText();
+            var topicId = this._topic.getId();
+
+            var actionDispatcher = ActionDispatcher.getInstance();
+            actionDispatcher.changeTextToTopic([topicId], text);
+        }
+    },
+
+    show: function (text) {
+
+        if (!this.isVisible()) {
+            //Create editor ui
+            var editorElem = this._buildEditor();
+            editorElem.inject($(document.body)[0]);
+
+            this._containerElem = editorElem;
+            this._registerEvents(editorElem);
+            this._showEditor(text);
+        }
+    },
+
+    _showEditor: function (defaultText) {
+
+        var topic = this._topic;
+
+        // Hide topic text ...
+        topic.getTextShape().setVisibility(false);
+
+        // Set Editor Style
+        var nodeText = topic.getTextShape();
+        var font = nodeText.getFont();
+        font.size = nodeText.getHtmlFontSize();
+        font.color = nodeText.getColor();
+        this._setStyle(font);
+
+        // Set editor's initial text
+        var text = $defined(defaultText) ? defaultText : topic.getText();
+        this._setText(text);
+
+        var me = this;
+        // Set editor's initial size
+        var displayFunc = function () {
+            // Position the editor and set the size...
+            var textShape = me._topic.getTextShape();
+
+            me._containerElem.css('display', 'block');
+
+            me._containerElem.offset(textShape.getNativePosition());
+            // Set size ...
+            var elemSize = topic.getSize();
+            me._setEditorSize(elemSize.width, elemSize.height);
+
+            var textareaElem = me._getTextareaElem();
+            textareaElem.focus();
+            me._positionCursor(textareaElem, !$defined(defaultText));
+
+        };
+
+        displayFunc.delay(10);
+    },
+
+    _setStyle: function (fontStyle) {
+        var inputField = this._getTextareaElem();
+        var spanField = this._getSpanElem();
+        if (!$defined(fontStyle.font)) {
+            fontStyle.font = "Arial";
+        }
+        if (!$defined(fontStyle.style)) {
+            fontStyle.style = "normal";
+        }
+        if (!$defined(fontStyle.weight)) {
+            fontStyle.weight = "normal";
+        }
+        if (!$defined(fontStyle.size)) {
+            fontStyle.size = 12;
+        }
+        inputField.style.fontSize = fontStyle.size + "px";
+        inputField.style.fontFamily = fontStyle.font;
+        inputField.style.fontStyle = fontStyle.style;
+        inputField.style.fontWeight = fontStyle.weight;
+        inputField.style.color = fontStyle.color;
+        spanField.style.fontFamily = fontStyle.font;
+        spanField.style.fontStyle = fontStyle.style;
+        spanField.style.fontWeight = fontStyle.weight;
+        spanField.style.fontSize = fontStyle.size + "px";
+    },
+
+    _setText: function (text) {
+        var inputField = this._getTextareaElem();
+        inputField.size = text.length + 1;
+        this._containerElem.style.width = (inputField.size * parseInt(inputField.style.fontSize) + 100) + "px";
+        var spanField = this._getSpanElem();
+        spanField.innerHTML = text;
+        inputField.value = text;
+    },
+
+    _getText: function () {
+        return this._getTextareaElem().value;
+    },
+
+    _getTextareaElem: function () {
+        return this._containerElem.getElement('input');
+    },
+
+    _getSpanElem: function () {
+        return this._containerElem.getElement('span');
+    },
+
+    _setEditorSize: function (width, height) {
+        var textShape = this._topic.getTextShape();
+        var scale = web2d.utils.TransformUtil.workoutScale(textShape._peer);
+        this._size = {width: width * scale.width, height: height * scale.height};
+        this._containerElem.style.width = this._size.width * 2 + "px";
+        this._containerElem.style.height = this._size.height + "px";
+    },
+
+    _positionCursor: function (inputElem, selectText) {
+        // Select text if it's required ...
+        if (inputElem.createTextRange) //ie
+        {
+            var range = inputElem.createTextRange();
+            var pos = inputElem.value.length;
+            if (!selectText) {
+                range.select();
+                range.move("character", pos);
+            }
+            else {
+                range.move("character", pos);
+                range.select();
+            }
+        }
+        else if (!selectText) {
+            inputElem.setSelectionRange(0, inputElem.value.length);
+        }
+    },
+
+    close: function (update) {
+        if (this.isVisible()) {
+            // Update changes ...
+            if (!$defined(update) || update) {
+                this._updateModel();
+            }
+
+            // Let make the visible text in the node visible again ...
+            this._topic.getTextShape().setVisibility(true);
+
+            // Remove it form the screen ...
+            this._containerElem.dispose();
+            this._containerElem = null;
+        }
+    }
+});
+
+export default TextEditor;

packages/mindplot/lib/components/TextEditorFactory.js

@@ -0,0 +1,31 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const RichTextEditor = require('./Ri')
+const TextEditor = require('./TextEditor').default;
+
+const TextEditorFactory = {};
+
+TextEditorFactory.getTextEditorFromName = function (name) {
+    var editorClass = null;
+    if (name == "RichTextEditor") {
+        editorClass = RichTextEditor;
+    } else {
+        editorClass = TextEditor;
+    }
+    return editorClass;
+};

packages/mindplot/lib/components/TopicEventDispatcher.js

@@ -0,0 +1,87 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Events = require('./Events').default;
+const MultilineTextEditor = require('./MultilineTextEditor').default;
+const TopicEvent = require('./Topic');
+const { TopicShape } = require('./model/INodeModel');
+
+const TopicEventDispatcher = new Class({
+    Extends: Events,
+    Static: {
+        _instance: null,
+
+        configure: function (readOnly) {
+            this._instance = new TopicEventDispatcher(readOnly);
+        },
+
+        getInstance: function () {
+            return this._instance;
+        },
+    },
+
+    initialize: function (readOnly) {
+        this._readOnly = readOnly;
+        this._activeEditor = null;
+        this._multilineEditor = new MultilineTextEditor();
+    },
+
+    close: function (update) {
+        if (this.isVisible()) {
+            this._activeEditor.close(update);
+            this._activeEditor = null;
+        }
+    },
+
+    show: function (topic, options) {
+        this.process(TopicEvent.EDIT, topic, options);
+    },
+
+    process: function (eventType, topic, options) {
+        $assert(eventType, 'eventType can not be null');
+
+        // Close all previous open editor ....
+        if (this.isVisible()) {
+            this.close();
+        }
+
+        // Open the new editor ...
+        var model = topic.getModel();
+        if (
+            model.getShapeType() != TopicShape.IMAGE &&
+            !this._readOnly &&
+            eventType == TopicEvent.EDIT
+        ) {
+            this._multilineEditor.show(topic, options ? options.text : null);
+            this._activeEditor = this._multilineEditor;
+        } else {
+            this.fireEvent(eventType, { model: model, readOnly: this._readOnly });
+        }
+    },
+
+    isVisible: function () {
+        return this._activeEditor != null && this._activeEditor.isVisible();
+    },
+});
+
+TopicEvent = {
+    EDIT: 'editnode',
+    CLICK: 'clicknode',
+};
+
+export { TopicEvent };
+export default TopicEvent;

packages/mindplot/lib/components/TopicFeature.js

@@ -0,0 +1,98 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+/** */
+const IconModel = require('./model/IconModel').default;
+const ImageIcon = require('./ImageIcon').default;
+const LinkModel = require('./model/LinkModel').default;
+const LinkIcon = require('./LinkIcon').default;
+const NoteModel = require('./model/NoteModel').default;
+const NoteIcon = require('./NoteIcon').default;
+
+const TopicFeature = {
+    /** the icon object */
+    Icon: {
+        id: IconModel.FEATURE_TYPE,
+        model: IconModel,
+        icon: ImageIcon
+    },
+
+    /** the link object */
+    Link: {
+        id: LinkModel.FEATURE_TYPE,
+        model: LinkModel,
+        icon: LinkIcon
+    },
+
+    /** the note object */
+    Note: {
+        id: NoteModel.FEATURE_TYPE,
+        model: NoteModel,
+        icon: NoteIcon
+    },
+
+    /**
+     * @param id the feature metadata id
+     * @return {Boolean} returns true if the given id is contained in the metadata array
+     */
+    isSupported: function (id) {
+        return TopicFeature._featuresMetadataById.some(function (elem) {
+            return elem.id == id;
+        });
+    },
+
+    /**
+     * @param type
+     * @param attributes
+     * @throws will throw an error if type is null or undefined
+     * @throws will throw an error if attributes is null or undefined
+     * @return {mindplot.model.FeatureModel} a new instance of the feature model subclass matching
+     * the topic feature
+     */
+    createModel: function (type, attributes) {
+        $assert(type, 'type can not be null');
+        $assert(attributes, 'attributes can not be null');
+
+        var model = TopicFeature._featuresMetadataById.filter(function (elem) {
+            return elem.id == type;
+        })[0].model;
+        return new model(attributes);
+    },
+
+    /**
+     * @param {mindplot.Topic} topic
+     * @param {mindplot.model.FeatureModel} model
+     * @param {Boolean} readOnly true if the editor is running in read-only mode
+     * @throws will throw an error if topic is null or undefined
+     * @throws will throw an error if model is null or undefined
+     * @return {mindplot.Icon} a new instance of the icon subclass matching the topic feature
+     */
+    createIcon: function (topic, model, readOnly) {
+        $assert(topic, 'topic can not be null');
+        $assert(model, 'model can not be null');
+
+        var icon = TopicFeature._featuresMetadataById.filter(function (elem) {
+            return elem.id == model.getType();
+        })[0].icon;
+        return new icon(topic, model, readOnly);
+    }
+};
+
+TopicFeature._featuresMetadataById = [TopicFeature.Icon, TopicFeature.Link, TopicFeature.Note];
+
+export default TopicFeature;

packages/mindplot/lib/components/TopicStyle.js

@@ -0,0 +1,132 @@
+/*
+ *    Copyright [2011] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const { TopicShape } = require('./model/INodeModel');
+
+const TopicStyle = new Class({
+    Static: {
+        _getStyles: function (topic) {
+            $assert(topic, 'topic can not be null');
+
+            var result;
+            if (topic.isCentralTopic()) {
+                result = TopicStyle.STYLES.CENTRAL_TOPIC;
+            } else {
+                var targetTopic = topic.getOutgoingConnectedTopic();
+                if ($defined(targetTopic)) {
+                    if (targetTopic.isCentralTopic()) {
+                        result = TopicStyle.STYLES.MAIN_TOPIC;
+                    } else {
+                        result = TopicStyle.STYLES.SUB_TOPIC;
+                    }
+                } else {
+                    result = TopicStyle.STYLES.ISOLATED_TOPIC;
+                }
+            }
+            return result;
+        },
+
+        defaultText: function (topic) {
+            var msgKey = this._getStyles(topic).msgKey;
+            return $msg(msgKey);
+        },
+
+        defaultFontStyle: function (topic) {
+            return this._getStyles(topic).fontStyle;
+        },
+
+        defaultBackgroundColor: function (topic) {
+            return this._getStyles(topic).backgroundColor;
+        },
+
+        defaultBorderColor: function (topic) {
+            return this._getStyles(topic).borderColor;
+        },
+
+        getInnerPadding: function (topic) {
+            return this._getStyles(topic).innerPadding;
+        },
+
+        defaultShapeType: function (topic) {
+            return this._getStyles(topic).shapeType;
+        },
+    },
+});
+
+TopicStyle.STYLES = {
+    CENTRAL_TOPIC: {
+        borderColor: 'rgb(57,113,177)',
+        backgroundColor: 'rgb(80,157,192)',
+        fontStyle: {
+            font: 'Verdana',
+            size: 10,
+            style: 'normal',
+            weight: 'bold',
+            color: '#ffffff',
+        },
+        msgKey: 'CENTRAL_TOPIC',
+        innerPadding: 11,
+        shapeType: TopicShape.ROUNDED_RECT,
+    },
+
+    MAIN_TOPIC: {
+        borderColor: 'rgb(2,59,185)',
+        backgroundColor: 'rgb(224,229,239)',
+        fontStyle: {
+            font: 'Arial',
+            size: 8,
+            style: 'normal',
+            weight: 'normal',
+            color: 'rgb(82,92,97)',
+        },
+        msgKey: 'MAIN_TOPIC',
+        innerPadding: 3,
+        shapeType: TopicShape.LINE,
+    },
+
+    SUB_TOPIC: {
+        borderColor: 'rgb(2,59,185)',
+        backgroundColor: 'rgb(224,229,239)',
+        fontStyle: {
+            font: 'Arial',
+            size: 6,
+            style: 'normal',
+            weight: 'normal',
+            color: 'rgb(82,92,97)',
+        },
+        msgKey: 'SUB_TOPIC',
+        innerPadding: 3,
+        shapeType: TopicShape.LINE,
+    },
+
+    ISOLATED_TOPIC: {
+        borderColor: 'rgb(2,59,185)',
+        backgroundColor: 'rgb(224,229,239)',
+        fontStyle: {
+            font: 'Verdana',
+            size: 8,
+            style: 'normal',
+            weight: 'normal',
+            color: 'rgb(82,92,97)',
+        },
+        msgKey: 'ISOLATED_TOPIC',
+        innerPadding: 4,
+        shapeType: TopicShape.LINE,
+    },
+};
+
+export default TopicStyle;

packages/mindplot/lib/components/Workspace.js

@@ -0,0 +1,229 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const web2D = require('@wismapping/web2d')
+const web2d = web2D();
+
+const Workspace = new Class({
+    initialize: function (screenManager, zoom) {
+        // Create a suitable container ...
+        $assert(screenManager, 'Div container can not be null');
+        $assert(zoom, 'zoom container can not be null');
+
+        this._zoom = zoom;
+        this._screenManager = screenManager;
+
+        var divContainer = screenManager.getContainer();
+        this._screenWidth = parseInt(divContainer.css('width'));
+        this._screenHeight = parseInt(divContainer.css('height'));
+
+        // Initialize web2d workspace.
+        var workspace = this._createWorkspace();
+        this._workspace = workspace;
+
+        // Append to the workspace...
+        workspace.addItAsChildTo(divContainer);
+        this.setZoom(zoom, true);
+
+        // Register drag events ...
+        this._registerDragEvents();
+        this._eventsEnabled = true;
+    },
+
+    _createWorkspace: function () {
+        // Initialize workspace ...
+        var coordOriginX = -(this._screenWidth / 2);
+        var coordOriginY = -(this._screenHeight / 2);
+
+        var workspaceProfile = {
+            width: this._screenWidth + "px",
+            height: this._screenHeight + "px",
+            coordSizeWidth: this._screenWidth,
+            coordSizeHeight: this._screenHeight,
+            coordOriginX: coordOriginX,
+            coordOriginY: coordOriginY,
+            fillColor: 'transparent',
+            strokeWidth: 0
+        };
+        web2d.Toolkit.init();
+        return new web2d.Workspace(workspaceProfile);
+    },
+
+    append: function (shape) {
+        if ($defined(shape.addToWorkspace)) {
+            shape.addToWorkspace(this);
+        } else {
+            this._workspace.append(shape);
+        }
+    },
+
+    removeChild: function (shape) {
+        // Element is a node, not a web2d element?
+        if ($defined(shape.removeFromWorkspace)) {
+            shape.removeFromWorkspace(this);
+        } else {
+            this._workspace.removeChild(shape);
+        }
+    },
+
+    addEvent: function (type, listener) {
+        this._workspace.addEvent(type, listener);
+    },
+
+    removeEvent: function (type, listener) {
+        $assert(type, 'type can not be null');
+        $assert(listener, 'listener can not be null');
+        this._workspace.removeEvent(type, listener);
+    },
+
+    getSize: function () {
+        return this._workspace.getCoordSize();
+    },
+
+    setZoom: function (zoom, center) {
+        this._zoom = zoom;
+        var workspace = this._workspace;
+
+        // Update coord scale...
+        var coordWidth = zoom * this._screenWidth;
+        var coordHeight = zoom * this._screenHeight;
+        workspace.setCoordSize(coordWidth, coordHeight);
+
+        // View port coords ...
+        if (this._viewPort) {
+            this._viewPort.width = this._viewPort.width * zoom;
+            this._viewPort.height = this._viewPort.height * zoom;
+        }
+
+        // Center topic....
+        var coordOriginX;
+        var coordOriginY;
+
+        if (center) {
+            if (this._viewPort) {
+                coordOriginX = -(this._viewPort.width / 2);
+                coordOriginY = -(this._viewPort.height / 2);
+            } else {
+                coordOriginX = -(coordWidth / 2);
+                coordOriginY = -(coordHeight / 2);
+            }
+        } else {
+            var coordOrigin = workspace.getCoordOrigin();
+            coordOriginX = coordOrigin.x;
+            coordOriginY = coordOrigin.y;
+        }
+
+        workspace.setCoordOrigin(coordOriginX, coordOriginY);
+
+        // Update screen.
+        this._screenManager.setOffset(coordOriginX, coordOriginY);
+        this._screenManager.setScale(zoom);
+
+        // Some changes in the screen. Let's fire an update event...
+        this._screenManager.fireEvent('update');
+    },
+
+    getScreenManager: function () {
+        return this._screenManager;
+    },
+
+    enableWorkspaceEvents: function (value) {
+        this._eventsEnabled = value;
+    },
+
+    isWorkspaceEventsEnabled: function () {
+        return this._eventsEnabled;
+    },
+
+    dumpNativeChart: function () {
+        return this._workspace.dumpNativeChart();
+    },
+
+    _registerDragEvents: function () {
+        var workspace = this._workspace;
+        var screenManager = this._screenManager;
+        var mWorkspace = this;
+        var mouseDownListener = function (event) {
+            if (!$defined(workspace._mouseMoveListener)) {
+                if (mWorkspace.isWorkspaceEventsEnabled()) {
+                    mWorkspace.enableWorkspaceEvents(false);
+
+                    var mouseDownPosition = screenManager.getWorkspaceMousePosition(event);
+                    var originalCoordOrigin = workspace.getCoordOrigin();
+
+                    var wasDragged = false;
+                    workspace._mouseMoveListener = function (event) {
+
+                        var currentMousePosition = screenManager.getWorkspaceMousePosition(event);
+
+                        var offsetX = currentMousePosition.x - mouseDownPosition.x;
+                        var coordOriginX = -offsetX + originalCoordOrigin.x;
+
+                        var offsetY = currentMousePosition.y - mouseDownPosition.y;
+                        var coordOriginY = -offsetY + originalCoordOrigin.y;
+
+                        workspace.setCoordOrigin(coordOriginX, coordOriginY);
+
+                        // Change cursor.
+                        if (Browser.firefox) {
+                            window.document.body.style.cursor = "-moz-grabbing";
+                        } else {
+                            window.document.body.style.cursor = "move";
+                        }
+                        event.preventDefault();
+
+                        // Fire drag event ...
+                        screenManager.fireEvent('update');
+                        wasDragged = true;
+
+
+                    };
+                    screenManager.addEvent('mousemove', workspace._mouseMoveListener);
+
+                    // Register mouse up listeners ...
+                    workspace._mouseUpListener = function (event) {
+
+                        screenManager.removeEvent('mousemove', workspace._mouseMoveListener);
+                        screenManager.removeEvent('mouseup', workspace._mouseUpListener);
+                        workspace._mouseUpListener = null;
+                        workspace._mouseMoveListener = null;
+                        window.document.body.style.cursor = 'default';
+
+                        // Update screen manager offset.
+                        var coordOrigin = workspace.getCoordOrigin();
+                        screenManager.setOffset(coordOrigin.x, coordOrigin.y);
+                        mWorkspace.enableWorkspaceEvents(true);
+
+                        if (!wasDragged) {
+                            screenManager.fireEvent('click');
+                        }
+                    };
+                    screenManager.addEvent('mouseup', workspace._mouseUpListener);
+                }
+            } else {
+                workspace._mouseUpListener();
+            }
+        };
+        screenManager.addEvent('mousedown', mouseDownListener);
+    },
+
+    setViewPort: function (size) {
+        this._viewPort = size;
+    }
+});
+
+export default Workspace;

packages/mindplot/lib/components/commands/AddFeatureToTopicCommand.js

@@ -0,0 +1,69 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default;
+
+const AddFeatureToTopicCommand = new Class(/** @lends AddFeatureToTopicCommand */{
+    Extends: Command,
+    /**
+     * @classdesc This command class handles do/undo of adding features to topics, e.g. an
+     * icon or a note. For a reference of existing features, refer to {@link mindplot.TopicFeature}
+     * @constructs
+     * @param {String} topicId the id of the topic
+     * @param {String} featureType the id of the feature type to add, e.g. "icon"
+     * @param {Object} attributes the attribute(s) of the respective feature model
+     * @extends mindplot.Command
+     * @see mindplot.model.FeatureModel and subclasses
+     */
+    initialize:function (topicId, featureType, attributes) {
+
+        $assert($defined(topicId), 'topicId can not be null');
+        $assert(featureType, 'featureType can not be null');
+        $assert(attributes, 'attributes can not be null');
+
+        this.parent();
+        this._topicId = topicId;
+        this._featureType = featureType;
+        this._attributes = attributes;
+        this._featureModel = null;
+    },
+
+    /** 
+     * Overrides abstract parent method 
+     */
+    execute:function (commandContext) {
+        var topic = commandContext.findTopics(this._topicId)[0];
+
+        // Feature must be created only one time.
+        if (!this._featureModel) {
+            var model = topic.getModel();
+            this._featureModel = model.createFeature(this._featureType, this._attributes);
+        }
+        topic.addFeature(this._featureModel);
+    },
+
+    /** 
+     * Overrides abstract parent method
+     * @see {@link mindplot.Command.undoExecute} 
+     */
+    undoExecute:function (commandContext) {
+        var topic = commandContext.findTopics(this._topicId)[0];
+        topic.removeFeature(this._featureModel);
+    }
+});
+
+export default AddFeatureToTopicCommand

packages/mindplot/lib/components/commands/AddRelationshipCommand.js

@@ -0,0 +1,53 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default
+
+const AddRelationshipCommand = new Class(/** @lends AddRelationshipCommand */{
+    Extends:Command,
+    /** 
+     * @classdesc This command class handles do/undo of adding a relationship to a topic.
+     * @constructs
+     * @param {XMLDOM} model
+     * @extends mindplot.Command
+     */
+    initialize:function (model) {
+        $assert(model, 'Relationship model can not be null');
+
+        this.parent();
+        this._model = model;
+    },
+    
+    /** 
+     * Overrides abstract parent method 
+     */
+    execute:function (commandContext) {
+        var relationship = commandContext.addRelationship(this._model);
+        relationship.setOnFocus(true);
+    },
+
+    /** 
+     * Overrides abstract parent method
+     * @see {@link mindplot.Command.undoExecute} 
+     */
+    undoExecute:function (commandContext) {
+        var rel = commandContext.findRelationships(this._model.getId());
+        commandContext.deleteRelationship(rel[0]);
+    }
+});
+
+export default AddRelationshipCommand;

packages/mindplot/lib/components/commands/AddTopicCommand.js

@@ -0,0 +1,97 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default;
+
+const AddTopicCommand = new Class(
+    /** @lends AddTopicCommand */ {
+        Extends: Command,
+        /**
+         * @classdesc This command class handles do/undo of adding one or multiple topics to
+         * the mindmap.
+         * @constructs
+         * @param {Array<mindplot.model.NodeModel>} models one or multiple models
+         * @param {Array<String>} parentTopicsId ids of the parent topics to add the children to, or null
+         * when attaching a dragged node or a node/branch from clipboard
+         * @extends mindplot.Command
+         */
+        initialize: function (models, parentTopicsId) {
+            $assert(models, 'models can not be null');
+            $assert(
+                parentTopicsId == null || parentTopicsId.length == models.length,
+                'parents and models must have the same size'
+            );
+
+            this.parent();
+            this._models = models;
+            this._parentsIds = parentTopicsId;
+        },
+
+        /**
+         * Overrides abstract parent method
+         */
+        execute: function (commandContext) {
+            var me = this;
+            _.each(this._models, function (model, index) {
+                // Add a new topic ...
+                var topic = commandContext.createTopic(model);
+
+                // Connect to topic ...
+                if (me._parentsIds) {
+                    var parentId = me._parentsIds[index];
+                    if ($defined(parentId)) {
+                        var parentTopic = commandContext.findTopics(parentId)[0];
+                        commandContext.connect(topic, parentTopic);
+                    }
+                } else {
+                    commandContext.addTopic(topic);
+                }
+
+                // Select just created node ...
+                var designer = commandContext._designer;
+                designer.onObjectFocusEvent(topic);
+                topic.setOnFocus(true);
+
+                // Render node ...
+                topic.setVisibility(true);
+            });
+        },
+
+        /**
+         * Overrides abstract parent method
+         * @see {@link mindplot.Command.undoExecute}
+         */
+        undoExecute: function (commandContext) {
+            // Delete disconnected the nodes. Create a copy of the topics ...
+            var clonedModel = [];
+            _.each(this._models, function (model) {
+                clonedModel.push(model.clone());
+            });
+
+            // Finally, remove the nodes ...
+            _.each(this._models, function (model) {
+                var topicId = model.getId();
+                var topic = commandContext.findTopics(topicId)[0];
+                commandContext.deleteTopic(topic);
+            });
+
+            this._models = clonedModel;
+        },
+    }
+);
+
+export default AddTopicCommand;

packages/mindplot/lib/components/commands/ChangeFeatureToTopicCommand.js

@@ -0,0 +1,64 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default
+
+const ChangeFeatureToTopicCommand = new Class(/** @lends ChangeFeatureToTopicCommand */{
+    Extends:Command,
+    /**
+     * @extends mindplot.Command
+     * @constructs
+     * @param topicId
+     * @param featureId
+     * @param attributes
+     * @throws will throw an error if topicId is null or undefined
+     * @throws will throw an error if featureId is null or undefined
+     * @throws will throw an error if attributes is null or undefined
+     */
+    initialize: function(topicId, featureId, attributes) {
+        $assert($defined(topicId), 'topicId can not be null');
+        $assert($defined(featureId), 'featureId can not be null');
+        $assert($defined(attributes), 'attributes can not be null');
+
+        this.parent();
+        this._topicId = topicId;
+        this._featureId = featureId;
+        this._attributes = attributes;
+    },
+
+    /** 
+     * Overrides abstract parent method
+     */
+    execute: function(commandContext) {
+        var topic = commandContext.findTopics(this._topicId)[0];
+        var feature = topic.findFeatureById(this._featureId);
+
+        var oldAttributes = feature.getAttributes();
+        feature.setAttributes(this._attributes);
+        this._attributes = oldAttributes;
+    },
+
+    /** 
+     * Overrides abstract parent method
+     * @see {@link mindplot.Command.undoExecute}
+     */
+    undoExecute: function(commandContext) {
+        this.execute(commandContext);
+    }
+});
+
+export default ChangeFeatureToTopicCommand;

packages/mindplot/lib/components/commands/DeleteCommand.js

@@ -0,0 +1,186 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default;
+
+const DeleteCommand = new Class(/** @lends mindplot.commands.DeleteCommand */{
+    Extends:Command,
+    /** 
+     * @classdesc This command class handles do/undo of deleting a topic.
+     * @constructs
+     * @param {Array<String>} topicIds ids of the topics to delete
+     * @param {Array<String>} relIds ids of the relationships connected to the topics
+     * @extends mindplot.Command
+     */
+    initialize:function (topicIds, relIds) {
+        $assert($defined(relIds), 'topicIds can not be null');
+
+        this.parent();
+        this._relIds = relIds;
+        this._topicIds = topicIds;
+        this._deletedTopicModels = [];
+        this._deletedRelModel = [];
+        this._parentTopicIds = [];
+    },
+
+    /** 
+     * Overrides abstract parent method 
+     */
+    execute:function (commandContext) {
+
+        // If a parent has been selected for deletion, the children must be excluded from the delete ...
+        var topics = this._filterChildren(this._topicIds, commandContext);
+
+        if (topics.length > 0) {
+            _.each(topics, function (topic) {
+                // In case that it's editing text node, force close without update ...
+                topic.closeEditors();
+
+                var model = topic.getModel();
+
+                // Delete relationships
+                var relationships = this._collectInDepthRelationships(topic);
+                this._deletedRelModel.append(relationships.map(function (rel) {
+                    return rel.getModel().clone();
+                }));
+
+                _.each(relationships, function (relationship) {
+                    commandContext.deleteRelationship(relationship);
+                });
+
+                // Store information for undo ...
+                var clonedModel = model.clone();
+                this._deletedTopicModels.push(clonedModel);
+                var outTopic = topic.getOutgoingConnectedTopic();
+                var outTopicId = null;
+                if (outTopic != null) {
+                    outTopicId = outTopic.getId();
+                }
+                this._parentTopicIds.push(outTopicId);
+
+                // Finally, delete the topic from the workspace...
+                commandContext.deleteTopic(topic);
+
+            }, this);
+        }
+
+        var rels = commandContext.findRelationships(this._relIds);
+        if (rels.length > 0) {
+            _.each(rels, function (rel) {
+                this._deletedRelModel.push(rel.getModel().clone());
+                commandContext.deleteRelationship(rel);
+            }, this);
+        }
+    },
+
+    /** 
+     * Overrides abstract parent method
+     * @see {@link mindplot.Command.undoExecute} 
+     */
+    undoExecute:function (commandContext) {
+
+        // Add all the topics ...
+        _.each(this._deletedTopicModels, function (model) {
+            commandContext.createTopic(model);
+        }, this);
+
+        // Do they need to be connected ?
+        _.each(this._deletedTopicModels, function (topicModel, index) {
+            var topics = commandContext.findTopics(topicModel.getId());
+
+            var parentId = this._parentTopicIds[index];
+            if (parentId) {
+                var parentTopics = commandContext.findTopics(parentId);
+                commandContext.connect(topics[0], parentTopics[0]);
+            }
+        }, this);
+
+        // Add rebuild relationships ...
+        _.each(this._deletedRelModel, function (model) {
+            commandContext.addRelationship(model);
+        });
+
+        // Finally display the topics ...
+        _.each(this._deletedTopicModels, function (topicModel) {
+            var topics = commandContext.findTopics(topicModel.getId());
+            topics[0].setBranchVisibility(true);
+        }, this);
+
+        // Focus on last recovered topic ..
+        if (this._deletedTopicModels.length > 0) {
+            var firstTopic = this._deletedTopicModels[0];
+            var topic = commandContext.findTopics(firstTopic.getId())[0];
+            topic.setOnFocus(true);
+        }
+
+        this._deletedTopicModels = [];
+        this._parentTopicIds = [];
+        this._deletedRelModel = [];
+    },
+
+    _filterChildren:function (topicIds, commandContext) {
+        var topics = commandContext.findTopics(topicIds);
+
+        var result = [];
+        _.each(topics, function (topic) {
+            var parent = topic.getParent();
+            var found = false;
+            while (parent != null && !found) {
+                found = topicIds.contains(parent.getId());
+                if (found) {
+                    break;
+                }
+                parent = parent.getParent();
+            }
+
+            if (!found) {
+                result.push(topic);
+            }
+        });
+
+        return result;
+    },
+
+    _collectInDepthRelationships:function (topic) {
+        var result = [];
+        result.append(topic.getRelationships());
+
+        var children = topic.getChildren();
+        var rels = children.map(function (topic) {
+            return this._collectInDepthRelationships(topic);
+        }, this);
+        result.append(rels.flatten());
+
+        if (result.length > 0) {
+            // Filter for unique ...
+            result = result.sort(function (a, b) {
+                return a.getModel().getId() - b.getModel().getId();
+            });
+            var ret = [result[0]];
+            for (var i = 1; i < result.length; i++) { // start loop at 1 as element 0 can never be a duplicate
+                if (result[i - 1] !== result[i]) {
+                    ret.push(result[i]);
+                }
+            }
+            result = ret;
+        }
+        return result;
+    }
+
+});
+
+export default DeleteCommand;

packages/mindplot/lib/components/commands/DragTopicCommand.js

@@ -0,0 +1,103 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default
+
+const DragTopicCommand = new Class(/** @lends DragTopicCommand */{
+    Extends:Command,
+    /** 
+     * @classdesc This command class handles do/undo of dragging a topic to a new position.
+     * @constructs
+     * @param {String} topicId id of the topic to drag
+     * @param {Object} position
+     * @param {Number} order the order property (children of one node are displayed in order from 0 to n)
+     * @param {mindplot.Topic} parentTopic the topic to be made the dragged topic's new parent
+     * @extends mindplot.Command
+     */
+    initialize:function (topicId, position, order, parentTopic) {
+        $assert(topicId, "topicId must be defined");
+
+        this._topicsId = topicId;
+        if ($defined(parentTopic))
+            this._parentId = parentTopic.getId();
+
+        this.parent();
+        this._position = position;
+        this._order = order;
+    },
+
+    /** 
+     * Overrides abstract parent method 
+     */
+    execute:function (commandContext) {
+
+        var topic = commandContext.findTopics(this._topicsId)[0];
+        topic.setVisibility(false);
+
+        // Save old position ...
+        var origParentTopic = topic.getOutgoingConnectedTopic();
+
+        // In this case, topics are positioned using order ...
+        var origOrder = topic.getOrder();
+        var origPosition = topic.getPosition();
+
+        // Disconnect topic ..
+        if ($defined(origParentTopic) && origParentTopic != this._parentId) {
+            commandContext.disconnect(topic);
+        }
+
+        // Set topic order ...
+        if (this._order != null) {
+            topic.setOrder(this._order);
+        } else if (this._position != null) {
+            commandContext.moveTopic(topic, this._position);
+        } else {
+            $assert("Illegal command state exception.");
+        }
+
+        // Finally, connect topic ...
+        if (origParentTopic != this._parentId) {
+
+            if ($defined(this._parentId)) {
+                var parentTopic = commandContext.findTopics(this._parentId)[0];
+                commandContext.connect(topic, parentTopic);
+            }
+
+            // Backup old parent id ...
+            this._parentId = null;
+            if ($defined(origParentTopic)) {
+                this._parentId = origParentTopic.getId();
+            }
+        }
+        topic.setVisibility(true);
+
+        // Store for undo ...
+        this._order = origOrder;
+        this._position = origPosition;
+
+    },
+
+    /** 
+     * Overrides abstract parent method
+     * @see {@link mindplot.Command.undoExecute} 
+     */
+    undoExecute:function (commandContext) {
+        this.execute(commandContext);
+    }
+});
+
+export default DragTopicCommand;

packages/mindplot/lib/components/commands/GenericFunctionCommand.js

@@ -0,0 +1,99 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default
+
+const GenericFunctionCommand = new Class(/** @lends GenericFunctionCommand */{
+    Extends:Command,
+    /**
+     * @classdesc This command handles do/undo of different actions, e.g. moving topics to 
+     * a different position, changing text or font,... (for full reference check the 
+     * StandaloneActionDispatcher i.e. the ActionDispatcher subclass in use)
+     * @constructs
+     * @param {Function} commandFunc the function the command shall execute
+     * @param {String|Array<String>} topicsIds the ids of the topics affected
+     * @param {Object} [value] value arbitrary value necessary for the execution of the function,
+     * e.g. color, font family or text
+     * @extends mindplot.Command
+     */
+    initialize:function (commandFunc, topicsIds, value) {
+        $assert(commandFunc, "commandFunc must be defined");
+        $assert($defined(topicsIds), "topicsIds must be defined");
+
+        this.parent();
+        this._value = value;
+        this._topicsId = topicsIds;
+        this._commandFunc = commandFunc;
+        this._oldValues = [];
+    },
+
+    /** 
+     * Overrides abstract parent method 
+     */
+    execute:function (commandContext) {
+        if (!this.applied) {
+
+            var topics = null;
+            try {
+                topics = commandContext.findTopics(this._topicsId);
+            } catch (e) {
+                if (this._commandFunc.commandType != "changeTextToTopic") {
+                    // Workaround: For some reason, there is a combination of events that involves
+                    // making some modification and firing out of focus event. This is causing
+                    // that a remove node try to be removed.  In some other life, I will come with the solution.
+                    // Almost aways occurs with IE9. I could be related with some change of order in sets o something similar.
+                    throw  e;
+                }
+            }
+
+            if (topics != null) {
+                var me = this;
+                _.each(topics, function (topic) {
+                    var oldValue = me._commandFunc(topic, me._value);
+                    me._oldValues.push(oldValue);
+                });
+            }
+            this.applied = true;
+
+        } else {
+            throw "Command can not be applied two times in a row.";
+        }
+
+    },
+
+    /** 
+     * Overrides abstract parent method
+     * @see {@link mindplot.Command.undoExecute} 
+     */
+    undoExecute:function (commandContext) {
+        if (this.applied) {
+            var topics = commandContext.findTopics(this._topicsId);
+            var me = this;
+            _.each(topics, function (topic, index) {
+                me._commandFunc(topic, me._oldValues[index]);
+
+            });
+
+            this.applied = false;
+            this._oldValues = [];
+        } else {
+            throw "undo can not be applied.";
+        }
+    }
+});
+
+export default GenericFunctionCommand

packages/mindplot/lib/components/commands/MoveControlPointCommand.js

@@ -0,0 +1,119 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default;
+
+const MoveControlPointCommand = new Class(
+    /** @lends MoveControlPointCommand */ {
+        Extends: Command,
+        /**
+         * @classdesc This command handles do/undo of changing the control points of a relationship
+         * arrow. These are the two points that appear when the relationship is on focus. They
+         * influence how the arrow is drawn (not the source or the destination topic nor the arrow
+         * direction)
+         * @constructs
+         * @param {ControlPoint} ctrlPointController
+         * @param {Number} point 0 for the destination control point, 1 for the source control point
+         * @param ctrlPointController {ControlPoint}
+         * @param point {Number} 0 for the destination control point, 1 for the source control point
+         */
+        initialize: function (ctrlPointController, point) {
+            $assert(ctrlPointController, 'line can not be null');
+            $assert($defined(point), 'point can not be null');
+
+            this.parent();
+            this._ctrlPointControler = ctrlPointController;
+            this._line = ctrlPointController._line;
+            this._controlPoint = this._ctrlPointControler.getControlPoint(point).clone();
+            this._oldControlPoint = this._ctrlPointControler.getOriginalCtrlPoint(point).clone();
+            this._originalEndPoint = this._ctrlPointControler.getOriginalEndPoint(point).clone();
+            switch (point) {
+                case 0:
+                    this._wasCustom = this._line.getLine().isSrcControlPointCustom();
+                    this._endPoint = this._line.getLine().getFrom().clone();
+                    break;
+                case 1:
+                    this._wasCustom = this._line.getLine().isDestControlPointCustom();
+                    this._endPoint = this._line.getLine().getTo().clone();
+                    break;
+            }
+            this._point = point;
+        },
+
+        /**
+         * Overrides abstract parent method
+         */
+        execute: function (commandContext) {
+            var model = this._line.getModel();
+            switch (this._point) {
+                case 0:
+                    model.setSrcCtrlPoint(this._controlPoint.clone());
+                    this._line.setFrom(this._endPoint.x, this._endPoint.y);
+                    this._line.setIsSrcControlPointCustom(true);
+                    this._line.setSrcControlPoint(this._controlPoint.clone());
+                    break;
+                case 1:
+                    model.setDestCtrlPoint(this._controlPoint.clone());
+                    this._wasCustom = this._line.getLine().isDestControlPointCustom();
+                    this._line.setTo(this._endPoint.x, this._endPoint.y);
+                    this._line.setIsDestControlPointCustom(true);
+                    this._line.setDestControlPoint(this._controlPoint.clone());
+                    break;
+            }
+            if (this._line.isOnFocus()) {
+                this._line._refreshShape();
+                this._ctrlPointControler.setLine(this._line);
+            }
+            this._line.getLine().updateLine(this._point);
+        },
+
+        /**
+         * Overrides abstract parent method
+         * @see {@link mindplot.Command.undoExecute}
+         */
+        undoExecute: function (commandContext) {
+            var line = this._line;
+            var model = line.getModel();
+            switch (this._point) {
+                case 0:
+                    if ($defined(this._oldControlPoint)) {
+                        line.setFrom(this._originalEndPoint.x, this._originalEndPoint.y);
+                        model.setSrcCtrlPoint(this._oldControlPoint.clone());
+                        line.setSrcControlPoint(this._oldControlPoint.clone());
+                        line.setIsSrcControlPointCustom(this._wasCustom);
+                    }
+                    break;
+                case 1:
+                    if ($defined(this._oldControlPoint)) {
+                        line.setTo(this._originalEndPoint.x, this._originalEndPoint.y);
+                        model.setDestCtrlPoint(this._oldControlPoint.clone());
+                        line.setDestControlPoint(this._oldControlPoint.clone());
+                        line.setIsDestControlPointCustom(this._wasCustom);
+                    }
+                    break;
+            }
+            this._line.getLine().updateLine(this._point);
+            if (this._line.isOnFocus()) {
+                this._ctrlPointControler.setLine(line);
+                line._refreshShape();
+            }
+        },
+    }
+);
+
+export default MoveControlPointCommand;
+

packages/mindplot/lib/components/commands/RemoveFeatureFromTopicCommand.js

@@ -0,0 +1,61 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Command = require('../Command').default;
+
+const RemoveFeatureFromTopicCommand = new Class(/**@lends RemoveFeatureFromTopicCommand */{
+    Extends:Command,
+    /**
+     * @classdesc This command handles do/undo of removing a feature from a topic, e.g. an icon or 
+     * a note. For a reference of existing features, refer to {@link mindplot.TopicFeature}.
+     * @constructs
+     * @param {String} topicId id of the topic to remove the feature from
+     * @param {String} featureId id of the feature to remove
+     * @extends mindplot.Command
+     */
+    initialize:function (topicId, featureId) {
+        $assert($defined(topicId), 'topicId can not be null');
+        $assert(featureId, 'iconModel can not be null');
+
+        this.parent();
+        this._topicId = topicId;
+        this._featureId = featureId;
+        this._oldFeature = null;
+    },
+
+    /** 
+     * Overrides abstract parent method 
+     */
+    execute:function (commandContext) {
+        var topic = commandContext.findTopics(this._topicId)[0];
+        var feature = topic.findFeatureById(this._featureId);
+        topic.removeFeature(feature);
+        this._oldFeature = feature;
+    },
+
+    /** 
+     * Overrides abstract parent method
+     * @see {@link mindplot.Command.undoExecute} 
+     */
+    undoExecute:function (commandContext) {
+        var topic = commandContext.findTopics(this._topicId)[0];
+        topic.addFeature(this._oldFeature);
+        this._oldFeature = null;
+    }
+});
+
+export default RemoveFeatureFromTopicCommand;

packages/mindplot/lib/components/footer.js

@@ -0,0 +1,5 @@
+try {
+    $(document).trigger('loadcomplete', 'mind');
+} catch (e) {
+    console.error(e.stack);
+}

packages/mindplot/lib/components/header.js

@@ -0,0 +1,35 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+var mindplot = {};
+mindplot.util = {};
+mindplot.commands = {};
+mindplot.layout = {};
+mindplot.layout.boards = {};
+mindplot.layout.boards.original = {};
+mindplot.widget = {};
+mindplot.model = {};
+mindplot.collaboration = {};
+mindplot.collaboration.framework = {};
+mindplot.persistence = {};
+
+mindplot.layout = {};
+
+Class.Mutators.Static = function (items) {
+    this.extend(items);
+};

packages/mindplot/lib/components/layout/AbstractBasicSorter.js

@@ -0,0 +1,93 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const ChildrenSorterStrategy = require('./ChildrenSorterStrategy').default
+
+/**
+ * @class
+ * @extends mindplot.layout.ChildrenSorterStrategy
+ */
+const AbstractBasicSorter = new Class(/** @lends AbstractBasicSorter */{
+    Extends: ChildrenSorterStrategy,
+
+    /**
+     * @param {} treeSet
+     * @param {} node
+     * @return the height of a node and its children if existing and not shrunken
+     */
+    computeChildrenIdByHeights: function(treeSet, node) {
+        var result = {};
+        this._computeChildrenHeight(treeSet, node, result);
+        return result;
+    },
+
+    _getVerticalPadding: function() {
+        return AbstractBasicSorter.INTERNODE_VERTICAL_PADDING;
+    },
+
+    _computeChildrenHeight : function(treeSet, node, heightCache) {
+        var height = node.getSize().height + (this._getVerticalPadding() * 2); // 2* Top and down padding;
+
+        var result;
+        var children = treeSet.getChildren(node);
+        if (children.length == 0 || node.areChildrenShrunken()) {
+            result = height;
+        } else {
+            var childrenHeight = 0;
+            _.each(children, function(child) {
+                childrenHeight += this._computeChildrenHeight(treeSet, child, heightCache);
+            }, this);
+
+            result = Math.max(height, childrenHeight);
+        }
+
+        if (heightCache) {
+            heightCache[node.getId()] = result;
+        }
+
+        return result;
+    },
+
+    _getSortedChildren:function(treeSet, node) {
+        var result = treeSet.getChildren(node);
+        result.sort(function(a, b) {
+            return a.getOrder() - b.getOrder()
+        });
+        return result;
+    },
+
+    _getRelativeDirection: function(reference, position) {
+        var offset = position.x - reference.x;
+        return offset >= 0 ? 1 : -1;
+    }
+
+});
+
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+AbstractBasicSorter.INTERNODE_VERTICAL_PADDING = 5;
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+AbstractBasicSorter.INTERNODE_HORIZONTAL_PADDING = 30;
+
+export default AbstractBasicSorter;

packages/mindplot/lib/components/layout/BalancedSorter.js

@@ -0,0 +1,278 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const AbstractBasicSorter = require('./AbstractBasicSorter').default;
+
+const BalancedSorter = new Class(/** @lends BalancedSorter */{
+    Extends:AbstractBasicSorter,
+    /** 
+     * @constructs
+     * @extends mindplot.layout.AbstractBasicSorter
+     */
+    initialize:function () {
+
+    },
+
+    /**
+     * @param {} graph
+     * @param {} parent
+     * @param {} node
+     * @param {} position
+     * @param {Boolean} free
+     * @return an array with order and position
+     */
+    predict:function (graph, parent, node, position, free) {
+        // If its a free node...
+        if (free) {
+            $assert($defined(position), "position cannot be null for predict in free positioning");
+            $assert($defined(node), "node cannot be null for predict in free positioning");
+
+            var rootNode = graph.getRootNode(parent);
+            var direction = this._getRelativeDirection(rootNode.getPosition(), node.getPosition());
+
+            var limitXPos = parent.getPosition().x + direction * (parent.getSize().width / 2 + node.getSize().width / 2 + BalancedSorter.INTERNODE_HORIZONTAL_PADDING);
+
+            var xPos = direction > 0 ?
+                (position.x >= limitXPos ? position.x : limitXPos) :
+                (position.x <= limitXPos ? position.x : limitXPos);
+
+            return [0, {x:xPos, y:position.y}];
+        }
+
+        var rootNode = graph.getRootNode(parent);
+
+        // If it is a dragged node...
+        if (node) {
+            $assert($defined(position), "position cannot be null for predict in dragging");
+            var nodeDirection = this._getRelativeDirection(rootNode.getPosition(), node.getPosition());
+            var positionDirection = this._getRelativeDirection(rootNode.getPosition(), position);
+            var siblings = graph.getSiblings(node);
+
+            var sameParent = parent == graph.getParent(node);
+            if (siblings.length == 0 && nodeDirection == positionDirection && sameParent) {
+                return [node.getOrder(), node.getPosition()];
+            }
+        }
+
+        if (!position) {
+            var right = this._getChildrenForOrder(parent, graph, 0);
+            var left = this._getChildrenForOrder(parent, graph, 1);
+        }
+        // Filter nodes on one side..
+        var order = position ? (position.x > rootNode.getPosition().x ? 0 : 1) : ((right.length - left.length) > 0 ? 1 : 0);
+        var direction = order % 2 == 0 ? 1 : -1;
+
+        // Exclude the dragged node (if set)
+        var children = this._getChildrenForOrder(parent, graph, order).filter(function (child) {
+            return child != node;
+        });
+
+        // No children?
+        if (children.length == 0) {
+            return [order, {x:parent.getPosition().x + direction * (parent.getSize().width / 2 + BalancedSorter.INTERNODE_HORIZONTAL_PADDING * 2), y:parent.getPosition().y}];
+        }
+
+        // Try to fit within ...
+        var result = null;
+        var last = children.getLast();
+        position = position || {x:last.getPosition().x, y:last.getPosition().y + 1};
+        _.each(children, function (child, index) {
+            var cpos = child.getPosition();
+            if (position.y > cpos.y) {
+                yOffset = child == last ?
+                    child.getSize().height + BalancedSorter.INTERNODE_VERTICAL_PADDING * 2 :
+                    (children[index + 1].getPosition().y - child.getPosition().y) / 2;
+                result = [child.getOrder() + 2, {x:cpos.x, y:cpos.y + yOffset}];
+            }
+        });
+
+        // Position wasn't below any node, so it must be inserted above
+        if (!result) {
+            var first = children[0];
+            result = [position.x > 0 ? 0 : 1, {
+                x:first.getPosition().x,
+                y:first.getPosition().y - first.getSize().height - BalancedSorter.INTERNODE_VERTICAL_PADDING * 2
+            }];
+        }
+
+        return result;
+    },
+
+    /**
+     * @param {} treeSet
+     * @param {} parent
+     * @param {} child
+     * @param {} order
+     */
+    insert:function (treeSet, parent, child, order) {
+        var children = this._getChildrenForOrder(parent, treeSet, order);
+
+        // If no children, return 0 or 1 depending on the side
+        if (children.length == 0) {
+            child.setOrder(order % 2);
+            return;
+        }
+
+        // Shift all the elements by two, so side is the same.
+        // In case of balanced sorter, order don't need to be continuous...
+        var max = 0;
+        for (var i = 0; i < children.length; i++) {
+            var node = children[i];
+            max = Math.max(max, node.getOrder());
+            if (node.getOrder() >= order) {
+                max = Math.max(max, node.getOrder() + 2);
+                node.setOrder(node.getOrder() + 2);
+            }
+        }
+
+        var newOrder = order > (max + 1) ? (max + 2) : order;
+        child.setOrder(newOrder);
+    },
+
+    /**
+     * @param {} treeSet
+     * @param {} node
+     */
+    detach:function (treeSet, node) {
+        var parent = treeSet.getParent(node);
+        // Filter nodes on one side..
+        var children = this._getChildrenForOrder(parent, treeSet, node.getOrder());
+
+        _.each(children, function (child, index) {
+            if (child.getOrder() > node.getOrder()) {
+                child.setOrder(child.getOrder() - 2);
+            }
+        });
+        node.setOrder(node.getOrder() % 2 == 0 ? 0 : 1);
+    },
+
+    /**
+     * @param {} treeSet
+     * @param {} node
+     * @return offsets
+     */
+    computeOffsets:function (treeSet, node) {
+        $assert(treeSet, "treeSet can no be null.");
+        $assert(node, "node can no be null.");
+
+        var children = this._getSortedChildren(treeSet, node);
+
+        // Compute heights ...
+        var heights = children.map(
+            function (child) {
+                return {id:child.getId(), order:child.getOrder(), width:child.getSize().width, height:this._computeChildrenHeight(treeSet, child)};
+            }, this).reverse();
+
+
+        // Compute the center of the branch ...
+        var totalPHeight = 0;
+        var totalNHeight = 0;
+
+        _.each(heights, function (elem) {
+            if (elem.order % 2 == 0) {
+                totalPHeight += elem.height;
+            } else {
+                totalNHeight += elem.height;
+            }
+        });
+        var psum = totalPHeight / 2;
+        var nsum = totalNHeight / 2;
+        var ysum = 0;
+
+        // Calculate the offsets ...
+        var result = {};
+        for (var i = 0; i < heights.length; i++) {
+            var direction = heights[i].order % 2 ? -1 : 1;
+
+            if (direction > 0) {
+                psum = psum - heights[i].height;
+                ysum = psum;
+            } else {
+                nsum = nsum - heights[i].height;
+                ysum = nsum;
+            }
+
+            var yOffset = ysum + heights[i].height / 2;
+            var xOffset = direction * (node.getSize().width / 2 + heights[i].width / 2 + +BalancedSorter.INTERNODE_HORIZONTAL_PADDING);
+
+            $assert(!isNaN(xOffset), "xOffset can not be null");
+            $assert(!isNaN(yOffset), "yOffset can not be null");
+
+            result[heights[i].id] = {x:xOffset, y:yOffset};
+        }
+        return result;
+    },
+
+    /**
+     * @param {} treeSet
+     * @param {} node
+     * @throw will throw an error if order elements are missing
+     */
+    verify:function (treeSet, node) {
+        // Check that all is consistent ...
+        var children = this._getChildrenForOrder(node, treeSet, node.getOrder());
+
+        // All odd ordered nodes should be "continuous" by themselves
+        // All even numbered nodes should be "continuous" by themselves
+        var factor = node.getOrder() % 2 == 0 ? 2 : 1;
+        for (var i = 0; i < children.length; i++) {
+            var order = i == 0 && factor == 1 ? 1 : (factor * i);
+            $assert(children[i].getOrder() == order, "Missing order elements. Missing order: " + (i * factor) + ". Parent:" + node.getId() + ",Node:" + children[i].getId());
+        }
+    },
+
+    /**
+     * @param {} treeSet
+     * @param {} child
+     * @return the direction of the child within the treeSet 
+     */
+    getChildDirection:function (treeSet, child) {
+        return child.getOrder() % 2 == 0 ? 1 : -1;
+    },
+
+    /**
+     * @return {String} the print name of this class
+     */
+    toString:function () {
+        return "Balanced Sorter";
+    },
+
+    _getChildrenForOrder:function (parent, graph, order) {
+        return this._getSortedChildren(graph, parent).filter(function (child) {
+            return child.getOrder() % 2 == order % 2;
+        });
+    },
+
+    _getVerticalPadding:function () {
+        return BalancedSorter.INTERNODE_VERTICAL_PADDING;
+    }
+});
+
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+BalancedSorter.INTERNODE_VERTICAL_PADDING = 5;
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+BalancedSorter.INTERNODE_HORIZONTAL_PADDING = 30;
+
+export default BalancedSorter;

packages/mindplot/lib/components/layout/ChangeEvent.js

@@ -0,0 +1,70 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const ChangeEvent = new Class(/** @lends ChangeEvent */{
+    /** 
+     * @constructs
+     * @param {} id
+     * @throws will throw an error if the given id is not/cannot be converted to a numerical value
+     */
+    initialize:function(id) {
+        $assert(!isNaN(id), "id can not be null");
+        this._id = id;
+        this._position = null;
+        this._order = null;
+    },
+
+    /** @return id */
+    getId:function() {
+        return this._id;
+    },
+
+    /** @return order */
+    getOrder: function() {
+        return this._order;
+    },
+
+    /** @return position */
+    getPosition: function() {
+        return this._position;
+    },
+
+    /** 
+     * @param {} value the order to set 
+     * @throws will throw an error if the given parameter is not/cannot be converted to a numerical
+     * value
+     */
+    setOrder: function(value) {
+        $assert(!isNaN(value), "value can not be null");
+        this._order = value;
+    },
+
+    /** @param {} value
+     *  @throws will throw an error if the value is null or undefined*/
+    setPosition: function(value) {
+        $assert(value, "value can not be null");
+        this._position = value;
+    },
+
+    /** @return {String} order and position */
+    toString: function() {
+        return "[order:" + this.getOrder() + ", position: {" + this.getPosition().x + "," + this.getPosition().y + "}]";
+    }
+});
+
+export default ChangeEvent;

packages/mindplot/lib/components/layout/ChildrenSorterStrategy.js

@@ -0,0 +1,69 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const ChildrenSorterStrategy = new Class(/** @lends ChildrenSorterStrategy */{
+    /** 
+     * @constructs
+     */
+    initialize:function() {
+
+    },
+
+    /** @abstract */
+    computeChildrenIdByHeights: function(treeSet, node) {
+        throw "Method must be implemented";
+    },
+
+    /** @abstract */
+    computeOffsets:function(treeSet, node) {
+        throw "Method must be implemented";
+    },
+
+    /** @abstract */
+    insert: function(treeSet, parent, child, order) {
+        throw "Method must be implemented";
+    },
+
+    /** @abstract */
+    detach:function(treeSet, node) {
+        throw "Method must be implemented";
+    },
+
+    /** @abstract */
+    predict:function(treeSet, parent, node, position, free) {
+        throw "Method must be implemented";
+    },
+
+    /** @abstract */
+    verify:function(treeSet, node) {
+        throw "Method must be implemented";
+    },
+
+    /** @abstract */
+    getChildDirection: function(treeSet, node) {
+        throw "Method must be implemented";
+    },
+
+    /** @abstract */
+    toString:function() {
+        throw "Method must be implemented: print name";
+    }
+
+});
+
+export default ChildrenSorterStrategy

packages/mindplot/lib/components/layout/EventBus.js

@@ -0,0 +1,48 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Events = require('../Events').default;
+
+const EventBus = new Class(/** @lends EventBus */{
+    Implements: Events,
+    /**
+     * @constructs
+     * @implements mindplot.Events
+     */
+    initialize: function() {
+    }
+});
+
+/**
+ * Enum for events
+ * @enum {String}
+ */
+EventBus.events = {
+    NodeResizeEvent:'NodeResizeEvent',
+    NodeMoveEvent:'NodeMoveEvent',
+    NodeShrinkEvent:'NodeShrinkEvent',
+    NodeConnectEvent:'NodeConnectEvent',
+    NodeDisconnectEvent:'NodeDisconnectEvent',
+    NodeAdded:'NodeAdded',
+    NodeRemoved:'NodeRemoved',
+    DoLayout:'DoLayout'
+};
+
+/** instance */
+EventBus.instance = new EventBus();
+
+export default EventBus;

packages/mindplot/lib/components/layout/EventBusDispatcher.js

@@ -0,0 +1,99 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const EventBus = require('./EventBus').default
+
+const EventBusDispatcher = new Class(/** @lends EventBusDispatcher */{
+    /**
+     * @constructs
+     */
+    initialize:function() {
+        this.registerBusEvents();
+    },
+
+    /**
+     * @param {mindplot.layout.LayoutManager} layoutManager
+     */
+    setLayoutManager : function(layoutManager) {
+        this._layoutManager = layoutManager;
+    },
+
+    /**
+     * register bus events
+     */
+    registerBusEvents:function () {
+        EventBus.instance.addEvent(EventBus.events.NodeAdded, this._nodeAdded.bind(this));
+        EventBus.instance.addEvent(EventBus.events.NodeRemoved, this._nodeRemoved.bind(this));
+        EventBus.instance.addEvent(EventBus.events.NodeResizeEvent, this._nodeResizeEvent.bind(this));
+        EventBus.instance.addEvent(EventBus.events.NodeMoveEvent, this._nodeMoveEvent.bind(this));
+        EventBus.instance.addEvent(EventBus.events.NodeDisconnectEvent, this._nodeDisconnectEvent.bind(this));
+        EventBus.instance.addEvent(EventBus.events.NodeConnectEvent, this._nodeConnectEvent.bind(this));
+        EventBus.instance.addEvent(EventBus.events.NodeShrinkEvent, this._nodeShrinkEvent.bind(this));
+        EventBus.instance.addEvent(EventBus.events.DoLayout, this._doLayout.bind(this));
+    },
+
+    _nodeResizeEvent: function(args) {
+        this._layoutManager.updateNodeSize(args.node.getId(), args.size);
+    },
+
+    _nodeMoveEvent: function(args) {
+        this._layoutManager.moveNode(args.node.getId(), args.position);
+    },
+
+    _nodeDisconnectEvent: function(node) {
+        this._layoutManager.disconnectNode(node.getId());
+    },
+
+    _nodeConnectEvent: function(args) {
+        this._layoutManager.connectNode(args.parentNode.getId(), args.childNode.getId(), args.childNode.getOrder());
+
+    },
+
+    _nodeShrinkEvent: function(node) {
+        this._layoutManager.updateShrinkState(node.getId(), node.areChildrenShrunken());
+    },
+
+    _nodeAdded: function(node) {
+        // Central topic must not be added twice ...
+        if (node.getId() != 0) {
+            this._layoutManager.addNode(node.getId(), {width:10,height:10}, node.getPosition());
+            this._layoutManager.updateShrinkState(node.getId(), node.areChildrenShrunken());
+        }
+    },
+
+    _nodeRemoved: function(node) {
+        this._layoutManager.removeNode(node.getId());
+    },
+
+    _doLayout: function() {
+//        (function() {
+        this._layoutManager.layout(true);
+//        console.log("---------");
+//        this._layoutManager.dump();
+//        console.log("---------");
+//        console.log("---------");
+//        }).delay(0, this);
+    },
+
+    /** @return layout manager */
+    getLayoutManager: function() {
+        return this._layoutManager;
+    }
+
+});
+
+export default EventBusDispatcher

packages/mindplot/lib/components/layout/GridSorter.js

@@ -0,0 +1,94 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const AbstractBasicSorter = require('./AbstractBasicSorter').default
+
+/**
+ * @class
+ * @extends mindplot.layout.AbstractBasicSorter
+ */
+const GridSorter = new Class(/** @lends GridSorter */{
+    Extends: AbstractBasicSorter,
+
+    /**
+     * @param {} treeSet
+     * @param {} node
+     * @return offsets
+     */
+    computeOffsets: function(treeSet, node) {
+        $assert(treeSet, "treeSet can no be null.");
+        $assert(node, "node can no be null.");
+        $assert("order can no be null.");
+
+        var children = this._getSortedChildren(treeSet, node);
+
+        // Compute heights ...
+        var me = this;
+        var heights = children.map(function(child) {
+            return {
+                id: child.getId(),
+                height: me._computeChildrenHeight(treeSet, child)
+            };
+        });
+
+        // Calculate the offsets ...
+        var result = {};
+        for (var i = 0; i < heights.length; i++) {
+            var even = i%2 == 0 ? 1 : -1;
+
+            var zeroHeight = i == 0 ? 0 : heights[0].height/2 * even;
+            var middleHeight = 0;
+            for (var j=i-2; j>0; j=j-2) {
+                middleHeight += heights[j].height * even;
+            }
+            var finalHeight = i == 0 ? 0 : heights[i].height/2 * even;
+
+            var yOffset = zeroHeight + middleHeight +finalHeight;
+            var xOffset = node.getSize().width + GridSorter.GRID_HORIZONTAR_SIZE;
+
+            $assert(!isNaN(xOffset), "xOffset can not be null");
+            $assert(!isNaN(yOffset), "yOffset can not be null");
+
+            result[heights[i].id] = {x:xOffset,y:yOffset};
+
+        }
+        return result;
+    },
+
+    /**
+     * @return {String} the print name of this class
+     */
+    toString:function() {
+        return "Grid Sorter";
+    }
+
+});
+
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+GridSorter.GRID_HORIZONTAR_SIZE = 20;
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+GridSorter.INTER_NODE_VERTICAL_DISTANCE = 50;
+
+export default GridSorter;

packages/mindplot/lib/components/layout/LayoutManager.js

@@ -0,0 +1,271 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Events = require('../Events').default
+const RootedTreeSet = require('./RootedTreeSet').default
+const OriginalLayout = require('./OriginalLayout').default
+const ChangeEvent = require('./ChangeEvent').default;
+
+const LayoutManager = new Class(/** @lends LayoutManager */{
+    Extends: Events,
+    /**
+     * @constructs
+     * @extends mindplot.Events
+     * @param {} rootNodeId
+     * @param {} rootSize
+     * @throws will throw an error if the root node id is null or undefined
+     * @throws will throw an error if the root size is null
+     */
+    initialize: function(rootNodeId, rootSize) {
+        $assert($defined(rootNodeId), "rootNodeId can not be null");
+        $assert(rootSize, "rootSize can not be null");
+        var position = position || {x:0, y:0};
+
+        this._treeSet = new RootedTreeSet();
+        this._layout = new OriginalLayout(this._treeSet);
+
+        var rootNode = this._layout.createNode(rootNodeId, rootSize, position, 'root');
+        this._treeSet.setRoot(rootNode);
+        this._events = [];
+    },
+
+    /**
+     * @param id
+     * @param size
+     * @throws will throw an error if id is null or undefined
+     */
+    updateNodeSize: function(id, size) {
+        $assert($defined(id), "id can not be null");
+
+        var node = this._treeSet.find(id);
+        node.setSize(size);
+    },
+
+    /**
+     * @param id
+     * @param value
+     * @throws will throw an error if id is null or undefined
+     * @throws will throw an error if value is null or undefined
+     * @return this
+     */
+    updateShrinkState: function(id, value) {
+        $assert($defined(id), "id can not be null");
+        $assert($defined(value), "value can not be null");
+
+        var node = this._treeSet.find(id);
+        node.setShrunken(value);
+
+        return this;
+    },
+
+    /**
+     * @param id
+     * @return {@link RootedTreeSet}.find(id)
+     */
+    find: function(id) {
+        return this._treeSet.find(id);
+    },
+
+    /**
+     * @param id
+     * @param position
+     * @throws will throw an error if id is null or undefined
+     * @throws will throw an error if position is null or undefined
+     * @throws will throw an error if the position's x property is null or undefined
+     * @throws will throw an error if the position's y property is null or undefined
+     */
+    moveNode: function(id, position) {
+        $assert($defined(id), "id cannot be null");
+        $assert($defined(position), "position cannot be null");
+        $assert($defined(position.x), "x can not be null");
+        $assert($defined(position.y), "y can not be null");
+
+        var node = this._treeSet.find(id);
+        // @Todo: this should not be here. This is broking the isolated node support...
+//        node.setFree(true);
+//        node.setFreeDisplacement({x:position.x - node.getPosition().x, y:position.y - node.getPosition().y});
+        node.setPosition(position);
+    },
+
+    /**
+     * @param parentId
+     * @param childId
+     * @param order
+     * @throws will throw an error if parentId is null or undefined
+     * @throws will throw an error if childId is null or undefined
+     * @throws will throw an error if order is null or undefined
+     * @return this
+     */
+    connectNode: function(parentId, childId, order) {
+        $assert($defined(parentId), "parentId cannot be null");
+        $assert($defined(childId), "childId cannot be null");
+        $assert($defined(order), "order cannot be null");
+
+        this._layout.connectNode(parentId, childId, order);
+
+        return this;
+    },
+
+    /**
+     * @param id
+     * @throws will throw an error if id is null or undefined
+     * @return this
+     */
+    disconnectNode: function(id) {
+        $assert($defined(id), "id can not be null");
+        this._layout.disconnectNode(id);
+
+        return this;
+    },
+
+    /**
+     * @param id
+     * @param size
+     * @param position
+     * @throws will throw an error if id is null or undefined
+     * @return this
+     */
+    addNode:function(id, size, position) {
+        $assert($defined(id), "id can not be null");
+        var result = this._layout.createNode(id, size, position, 'topic');
+        this._treeSet.add(result);
+
+        return this;
+    },
+
+    /**
+     * removes a node and its connection to parent if existing
+     * @param id
+     * @throws will throw an error if id is null or undefined
+     * @return this
+     */
+    removeNode: function(id) {
+        $assert($defined(id), "id can not be null");
+        var node = this._treeSet.find(id);
+
+        // Is It connected ?
+        if (this._treeSet.getParent(node)) {
+            this.disconnectNode(id);
+        }
+
+        // Remove the all the branch ...
+        this._treeSet.remove(id);
+
+        return this;
+    },
+
+    /**
+     * @param {Number} parentId
+     * @param {Number=} nodeId
+     * @param {String=} position the position to use as mindplot.layout.Node.properties position
+     * property as '(x,y)'
+     * @param {Boolean=} free true specifies free node positioning
+     * @throws will throw an error if parentId is null or undefined
+     */
+    predict: function(parentId, nodeId, position, free) {
+        $assert($defined(parentId), "parentId can not be null");
+
+        var parent = this._treeSet.find(parentId);
+        var node = nodeId ? this._treeSet.find(nodeId) : null;
+        var sorter = parent.getSorter();
+
+        var result = sorter.predict(this._treeSet, parent, node, position, free);
+        return {order:result[0],position:result[1]};
+    },
+
+    /**
+     * logs dump to console
+     */
+    dump: function() {
+        console.log(this._treeSet.dump());
+    },
+
+    /**
+     * @param containerId
+     * @param {width:Number, height:Number} size
+     * @throws will throw an error if containerId is null or undefined
+     * @return canvas
+     */
+    plot: function(containerId, size) {
+        $assert(containerId, "containerId cannot be null");
+        size = size || {width:200,height:200};
+        var squaresize = 10;
+        var canvas = Raphael(containerId, size.width, size.height);
+        canvas.drawGrid(0, 0, size.width, size.height, size.width / squaresize, size.height / squaresize);
+        this._treeSet.plot(canvas);
+
+        return canvas;
+    },
+
+    /**
+     * initializes the layout to be updated
+     * @param fireEvents
+     * @return this
+     */
+    layout: function(fireEvents) {
+        // File repositioning ...
+        this._layout.layout();
+
+        // Collect changes ...
+        this._collectChanges();
+
+        if ($(fireEvents).length>0 || fireEvents) {
+            this._flushEvents();
+        }
+
+        return this;
+    },
+
+    _flushEvents: function() {
+        _.each(this._events, function(event) {
+            this.fireEvent('change', event);
+        }, this);
+        this._events = [];
+    },
+
+    _collectChanges: function(nodes) {
+        if (!nodes)
+            nodes = this._treeSet.getTreeRoots();
+
+        _.each(nodes, function(node) {
+            if (node.hasOrderChanged() || node.hasPositionChanged()) {
+
+                // Find or create a event ...
+                var id = node.getId();
+                var event = this._events.some(function(event) {
+                    return event.id == id;
+                });
+                if (!event) {
+                    event = new ChangeEvent(id);
+                }
+
+                // Update nodes ...
+                event.setOrder(node.getOrder());
+                event.setPosition(node.getPosition());
+
+                node.resetPositionState();
+                node.resetOrderState();
+                node.resetFreeState();
+                this._events.push(event);
+            }
+            this._collectChanges(this._treeSet.getChildren(node));
+        }, this);
+    }
+
+});
+
+export default LayoutManager;

packages/mindplot/lib/components/layout/Node.js

@@ -0,0 +1,222 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const Node = new Class(/** @lends Node */{
+    /**
+     * @constructs
+     * @param id
+     * @param size
+     * @param position
+     * @param sorter
+     * @throws will throw an error if id is not a finite number or is null or undefined
+     * @throws will throw an error if size is null or undefined
+     * @throws will throw an error if position is null or undefined
+     * @throws will throw an error if sorter is null or undefined
+     */
+    initialize:function (id, size, position, sorter) {
+        $assert(typeof id === 'number' && isFinite(id), "id can not be null");
+        $assert(size, "size can not be null");
+        $assert(position, "position can not be null");
+        $assert(sorter, "sorter can not be null");
+
+        this._id = id;
+        this._sorter = sorter;
+        this._properties = {};
+
+        this.setSize(size);
+        this.setPosition(position);
+        this.setShrunken(false);
+    },
+
+    /** */
+    getId:function () {
+        return this._id;
+    },
+
+    /** */
+    setFree:function (value) {
+        this._setProperty('free', value);
+    },
+
+    /** */
+    isFree:function () {
+        return this._getProperty('free');
+    },
+
+    /** */
+    hasFreeChanged:function () {
+        return this._isPropertyChanged('free');
+    },
+
+    /** */
+    hasFreeDisplacementChanged:function () {
+        return this._isPropertyChanged('freeDisplacement');
+    },
+
+    /** */
+    setShrunken:function (value) {
+        this._setProperty('shrink', value);
+    },
+
+    /** */
+    areChildrenShrunken:function () {
+        return this._getProperty('shrink');
+    },
+
+    /** */
+    setOrder:function (order) {
+        $assert(typeof order === 'number' && isFinite(order), "Order can not be null. Value:" + order);
+        this._setProperty('order', order);
+    },
+
+    /** */
+    resetPositionState:function () {
+        var prop = this._properties['position'];
+        if (prop) {
+            prop.hasChanged = false;
+        }
+    },
+
+    /** */
+    resetOrderState:function () {
+        var prop = this._properties['order'];
+        if (prop) {
+            prop.hasChanged = false;
+        }
+    },
+
+    /** */
+    resetFreeState:function () {
+        var prop = this._properties['freeDisplacement'];
+        if (prop) {
+            prop.hasChanged = false;
+        }
+    },
+
+    /** */
+    getOrder:function () {
+        return this._getProperty('order');
+    },
+
+    /** */
+    hasOrderChanged:function () {
+        return this._isPropertyChanged('order');
+    },
+
+    /** */
+    hasPositionChanged:function () {
+        return this._isPropertyChanged('position');
+    },
+
+    /** */
+    hasSizeChanged:function () {
+        return this._isPropertyChanged('size');
+    },
+
+    /** */
+    getPosition:function () {
+        return this._getProperty('position');
+    },
+
+    /** */
+    setSize:function (size) {
+        $assert($defined(size), "Size can not be null");
+        this._setProperty('size', Object.clone(size));
+    },
+
+    /** */
+    getSize:function () {
+        return this._getProperty('size');
+    },
+
+    /** */
+    setFreeDisplacement:function (displacement) {
+        $assert($defined(displacement), "Position can not be null");
+        $assert($defined(displacement.x), "x can not be null");
+        $assert($defined(displacement.y), "y can not be null");
+        var oldDisplacement = this.getFreeDisplacement();
+        var newDisplacement = {x:oldDisplacement.x + displacement.x, y:oldDisplacement.y + displacement.y};
+
+        this._setProperty('freeDisplacement', Object.clone(newDisplacement));
+    },
+
+    /** */
+    resetFreeDisplacement:function () {
+        this._setProperty('freeDisplacement', {x:0, y:0});
+    },
+
+    /** */
+    getFreeDisplacement:function () {
+        var freeDisplacement = this._getProperty('freeDisplacement');
+        return (freeDisplacement || {x:0, y:0});
+    },
+
+    /** */
+    setPosition:function (position) {
+        $assert($defined(position), "Position can not be null");
+        $assert($defined(position.x), "x can not be null");
+        $assert($defined(position.y), "y can not be null");
+
+        // This is a performance improvement to avoid movements that really could be avoided.
+        var currentPos = this.getPosition();
+        if (currentPos == null || Math.abs(currentPos.x - position.x) > 2 || Math.abs(currentPos.y - position.y) > 2)
+            this._setProperty('position', position);
+    },
+
+    _setProperty:function (key, value) {
+        var prop = this._properties[key];
+        if (!prop) {
+            prop = {
+                hasChanged:false,
+                value:null,
+                oldValue:null
+            };
+        }
+
+        // Only update if the property has changed ...
+        if (JSON.stringify(prop.value) != JSON.stringify(value)) {
+            prop.oldValue = prop.value;
+            prop.value = value;
+            prop.hasChanged = true;
+        }
+        this._properties[key] = prop;
+    },
+
+    _getProperty:function (key) {
+        var prop = this._properties[key];
+        return $defined(prop) ? prop.value : null;
+    },
+
+    _isPropertyChanged:function (key) {
+        var prop = this._properties[key];
+        return prop ? prop.hasChanged : false;
+    },
+
+    /** */
+    getSorter:function () {
+        return this._sorter;
+    },
+
+    /** @return {String} returns id, order, position, size and shrink information*/
+    toString:function () {
+        return "[id:" + this.getId() + ", order:" + this.getOrder() + ", position: {" + this.getPosition().x + "," + this.getPosition().y + "}, size: {" + this.getSize().width + "," + this.getSize().height + "}, shrink:" + this.areChildrenShrunken() + "]";
+    }
+
+});
+
+export default Node;

packages/mindplot/lib/components/layout/OriginalLayout.js

@@ -0,0 +1,258 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const Node = require('./Node').default;
+const SymmetricSorter = require('./SymmetricSorter').default
+const BalancedSorter = require('./BalancedSorter').default; 
+
+const OriginalLayout = new Class(/** @lends OriginalLayout */{
+    /**
+     * @constructs
+     * @param treeSet
+     */
+    initialize:function (treeSet) {
+        this._treeSet = treeSet;
+    },
+
+    /** */
+    createNode:function (id, size, position, type) {
+        $assert($defined(id), "id can not be null");
+        $assert(size, "size can not be null");
+        $assert(position, "position can not be null");
+        $assert(type, "type can not be null");
+
+        var strategy = type === 'root' ?
+            OriginalLayout.BALANCED_SORTER :
+            OriginalLayout.SYMMETRIC_SORTER;
+        return new Node(id, size, position, strategy);
+    },
+
+    /** */
+    connectNode:function (parentId, childId, order) {
+
+        var parent = this._treeSet.find(parentId);
+        var child = this._treeSet.find(childId);
+
+        // Insert the new node ...
+        var sorter = parent.getSorter();
+        sorter.insert(this._treeSet, parent, child, order);
+
+        // Connect the new node ...
+        this._treeSet.connect(parentId, childId);
+
+        // Fire a basic validation ...
+        sorter.verify(this._treeSet, parent);
+    },
+
+    /** */
+    disconnectNode:function (nodeId) {
+        var node = this._treeSet.find(nodeId);
+        var parent = this._treeSet.getParent(node);
+        $assert(parent, "Node already disconnected");
+
+        // Make it fixed
+        node.setFree(false);
+        node.resetFreeDisplacement();
+
+        // Remove from children list.
+        var sorter = parent.getSorter();
+        sorter.detach(this._treeSet, node);
+
+        // Disconnect the new node ...
+        this._treeSet.disconnect(nodeId);
+
+        // Fire a basic validation ...
+        parent.getSorter().verify(this._treeSet, parent);
+    },
+
+    /** */
+    layout:function () {
+        var roots = this._treeSet.getTreeRoots();
+        _.each(roots, function (node) {
+
+            // Calculate all node heights ...
+            var sorter = node.getSorter();
+
+            var heightById = sorter.computeChildrenIdByHeights(this._treeSet, node);
+
+            this._layoutChildren(node, heightById);
+
+            this._fixOverlapping(node, heightById);
+        }, this);
+    },
+
+    _layoutChildren:function (node, heightById) {
+
+        var nodeId = node.getId();
+        var children = this._treeSet.getChildren(node);
+        var parent = this._treeSet.getParent(node);
+        var childrenOrderMoved = children.some(function (child) {
+            return child.hasOrderChanged();
+        });
+        var childrenSizeChanged = children.some(function (child) {
+            return child.hasSizeChanged();
+        });
+
+        // If ether any of the nodes has been changed of position or the height of the children is not
+        // the same, children nodes must be repositioned ....
+        var newBranchHeight = heightById[nodeId];
+
+        var parentHeightChanged = $defined(parent) ? parent._heightChanged : false;
+        var heightChanged = node._branchHeight != newBranchHeight;
+        node._heightChanged = heightChanged || parentHeightChanged;
+
+        if (childrenOrderMoved || childrenSizeChanged || heightChanged || parentHeightChanged) {
+            var sorter = node.getSorter();
+            var offsetById = sorter.computeOffsets(this._treeSet, node);
+            var parentPosition = node.getPosition();
+            var me = this;
+            _.each(children, function (child) {
+                var offset = offsetById[child.getId()];
+
+                var childFreeDisplacement = child.getFreeDisplacement();
+                var direction = node.getSorter().getChildDirection(me._treeSet, child);
+
+                if ((direction > 0 && childFreeDisplacement.x < 0) || (direction < 0 && childFreeDisplacement.x > 0)) {
+                    child.resetFreeDisplacement();
+                    child.setFreeDisplacement({x:-childFreeDisplacement.x, y:childFreeDisplacement.y});
+                }
+
+                offset.x += child.getFreeDisplacement().x;
+                offset.y += child.getFreeDisplacement().y;
+
+                var parentX = parentPosition.x;
+                var parentY = parentPosition.y;
+
+                var newPos = {x:parentX + offset.x, y:parentY + offset.y + me._calculateAlignOffset(node, child, heightById)};
+                me._treeSet.updateBranchPosition(child, newPos);
+            });
+
+            node._branchHeight = newBranchHeight;
+        }
+
+        // Continue reordering the children nodes ...
+        _.each(children, function (child) {
+            this._layoutChildren(child, heightById);
+        }, this);
+    },
+
+    _calculateAlignOffset:function (node, child, heightById) {
+        if (child.isFree()) {
+            return 0;
+        }
+
+        var offset = 0;
+
+        var nodeHeight = node.getSize().height;
+        var childHeight = child.getSize().height;
+
+        if (this._treeSet.isStartOfSubBranch(child) && this._branchIsTaller(child, heightById)) {
+            if (this._treeSet.hasSinglePathToSingleLeaf(child)) {
+                offset = heightById[child.getId()] / 2 - (childHeight + child.getSorter()._getVerticalPadding() * 2) / 2;
+            } else {
+                offset = this._treeSet.isLeaf(child) ? 0 : -(childHeight - nodeHeight) / 2;
+            }
+        } else if (nodeHeight > childHeight) {
+            if (this._treeSet.getSiblings(child).length > 0) {
+                offset = 0;
+            } else {
+                offset = nodeHeight / 2 - childHeight / 2;
+            }
+        }
+        else if (childHeight > nodeHeight) {
+            if (this._treeSet.getSiblings(child).length > 0) {
+                offset = 0;
+            } else {
+                offset = -(childHeight / 2 - nodeHeight / 2);
+            }
+        }
+
+        return offset;
+    },
+
+    _branchIsTaller:function (node, heightById) {
+        return heightById[node.getId()] > (node.getSize().height + node.getSorter()._getVerticalPadding() * 2);
+    },
+
+    _fixOverlapping:function (node, heightById) {
+        var children = this._treeSet.getChildren(node);
+
+        if (node.isFree()) {
+            this._shiftBranches(node, heightById);
+        }
+
+        _.each(children, function (child) {
+            this._fixOverlapping(child, heightById);
+        }, this);
+    },
+
+    _shiftBranches:function (node, heightById) {
+        var shiftedBranches = [node];
+
+        var siblingsToShift = this._treeSet.getSiblingsInVerticalDirection(node, node.getFreeDisplacement().y);
+        var last = node;
+        _.each(siblingsToShift, function (sibling) {
+            var overlappingOccurs = shiftedBranches.some(function (shiftedBranch) {
+                return this._branchesOverlap(shiftedBranch, sibling, heightById);
+            }, this);
+
+            if (!sibling.isFree() || overlappingOccurs) {
+                var sAmount = node.getFreeDisplacement().y;
+                this._treeSet.shiftBranchPosition(sibling, 0, sAmount);
+                shiftedBranches.push(sibling);
+            }
+        }, this);
+
+        var branchesToShift = this._treeSet.getBranchesInVerticalDirection(node, node.getFreeDisplacement().y).filter(function (branch) {
+            return !shiftedBranches.contains(branch);
+        });
+
+        _.each(branchesToShift, function (branch) {
+            var bAmount = node.getFreeDisplacement().y;
+            this._treeSet.shiftBranchPosition(branch, 0, bAmount);
+            shiftedBranches.push(branch);
+            last = branch;
+        }, this);
+    },
+
+    _branchesOverlap:function (branchA, branchB, heightById) {
+        // a branch doesn't really overlap with itself
+        if (branchA == branchB) {
+            return false;
+        }
+
+        var topA = branchA.getPosition().y - heightById[branchA.getId()] / 2;
+        var bottomA = branchA.getPosition().y + heightById[branchA.getId()] / 2;
+        var topB = branchB.getPosition().y - heightById[branchB.getId()] / 2;
+        var bottomB = branchB.getPosition().y + heightById[branchB.getId()] / 2;
+
+        return !(topA >= bottomB || bottomA <= topB);
+    }
+
+});
+
+
+/**
+ * @type {mindplot.layout.SymmetricSorter}
+ */
+OriginalLayout.SYMMETRIC_SORTER = new SymmetricSorter();
+/**
+ * @type {mindplot.layout.BalancedSorter}
+ */
+OriginalLayout.BALANCED_SORTER = new BalancedSorter();
+
+export default OriginalLayout;

packages/mindplot/lib/components/layout/RootedTreeSet.js

@@ -0,0 +1,396 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
+const RootedTreeSet = new Class(/** @lends RootedTreeSet */{
+    /** @constructs */
+    initialize:function () {
+        this._rootNodes = [];
+    },
+
+    /** 
+     * @param root
+     * @throws will throw an error if root is null or undefined
+     */
+    setRoot:function (root) {
+        $assert(root, 'root can not be null');
+        this._rootNodes.push(this._decodate(root));
+    },
+
+    /** getter */
+    getTreeRoots:function () {
+        return this._rootNodes;
+    },
+
+    _decodate:function (node) {
+        node._children = [];
+        return node;
+    },
+
+    /**
+     * @param {mindplot.model.NodeModel} node
+     * @throws will throw an error if node is null or undefined
+     * @throws will throw an error if node with id already exists
+     * @throws will throw an error if node has been added already
+     */
+    add:function (node) {
+        $assert(node, 'node can not be null');
+        $assert(!this.find(node.getId(), false), 'node already exits with this id. Id:' + node.getId());
+        $assert(!node._children, 'node already added');
+        this._rootNodes.push(this._decodate(node));
+    },
+
+
+    /**
+     * @param nodeId
+     * @throws will throw an error if nodeId is null or undefined 
+     */
+    remove:function (nodeId) {
+        $assert($defined(nodeId), 'nodeId can not be null');
+        var node = this.find(nodeId);
+        this._rootNodes.erase(node);
+    },
+
+    /** 
+     * @param parentId
+     * @param childId
+     * @throws will throw an error if parentId is null or undefined 
+     * @throws will throw an error if childId is null or undefined 
+     * @throws will throw an error if node with id childId is already a child of parent
+     */
+    connect:function (parentId, childId) {
+        $assert($defined(parentId), 'parent can not be null');
+        $assert($defined(childId), 'child can not be null');
+
+        var parent = this.find(parentId);
+        var child = this.find(childId, true);
+        $assert(!child._parent, 'node already connected. Id:' + child.getId() + ",previous:" + child._parent);
+
+        parent._children.push(child);
+        child._parent = parent;
+        this._rootNodes.erase(child);
+    },
+
+    /** 
+     * @param nodeId
+     * @throws will throw an error if nodeId is null or undefined 
+     * @throws will throw an error if node is not connected
+     */
+    disconnect:function (nodeId) {
+        $assert($defined(nodeId), 'nodeId can not be null');
+        var node = this.find(nodeId);
+        $assert(node._parent, "Node is not connected");
+
+        node._parent._children.erase(node);
+        this._rootNodes.push(node);
+        node._parent = null;
+    },
+
+    /** 
+     * @param id
+     * @param validate
+     * @throws will throw an error if id is null or undefined 
+     * @throws will throw an error if node cannot be found
+     * @return node
+     */
+    find:function (id, validate) {
+        $assert($defined(id), 'id can not be null');
+
+        var graphs = this._rootNodes;
+        var result = null;
+        for (var i = 0; i < graphs.length; i++) {
+            var node = graphs[i];
+            result = this._find(id, node);
+            if (result) {
+                break;
+            }
+        }
+        validate = !$defined(validate) ? true : validate;
+        $assert(validate ? result : true, 'node could not be found id:' + id + "\n,RootedTreeSet" + this.dump());
+        return result;
+
+    },
+
+    _find:function (id, parent) {
+        if (parent.getId() == id) {
+            return parent;
+
+        }
+
+        var result = null;
+        var children = parent._children;
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            result = this._find(id, child);
+            if (result)
+                break;
+        }
+
+        return result;
+    },
+
+    /** 
+     * @param node
+     * @throws will throw an error if nodeId is null or undefined
+     * @return children
+     */
+    getChildren:function (node) {
+        $assert(node, 'node cannot be null');
+        return node._children;
+    },
+
+    /** 
+     * @param node
+     * @throws will throw an error if node is null or undefined
+     * @return root node or the provided node, if it has no parent
+     */
+    getRootNode:function (node) {
+        $assert(node, "node cannot be null");
+        var parent = this.getParent(node);
+        if ($defined(parent)) {
+            return this.getRootNode(parent);
+        }
+
+        return node;
+    },
+
+    /** 
+     * @param node
+     * @throws will throw an error if node is null or undefined 
+     * @return {Array} ancestors*/
+    getAncestors:function (node) {
+        $assert(node, 'node cannot be null');
+        return this._getAncestors(this.getParent(node), []);
+    },
+
+    _getAncestors:function (node, ancestors) {
+        var result = ancestors;
+        if (node) {
+            result.push(node);
+            this._getAncestors(this.getParent(node), result);
+        }
+        return result;
+    },
+
+    /** 
+     * @param node
+     * @throws will throw an error if node is null or undefined 
+     * @return {Array} siblings
+     */
+    getSiblings:function (node) {
+        $assert(node, 'node cannot be null');
+        if (!$defined(node._parent)) {
+            return [];
+        }
+        var siblings = node._parent._children.filter(function (child) {
+            return child != node;
+        });
+        return siblings;
+    },
+
+    /** 
+     * @param node
+     * @throws will throw an error if node is null or undefined 
+     * @return {Boolean} whether the node has a single path to a single leaf (no branching)
+     */
+    hasSinglePathToSingleLeaf:function (node) {
+        $assert(node, 'node cannot be null');
+        return this._hasSinglePathToSingleLeaf(node);
+    },
+
+    _hasSinglePathToSingleLeaf:function (node) {
+        var children = this.getChildren(node);
+
+        if (children.length == 1) {
+            return this._hasSinglePathToSingleLeaf(children[0]);
+        }
+
+        return children.length == 0;
+    },
+
+    /**
+     * @param node
+     * @return {Boolean} whether the node is the start of a subbranch*/
+    isStartOfSubBranch:function (node) {
+        return this.getSiblings(node).length > 0 && this.getChildren(node).length == 1;
+    },
+
+    /** 
+     * @param node
+     * @throws will throw an error if node is null or undefined 
+     * @return {Boolean} whether the node is a leaf 
+     */
+    isLeaf:function (node) {
+        $assert(node, 'node cannot be null');
+        return this.getChildren(node).length == 0;
+    },
+
+    /** 
+     * @param node
+     * @throws will throw an error if node is null or undefined 
+     * @return parent
+     */
+    getParent:function (node) {
+        $assert(node, 'node cannot be null');
+        return node._parent;
+    },
+
+    /** 
+     * @return result
+     */
+    dump:function () {
+        var branches = this._rootNodes;
+        var result = "";
+        for (var i = 0; i < branches.length; i++) {
+            var branch = branches[i];
+            result += this._dump(branch, "");
+        }
+        return result;
+    },
+
+    _dump:function (node, indent) {
+        var result = indent + node + "\n";
+        var children = this.getChildren(node);
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            result += this._dump(child, indent + "   ");
+        }
+
+        return result;
+    },
+
+    /** 
+     * @param canvas
+     */
+    plot:function (canvas) {
+        var branches = this._rootNodes;
+        for (var i = 0; i < branches.length; i++) {
+            var branch = branches[i];
+            this._plot(canvas, branch);
+        }
+    },
+
+    _plot:function (canvas, node, root) {
+        var children = this.getChildren(node);
+        var cx = node.getPosition().x + canvas.width / 2 - node.getSize().width / 2;
+        var cy = node.getPosition().y + canvas.height / 2 - node.getSize().height / 2;
+        var rect = canvas.rect(cx, cy, node.getSize().width, node.getSize().height);
+        var order = node.getOrder() == null ? "r" : node.getOrder();
+        var text = canvas.text(node.getPosition().x + canvas.width / 2, node.getPosition().y + canvas.height / 2, node.getId() + "[" + order + "]");
+        text.attr('fill', '#FFF');
+        var fillColor = this._rootNodes.contains(node) ? "#000" : (node.isFree() ? "#abc" : "#c00");
+        rect.attr('fill', fillColor);
+
+        var rectPosition = {x:rect.attr("x") - canvas.width / 2 + rect.attr("width") / 2, y:rect.attr("y") - canvas.height / 2 + rect.attr("height") / 2};
+        var rectSize = {width:rect.attr("width"), height:rect.attr("height")};
+        rect.click(function () {
+            console.log("[id:" + node.getId() + ", order:" + node.getOrder() + ", position:(" + rectPosition.x + "," + rectPosition.y + "), size:" + rectSize.width + "x" + rectSize.height + ", freeDisplacement:(" + node.getFreeDisplacement().x + "," + node.getFreeDisplacement().y + ")]");
+        });
+        text.click(function () {
+            console.log("[id:" + node.getId() + ", order:" + node.getOrder() + ", position:(" + rectPosition.x + "," + rectPosition.y + "), size:" + rectSize.width + "x" + rectSize.height + ", freeDisplacement:(" + node.getFreeDisplacement().x + "," + node.getFreeDisplacement().y + ")]");
+        });
+
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            this._plot(canvas, child);
+        }
+    },
+
+    /** 
+     * @param node
+     * @param position
+     */
+    updateBranchPosition:function (node, position) {
+
+        var oldPos = node.getPosition();
+        node.setPosition(position);
+
+        var xOffset = oldPos.x - position.x;
+        var yOffset = oldPos.y - position.y;
+
+        var children = this.getChildren(node);
+        var me = this;
+        _.each(children, function (child) {
+            me.shiftBranchPosition(child, xOffset, yOffset);
+        });
+
+    },
+
+    /** 
+     * @param node
+     * @param xOffset
+     * @param yOffset
+     */
+    shiftBranchPosition:function (node, xOffset, yOffset) {
+        var position = node.getPosition();
+        node.setPosition({x:position.x + xOffset, y:position.y + yOffset});
+
+        var children = this.getChildren(node);
+        var me = this;
+        _.each(children, function (child) {
+            me.shiftBranchPosition(child, xOffset, yOffset);
+        });
+    },
+
+    /** 
+     * @param node
+     * @param yOffset
+     * @return siblings in the offset (vertical) direction, i.e. with lower or higher order, respectively
+     */
+    getSiblingsInVerticalDirection:function (node, yOffset) {
+        // siblings with lower or higher order, depending on the direction of the offset and on the same side as their parent
+        var parent = this.getParent(node);
+        var siblings = this.getSiblings(node).filter(function (sibling) {
+            var sameSide = node.getPosition().x > parent.getPosition().x ? sibling.getPosition().x > parent.getPosition().x : sibling.getPosition().x < parent.getPosition().x;
+            var orderOK = yOffset < 0 ? sibling.getOrder() < node.getOrder() : sibling.getOrder() > node.getOrder();
+            return orderOK && sameSide;
+        });
+
+        if (yOffset < 0) {
+            siblings.reverse();
+        }
+
+        return siblings;
+    },
+
+    /** 
+     * @param node
+     * @param yOffset
+     * @return branches of the root node on the same side as the given node's, in the given 
+     * vertical direction
+     */
+    getBranchesInVerticalDirection:function (node, yOffset) {
+        // direct descendants of the root that do not contain the node and are on the same side
+        // and on the direction of the offset
+        var rootNode = this.getRootNode(node);
+        var branches = this.getChildren(rootNode).filter(function (child) {
+            return this._find(node.getId(), child);
+        }, this);
+
+        var branch = branches[0];
+        var rootDescendants = this.getSiblings(branch).filter(function (sibling) {
+            var sameSide = node.getPosition().x > rootNode.getPosition().x ? sibling.getPosition().x > rootNode.getPosition().x : sibling.getPosition().x < rootNode.getPosition().x;
+            var sameDirection = yOffset < 0 ? sibling.getOrder() < branch.getOrder() : sibling.getOrder() > branch.getOrder();
+            return sameSide && sameDirection;
+        }, this);
+
+        return rootDescendants;
+    }
+
+});
+
+export default RootedTreeSet;

packages/mindplot/lib/components/layout/SymmetricSorter.js

@@ -0,0 +1,283 @@
+/*
+ *    Copyright [2015] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+const AbstractBasicSorter = require('./AbstractBasicSorter').default;
+
+const SymmetricSorter = new Class(/** @lends SymmetricSorter */{
+    Extends: AbstractBasicSorter,
+    /**
+     * @constructs
+     * @extends mindplot.layout.AbstractBasicSorter
+     */
+    initialize:function () {
+
+    },
+
+    /**
+     * Predict the order and position of a dragged node.
+     *
+     * @param graph The tree set
+     * @param parent The parent of the node
+     * @param node The node
+     * @param position The position of the drag
+     * @param free Free drag or not
+     * @return {*}
+     */
+    predict:function (graph, parent, node, position, free) {
+
+        var self = this;
+        var rootNode = graph.getRootNode(parent);
+
+        // If its a free node...
+        if (free) {
+            $assert($defined(position), "position cannot be null for predict in free positioning");
+            $assert($defined(node), "node cannot be null for predict in free positioning");
+
+            var direction = this._getRelativeDirection(rootNode.getPosition(), parent.getPosition());
+            var limitXPos = parent.getPosition().x + direction * (parent.getSize().width / 2 + node.getSize().width / 2 + SymmetricSorter.INTERNODE_HORIZONTAL_PADDING);
+
+            var xPos = direction > 0 ?
+                (position.x >= limitXPos ? position.x : limitXPos) :
+                (position.x <= limitXPos ? position.x : limitXPos);
+
+            return [0, {x:xPos, y:position.y}];
+        }
+
+        // Its not a dragged node (it is being added)
+        if (!node) {
+            var parentDirection = self._getRelativeDirection(rootNode.getPosition(), parent.getPosition());
+            var position = {
+                x:parent.getPosition().x + parentDirection * (parent.getSize().width + SymmetricSorter.INTERNODE_HORIZONTAL_PADDING),
+                y:parent.getPosition().y
+            };
+            return [graph.getChildren(parent).length, position];
+        }
+
+        // If it is a dragged node...
+        $assert($defined(position), "position cannot be null for predict in dragging");
+        var nodeDirection = this._getRelativeDirection(rootNode.getPosition(), node.getPosition());
+        var positionDirection = this._getRelativeDirection(rootNode.getPosition(), position);
+        var siblings = graph.getSiblings(node);
+
+        // node has no siblings and its trying to reconnect to its own parent
+        var sameParent = parent == graph.getParent(node);
+        if (siblings.length == 0 && nodeDirection == positionDirection && sameParent) {
+            return [node.getOrder(), node.getPosition()];
+        }
+
+        var parentChildren = graph.getChildren(parent);
+
+        if (parentChildren.length == 0) {
+            // Fit as a child of the parent node...
+            var position = {
+                x:parent.getPosition().x + positionDirection * (parent.getSize().width + SymmetricSorter.INTERNODE_HORIZONTAL_PADDING),
+                y:parent.getPosition().y
+            };
+            return [0, position];
+        } else {
+            // Try to fit within ...
+            var result = null;
+            var last = parentChildren.getLast();
+            for (var i = 0; i < parentChildren.length; i++) {
+                var parentChild = parentChildren[i];
+                var nodeAfter = (i + 1) == parentChild.length ? null : parentChildren[i + 1];
+
+                // Fit at the bottom
+                if (!nodeAfter && position.y > parentChild.getPosition().y) {
+                    var order = (graph.getParent(node)  && graph.getParent(node).getId() == parent.getId()) ?
+                        last.getOrder() : last.getOrder() + 1;
+                    var position = {
+                        x:parentChild.getPosition().x,
+                        y:parentChild.getPosition().y + parentChild.getSize().height + SymmetricSorter.INTERNODE_VERTICAL_PADDING * 2
+                    };
+                    return [order, position];
+                }
+
+                // Fit after this node
+                if (nodeAfter && position.y > parentChild.getPosition().y && position.y < nodeAfter.getPosition().y) {
+                    if (nodeAfter.getId() == node.getId() || parentChild.getId() == node.getId()) {
+                        return [node.getOrder(), node.getPosition()];
+                    } else {
+                        var order = position.y > node.getPosition().y ?
+                            nodeAfter.getOrder() - 1 : parentChild.getOrder() + 1;
+                        var position = {
+                            x:parentChild.getPosition().x,
+                            y:parentChild.getPosition().y + (nodeAfter.getPosition().y - parentChild.getPosition().y) / 2
+                        };
+
+                        return [order, position];
+                    }
+                }
+            }
+        }
+
+        // Position wasn't below any node, so it must be fitted above the first
+        var first = parentChildren[0];
+        var position = {
+            x:first.getPosition().x,
+            y:first.getPosition().y - first.getSize().height - SymmetricSorter.INTERNODE_VERTICAL_PADDING * 2
+        };
+        return [0, position];
+    },
+
+    /** 
+     * @param treeSet
+     * @param parent
+     * @param child
+     * @param order
+     * @throws will throw an error if the order is not strictly continuous
+     */
+    insert:function (treeSet, parent, child, order) {
+        var children = this._getSortedChildren(treeSet, parent);
+        $assert(order <= children.length, "Order must be continues and can not have holes. Order:" + order);
+
+        // Shift all the elements in one .
+        for (var i = order; i < children.length; i++) {
+            var node = children[i];
+            node.setOrder(i + 1);
+        }
+        child.setOrder(order);
+    },
+
+    /** 
+     * @param treeSet
+     * @param node
+     * @throws will throw an error if the node is in the wrong position*/
+    detach:function (treeSet, node) {
+        var parent = treeSet.getParent(node);
+        var children = this._getSortedChildren(treeSet, parent);
+        var order = node.getOrder();
+        $assert(children[order] === node, "Node seems not to be in the right position");
+
+        // Shift all the nodes ...
+        for (var i = node.getOrder() + 1; i < children.length; i++) {
+            var child = children[i];
+            child.setOrder(child.getOrder() - 1);
+        }
+        node.setOrder(0);
+    },
+
+    /** 
+     * @param treeSet
+     * @param node
+     * @throws will throw an error if treeSet is null or undefined
+     * @throws will throw an error if node is null or undefined
+     * @throws will throw an error if the calculated x offset cannot be converted to a numeric 
+     * value, is null or undefined
+     * @throws will throw an error if the calculated y offset cannot be converted to a numeric 
+     * value, is null or undefined
+     * @return offsets
+     */
+    computeOffsets:function (treeSet, node) {
+        $assert(treeSet, "treeSet can no be null.");
+        $assert(node, "node can no be null.");
+
+        var children = this._getSortedChildren(treeSet, node);
+
+        // Compute heights ...
+        var heights = children.map(
+            function (child) {
+                return {id:child.getId(), order:child.getOrder(), position:child.getPosition(), width:child.getSize().width, height:this._computeChildrenHeight(treeSet, child)};
+            }, this).reverse();
+
+        // Compute the center of the branch ...
+        var totalHeight = 0;
+        _.each(heights, function (elem) {
+            totalHeight += elem.height;
+        });
+        var ysum = totalHeight / 2;
+
+        // Calculate the offsets ...
+        var result = {};
+        for (var i = 0; i < heights.length; i++) {
+            ysum = ysum - heights[i].height;
+            var childNode = treeSet.find(heights[i].id);
+            var direction = this.getChildDirection(treeSet, childNode);
+
+            var yOffset = ysum + heights[i].height / 2;
+            var xOffset = direction * (heights[i].width / 2 + node.getSize().width / 2 + SymmetricSorter.INTERNODE_HORIZONTAL_PADDING);
+
+            $assert(!isNaN(xOffset), "xOffset can not be null");
+            $assert(!isNaN(yOffset), "yOffset can not be null");
+
+            result[heights[i].id] = {x:xOffset, y:yOffset};
+        }
+        return result;
+    },
+
+    /** 
+     * @param treeSet
+     * @param node
+     * @throws will throw an error if order elements are missing
+     */
+    verify:function (treeSet, node) {
+        // Check that all is consistent ...
+        var children = this._getSortedChildren(treeSet, node);
+
+        for (var i = 0; i < children.length; i++) {
+            $assert(children[i].getOrder() == i, "missing order elements");
+        }
+    },
+
+    /** 
+     * @param treeSet
+     * @param child
+     * @return direction of the given child from its parent or from the root node, if isolated*/
+    getChildDirection:function (treeSet, child) {
+        $assert(treeSet, "treeSet can no be null.");
+        $assert(treeSet.getParent(child), "This should not happen");
+
+        var result;
+        var rootNode = treeSet.getRootNode(child);
+        if (treeSet.getParent(child) == rootNode) {
+            // This is the case of a isolated child ... In this case, the directions is based on the root.
+            result = Math.sign(rootNode.getPosition().x);
+        } else {
+            // if this is not the case, honor the direction of the parent ...
+            var parent = treeSet.getParent(child);
+            var grandParent = treeSet.getParent(parent);
+            var sorter = grandParent.getSorter();
+            result = sorter.getChildDirection(treeSet, parent);
+
+        }
+        return result;
+    },
+
+    /** @return {String} the print name of this class */
+    toString:function () {
+        return "Symmetric Sorter";
+    },
+
+    _getVerticalPadding:function () {
+        return SymmetricSorter.INTERNODE_VERTICAL_PADDING;
+    }
+});
+
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+SymmetricSorter.INTERNODE_VERTICAL_PADDING = 5;
+/**
+ * @constant
+ * @type {Number}
+ * @default
+ */
+SymmetricSorter.INTERNODE_HORIZONTAL_PADDING = 30;
+
+export default SymmetricSorter

packages/mindplot/lib/components/libraries/bootstrap/BootstrapDialog.Request.js

@@ -0,0 +1,51 @@
+const BootstrapDialog = require('./BootstrapDialog').default
+
+BootstrapDialog.Request = new Class({
+
+    Extends: BootstrapDialog,
+
+    initialize: function(url, title, options) {
+        this.parent(title, options);
+        this.requestOptions = {};
+        this.requestOptions.cache = false;
+        var me = this;
+        this.requestOptions.fail = function(xhr) {
+            // Intercept form requests ...
+            console.log("Failure:");
+            console.log(xhr);
+        };
+
+        this.requestOptions.success = function() {
+            // Intercept form requests ...
+            var forms = me._native.find('form');
+            _.each(forms, function(form) {
+                $(form).on('submit', function(event) {
+                    // Intercept form ...
+                    me.requestOptions.url = form.action;
+                    me.requestOptions.method = form.method ? form.method : 'post';
+                    $.ajax(me.requestOptions);
+                    event.stopPropagation();
+                    return false;
+                });
+            });
+        };
+
+        this._native.find('.modal-body').load(url, function () {
+            me.acceptButton.unbind('click').click(function () {
+                submitDialogForm();
+            });
+            me._native.on('hidden.bs.modal', function () {
+                $(this).remove();
+            });
+            me.show();
+        });
+    },
+
+    onDialogShown: function() {
+        if (typeof(onDialogShown) == "function") {
+            onDialogShown();
+        }
+    }
+
+
+});

packages/mindplot/lib/components/libraries/bootstrap/BootstrapDialog.js

@@ -0,0 +1,115 @@
+const Options = require('../../Options').default;
+
+const BootstrapDialog = new Class({
+    Implements: Options,
+
+    options: {
+        cancelButton: false,
+        closeButton: false,
+        acceptButton: true,
+        removeButton:false,
+        errorMessage: false,
+        onEventData:{}
+    },
+
+    initialize: function (title, options) {
+        this.setOptions(options);
+        this.options.onEventData.dialog = this;
+        this._native = $('<div class="modal fade" tabindex="-1"></div>').append('<div class="modal-dialog"></div>');
+        var content = $('<div class="modal-content"></div>');
+        var header = this._buildHeader(title);
+        if (header) {
+            content.append(header);
+        }
+        var body = $('<div class="modal-body"></div>');
+        if(this.options.errorMessage){
+            var error = $('<div class="alert alert-danger"></div>');
+            error.hide();
+            body.append(error);
+        }
+        content.append(body);
+        var footer = this._buildFooter();
+        if (footer) {
+            content.append(footer);
+        }
+        this._native.find(".modal-dialog").append(content);
+        this._native.on('hidden.bs.modal', function() {
+            $(this).remove();
+        });
+        this._native.on('shown.bs.modal', this.onDialogShown);
+    },
+
+    _buildFooter: function() {
+        var footer = null;
+        if (this.options.acceptButton || this.options.removeButton || this.options.cancelButton) {
+            footer = $('<div class="modal-footer" style="paddingTop:5;textAlign:center">');
+        }
+        if (this.options.acceptButton) {
+            this.acceptButton = $('<button type="button" class="btn btn-primary" id="acceptBtn" data-dismiss="modal">'+ $msg('ACCEPT') + '</button>');
+            footer.append(this.acceptButton);
+            this.acceptButton.unbind('click').on("click",this.options.onEventData, this.onAcceptClick)
+        }
+        if (this.options.removeButton) {
+            this.removeButton = $('<button type="button" class="btn btn-secondary" id="removeBtn" data-dismiss="modal">'+ $msg('REMOVE') +'</button>');
+            footer.append(this.removeButton);
+            this.removeButton.on('click', this.options.onEventData, this.onRemoveClick);
+        }
+        if (this.options.cancelButton) {
+            footer.append('<button type="button" class="btn btn-secondary" data-dismiss="modal">'+ $msg('CANCEL') +'</button>');
+        }
+        return footer;
+    },
+
+    _buildHeader: function(title) {
+        var header = null;
+        if (this.options.closeButton || title) {
+            header = $('<div class="modal-header"></div>');
+        }
+        if (this.options.closeButton) {
+            header.append(
+                '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>'
+            );
+        }
+        if (title) {
+            header.append('<h2 class="modal-title">' + title + '</h2>');
+        }
+        return header;
+    },
+
+    onAcceptClick: function(event) {
+        throw "Unsupported operation";
+    },
+
+    onDialogShown: function() {},
+    onRemoveClick: function(event) {
+        throw "Unsupported operation";
+    },
+
+    show: function () {
+        this._native.modal();
+    },
+
+    setContent: function(content) {
+        var modalBody = this._native.find('.modal-body');
+        modalBody.append(content);
+    },
+
+    css: function(options){
+        this._native.find('.modal-dialog').css(options);
+    },
+
+    close: function() {
+        this._native.modal('hide');
+    },
+
+    alertError: function(message){
+        this._native.find('.alert-danger').text(message);
+        this._native.find('.alert-danger').show();
+    },
+
+    cleanError: function(){
+        this._native.find('.alert-danger').hide();
+    }
+});
+
+export default BootstrapDialog;

packages/mindplot/lib/components/libraries/bootstrap/css/bootstrap-colorpicker.css

@@ -0,0 +1,214 @@
+/*!
+ * Bootstrap Colorpicker
+ * http://mjolnic.github.io/bootstrap-colorpicker/
+ *
+ * Originally written by (c) 2012 Stefan Petre
+ * Licensed under the Apache License v2.0
+ * http://www.apache.org/licenses/LICENSE-2.0.txt
+ *
+ */
+
+.colorpicker-saturation {
+  float: left;
+  width: 100px;
+  height: 100px;
+  cursor: crosshair;
+  background-image: url("../img/bootstrap-colorpicker/saturation.png");
+}
+
+.colorpicker-saturation i {
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: block;
+  width: 5px;
+  height: 5px;
+  margin: -4px 0 0 -4px;
+  border: 1px solid #000;
+  -webkit-border-radius: 5px;
+     -moz-border-radius: 5px;
+          border-radius: 5px;
+}
+
+.colorpicker-saturation i b {
+  display: block;
+  width: 5px;
+  height: 5px;
+  border: 1px solid #fff;
+  -webkit-border-radius: 5px;
+     -moz-border-radius: 5px;
+          border-radius: 5px;
+}
+
+.colorpicker-hue,
+.colorpicker-alpha {
+  float: left;
+  width: 15px;
+  height: 100px;
+  margin-bottom: 4px;
+  margin-left: 4px;
+  cursor: row-resize;
+}
+
+.colorpicker-hue i,
+.colorpicker-alpha i {
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: block;
+  width: 100%;
+  height: 1px;
+  margin-top: -1px;
+  background: #000;
+  border-top: 1px solid #fff;
+}
+
+.colorpicker-hue {
+  background-image: url("../img/bootstrap-colorpicker/hue.png");
+}
+
+.colorpicker-alpha {
+  display: none;
+  background-image: url("../img/bootstrap-colorpicker/alpha.png");
+}
+
+.colorpicker {
+  top: 0;
+  left: 0;
+  z-index: 2500;
+  min-width: 130px;
+  padding: 4px;
+  margin-top: 1px;
+  -webkit-border-radius: 4px;
+     -moz-border-radius: 4px;
+          border-radius: 4px;
+  *zoom: 1;
+}
+
+.colorpicker:before,
+.colorpicker:after {
+  display: table;
+  line-height: 0;
+  content: "";
+}
+
+.colorpicker:after {
+  clear: both;
+}
+
+.colorpicker:before {
+  position: absolute;
+  top: -7px;
+  left: 6px;
+  display: inline-block;
+  border-right: 7px solid transparent;
+  border-bottom: 7px solid #ccc;
+  border-left: 7px solid transparent;
+  border-bottom-color: rgba(0, 0, 0, 0.2);
+  content: '';
+}
+
+.colorpicker:after {
+  position: absolute;
+  top: -6px;
+  left: 7px;
+  display: inline-block;
+  border-right: 6px solid transparent;
+  border-bottom: 6px solid #ffffff;
+  border-left: 6px solid transparent;
+  content: '';
+}
+
+.colorpicker div {
+  position: relative;
+}
+
+.colorpicker.colorpicker-with-alpha {
+  min-width: 140px;
+}
+
+.colorpicker.colorpicker-with-alpha .colorpicker-alpha {
+  display: block;
+}
+
+.colorpicker-color {
+  height: 10px;
+  margin-top: 5px;
+  clear: both;
+  background-image: url("../img/bootstrap-colorpicker/alpha.png");
+  background-position: 0 100%;
+}
+
+.colorpicker-color div {
+  height: 10px;
+}
+
+.colorpicker-element .input-group-addon i {
+  display: block;
+  width: 16px;
+  height: 16px;
+  cursor: pointer;
+}
+
+.colorpicker.colorpicker-inline {
+  position: relative;
+  display: inline-block;
+  float: none;
+}
+
+.colorpicker.colorpicker-horizontal {
+  width: 110px;
+  height: auto;
+  min-width: 110px;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-saturation {
+  margin-bottom: 4px;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-color {
+  width: 100px;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue,
+.colorpicker.colorpicker-horizontal .colorpicker-alpha {
+  float: left;
+  width: 100px;
+  height: 15px;
+  margin-bottom: 4px;
+  margin-left: 0;
+  cursor: col-resize;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue i,
+.colorpicker.colorpicker-horizontal .colorpicker-alpha i {
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: block;
+  width: 1px;
+  height: 15px;
+  margin-top: 0;
+  background: #ffffff;
+  border: none;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue {
+  background-image: url("../img/bootstrap-colorpicker/hue-horizontal.png");
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-alpha {
+  background-image: url("../img/bootstrap-colorpicker/alpha-horizontal.png");
+}
+
+.colorpicker.colorpicker-hidden {
+  display: none;
+}
+
+.colorpicker.colorpicker-visible {
+  display: block;
+}
+
+.colorpicker-inline.colorpicker-visible {
+  display: inline-block;
+}

packages/mindplot/lib/components/libraries/bootstrap/css/bootstrap-colorpicker.min.css

@@ -0,0 +1,9 @@
+/*!
+ * Bootstrap Colorpicker
+ * http://mjolnic.github.io/bootstrap-colorpicker/
+ *
+ * Originally written by (c) 2012 Stefan Petre
+ * Licensed under the Apache License v2.0
+ * http://www.apache.org/licenses/LICENSE-2.0.txt
+ *
+ */.colorpicker-saturation{float:left;width:100px;height:100px;cursor:crosshair;background-image:url("../img/bootstrap-colorpicker/saturation.png")}.colorpicker-saturation i{position:absolute;top:0;left:0;display:block;width:5px;height:5px;margin:-4px 0 0 -4px;border:1px solid #000;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.colorpicker-saturation i b{display:block;width:5px;height:5px;border:1px solid #fff;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.colorpicker-hue,.colorpicker-alpha{float:left;width:15px;height:100px;margin-bottom:4px;margin-left:4px;cursor:row-resize}.colorpicker-hue i,.colorpicker-alpha i{position:absolute;top:0;left:0;display:block;width:100%;height:1px;margin-top:-1px;background:#000;border-top:1px solid #fff}.colorpicker-hue{background-image:url("../img/bootstrap-colorpicker/hue.png")}.colorpicker-alpha{display:none;background-image:url("../img/bootstrap-colorpicker/alpha.png")}.colorpicker{top:0;left:0;z-index:2500;min-width:130px;padding:4px;margin-top:1px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;*zoom:1}.colorpicker:before,.colorpicker:after{display:table;line-height:0;content:""}.colorpicker:after{clear:both}.colorpicker:before{position:absolute;top:-7px;left:6px;display:inline-block;border-right:7px solid transparent;border-bottom:7px solid #ccc;border-left:7px solid transparent;border-bottom-color:rgba(0,0,0,0.2);content:''}.colorpicker:after{position:absolute;top:-6px;left:7px;display:inline-block;border-right:6px solid transparent;border-bottom:6px solid #fff;border-left:6px solid transparent;content:''}.colorpicker div{position:relative}.colorpicker.colorpicker-with-alpha{min-width:140px}.colorpicker.colorpicker-with-alpha .colorpicker-alpha{display:block}.colorpicker-color{height:10px;margin-top:5px;clear:both;background-image:url("../img/bootstrap-colorpicker/alpha.png");background-position:0 100%}.colorpicker-color div{height:10px}.colorpicker-element .input-group-addon i{display:block;width:16px;height:16px;cursor:pointer}.colorpicker.colorpicker-inline{position:relative;display:inline-block;float:none}.colorpicker.colorpicker-horizontal{width:110px;height:auto;min-width:110px}.colorpicker.colorpicker-horizontal .colorpicker-saturation{margin-bottom:4px}.colorpicker.colorpicker-horizontal .colorpicker-color{width:100px}.colorpicker.colorpicker-horizontal .colorpicker-hue,.colorpicker.colorpicker-horizontal .colorpicker-alpha{float:left;width:100px;height:15px;margin-bottom:4px;margin-left:0;cursor:col-resize}.colorpicker.colorpicker-horizontal .colorpicker-hue i,.colorpicker.colorpicker-horizontal .colorpicker-alpha i{position:absolute;top:0;left:0;display:block;width:1px;height:15px;margin-top:0;background:#fff;border:0}.colorpicker.colorpicker-horizontal .colorpicker-hue{background-image:url("../img/bootstrap-colorpicker/hue-horizontal.png")}.colorpicker.colorpicker-horizontal .colorpicker-alpha{background-image:url("../img/bootstrap-colorpicker/alpha-horizontal.png")}.colorpicker.colorpicker-hidden{display:none}.colorpicker.colorpicker-visible{display:block}.colorpicker-inline.colorpicker-visible{display:inline-block}

packages/mindplot/lib/components/libraries/bootstrap/css/bootstrap-theme.css

@@ -0,0 +1,347 @@
+/*!
+ * Bootstrap v3.1.1 (http://getbootstrap.com)
+ * Copyright 2011-2014 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
+.btn-default,
+.btn-primary,
+.btn-success,
+.btn-info,
+.btn-warning,
+.btn-danger {
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
+}
+.btn-default:active,
+.btn-primary:active,
+.btn-success:active,
+.btn-info:active,
+.btn-warning:active,
+.btn-danger:active,
+.btn-default.active,
+.btn-primary.active,
+.btn-success.active,
+.btn-info.active,
+.btn-warning.active,
+.btn-danger.active {
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+}
+.btn:active,
+.btn.active {
+  background-image: none;
+}
+.btn-default {
+  text-shadow: 0 1px 0 #fff;
+  background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
+  background-image:         linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #dbdbdb;
+  border-color: #ccc;
+}
+.btn-default:hover,
+.btn-default:focus {
+  background-color: #e0e0e0;
+  background-position: 0 -15px;
+}
+.btn-default:active,
+.btn-default.active {
+  background-color: #e0e0e0;
+  border-color: #dbdbdb;
+}
+.btn-primary {
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #2d6ca2 100%);
+  background-image:         linear-gradient(to bottom, #428bca 0%, #2d6ca2 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff2d6ca2', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #2b669a;
+}
+.btn-primary:hover,
+.btn-primary:focus {
+  background-color: #2d6ca2;
+  background-position: 0 -15px;
+}
+.btn-primary:active,
+.btn-primary.active {
+  background-color: #2d6ca2;
+  border-color: #2b669a;
+}
+.btn-success {
+  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%);
+  background-image:         linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #3e8f3e;
+}
+.btn-success:hover,
+.btn-success:focus {
+  background-color: #419641;
+  background-position: 0 -15px;
+}
+.btn-success:active,
+.btn-success.active {
+  background-color: #419641;
+  border-color: #3e8f3e;
+}
+.btn-info {
+  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
+  background-image:         linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #28a4c9;
+}
+.btn-info:hover,
+.btn-info:focus {
+  background-color: #2aabd2;
+  background-position: 0 -15px;
+}
+.btn-info:active,
+.btn-info.active {
+  background-color: #2aabd2;
+  border-color: #28a4c9;
+}
+.btn-warning {
+  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
+  background-image:         linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #e38d13;
+}
+.btn-warning:hover,
+.btn-warning:focus {
+  background-color: #eb9316;
+  background-position: 0 -15px;
+}
+.btn-warning:active,
+.btn-warning.active {
+  background-color: #eb9316;
+  border-color: #e38d13;
+}
+.btn-danger {
+  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
+  background-image:         linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #b92c28;
+}
+.btn-danger:hover,
+.btn-danger:focus {
+  background-color: #c12e2a;
+  background-position: 0 -15px;
+}
+.btn-danger:active,
+.btn-danger.active {
+  background-color: #c12e2a;
+  border-color: #b92c28;
+}
+.thumbnail,
+.img-thumbnail {
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+}
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  background-color: #e8e8e8;
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image:         linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
+  background-repeat: repeat-x;
+}
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
+  background-color: #357ebd;
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);
+  background-image:         linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
+  background-repeat: repeat-x;
+}
+.navbar-default {
+  background-image: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 100%);
+  background-image:         linear-gradient(to bottom, #fff 0%, #f8f8f8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
+}
+.navbar-default .navbar-nav > .active > a {
+  background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f3f3f3 100%);
+  background-image:         linear-gradient(to bottom, #ebebeb 0%, #f3f3f3 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff3f3f3', GradientType=0);
+  background-repeat: repeat-x;
+  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075);
+}
+.navbar-brand,
+.navbar-nav > li > a {
+  text-shadow: 0 1px 0 rgba(255, 255, 255, .25);
+}
+.navbar-inverse {
+  background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%);
+  background-image:         linear-gradient(to bottom, #3c3c3c 0%, #222 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+}
+.navbar-inverse .navbar-nav > .active > a {
+  background-image: -webkit-linear-gradient(top, #222 0%, #282828 100%);
+  background-image:         linear-gradient(to bottom, #222 0%, #282828 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff282828', GradientType=0);
+  background-repeat: repeat-x;
+  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
+          box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
+}
+.navbar-inverse .navbar-brand,
+.navbar-inverse .navbar-nav > li > a {
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
+}
+.navbar-static-top,
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+  border-radius: 0;
+}
+.alert {
+  text-shadow: 0 1px 0 rgba(255, 255, 255, .2);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
+}
+.alert-success {
+  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
+  background-image:         linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #b2dba1;
+}
+.alert-info {
+  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
+  background-image:         linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #9acfea;
+}
+.alert-warning {
+  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
+  background-image:         linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #f5e79e;
+}
+.alert-danger {
+  background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
+  background-image:         linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #dca7a7;
+}
+.progress {
+  background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
+  background-image:         linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar {
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #3071a9 100%);
+  background-image:         linear-gradient(to bottom, #428bca 0%, #3071a9 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3071a9', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-success {
+  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%);
+  background-image:         linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-info {
+  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
+  background-image:         linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-warning {
+  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
+  background-image:         linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-danger {
+  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%);
+  background-image:         linear-gradient(to bottom, #d9534f 0%, #c9302c 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);
+  background-repeat: repeat-x;
+}
+.list-group {
+  border-radius: 4px;
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+}
+.list-group-item.active,
+.list-group-item.active:hover,
+.list-group-item.active:focus {
+  text-shadow: 0 -1px 0 #3071a9;
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #3278b3 100%);
+  background-image:         linear-gradient(to bottom, #428bca 0%, #3278b3 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3278b3', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #3278b3;
+}
+.panel {
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
+}
+.panel-default > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image:         linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-primary > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);
+  background-image:         linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-success > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
+  background-image:         linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-info > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
+  background-image:         linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-warning > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
+  background-image:         linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-danger > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
+  background-image:         linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);
+  background-repeat: repeat-x;
+}
+.well {
+  background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
+  background-image:         linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #dcdcdc;
+  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
+          box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
+}
+/*# sourceMappingURL=bootstrap-theme.css.map */

packages/mindplot/lib/components/libraries/bootstrap/fonts/glyphicons-halflings-regular.svg

@@ -0,0 +1,229 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata></metadata>
+<defs>
+<font id="glyphicons_halflingsregular" horiz-adv-x="1200" >
+<font-face units-per-em="1200" ascent="960" descent="-240" />
+<missing-glyph horiz-adv-x="500" />
+<glyph />
+<glyph />
+<glyph unicode="&#xd;" />
+<glyph unicode=" " />
+<glyph unicode="*" d="M100 500v200h259l-183 183l141 141l183 -183v259h200v-259l183 183l141 -141l-183 -183h259v-200h-259l183 -183l-141 -141l-183 183v-259h-200v259l-183 -183l-141 141l183 183h-259z" />
+<glyph unicode="+" d="M0 400v300h400v400h300v-400h400v-300h-400v-400h-300v400h-400z" />
+<glyph unicode="&#xa0;" />
+<glyph unicode="&#x2000;" horiz-adv-x="652" />
+<glyph unicode="&#x2001;" horiz-adv-x="1304" />
+<glyph unicode="&#x2002;" horiz-adv-x="652" />
+<glyph unicode="&#x2003;" horiz-adv-x="1304" />
+<glyph unicode="&#x2004;" horiz-adv-x="434" />
+<glyph unicode="&#x2005;" horiz-adv-x="326" />
+<glyph unicode="&#x2006;" horiz-adv-x="217" />
+<glyph unicode="&#x2007;" horiz-adv-x="217" />
+<glyph unicode="&#x2008;" horiz-adv-x="163" />
+<glyph unicode="&#x2009;" horiz-adv-x="260" />
+<glyph unicode="&#x200a;" horiz-adv-x="72" />
+<glyph unicode="&#x202f;" horiz-adv-x="260" />
+<glyph unicode="&#x205f;" horiz-adv-x="326" />
+<glyph unicode="&#x20ac;" d="M100 500l100 100h113q0 47 5 100h-218l100 100h135q37 167 112 257q117 141 297 141q242 0 354 -189q60 -103 66 -209h-181q0 55 -25.5 99t-63.5 68t-75 36.5t-67 12.5q-24 0 -52.5 -10t-62.5 -32t-65.5 -67t-50.5 -107h379l-100 -100h-300q-6 -46 -6 -100h406l-100 -100 h-300q9 -74 33 -132t52.5 -91t62 -54.5t59 -29t46.5 -7.5q29 0 66 13t75 37t63.5 67.5t25.5 96.5h174q-31 -172 -128 -278q-107 -117 -274 -117q-205 0 -324 158q-36 46 -69 131.5t-45 205.5h-217z" />
+<glyph unicode="&#x2212;" d="M200 400h900v300h-900v-300z" />
+<glyph unicode="&#x25fc;" horiz-adv-x="500" d="M0 0z" />
+<glyph unicode="&#x2601;" d="M-14 494q0 -80 56.5 -137t135.5 -57h750q120 0 205 86.5t85 207.5t-85 207t-205 86q-46 0 -90 -14q-44 97 -134.5 156.5t-200.5 59.5q-152 0 -260 -107.5t-108 -260.5q0 -25 2 -37q-66 -14 -108.5 -67.5t-42.5 -122.5z" />
+<glyph unicode="&#x2709;" d="M0 100l400 400l200 -200l200 200l400 -400h-1200zM0 300v600l300 -300zM0 1100l600 -603l600 603h-1200zM900 600l300 300v-600z" />
+<glyph unicode="&#x270f;" d="M-13 -13l333 112l-223 223zM187 403l214 -214l614 614l-214 214zM887 1103l214 -214l99 92q13 13 13 32.5t-13 33.5l-153 153q-15 13 -33 13t-33 -13z" />
+<glyph unicode="&#xe001;" d="M0 1200h1200l-500 -550v-550h300v-100h-800v100h300v550z" />
+<glyph unicode="&#xe002;" d="M14 84q18 -55 86 -75.5t147 5.5q65 21 109 69t44 90v606l600 155v-521q-64 16 -138 -7q-79 -26 -122.5 -83t-25.5 -111q18 -55 86 -75.5t147 4.5q70 23 111.5 63.5t41.5 95.5v881q0 10 -7 15.5t-17 2.5l-752 -193q-10 -3 -17 -12.5t-7 -19.5v-689q-64 17 -138 -7 q-79 -25 -122.5 -82t-25.5 -112z" />
+<glyph unicode="&#xe003;" d="M23 693q0 200 142 342t342 142t342 -142t142 -342q0 -142 -78 -261l300 -300q7 -8 7 -18t-7 -18l-109 -109q-8 -7 -18 -7t-18 7l-300 300q-119 -78 -261 -78q-200 0 -342 142t-142 342zM176 693q0 -136 97 -233t234 -97t233.5 96.5t96.5 233.5t-96.5 233.5t-233.5 96.5 t-234 -97t-97 -233z" />
+<glyph unicode="&#xe005;" d="M100 784q0 64 28 123t73 100.5t104.5 64t119 20.5t120 -38.5t104.5 -104.5q48 69 109.5 105t121.5 38t118.5 -20.5t102.5 -64t71 -100.5t27 -123q0 -57 -33.5 -117.5t-94 -124.5t-126.5 -127.5t-150 -152.5t-146 -174q-62 85 -145.5 174t-149.5 152.5t-126.5 127.5 t-94 124.5t-33.5 117.5z" />
+<glyph unicode="&#xe006;" d="M-72 800h479l146 400h2l146 -400h472l-382 -278l145 -449l-384 275l-382 -275l146 447zM168 71l2 1z" />
+<glyph unicode="&#xe007;" d="M-72 800h479l146 400h2l146 -400h472l-382 -278l145 -449l-384 275l-382 -275l146 447zM168 71l2 1zM237 700l196 -142l-73 -226l192 140l195 -141l-74 229l193 140h-235l-77 211l-78 -211h-239z" />
+<glyph unicode="&#xe008;" d="M0 0v143l400 257v100q-37 0 -68.5 74.5t-31.5 125.5v200q0 124 88 212t212 88t212 -88t88 -212v-200q0 -51 -31.5 -125.5t-68.5 -74.5v-100l400 -257v-143h-1200z" />
+<glyph unicode="&#xe009;" d="M0 0v1100h1200v-1100h-1200zM100 100h100v100h-100v-100zM100 300h100v100h-100v-100zM100 500h100v100h-100v-100zM100 700h100v100h-100v-100zM100 900h100v100h-100v-100zM300 100h600v400h-600v-400zM300 600h600v400h-600v-400zM1000 100h100v100h-100v-100z M1000 300h100v100h-100v-100zM1000 500h100v100h-100v-100zM1000 700h100v100h-100v-100zM1000 900h100v100h-100v-100z" />
+<glyph unicode="&#xe010;" d="M0 50v400q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5zM0 650v400q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400 q-21 0 -35.5 14.5t-14.5 35.5zM600 50v400q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-400q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5zM600 650v400q0 21 14.5 35.5t35.5 14.5h400q21 0 35.5 -14.5t14.5 -35.5v-400 q0 -21 -14.5 -35.5t-35.5 -14.5h-400q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe011;" d="M0 50v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM0 450v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200 q-21 0 -35.5 14.5t-14.5 35.5zM0 850v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM400 50v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5 t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM400 450v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM400 850v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5 v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM800 50v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM800 450v200q0 21 14.5 35.5t35.5 14.5h200 q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM800 850v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe012;" d="M0 50v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM0 450q0 -21 14.5 -35.5t35.5 -14.5h200q21 0 35.5 14.5t14.5 35.5v200q0 21 -14.5 35.5t-35.5 14.5h-200q-21 0 -35.5 -14.5 t-14.5 -35.5v-200zM0 850v200q0 21 14.5 35.5t35.5 14.5h200q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5zM400 50v200q0 21 14.5 35.5t35.5 14.5h700q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5 t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5zM400 450v200q0 21 14.5 35.5t35.5 14.5h700q21 0 35.5 -14.5t14.5 -35.5v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5zM400 850v200q0 21 14.5 35.5t35.5 14.5h700q21 0 35.5 -14.5t14.5 -35.5 v-200q0 -21 -14.5 -35.5t-35.5 -14.5h-700q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe013;" d="M29 454l419 -420l818 820l-212 212l-607 -607l-206 207z" />
+<glyph unicode="&#xe014;" d="M106 318l282 282l-282 282l212 212l282 -282l282 282l212 -212l-282 -282l282 -282l-212 -212l-282 282l-282 -282z" />
+<glyph unicode="&#xe015;" d="M23 693q0 200 142 342t342 142t342 -142t142 -342q0 -142 -78 -261l300 -300q7 -8 7 -18t-7 -18l-109 -109q-8 -7 -18 -7t-18 7l-300 300q-119 -78 -261 -78q-200 0 -342 142t-142 342zM176 693q0 -136 97 -233t234 -97t233.5 96.5t96.5 233.5t-96.5 233.5t-233.5 96.5 t-234 -97t-97 -233zM300 600v200h100v100h200v-100h100v-200h-100v-100h-200v100h-100z" />
+<glyph unicode="&#xe016;" d="M23 694q0 200 142 342t342 142t342 -142t142 -342q0 -141 -78 -262l300 -299q7 -7 7 -18t-7 -18l-109 -109q-8 -8 -18 -8t-18 8l-300 300q-119 -78 -261 -78q-200 0 -342 142t-142 342zM176 694q0 -136 97 -233t234 -97t233.5 97t96.5 233t-96.5 233t-233.5 97t-234 -97 t-97 -233zM300 601h400v200h-400v-200z" />
+<glyph unicode="&#xe017;" d="M23 600q0 183 105 331t272 210v-166q-103 -55 -165 -155t-62 -220q0 -177 125 -302t302 -125t302 125t125 302q0 120 -62 220t-165 155v166q167 -62 272 -210t105 -331q0 -118 -45.5 -224.5t-123 -184t-184 -123t-224.5 -45.5t-224.5 45.5t-184 123t-123 184t-45.5 224.5 zM500 750q0 -21 14.5 -35.5t35.5 -14.5h100q21 0 35.5 14.5t14.5 35.5v400q0 21 -14.5 35.5t-35.5 14.5h-100q-21 0 -35.5 -14.5t-14.5 -35.5v-400z" />
+<glyph unicode="&#xe018;" d="M100 1h200v300h-200v-300zM400 1v500h200v-500h-200zM700 1v800h200v-800h-200zM1000 1v1200h200v-1200h-200z" />
+<glyph unicode="&#xe019;" d="M26 601q0 -33 6 -74l151 -38l2 -6q14 -49 38 -93l3 -5l-80 -134q45 -59 105 -105l133 81l5 -3q45 -26 94 -39l5 -2l38 -151q40 -5 74 -5q27 0 74 5l38 151l6 2q46 13 93 39l5 3l134 -81q56 44 104 105l-80 134l3 5q24 44 39 93l1 6l152 38q5 40 5 74q0 28 -5 73l-152 38 l-1 6q-16 51 -39 93l-3 5l80 134q-44 58 -104 105l-134 -81l-5 3q-45 25 -93 39l-6 1l-38 152q-40 5 -74 5q-27 0 -74 -5l-38 -152l-5 -1q-50 -14 -94 -39l-5 -3l-133 81q-59 -47 -105 -105l80 -134l-3 -5q-25 -47 -38 -93l-2 -6l-151 -38q-6 -48 -6 -73zM385 601 q0 88 63 151t152 63t152 -63t63 -151q0 -89 -63 -152t-152 -63t-152 63t-63 152z" />
+<glyph unicode="&#xe020;" d="M100 1025v50q0 10 7.5 17.5t17.5 7.5h275v100q0 41 29.5 70.5t70.5 29.5h300q41 0 70.5 -29.5t29.5 -70.5v-100h275q10 0 17.5 -7.5t7.5 -17.5v-50q0 -11 -7 -18t-18 -7h-1050q-11 0 -18 7t-7 18zM200 100v800h900v-800q0 -41 -29.5 -71t-70.5 -30h-700q-41 0 -70.5 30 t-29.5 71zM300 100h100v700h-100v-700zM500 100h100v700h-100v-700zM500 1100h300v100h-300v-100zM700 100h100v700h-100v-700zM900 100h100v700h-100v-700z" />
+<glyph unicode="&#xe021;" d="M1 601l656 644l644 -644h-200v-600h-300v400h-300v-400h-300v600h-200z" />
+<glyph unicode="&#xe022;" d="M100 25v1150q0 11 7 18t18 7h475v-500h400v-675q0 -11 -7 -18t-18 -7h-850q-11 0 -18 7t-7 18zM700 800v300l300 -300h-300z" />
+<glyph unicode="&#xe023;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM500 500v400h100 v-300h200v-100h-300z" />
+<glyph unicode="&#xe024;" d="M-100 0l431 1200h209l-21 -300h162l-20 300h208l431 -1200h-538l-41 400h-242l-40 -400h-539zM488 500h224l-27 300h-170z" />
+<glyph unicode="&#xe025;" d="M0 0v400h490l-290 300h200v500h300v-500h200l-290 -300h490v-400h-1100zM813 200h175v100h-175v-100z" />
+<glyph unicode="&#xe026;" d="M1 600q0 122 47.5 233t127.5 191t191 127.5t233 47.5t233 -47.5t191 -127.5t127.5 -191t47.5 -233t-47.5 -233t-127.5 -191t-191 -127.5t-233 -47.5t-233 47.5t-191 127.5t-127.5 191t-47.5 233zM188 600q0 -170 121 -291t291 -121t291 121t121 291t-121 291t-291 121 t-291 -121t-121 -291zM350 600h150v300h200v-300h150l-250 -300z" />
+<glyph unicode="&#xe027;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM350 600l250 300 l250 -300h-150v-300h-200v300h-150z" />
+<glyph unicode="&#xe028;" d="M0 25v475l200 700h800l199 -700l1 -475q0 -11 -7 -18t-18 -7h-1150q-11 0 -18 7t-7 18zM200 500h200l50 -200h300l50 200h200l-97 500h-606z" />
+<glyph unicode="&#xe029;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -172 121.5 -293t292.5 -121t292.5 121t121.5 293q0 171 -121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM500 397v401 l297 -200z" />
+<glyph unicode="&#xe030;" d="M23 600q0 -118 45.5 -224.5t123 -184t184 -123t224.5 -45.5t224.5 45.5t184 123t123 184t45.5 224.5h-150q0 -177 -125 -302t-302 -125t-302 125t-125 302t125 302t302 125q136 0 246 -81l-146 -146h400v400l-145 -145q-157 122 -355 122q-118 0 -224.5 -45.5t-184 -123 t-123 -184t-45.5 -224.5z" />
+<glyph unicode="&#xe031;" d="M23 600q0 118 45.5 224.5t123 184t184 123t224.5 45.5q198 0 355 -122l145 145v-400h-400l147 147q-112 80 -247 80q-177 0 -302 -125t-125 -302h-150zM100 0v400h400l-147 -147q112 -80 247 -80q177 0 302 125t125 302h150q0 -118 -45.5 -224.5t-123 -184t-184 -123 t-224.5 -45.5q-198 0 -355 122z" />
+<glyph unicode="&#xe032;" d="M100 0h1100v1200h-1100v-1200zM200 100v900h900v-900h-900zM300 200v100h100v-100h-100zM300 400v100h100v-100h-100zM300 600v100h100v-100h-100zM300 800v100h100v-100h-100zM500 200h500v100h-500v-100zM500 400v100h500v-100h-500zM500 600v100h500v-100h-500z M500 800v100h500v-100h-500z" />
+<glyph unicode="&#xe033;" d="M0 100v600q0 41 29.5 70.5t70.5 29.5h100v200q0 82 59 141t141 59h300q82 0 141 -59t59 -141v-200h100q41 0 70.5 -29.5t29.5 -70.5v-600q0 -41 -29.5 -70.5t-70.5 -29.5h-900q-41 0 -70.5 29.5t-29.5 70.5zM400 800h300v150q0 21 -14.5 35.5t-35.5 14.5h-200 q-21 0 -35.5 -14.5t-14.5 -35.5v-150z" />
+<glyph unicode="&#xe034;" d="M100 0v1100h100v-1100h-100zM300 400q60 60 127.5 84t127.5 17.5t122 -23t119 -30t110 -11t103 42t91 120.5v500q-40 -81 -101.5 -115.5t-127.5 -29.5t-138 25t-139.5 40t-125.5 25t-103 -29.5t-65 -115.5v-500z" />
+<glyph unicode="&#xe035;" d="M0 275q0 -11 7 -18t18 -7h50q11 0 18 7t7 18v300q0 127 70.5 231.5t184.5 161.5t245 57t245 -57t184.5 -161.5t70.5 -231.5v-300q0 -11 7 -18t18 -7h50q11 0 18 7t7 18v300q0 116 -49.5 227t-131 192.5t-192.5 131t-227 49.5t-227 -49.5t-192.5 -131t-131 -192.5 t-49.5 -227v-300zM200 20v460q0 8 6 14t14 6h160q8 0 14 -6t6 -14v-460q0 -8 -6 -14t-14 -6h-160q-8 0 -14 6t-6 14zM800 20v460q0 8 6 14t14 6h160q8 0 14 -6t6 -14v-460q0 -8 -6 -14t-14 -6h-160q-8 0 -14 6t-6 14z" />
+<glyph unicode="&#xe036;" d="M0 400h300l300 -200v800l-300 -200h-300v-400zM688 459l141 141l-141 141l71 71l141 -141l141 141l71 -71l-141 -141l141 -141l-71 -71l-141 141l-141 -141z" />
+<glyph unicode="&#xe037;" d="M0 400h300l300 -200v800l-300 -200h-300v-400zM700 857l69 53q111 -135 111 -310q0 -169 -106 -302l-67 54q86 110 86 248q0 146 -93 257z" />
+<glyph unicode="&#xe038;" d="M0 401v400h300l300 200v-800l-300 200h-300zM702 858l69 53q111 -135 111 -310q0 -170 -106 -303l-67 55q86 110 86 248q0 145 -93 257zM889 951l7 -8q123 -151 123 -344q0 -189 -119 -339l-7 -8l81 -66l6 8q142 178 142 405q0 230 -144 408l-6 8z" />
+<glyph unicode="&#xe039;" d="M0 0h500v500h-200v100h-100v-100h-200v-500zM0 600h100v100h400v100h100v100h-100v300h-500v-600zM100 100v300h300v-300h-300zM100 800v300h300v-300h-300zM200 200v100h100v-100h-100zM200 900h100v100h-100v-100zM500 500v100h300v-300h200v-100h-100v-100h-200v100 h-100v100h100v200h-200zM600 0v100h100v-100h-100zM600 1000h100v-300h200v-300h300v200h-200v100h200v500h-600v-200zM800 800v300h300v-300h-300zM900 0v100h300v-100h-300zM900 900v100h100v-100h-100zM1100 200v100h100v-100h-100z" />
+<glyph unicode="&#xe040;" d="M0 200h100v1000h-100v-1000zM100 0v100h300v-100h-300zM200 200v1000h100v-1000h-100zM500 0v91h100v-91h-100zM500 200v1000h200v-1000h-200zM700 0v91h100v-91h-100zM800 200v1000h100v-1000h-100zM900 0v91h200v-91h-200zM1000 200v1000h200v-1000h-200z" />
+<glyph unicode="&#xe041;" d="M0 700l1 475q0 10 7.5 17.5t17.5 7.5h474l700 -700l-500 -500zM148 953q0 -42 29 -71q30 -30 71.5 -30t71.5 30q29 29 29 71t-29 71q-30 30 -71.5 30t-71.5 -30q-29 -29 -29 -71z" />
+<glyph unicode="&#xe042;" d="M1 700l1 475q0 11 7 18t18 7h474l700 -700l-500 -500zM148 953q0 -42 30 -71q29 -30 71 -30t71 30q30 29 30 71t-30 71q-29 30 -71 30t-71 -30q-30 -29 -30 -71zM701 1200h100l700 -700l-500 -500l-50 50l450 450z" />
+<glyph unicode="&#xe043;" d="M100 0v1025l175 175h925v-1000l-100 -100v1000h-750l-100 -100h750v-1000h-900z" />
+<glyph unicode="&#xe044;" d="M200 0l450 444l450 -443v1150q0 20 -14.5 35t-35.5 15h-800q-21 0 -35.5 -15t-14.5 -35v-1151z" />
+<glyph unicode="&#xe045;" d="M0 100v700h200l100 -200h600l100 200h200v-700h-200v200h-800v-200h-200zM253 829l40 -124h592l62 124l-94 346q-2 11 -10 18t-18 7h-450q-10 0 -18 -7t-10 -18zM281 24l38 152q2 10 11.5 17t19.5 7h500q10 0 19.5 -7t11.5 -17l38 -152q2 -10 -3.5 -17t-15.5 -7h-600 q-10 0 -15.5 7t-3.5 17z" />
+<glyph unicode="&#xe046;" d="M0 200q0 -41 29.5 -70.5t70.5 -29.5h1000q41 0 70.5 29.5t29.5 70.5v600q0 41 -29.5 70.5t-70.5 29.5h-150q-4 8 -11.5 21.5t-33 48t-53 61t-69 48t-83.5 21.5h-200q-41 0 -82 -20.5t-70 -50t-52 -59t-34 -50.5l-12 -20h-150q-41 0 -70.5 -29.5t-29.5 -70.5v-600z M356 500q0 100 72 172t172 72t172 -72t72 -172t-72 -172t-172 -72t-172 72t-72 172zM494 500q0 -44 31 -75t75 -31t75 31t31 75t-31 75t-75 31t-75 -31t-31 -75zM900 700v100h100v-100h-100z" />
+<glyph unicode="&#xe047;" d="M53 0h365v66q-41 0 -72 11t-49 38t1 71l92 234h391l82 -222q16 -45 -5.5 -88.5t-74.5 -43.5v-66h417v66q-34 1 -74 43q-18 19 -33 42t-21 37l-6 13l-385 998h-93l-399 -1006q-24 -48 -52 -75q-12 -12 -33 -25t-36 -20l-15 -7v-66zM416 521l178 457l46 -140l116 -317h-340 z" />
+<glyph unicode="&#xe048;" d="M100 0v89q41 7 70.5 32.5t29.5 65.5v827q0 28 -1 39.5t-5.5 26t-15.5 21t-29 14t-49 14.5v71l471 -1q120 0 213 -88t93 -228q0 -55 -11.5 -101.5t-28 -74t-33.5 -47.5t-28 -28l-12 -7q8 -3 21.5 -9t48 -31.5t60.5 -58t47.5 -91.5t21.5 -129q0 -84 -59 -156.5t-142 -111 t-162 -38.5h-500zM400 200h161q89 0 153 48.5t64 132.5q0 90 -62.5 154.5t-156.5 64.5h-159v-400zM400 700h139q76 0 130 61.5t54 138.5q0 82 -84 130.5t-239 48.5v-379z" />
+<glyph unicode="&#xe049;" d="M200 0v57q77 7 134.5 40.5t65.5 80.5l173 849q10 56 -10 74t-91 37q-6 1 -10.5 2.5t-9.5 2.5v57h425l2 -57q-33 -8 -62 -25.5t-46 -37t-29.5 -38t-17.5 -30.5l-5 -12l-128 -825q-10 -52 14 -82t95 -36v-57h-500z" />
+<glyph unicode="&#xe050;" d="M-75 200h75v800h-75l125 167l125 -167h-75v-800h75l-125 -167zM300 900v300h150h700h150v-300h-50q0 29 -8 48.5t-18.5 30t-33.5 15t-39.5 5.5t-50.5 1h-200v-850l100 -50v-100h-400v100l100 50v850h-200q-34 0 -50.5 -1t-40 -5.5t-33.5 -15t-18.5 -30t-8.5 -48.5h-49z " />
+<glyph unicode="&#xe051;" d="M33 51l167 125v-75h800v75l167 -125l-167 -125v75h-800v-75zM100 901v300h150h700h150v-300h-50q0 29 -8 48.5t-18 30t-33.5 15t-40 5.5t-50.5 1h-200v-650l100 -50v-100h-400v100l100 50v650h-200q-34 0 -50.5 -1t-39.5 -5.5t-33.5 -15t-18.5 -30t-8 -48.5h-50z" />
+<glyph unicode="&#xe052;" d="M0 50q0 -20 14.5 -35t35.5 -15h1100q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-1100q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM0 350q0 -20 14.5 -35t35.5 -15h800q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-800q-21 0 -35.5 -14.5t-14.5 -35.5 v-100zM0 650q0 -20 14.5 -35t35.5 -15h1000q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-1000q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM0 950q0 -20 14.5 -35t35.5 -15h600q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-600q-21 0 -35.5 -14.5 t-14.5 -35.5v-100z" />
+<glyph unicode="&#xe053;" d="M0 50q0 -20 14.5 -35t35.5 -15h1100q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-1100q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM0 650q0 -20 14.5 -35t35.5 -15h1100q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-1100q-21 0 -35.5 -14.5t-14.5 -35.5 v-100zM200 350q0 -20 14.5 -35t35.5 -15h700q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-700q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM200 950q0 -20 14.5 -35t35.5 -15h700q21 0 35.5 15t14.5 35v100q0 21 -14.5 35.5t-35.5 14.5h-700q-21 0 -35.5 -14.5 t-14.5 -35.5v-100z" />
+<glyph unicode="&#xe054;" d="M0 50v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100q-21 0 -35.5 15t-14.5 35zM100 650v100q0 21 14.5 35.5t35.5 14.5h1000q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1000q-21 0 -35.5 15 t-14.5 35zM300 350v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-800q-21 0 -35.5 15t-14.5 35zM500 950v100q0 21 14.5 35.5t35.5 14.5h600q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-600 q-21 0 -35.5 15t-14.5 35z" />
+<glyph unicode="&#xe055;" d="M0 50v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100q-21 0 -35.5 15t-14.5 35zM0 350v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100q-21 0 -35.5 15 t-14.5 35zM0 650v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100q-21 0 -35.5 15t-14.5 35zM0 950v100q0 21 14.5 35.5t35.5 14.5h1100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-1100 q-21 0 -35.5 15t-14.5 35z" />
+<glyph unicode="&#xe056;" d="M0 50v100q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-100q-21 0 -35.5 15t-14.5 35zM0 350v100q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-100q-21 0 -35.5 15 t-14.5 35zM0 650v100q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-100q-21 0 -35.5 15t-14.5 35zM0 950v100q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-100q-21 0 -35.5 15 t-14.5 35zM300 50v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-800q-21 0 -35.5 15t-14.5 35zM300 350v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-800 q-21 0 -35.5 15t-14.5 35zM300 650v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15h-800q-21 0 -35.5 15t-14.5 35zM300 950v100q0 21 14.5 35.5t35.5 14.5h800q21 0 35.5 -14.5t14.5 -35.5v-100q0 -20 -14.5 -35t-35.5 -15 h-800q-21 0 -35.5 15t-14.5 35z" />
+<glyph unicode="&#xe057;" d="M-101 500v100h201v75l166 -125l-166 -125v75h-201zM300 0h100v1100h-100v-1100zM500 50q0 -20 14.5 -35t35.5 -15h600q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-600q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM500 350q0 -20 14.5 -35t35.5 -15h300q20 0 35 15t15 35 v100q0 21 -15 35.5t-35 14.5h-300q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM500 650q0 -20 14.5 -35t35.5 -15h500q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-500q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM500 950q0 -20 14.5 -35t35.5 -15h100q20 0 35 15t15 35v100 q0 21 -15 35.5t-35 14.5h-100q-21 0 -35.5 -14.5t-14.5 -35.5v-100z" />
+<glyph unicode="&#xe058;" d="M1 50q0 -20 14.5 -35t35.5 -15h600q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-600q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM1 350q0 -20 14.5 -35t35.5 -15h300q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-300q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM1 650 q0 -20 14.5 -35t35.5 -15h500q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-500q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM1 950q0 -20 14.5 -35t35.5 -15h100q20 0 35 15t15 35v100q0 21 -15 35.5t-35 14.5h-100q-21 0 -35.5 -14.5t-14.5 -35.5v-100zM801 0v1100h100v-1100 h-100zM934 550l167 -125v75h200v100h-200v75z" />
+<glyph unicode="&#xe059;" d="M0 275v650q0 31 22 53t53 22h750q31 0 53 -22t22 -53v-650q0 -31 -22 -53t-53 -22h-750q-31 0 -53 22t-22 53zM900 600l300 300v-600z" />
+<glyph unicode="&#xe060;" d="M0 44v1012q0 18 13 31t31 13h1112q19 0 31.5 -13t12.5 -31v-1012q0 -18 -12.5 -31t-31.5 -13h-1112q-18 0 -31 13t-13 31zM100 263l247 182l298 -131l-74 156l293 318l236 -288v500h-1000v-737zM208 750q0 56 39 95t95 39t95 -39t39 -95t-39 -95t-95 -39t-95 39t-39 95z " />
+<glyph unicode="&#xe062;" d="M148 745q0 124 60.5 231.5t165 172t226.5 64.5q123 0 227 -63t164.5 -169.5t60.5 -229.5t-73 -272q-73 -114 -166.5 -237t-150.5 -189l-57 -66q-10 9 -27 26t-66.5 70.5t-96 109t-104 135.5t-100.5 155q-63 139 -63 262zM342 772q0 -107 75.5 -182.5t181.5 -75.5 q107 0 182.5 75.5t75.5 182.5t-75.5 182t-182.5 75t-182 -75.5t-75 -181.5z" />
+<glyph unicode="&#xe063;" d="M1 600q0 122 47.5 233t127.5 191t191 127.5t233 47.5t233 -47.5t191 -127.5t127.5 -191t47.5 -233t-47.5 -233t-127.5 -191t-191 -127.5t-233 -47.5t-233 47.5t-191 127.5t-127.5 191t-47.5 233zM173 600q0 -177 125.5 -302t301.5 -125v854q-176 0 -301.5 -125 t-125.5 -302z" />
+<glyph unicode="&#xe064;" d="M117 406q0 94 34 186t88.5 172.5t112 159t115 177t87.5 194.5q21 -71 57.5 -142.5t76 -130.5t83 -118.5t82 -117t70 -116t50 -125.5t18.5 -136q0 -89 -39 -165.5t-102 -126.5t-140 -79.5t-156 -33.5q-114 6 -211.5 53t-161.5 139t-64 210zM243 414q14 -82 59.5 -136 t136.5 -80l16 98q-7 6 -18 17t-34 48t-33 77q-15 73 -14 143.5t10 122.5l9 51q-92 -110 -119.5 -185t-12.5 -156z" />
+<glyph unicode="&#xe065;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5q366 -6 397 -14l-186 -186h-311q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v125l200 200v-225q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-165 0 -282.5 117.5 t-117.5 282.5zM436 341l161 50l412 412l-114 113l-405 -405zM995 1015l113 -113l113 113l-21 85l-92 28z" />
+<glyph unicode="&#xe066;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5h261l2 -80q-133 -32 -218 -120h-145q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5l200 153v-53q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-165 0 -282.5 117.5t-117.5 282.5 zM423 524q30 38 81.5 64t103 35.5t99 14t77.5 3.5l29 -1v-209l360 324l-359 318v-216q-7 0 -19 -1t-48 -8t-69.5 -18.5t-76.5 -37t-76.5 -59t-62 -88t-39.5 -121.5z" />
+<glyph unicode="&#xe067;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5h300q61 0 127 -23l-178 -177h-349q-41 0 -70.5 -29.5t-29.5 -70.5v-500q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v69l200 200v-169q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-165 0 -282.5 117.5 t-117.5 282.5zM342 632l283 -284l567 567l-137 137l-430 -431l-146 147z" />
+<glyph unicode="&#xe068;" d="M0 603l300 296v-198h200v200h-200l300 300l295 -300h-195v-200h200v198l300 -296l-300 -300v198h-200v-200h195l-295 -300l-300 300h200v200h-200v-198z" />
+<glyph unicode="&#xe069;" d="M200 50v1000q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-437l500 487v-1100l-500 488v-438q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe070;" d="M0 50v1000q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-437l500 487v-487l500 487v-1100l-500 488v-488l-500 488v-438q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5z" />
+<glyph unicode="&#xe071;" d="M136 550l564 550v-487l500 487v-1100l-500 488v-488z" />
+<glyph unicode="&#xe072;" d="M200 0l900 550l-900 550v-1100z" />
+<glyph unicode="&#xe073;" d="M200 150q0 -21 14.5 -35.5t35.5 -14.5h200q21 0 35.5 14.5t14.5 35.5v800q0 21 -14.5 35.5t-35.5 14.5h-200q-21 0 -35.5 -14.5t-14.5 -35.5v-800zM600 150q0 -21 14.5 -35.5t35.5 -14.5h200q21 0 35.5 14.5t14.5 35.5v800q0 21 -14.5 35.5t-35.5 14.5h-200 q-21 0 -35.5 -14.5t-14.5 -35.5v-800z" />
+<glyph unicode="&#xe074;" d="M200 150q0 -20 14.5 -35t35.5 -15h800q21 0 35.5 15t14.5 35v800q0 21 -14.5 35.5t-35.5 14.5h-800q-21 0 -35.5 -14.5t-14.5 -35.5v-800z" />
+<glyph unicode="&#xe075;" d="M0 0v1100l500 -487v487l564 -550l-564 -550v488z" />
+<glyph unicode="&#xe076;" d="M0 0v1100l500 -487v487l500 -487v437q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-1000q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v438l-500 -488v488z" />
+<glyph unicode="&#xe077;" d="M300 0v1100l500 -487v437q0 21 14.5 35.5t35.5 14.5h100q21 0 35.5 -14.5t14.5 -35.5v-1000q0 -21 -14.5 -35.5t-35.5 -14.5h-100q-21 0 -35.5 14.5t-14.5 35.5v438z" />
+<glyph unicode="&#xe078;" d="M100 250v100q0 21 14.5 35.5t35.5 14.5h1000q21 0 35.5 -14.5t14.5 -35.5v-100q0 -21 -14.5 -35.5t-35.5 -14.5h-1000q-21 0 -35.5 14.5t-14.5 35.5zM100 500h1100l-550 564z" />
+<glyph unicode="&#xe079;" d="M185 599l592 -592l240 240l-353 353l353 353l-240 240z" />
+<glyph unicode="&#xe080;" d="M272 194l353 353l-353 353l241 240l572 -571l21 -22l-1 -1v-1l-592 -591z" />
+<glyph unicode="&#xe081;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -299.5t-217.5 -217.5t-299.5 -80t-299.5 80t-217.5 217.5t-80 299.5zM300 500h200v-200h200v200h200v200h-200v200h-200v-200h-200v-200z" />
+<glyph unicode="&#xe082;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -299.5t-217.5 -217.5t-299.5 -80t-299.5 80t-217.5 217.5t-80 299.5zM300 500h600v200h-600v-200z" />
+<glyph unicode="&#xe083;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -299.5t-217.5 -217.5t-299.5 -80t-299.5 80t-217.5 217.5t-80 299.5zM246 459l213 -213l141 142l141 -142l213 213l-142 141l142 141l-213 212l-141 -141l-141 142l-212 -213l141 -141 z" />
+<glyph unicode="&#xe084;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -299.5t-217.5 -217.5t-299.5 -80t-299.5 80t-217.5 217.5t-80 299.5zM270 551l276 -277l411 411l-175 174l-236 -236l-102 102z" />
+<glyph unicode="&#xe085;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -299.5t-217.5 -217.5t-299.5 -80t-299.5 80t-217.5 217.5t-80 299.5zM364 700h143q4 0 11.5 -1t11 -1t6.5 3t3 9t1 11t3.5 8.5t3.5 6t5.5 4t6.5 2.5t9 1.5t9 0.5h11.5h12.5 q19 0 30 -10t11 -26q0 -22 -4 -28t-27 -22q-5 -1 -12.5 -3t-27 -13.5t-34 -27t-26.5 -46t-11 -68.5h200q5 3 14 8t31.5 25.5t39.5 45.5t31 69t14 94q0 51 -17.5 89t-42 58t-58.5 32t-58.5 15t-51.5 3q-50 0 -90.5 -12t-75 -38.5t-53.5 -74.5t-19 -114zM500 300h200v100h-200 v-100z" />
+<glyph unicode="&#xe086;" d="M3 600q0 162 80 299.5t217.5 217.5t299.5 80t299.5 -80t217.5 -217.5t80 -299.5t-80 -299.5t-217.5 -217.5t-299.5 -80t-299.5 80t-217.5 217.5t-80 299.5zM400 300h400v100h-100v300h-300v-100h100v-200h-100v-100zM500 800h200v100h-200v-100z" />
+<glyph unicode="&#xe087;" d="M0 500v200h195q31 125 98.5 199.5t206.5 100.5v200h200v-200q54 -20 113 -60t112.5 -105.5t71.5 -134.5h203v-200h-203q-25 -102 -116.5 -186t-180.5 -117v-197h-200v197q-140 27 -208 102.5t-98 200.5h-194zM290 500q24 -73 79.5 -127.5t130.5 -78.5v206h200v-206 q149 48 201 206h-201v200h200q-25 74 -75.5 127t-124.5 77v-204h-200v203q-75 -23 -130 -77t-79 -126h209v-200h-210z" />
+<glyph unicode="&#xe088;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM356 465l135 135 l-135 135l109 109l135 -135l135 135l109 -109l-135 -135l135 -135l-109 -109l-135 135l-135 -135z" />
+<glyph unicode="&#xe089;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM322 537l141 141 l87 -87l204 205l142 -142l-346 -345z" />
+<glyph unicode="&#xe090;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -115 62 -215l568 567q-100 62 -216 62q-171 0 -292.5 -121.5t-121.5 -292.5zM391 245q97 -59 209 -59q171 0 292.5 121.5t121.5 292.5 q0 112 -59 209z" />
+<glyph unicode="&#xe091;" d="M0 547l600 453v-300h600v-300h-600v-301z" />
+<glyph unicode="&#xe092;" d="M0 400v300h600v300l600 -453l-600 -448v301h-600z" />
+<glyph unicode="&#xe093;" d="M204 600l450 600l444 -600h-298v-600h-300v600h-296z" />
+<glyph unicode="&#xe094;" d="M104 600h296v600h300v-600h298l-449 -600z" />
+<glyph unicode="&#xe095;" d="M0 200q6 132 41 238.5t103.5 193t184 138t271.5 59.5v271l600 -453l-600 -448v301q-95 -2 -183 -20t-170 -52t-147 -92.5t-100 -135.5z" />
+<glyph unicode="&#xe096;" d="M0 0v400l129 -129l294 294l142 -142l-294 -294l129 -129h-400zM635 777l142 -142l294 294l129 -129v400h-400l129 -129z" />
+<glyph unicode="&#xe097;" d="M34 176l295 295l-129 129h400v-400l-129 130l-295 -295zM600 600v400l129 -129l295 295l142 -141l-295 -295l129 -130h-400z" />
+<glyph unicode="&#xe101;" d="M23 600q0 118 45.5 224.5t123 184t184 123t224.5 45.5t224.5 -45.5t184 -123t123 -184t45.5 -224.5t-45.5 -224.5t-123 -184t-184 -123t-224.5 -45.5t-224.5 45.5t-184 123t-123 184t-45.5 224.5zM456 851l58 -302q4 -20 21.5 -34.5t37.5 -14.5h54q20 0 37.5 14.5 t21.5 34.5l58 302q4 20 -8 34.5t-32 14.5h-207q-21 0 -33 -14.5t-8 -34.5zM500 300h200v100h-200v-100z" />
+<glyph unicode="&#xe102;" d="M0 800h100v-200h400v300h200v-300h400v200h100v100h-111q1 1 1 6.5t-1.5 15t-3.5 17.5l-34 172q-11 39 -41.5 63t-69.5 24q-32 0 -61 -17l-239 -144q-22 -13 -40 -35q-19 24 -40 36l-238 144q-33 18 -62 18q-39 0 -69.5 -23t-40.5 -61l-35 -177q-2 -8 -3 -18t-1 -15v-6 h-111v-100zM100 0h400v400h-400v-400zM200 900q-3 0 14 48t36 96l18 47l213 -191h-281zM700 0v400h400v-400h-400zM731 900l202 197q5 -12 12 -32.5t23 -64t25 -72t7 -28.5h-269z" />
+<glyph unicode="&#xe103;" d="M0 -22v143l216 193q-9 53 -13 83t-5.5 94t9 113t38.5 114t74 124q47 60 99.5 102.5t103 68t127.5 48t145.5 37.5t184.5 43.5t220 58.5q0 -189 -22 -343t-59 -258t-89 -181.5t-108.5 -120t-122 -68t-125.5 -30t-121.5 -1.5t-107.5 12.5t-87.5 17t-56.5 7.5l-99 -55z M238.5 300.5q19.5 -6.5 86.5 76.5q55 66 367 234q70 38 118.5 69.5t102 79t99 111.5t86.5 148q22 50 24 60t-6 19q-7 5 -17 5t-26.5 -14.5t-33.5 -39.5q-35 -51 -113.5 -108.5t-139.5 -89.5l-61 -32q-369 -197 -458 -401q-48 -111 -28.5 -117.5z" />
+<glyph unicode="&#xe104;" d="M111 408q0 -33 5 -63q9 -56 44 -119.5t105 -108.5q31 -21 64 -16t62 23.5t57 49.5t48 61.5t35 60.5q32 66 39 184.5t-13 157.5q79 -80 122 -164t26 -184q-5 -33 -20.5 -69.5t-37.5 -80.5q-10 -19 -14.5 -29t-12 -26t-9 -23.5t-3 -19t2.5 -15.5t11 -9.5t19.5 -5t30.5 2.5 t42 8q57 20 91 34t87.5 44.5t87 64t65.5 88.5t47 122q38 172 -44.5 341.5t-246.5 278.5q22 -44 43 -129q39 -159 -32 -154q-15 2 -33 9q-79 33 -120.5 100t-44 175.5t48.5 257.5q-13 -8 -34 -23.5t-72.5 -66.5t-88.5 -105.5t-60 -138t-8 -166.5q2 -12 8 -41.5t8 -43t6 -39.5 t3.5 -39.5t-1 -33.5t-6 -31.5t-13.5 -24t-21 -20.5t-31 -12q-38 -10 -67 13t-40.5 61.5t-15 81.5t10.5 75q-52 -46 -83.5 -101t-39 -107t-7.5 -85z" />
+<glyph unicode="&#xe105;" d="M-61 600l26 40q6 10 20 30t49 63.5t74.5 85.5t97 90t116.5 83.5t132.5 59t145.5 23.5t145.5 -23.5t132.5 -59t116.5 -83.5t97 -90t74.5 -85.5t49 -63.5t20 -30l26 -40l-26 -40q-6 -10 -20 -30t-49 -63.5t-74.5 -85.5t-97 -90t-116.5 -83.5t-132.5 -59t-145.5 -23.5 t-145.5 23.5t-132.5 59t-116.5 83.5t-97 90t-74.5 85.5t-49 63.5t-20 30zM120 600q7 -10 40.5 -58t56 -78.5t68 -77.5t87.5 -75t103 -49.5t125 -21.5t123.5 20t100.5 45.5t85.5 71.5t66.5 75.5t58 81.5t47 66q-1 1 -28.5 37.5t-42 55t-43.5 53t-57.5 63.5t-58.5 54 q49 -74 49 -163q0 -124 -88 -212t-212 -88t-212 88t-88 212q0 85 46 158q-102 -87 -226 -258zM377 656q49 -124 154 -191l105 105q-37 24 -75 72t-57 84l-20 36z" />
+<glyph unicode="&#xe106;" d="M-61 600l26 40q6 10 20 30t49 63.5t74.5 85.5t97 90t116.5 83.5t132.5 59t145.5 23.5q61 0 121 -17l37 142h148l-314 -1200h-148l37 143q-82 21 -165 71.5t-140 102t-109.5 112t-72 88.5t-29.5 43zM120 600q210 -282 393 -336l37 141q-107 18 -178.5 101.5t-71.5 193.5 q0 85 46 158q-102 -87 -226 -258zM377 656q49 -124 154 -191l47 47l23 87q-30 28 -59 69t-44 68l-14 26zM780 161l38 145q22 15 44.5 34t46 44t40.5 44t41 50.5t33.5 43.5t33 44t24.5 34q-97 127 -140 175l39 146q67 -54 131.5 -125.5t87.5 -103.5t36 -52l26 -40l-26 -40 q-7 -12 -25.5 -38t-63.5 -79.5t-95.5 -102.5t-124 -100t-146.5 -79z" />
+<glyph unicode="&#xe107;" d="M-97.5 34q13.5 -34 50.5 -34h1294q37 0 50.5 35.5t-7.5 67.5l-642 1056q-20 34 -48 36.5t-48 -29.5l-642 -1066q-21 -32 -7.5 -66zM155 200l445 723l445 -723h-345v100h-200v-100h-345zM500 600l100 -300l100 300v100h-200v-100z" />
+<glyph unicode="&#xe108;" d="M100 262v41q0 20 11 44.5t26 38.5l363 325v339q0 62 44 106t106 44t106 -44t44 -106v-339l363 -325q15 -14 26 -38.5t11 -44.5v-41q0 -20 -12 -26.5t-29 5.5l-359 249v-263q100 -91 100 -113v-64q0 -20 -13 -28.5t-32 0.5l-94 78h-222l-94 -78q-19 -9 -32 -0.5t-13 28.5 v64q0 22 100 113v263l-359 -249q-17 -12 -29 -5.5t-12 26.5z" />
+<glyph unicode="&#xe109;" d="M0 50q0 -20 14.5 -35t35.5 -15h1000q21 0 35.5 15t14.5 35v750h-1100v-750zM0 900h1100v150q0 21 -14.5 35.5t-35.5 14.5h-150v100h-100v-100h-500v100h-100v-100h-150q-21 0 -35.5 -14.5t-14.5 -35.5v-150zM100 100v100h100v-100h-100zM100 300v100h100v-100h-100z M100 500v100h100v-100h-100zM300 100v100h100v-100h-100zM300 300v100h100v-100h-100zM300 500v100h100v-100h-100zM500 100v100h100v-100h-100zM500 300v100h100v-100h-100zM500 500v100h100v-100h-100zM700 100v100h100v-100h-100zM700 300v100h100v-100h-100zM700 500 v100h100v-100h-100zM900 100v100h100v-100h-100zM900 300v100h100v-100h-100zM900 500v100h100v-100h-100z" />
+<glyph unicode="&#xe110;" d="M0 200v200h259l600 600h241v198l300 -295l-300 -300v197h-159l-600 -600h-341zM0 800h259l122 -122l141 142l-181 180h-341v-200zM678 381l141 142l122 -123h159v198l300 -295l-300 -300v197h-241z" />
+<glyph unicode="&#xe111;" d="M0 400v600q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-600q0 -41 -29.5 -70.5t-70.5 -29.5h-596l-304 -300v300h-100q-41 0 -70.5 29.5t-29.5 70.5z" />
+<glyph unicode="&#xe112;" d="M100 600v200h300v-250q0 -113 6 -145q17 -92 102 -117q39 -11 92 -11q37 0 66.5 5.5t50 15.5t36 24t24 31.5t14 37.5t7 42t2.5 45t0 47v25v250h300v-200q0 -42 -3 -83t-15 -104t-31.5 -116t-58 -109.5t-89 -96.5t-129 -65.5t-174.5 -25.5t-174.5 25.5t-129 65.5t-89 96.5 t-58 109.5t-31.5 116t-15 104t-3 83zM100 900v300h300v-300h-300zM800 900v300h300v-300h-300z" />
+<glyph unicode="&#xe113;" d="M-30 411l227 -227l352 353l353 -353l226 227l-578 579z" />
+<glyph unicode="&#xe114;" d="M70 797l580 -579l578 579l-226 227l-353 -353l-352 353z" />
+<glyph unicode="&#xe115;" d="M-198 700l299 283l300 -283h-203v-400h385l215 -200h-800v600h-196zM402 1000l215 -200h381v-400h-198l299 -283l299 283h-200v600h-796z" />
+<glyph unicode="&#xe116;" d="M18 939q-5 24 10 42q14 19 39 19h896l38 162q5 17 18.5 27.5t30.5 10.5h94q20 0 35 -14.5t15 -35.5t-15 -35.5t-35 -14.5h-54l-201 -961q-2 -4 -6 -10.5t-19 -17.5t-33 -11h-31v-50q0 -20 -14.5 -35t-35.5 -15t-35.5 15t-14.5 35v50h-300v-50q0 -20 -14.5 -35t-35.5 -15 t-35.5 15t-14.5 35v50h-50q-21 0 -35.5 15t-14.5 35q0 21 14.5 35.5t35.5 14.5h535l48 200h-633q-32 0 -54.5 21t-27.5 43z" />
+<glyph unicode="&#xe117;" d="M0 0v800h1200v-800h-1200zM0 900v100h200q0 41 29.5 70.5t70.5 29.5h300q41 0 70.5 -29.5t29.5 -70.5h500v-100h-1200z" />
+<glyph unicode="&#xe118;" d="M1 0l300 700h1200l-300 -700h-1200zM1 400v600h200q0 41 29.5 70.5t70.5 29.5h300q41 0 70.5 -29.5t29.5 -70.5h500v-200h-1000z" />
+<glyph unicode="&#xe119;" d="M302 300h198v600h-198l298 300l298 -300h-198v-600h198l-298 -300z" />
+<glyph unicode="&#xe120;" d="M0 600l300 298v-198h600v198l300 -298l-300 -297v197h-600v-197z" />
+<glyph unicode="&#xe121;" d="M0 100v100q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5zM31 400l172 739q5 22 23 41.5t38 19.5h672q19 0 37.5 -22.5t23.5 -45.5l172 -732h-1138zM800 100h100v100h-100v-100z M1000 100h100v100h-100v-100z" />
+<glyph unicode="&#xe122;" d="M-101 600v50q0 24 25 49t50 38l25 13v-250l-11 5.5t-24 14t-30 21.5t-24 27.5t-11 31.5zM100 500v250v8v8v7t0.5 7t1.5 5.5t2 5t3 4t4.5 3.5t6 1.5t7.5 0.5h200l675 250v-850l-675 200h-38l47 -276q2 -12 -3 -17.5t-11 -6t-21 -0.5h-8h-83q-20 0 -34.5 14t-18.5 35 q-55 337 -55 351zM1100 200v850q0 21 14.5 35.5t35.5 14.5q20 0 35 -14.5t15 -35.5v-850q0 -20 -15 -35t-35 -15q-21 0 -35.5 15t-14.5 35z" />
+<glyph unicode="&#xe123;" d="M74 350q0 21 13.5 35.5t33.5 14.5h18l117 173l63 327q15 77 76 140t144 83l-18 32q-6 19 3 32t29 13h94q20 0 29 -10.5t3 -29.5q-18 -36 -18 -37q83 -19 144 -82.5t76 -140.5l63 -327l118 -173h17q20 0 33.5 -14.5t13.5 -35.5q0 -20 -13 -40t-31 -27q-8 -3 -23 -8.5 t-65 -20t-103 -25t-132.5 -19.5t-158.5 -9q-125 0 -245.5 20.5t-178.5 40.5l-58 20q-18 7 -31 27.5t-13 40.5zM497 110q12 -49 40 -79.5t63 -30.5t63 30.5t39 79.5q-48 -6 -102 -6t-103 6z" />
+<glyph unicode="&#xe124;" d="M21 445l233 -45l-78 -224l224 78l45 -233l155 179l155 -179l45 233l224 -78l-78 224l234 45l-180 155l180 156l-234 44l78 225l-224 -78l-45 233l-155 -180l-155 180l-45 -233l-224 78l78 -225l-233 -44l179 -156z" />
+<glyph unicode="&#xe125;" d="M0 200h200v600h-200v-600zM300 275q0 -75 100 -75h61q124 -100 139 -100h250q46 0 83 57l238 344q29 31 29 74v100q0 44 -30.5 84.5t-69.5 40.5h-328q28 118 28 125v150q0 44 -30.5 84.5t-69.5 40.5h-50q-27 0 -51 -20t-38 -48l-96 -198l-145 -196q-20 -26 -20 -63v-400z M400 300v375l150 213l100 212h50v-175l-50 -225h450v-125l-250 -375h-214l-136 100h-100z" />
+<glyph unicode="&#xe126;" d="M0 400v600h200v-600h-200zM300 525v400q0 75 100 75h61q124 100 139 100h250q46 0 83 -57l238 -344q29 -31 29 -74v-100q0 -44 -30.5 -84.5t-69.5 -40.5h-328q28 -118 28 -125v-150q0 -44 -30.5 -84.5t-69.5 -40.5h-50q-27 0 -51 20t-38 48l-96 198l-145 196 q-20 26 -20 63zM400 525l150 -212l100 -213h50v175l-50 225h450v125l-250 375h-214l-136 -100h-100v-375z" />
+<glyph unicode="&#xe127;" d="M8 200v600h200v-600h-200zM308 275v525q0 17 14 35.5t28 28.5l14 9l362 230q14 6 25 6q17 0 29 -12l109 -112q14 -14 14 -34q0 -18 -11 -32l-85 -121h302q85 0 138.5 -38t53.5 -110t-54.5 -111t-138.5 -39h-107l-130 -339q-7 -22 -20.5 -41.5t-28.5 -19.5h-341 q-7 0 -90 81t-83 94zM408 289l100 -89h293l131 339q6 21 19.5 41t28.5 20h203q16 0 25 15t9 36q0 20 -9 34.5t-25 14.5h-457h-6.5h-7.5t-6.5 0.5t-6 1t-5 1.5t-5.5 2.5t-4 4t-4 5.5q-5 12 -5 20q0 14 10 27l147 183l-86 83l-339 -236v-503z" />
+<glyph unicode="&#xe128;" d="M-101 651q0 72 54 110t139 38l302 -1l-85 121q-11 16 -11 32q0 21 14 34l109 113q13 12 29 12q11 0 25 -6l365 -230q7 -4 17 -10.5t26.5 -26t16.5 -36.5v-526q0 -13 -86 -93.5t-94 -80.5h-341q-16 0 -29.5 20t-19.5 41l-130 339h-107q-84 0 -139 39t-55 111zM-1 601h222 q15 0 28.5 -20.5t19.5 -40.5l131 -339h293l107 89v502l-343 237l-87 -83l145 -184q10 -11 10 -26q0 -11 -5 -20q-1 -3 -3.5 -5.5l-4 -4t-5 -2.5t-5.5 -1.5t-6.5 -1t-6.5 -0.5h-7.5h-6.5h-476v-100zM1000 201v600h200v-600h-200z" />
+<glyph unicode="&#xe129;" d="M97 719l230 -363q4 -6 10.5 -15.5t26 -25t36.5 -15.5h525q13 0 94 83t81 90v342q0 15 -20 28.5t-41 19.5l-339 131v106q0 84 -39 139t-111 55t-110 -53.5t-38 -138.5v-302l-121 84q-15 12 -33.5 11.5t-32.5 -13.5l-112 -110q-22 -22 -6 -53zM172 739l83 86l183 -146 q22 -18 47 -5q3 1 5.5 3.5l4 4t2.5 5t1.5 5.5t1 6.5t0.5 6.5v7.5v6.5v456q0 22 25 31t50 -0.5t25 -30.5v-202q0 -16 20 -29.5t41 -19.5l339 -130v-294l-89 -100h-503zM400 0v200h600v-200h-600z" />
+<glyph unicode="&#xe130;" d="M2 585q-16 -31 6 -53l112 -110q13 -13 32 -13.5t34 10.5l121 85q0 -51 -0.5 -153.5t-0.5 -148.5q0 -84 38.5 -138t110.5 -54t111 55t39 139v106l339 131q20 6 40.5 19.5t20.5 28.5v342q0 7 -81 90t-94 83h-525q-17 0 -35.5 -14t-28.5 -28l-10 -15zM77 565l236 339h503 l89 -100v-294l-340 -130q-20 -6 -40 -20t-20 -29v-202q0 -22 -25 -31t-50 0t-25 31v456v14.5t-1.5 11.5t-5 12t-9.5 7q-24 13 -46 -5l-184 -146zM305 1104v200h600v-200h-600z" />
+<glyph unicode="&#xe131;" d="M5 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t232.5 47.5q162 0 299.5 -80t217.5 -218t80 -300t-80 -299.5t-217.5 -217.5t-299.5 -80t-300 80t-218 217.5t-80 299.5zM298 701l2 -201h300l-2 -194l402 294l-402 298v-197h-300z" />
+<glyph unicode="&#xe132;" d="M0 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t231.5 47.5q122 0 232.5 -47.5t190.5 -127.5t127.5 -190.5t47.5 -232.5q0 -162 -80 -299.5t-218 -217.5t-300 -80t-299.5 80t-217.5 217.5t-80 299.5zM200 600l402 -294l-2 194h300l2 201h-300v197z" />
+<glyph unicode="&#xe133;" d="M5 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t232.5 47.5q162 0 299.5 -80t217.5 -218t80 -300t-80 -299.5t-217.5 -217.5t-299.5 -80t-300 80t-218 217.5t-80 299.5zM300 600h200v-300h200v300h200l-300 400z" />
+<glyph unicode="&#xe134;" d="M5 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t232.5 47.5q162 0 299.5 -80t217.5 -218t80 -300t-80 -299.5t-217.5 -217.5t-299.5 -80t-300 80t-218 217.5t-80 299.5zM300 600l300 -400l300 400h-200v300h-200v-300h-200z" />
+<glyph unicode="&#xe135;" d="M5 597q0 122 47.5 232.5t127.5 190.5t190.5 127.5t232.5 47.5q121 0 231.5 -47.5t190.5 -127.5t127.5 -190.5t47.5 -232.5q0 -162 -80 -299.5t-217.5 -217.5t-299.5 -80t-300 80t-218 217.5t-80 299.5zM254 780q-8 -33 5.5 -92.5t7.5 -87.5q0 -9 17 -44t16 -60 q12 0 23 -5.5t23 -15t20 -13.5q24 -12 108 -42q22 -8 53 -31.5t59.5 -38.5t57.5 -11q8 -18 -15 -55t-20 -57q42 -71 87 -80q0 -6 -3 -15.5t-3.5 -14.5t4.5 -17q104 -3 221 112q30 29 47 47t34.5 49t20.5 62q-14 9 -37 9.5t-36 7.5q-14 7 -49 15t-52 19q-9 0 -39.5 -0.5 t-46.5 -1.5t-39 -6.5t-39 -16.5q-50 -35 -66 -12q-4 2 -3.5 25.5t0.5 25.5q-6 13 -26.5 17t-24.5 7q2 22 -2 41t-16.5 28t-38.5 -20q-23 -25 -42 4q-19 28 -8 58q6 16 22 22q6 -1 26 -1.5t33.5 -4t19.5 -13.5q12 -19 32 -37.5t34 -27.5l14 -8q0 3 9.5 39.5t5.5 57.5 q-4 23 14.5 44.5t22.5 31.5q5 14 10 35t8.5 31t15.5 22.5t34 21.5q-6 18 10 37q8 0 23.5 -1.5t24.5 -1.5t20.5 4.5t20.5 15.5q-10 23 -30.5 42.5t-38 30t-49 26.5t-43.5 23q11 39 2 44q31 -13 58 -14.5t39 3.5l11 4q7 36 -16.5 53.5t-64.5 28.5t-56 23q-19 -3 -37 0 q-15 -12 -36.5 -21t-34.5 -12t-44 -8t-39 -6q-15 -3 -45.5 0.5t-45.5 -2.5q-21 -7 -52 -26.5t-34 -34.5q-3 -11 6.5 -22.5t8.5 -18.5q-3 -34 -27.5 -90.5t-29.5 -79.5zM518 916q3 12 16 30t16 25q10 -10 18.5 -10t14 6t14.5 14.5t16 12.5q0 -24 17 -66.5t17 -43.5 q-9 2 -31 5t-36 5t-32 8t-30 14zM692 1003h1h-1z" />
+<glyph unicode="&#xe136;" d="M0 164.5q0 21.5 15 37.5l600 599q-33 101 6 201.5t135 154.5q164 92 306 -9l-259 -138l145 -232l251 126q13 -175 -151 -267q-123 -70 -253 -23l-596 -596q-15 -16 -36.5 -16t-36.5 16l-111 110q-15 15 -15 36.5z" />
+<glyph unicode="&#xe137;" horiz-adv-x="1220" d="M0 196v100q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5zM0 596v100q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000 q-41 0 -70.5 29.5t-29.5 70.5zM0 996v100q0 41 29.5 70.5t70.5 29.5h1000q41 0 70.5 -29.5t29.5 -70.5v-100q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5zM600 596h500v100h-500v-100zM800 196h300v100h-300v-100zM900 996h200v100h-200v-100z" />
+<glyph unicode="&#xe138;" d="M100 1100v100h1000v-100h-1000zM150 1000h900l-350 -500v-300l-200 -200v500z" />
+<glyph unicode="&#xe139;" d="M0 200v200h1200v-200q0 -41 -29.5 -70.5t-70.5 -29.5h-1000q-41 0 -70.5 29.5t-29.5 70.5zM0 500v400q0 41 29.5 70.5t70.5 29.5h300v100q0 41 29.5 70.5t70.5 29.5h200q41 0 70.5 -29.5t29.5 -70.5v-100h300q41 0 70.5 -29.5t29.5 -70.5v-400h-500v100h-200v-100h-500z M500 1000h200v100h-200v-100z" />
+<glyph unicode="&#xe140;" d="M0 0v400l129 -129l200 200l142 -142l-200 -200l129 -129h-400zM0 800l129 129l200 -200l142 142l-200 200l129 129h-400v-400zM729 329l142 142l200 -200l129 129v-400h-400l129 129zM729 871l200 200l-129 129h400v-400l-129 129l-200 -200z" />
+<glyph unicode="&#xe141;" d="M0 596q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM182 596q0 -172 121.5 -293t292.5 -121t292.5 121t121.5 293q0 171 -121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM291 655 q0 23 15.5 38.5t38.5 15.5t39 -16t16 -38q0 -23 -16 -39t-39 -16q-22 0 -38 16t-16 39zM400 850q0 22 16 38.5t39 16.5q22 0 38 -16t16 -39t-16 -39t-38 -16q-23 0 -39 16.5t-16 38.5zM514 609q0 32 20.5 56.5t51.5 29.5l122 126l1 1q-9 14 -9 28q0 22 16 38.5t39 16.5 q22 0 38 -16t16 -39t-16 -39t-38 -16q-14 0 -29 10l-55 -145q17 -22 17 -51q0 -36 -25.5 -61.5t-61.5 -25.5t-61.5 25.5t-25.5 61.5zM800 655q0 22 16 38t39 16t38.5 -15.5t15.5 -38.5t-16 -39t-38 -16q-23 0 -39 16t-16 39z" />
+<glyph unicode="&#xe142;" d="M-40 375q-13 -95 35 -173q35 -57 94 -89t129 -32q63 0 119 28q33 16 65 40.5t52.5 45.5t59.5 64q40 44 57 61l394 394q35 35 47 84t-3 96q-27 87 -117 104q-20 2 -29 2q-46 0 -78.5 -16.5t-67.5 -51.5l-389 -396l-7 -7l69 -67l377 373q20 22 39 38q23 23 50 23 q38 0 53 -36q16 -39 -20 -75l-547 -547q-52 -52 -125 -52q-55 0 -100 33t-54 96q-5 35 2.5 66t31.5 63t42 50t56 54q24 21 44 41l348 348q52 52 82.5 79.5t84 54t107.5 26.5q25 0 48 -4q95 -17 154 -94.5t51 -175.5q-7 -101 -98 -192l-252 -249l-253 -256l7 -7l69 -60 l517 511q67 67 95 157t11 183q-16 87 -67 154t-130 103q-69 33 -152 33q-107 0 -197 -55q-40 -24 -111 -95l-512 -512q-68 -68 -81 -163z" />
+<glyph unicode="&#xe143;" d="M80 784q0 131 98.5 229.5t230.5 98.5q143 0 241 -129q103 129 246 129q129 0 226 -98.5t97 -229.5q0 -46 -17.5 -91t-61 -99t-77 -89.5t-104.5 -105.5q-197 -191 -293 -322l-17 -23l-16 23q-43 58 -100 122.5t-92 99.5t-101 100q-71 70 -104.5 105.5t-77 89.5t-61 99 t-17.5 91zM250 784q0 -27 30.5 -70t61.5 -75.5t95 -94.5l22 -22q93 -90 190 -201q82 92 195 203l12 12q64 62 97.5 97t64.5 79t31 72q0 71 -48 119.5t-105 48.5q-74 0 -132 -83l-118 -171l-114 174q-51 80 -123 80q-60 0 -109.5 -49.5t-49.5 -118.5z" />
+<glyph unicode="&#xe144;" d="M57 353q0 -95 66 -159l141 -142q68 -66 159 -66q93 0 159 66l283 283q66 66 66 159t-66 159l-141 141q-8 9 -19 17l-105 -105l212 -212l-389 -389l-247 248l95 95l-18 18q-46 45 -75 101l-55 -55q-66 -66 -66 -159zM269 706q0 -93 66 -159l141 -141q7 -7 19 -17l105 105 l-212 212l389 389l247 -247l-95 -96l18 -17q47 -49 77 -100l29 29q35 35 62.5 88t27.5 96q0 93 -66 159l-141 141q-66 66 -159 66q-95 0 -159 -66l-283 -283q-66 -64 -66 -159z" />
+<glyph unicode="&#xe145;" d="M200 100v953q0 21 30 46t81 48t129 38t163 15t162 -15t127 -38t79 -48t29 -46v-953q0 -41 -29.5 -70.5t-70.5 -29.5h-600q-41 0 -70.5 29.5t-29.5 70.5zM300 300h600v700h-600v-700zM496 150q0 -43 30.5 -73.5t73.5 -30.5t73.5 30.5t30.5 73.5t-30.5 73.5t-73.5 30.5 t-73.5 -30.5t-30.5 -73.5z" />
+<glyph unicode="&#xe146;" d="M0 0l303 380l207 208l-210 212h300l267 279l-35 36q-15 14 -15 35t15 35q14 15 35 15t35 -15l283 -282q15 -15 15 -36t-15 -35q-14 -15 -35 -15t-35 15l-36 35l-279 -267v-300l-212 210l-208 -207z" />
+<glyph unicode="&#xe148;" d="M295 433h139q5 -77 48.5 -126.5t117.5 -64.5v335q-6 1 -15.5 4t-11.5 3q-46 14 -79 26.5t-72 36t-62.5 52t-40 72.5t-16.5 99q0 92 44 159.5t109 101t144 40.5v78h100v-79q38 -4 72.5 -13.5t75.5 -31.5t71 -53.5t51.5 -84t24.5 -118.5h-159q-8 72 -35 109.5t-101 50.5 v-307l64 -14q34 -7 64 -16.5t70 -31.5t67.5 -52t47.5 -80.5t20 -112.5q0 -139 -89 -224t-244 -96v-77h-100v78q-152 17 -237 104q-40 40 -52.5 93.5t-15.5 139.5zM466 889q0 -29 8 -51t16.5 -34t29.5 -22.5t31 -13.5t38 -10q7 -2 11 -3v274q-61 -8 -97.5 -37.5t-36.5 -102.5 zM700 237q170 18 170 151q0 64 -44 99.5t-126 60.5v-311z" />
+<glyph unicode="&#xe149;" d="M100 600v100h166q-24 49 -44 104q-10 26 -14.5 55.5t-3 72.5t25 90t68.5 87q97 88 263 88q129 0 230 -89t101 -208h-153q0 52 -34 89.5t-74 51.5t-76 14q-37 0 -79 -14.5t-62 -35.5q-41 -44 -41 -101q0 -28 16.5 -69.5t28 -62.5t41.5 -72h241v-100h-197q8 -50 -2.5 -115 t-31.5 -94q-41 -59 -99 -113q35 11 84 18t70 7q33 1 103 -16t103 -17q76 0 136 30l50 -147q-41 -25 -80.5 -36.5t-59 -13t-61.5 -1.5q-23 0 -128 33t-155 29q-39 -4 -82 -17t-66 -25l-24 -11l-55 145l16.5 11t15.5 10t13.5 9.5t14.5 12t14.5 14t17.5 18.5q48 55 54 126.5 t-30 142.5h-221z" />
+<glyph unicode="&#xe150;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM602 900l298 300l298 -300h-198v-900h-200v900h-198z" />
+<glyph unicode="&#xe151;" d="M2 300h198v900h200v-900h198l-298 -300zM700 0v200h100v-100h200v-100h-300zM700 400v100h300v-200h-99v-100h-100v100h99v100h-200zM700 700v500h300v-500h-100v100h-100v-100h-100zM801 900h100v200h-100v-200z" />
+<glyph unicode="&#xe152;" d="M2 300h198v900h200v-900h198l-298 -300zM700 0v500h300v-500h-100v100h-100v-100h-100zM700 700v200h100v-100h200v-100h-300zM700 1100v100h300v-200h-99v-100h-100v100h99v100h-200zM801 200h100v200h-100v-200z" />
+<glyph unicode="&#xe153;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM800 100v400h300v-500h-100v100h-200zM800 1100v100h200v-500h-100v400h-100zM901 200h100v200h-100v-200z" />
+<glyph unicode="&#xe154;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM800 400v100h200v-500h-100v400h-100zM800 800v400h300v-500h-100v100h-200zM901 900h100v200h-100v-200z" />
+<glyph unicode="&#xe155;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM700 100v200h500v-200h-500zM700 400v200h400v-200h-400zM700 700v200h300v-200h-300zM700 1000v200h200v-200h-200z" />
+<glyph unicode="&#xe156;" d="M2 300l298 -300l298 300h-198v900h-200v-900h-198zM700 100v200h200v-200h-200zM700 400v200h300v-200h-300zM700 700v200h400v-200h-400zM700 1000v200h500v-200h-500z" />
+<glyph unicode="&#xe157;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5h300q162 0 281 -118.5t119 -281.5v-300q0 -165 -118.5 -282.5t-281.5 -117.5h-300q-165 0 -282.5 117.5t-117.5 282.5zM200 300q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5 h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500z" />
+<glyph unicode="&#xe158;" d="M0 400v300q0 163 119 281.5t281 118.5h300q165 0 282.5 -117.5t117.5 -282.5v-300q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-163 0 -281.5 117.5t-118.5 282.5zM200 300q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5 h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500zM400 300l333 250l-333 250v-500z" />
+<glyph unicode="&#xe159;" d="M0 400v300q0 163 117.5 281.5t282.5 118.5h300q163 0 281.5 -119t118.5 -281v-300q0 -165 -117.5 -282.5t-282.5 -117.5h-300q-165 0 -282.5 117.5t-117.5 282.5zM200 300q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5 h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500zM300 700l250 -333l250 333h-500z" />
+<glyph unicode="&#xe160;" d="M0 400v300q0 165 117.5 282.5t282.5 117.5h300q165 0 282.5 -117.5t117.5 -282.5v-300q0 -162 -118.5 -281t-281.5 -119h-300q-165 0 -282.5 118.5t-117.5 281.5zM200 300q0 -41 29.5 -70.5t70.5 -29.5h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5 h-500q-41 0 -70.5 -29.5t-29.5 -70.5v-500zM300 400h500l-250 333z" />
+<glyph unicode="&#xe161;" d="M0 400v300h300v200l400 -350l-400 -350v200h-300zM500 0v200h500q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5h-500v200h400q165 0 282.5 -117.5t117.5 -282.5v-300q0 -165 -117.5 -282.5t-282.5 -117.5h-400z" />
+<glyph unicode="&#xe162;" d="M217 519q8 -19 31 -19h302q-155 -438 -160 -458q-5 -21 4 -32l9 -8h9q14 0 26 15q11 13 274.5 321.5t264.5 308.5q14 19 5 36q-8 17 -31 17l-301 -1q1 4 78 219.5t79 227.5q2 15 -5 27l-9 9h-9q-15 0 -25 -16q-4 -6 -98 -111.5t-228.5 -257t-209.5 -237.5q-16 -19 -6 -41 z" />
+<glyph unicode="&#xe163;" d="M0 400q0 -165 117.5 -282.5t282.5 -117.5h300q47 0 100 15v185h-500q-41 0 -70.5 29.5t-29.5 70.5v500q0 41 29.5 70.5t70.5 29.5h500v185q-14 4 -114 7.5t-193 5.5l-93 2q-165 0 -282.5 -117.5t-117.5 -282.5v-300zM600 400v300h300v200l400 -350l-400 -350v200h-300z " />
+<glyph unicode="&#xe164;" d="M0 400q0 -165 117.5 -282.5t282.5 -117.5h300q163 0 281.5 117.5t118.5 282.5v98l-78 73l-122 -123v-148q0 -41 -29.5 -70.5t-70.5 -29.5h-500q-41 0 -70.5 29.5t-29.5 70.5v500q0 41 29.5 70.5t70.5 29.5h156l118 122l-74 78h-100q-165 0 -282.5 -117.5t-117.5 -282.5 v-300zM496 709l353 342l-149 149h500v-500l-149 149l-342 -353z" />
+<glyph unicode="&#xe165;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM406 600 q0 80 57 137t137 57t137 -57t57 -137t-57 -137t-137 -57t-137 57t-57 137z" />
+<glyph unicode="&#xe166;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM100 800l445 -500l450 500h-295v400h-300v-400h-300zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe167;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM100 700h300v-300h300v300h295l-445 500zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe168;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM100 705l305 -305l596 596l-154 155l-442 -442l-150 151zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe169;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM100 988l97 -98l212 213l-97 97zM200 400l697 1l3 699l-250 -239l-149 149l-212 -212l149 -149zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe170;" d="M0 0v275q0 11 7 18t18 7h1048q11 0 19 -7.5t8 -17.5v-275h-1100zM200 612l212 -212l98 97l-213 212zM300 1200l239 -250l-149 -149l212 -212l149 148l249 -237l-1 697zM900 150h100v50h-100v-50z" />
+<glyph unicode="&#xe171;" d="M23 415l1177 784v-1079l-475 272l-310 -393v416h-392zM494 210l672 938l-672 -712v-226z" />
+<glyph unicode="&#xe172;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-850q0 -21 -15 -35.5t-35 -14.5h-150v400h-700v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM600 1000h100v200h-100v-200z" />
+<glyph unicode="&#xe173;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-218l-276 -275l-120 120l-126 -127h-378v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM581 306l123 123l120 -120l353 352l123 -123l-475 -476zM600 1000h100v200h-100v-200z" />
+<glyph unicode="&#xe174;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-269l-103 -103l-170 170l-298 -298h-329v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM600 1000h100v200h-100v-200zM700 133l170 170l-170 170l127 127l170 -170l170 170l127 -128l-170 -169l170 -170 l-127 -127l-170 170l-170 -170z" />
+<glyph unicode="&#xe175;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-300h-400v-200h-500v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM600 300l300 -300l300 300h-200v300h-200v-300h-200zM600 1000v200h100v-200h-100z" />
+<glyph unicode="&#xe176;" d="M0 150v1000q0 20 14.5 35t35.5 15h250v-300h500v300h100l200 -200v-402l-200 200l-298 -298h-402v-400h-150q-21 0 -35.5 14.5t-14.5 35.5zM600 300h200v-300h200v300h200l-300 300zM600 1000v200h100v-200h-100z" />
+<glyph unicode="&#xe177;" d="M0 250q0 -21 14.5 -35.5t35.5 -14.5h1100q21 0 35.5 14.5t14.5 35.5v550h-1200v-550zM0 900h1200v150q0 21 -14.5 35.5t-35.5 14.5h-1100q-21 0 -35.5 -14.5t-14.5 -35.5v-150zM100 300v200h400v-200h-400z" />
+<glyph unicode="&#xe178;" d="M0 400l300 298v-198h400v-200h-400v-198zM100 800v200h100v-200h-100zM300 800v200h100v-200h-100zM500 800v200h400v198l300 -298l-300 -298v198h-400zM800 300v200h100v-200h-100zM1000 300h100v200h-100v-200z" />
+<glyph unicode="&#xe179;" d="M100 700v400l50 100l50 -100v-300h100v300l50 100l50 -100v-300h100v300l50 100l50 -100v-400l-100 -203v-447q0 -21 -14.5 -35.5t-35.5 -14.5h-200q-21 0 -35.5 14.5t-14.5 35.5v447zM800 597q0 -29 10.5 -55.5t25 -43t29 -28.5t25.5 -18l10 -5v-397q0 -21 14.5 -35.5 t35.5 -14.5h200q21 0 35.5 14.5t14.5 35.5v1106q0 31 -18 40.5t-44 -7.5l-276 -116q-25 -17 -43.5 -51.5t-18.5 -65.5v-359z" />
+<glyph unicode="&#xe180;" d="M100 0h400v56q-75 0 -87.5 6t-12.5 44v394h500v-394q0 -38 -12.5 -44t-87.5 -6v-56h400v56q-4 0 -11 0.5t-24 3t-30 7t-24 15t-11 24.5v888q0 22 25 34.5t50 13.5l25 2v56h-400v-56q75 0 87.5 -6t12.5 -44v-394h-500v394q0 38 12.5 44t87.5 6v56h-400v-56q4 0 11 -0.5 t24 -3t30 -7t24 -15t11 -24.5v-888q0 -22 -25 -34.5t-50 -13.5l-25 -2v-56z" />
+<glyph unicode="&#xe181;" d="M0 300q0 -41 29.5 -70.5t70.5 -29.5h300q41 0 70.5 29.5t29.5 70.5v500q0 41 -29.5 70.5t-70.5 29.5h-300q-41 0 -70.5 -29.5t-29.5 -70.5v-500zM100 100h400l200 200h105l295 98v-298h-425l-100 -100h-375zM100 300v200h300v-200h-300zM100 600v200h300v-200h-300z M100 1000h400l200 -200v-98l295 98h105v200h-425l-100 100h-375zM700 402v163l400 133v-163z" />
+<glyph unicode="&#xe182;" d="M16.5 974.5q0.5 -21.5 16 -90t46.5 -140t104 -177.5t175 -208q103 -103 207.5 -176t180 -103.5t137 -47t92.5 -16.5l31 1l163 162q17 18 13.5 41t-22.5 37l-192 136q-19 14 -45 12t-42 -19l-118 -118q-142 101 -268 227t-227 268l118 118q17 17 20 41.5t-11 44.5 l-139 194q-14 19 -36.5 22t-40.5 -14l-162 -162q-1 -11 -0.5 -32.5z" />
+<glyph unicode="&#xe183;" d="M0 50v212q0 20 10.5 45.5t24.5 39.5l365 303v50q0 4 1 10.5t12 22.5t30 28.5t60 23t97 10.5t97 -10t60 -23.5t30 -27.5t12 -24l1 -10v-50l365 -303q14 -14 24.5 -39.5t10.5 -45.5v-212q0 -21 -14.5 -35.5t-35.5 -14.5h-1100q-20 0 -35 14.5t-15 35.5zM0 712 q0 -21 14.5 -33.5t34.5 -8.5l202 33q20 4 34.5 21t14.5 38v146q141 24 300 24t300 -24v-146q0 -21 14.5 -38t34.5 -21l202 -33q20 -4 34.5 8.5t14.5 33.5v200q-6 8 -19 20.5t-63 45t-112 57t-171 45t-235 20.5q-92 0 -175 -10.5t-141.5 -27t-108.5 -36.5t-81.5 -40 t-53.5 -36.5t-31 -27.5l-9 -10v-200z" />
+<glyph unicode="&#xe184;" d="M100 0v100h1100v-100h-1100zM175 200h950l-125 150v250l100 100v400h-100v-200h-100v200h-200v-200h-100v200h-200v-200h-100v200h-100v-400l100 -100v-250z" />
+<glyph unicode="&#xe185;" d="M100 0h300v400q0 41 -29.5 70.5t-70.5 29.5h-100q-41 0 -70.5 -29.5t-29.5 -70.5v-400zM500 0v1000q0 41 29.5 70.5t70.5 29.5h100q41 0 70.5 -29.5t29.5 -70.5v-1000h-300zM900 0v700q0 41 29.5 70.5t70.5 29.5h100q41 0 70.5 -29.5t29.5 -70.5v-700h-300z" />
+<glyph unicode="&#xe186;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h300v300h-200v100h200v100h-300v-300h200v-100h-200v-100zM600 300h200v100h100v300h-100v100h-200v-500 zM700 400v300h100v-300h-100z" />
+<glyph unicode="&#xe187;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h100v200h100v-200h100v500h-100v-200h-100v200h-100v-500zM600 300h200v100h100v300h-100v100h-200v-500 zM700 400v300h100v-300h-100z" />
+<glyph unicode="&#xe188;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h300v100h-200v300h200v100h-300v-500zM600 300h300v100h-200v300h200v100h-300v-500z" />
+<glyph unicode="&#xe189;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 550l300 -150v300zM600 400l300 150l-300 150v-300z" />
+<glyph unicode="&#xe190;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300v500h700v-500h-700zM300 400h130q41 0 68 42t27 107t-28.5 108t-66.5 43h-130v-300zM575 549 q0 -65 27 -107t68 -42h130v300h-130q-38 0 -66.5 -43t-28.5 -108z" />
+<glyph unicode="&#xe191;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h300v300h-200v100h200v100h-300v-300h200v-100h-200v-100zM601 300h100v100h-100v-100zM700 700h100 v-400h100v500h-200v-100z" />
+<glyph unicode="&#xe192;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 300h300v400h-200v100h-100v-500zM301 400v200h100v-200h-100zM601 300h100v100h-100v-100zM700 700h100 v-400h100v500h-200v-100z" />
+<glyph unicode="&#xe193;" d="M-100 300v500q0 124 88 212t212 88h700q124 0 212 -88t88 -212v-500q0 -124 -88 -212t-212 -88h-700q-124 0 -212 88t-88 212zM100 200h900v700h-900v-700zM200 700v100h300v-300h-99v-100h-100v100h99v200h-200zM201 300v100h100v-100h-100zM601 300v100h100v-100h-100z M700 700v100h200v-500h-100v400h-100z" />
+<glyph unicode="&#xe194;" d="M4 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM186 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM400 500v200 l100 100h300v-100h-300v-200h300v-100h-300z" />
+<glyph unicode="&#xe195;" d="M0 600q0 162 80 299t217 217t299 80t299 -80t217 -217t80 -299t-80 -299t-217 -217t-299 -80t-299 80t-217 217t-80 299zM182 600q0 -171 121.5 -292.5t292.5 -121.5t292.5 121.5t121.5 292.5t-121.5 292.5t-292.5 121.5t-292.5 -121.5t-121.5 -292.5zM400 400v400h300 l100 -100v-100h-100v100h-200v-100h200v-100h-200v-100h-100zM700 400v100h100v-100h-100z" />
+<glyph unicode="&#xe197;" d="M-14 494q0 -80 56.5 -137t135.5 -57h222v300h400v-300h128q120 0 205 86.5t85 207.5t-85 207t-205 86q-46 0 -90 -14q-44 97 -134.5 156.5t-200.5 59.5q-152 0 -260 -107.5t-108 -260.5q0 -25 2 -37q-66 -14 -108.5 -67.5t-42.5 -122.5zM300 200h200v300h200v-300h200 l-300 -300z" />
+<glyph unicode="&#xe198;" d="M-14 494q0 -80 56.5 -137t135.5 -57h8l414 414l403 -403q94 26 154.5 104.5t60.5 178.5q0 120 -85 206.5t-205 86.5q-46 0 -90 -14q-44 97 -134.5 156.5t-200.5 59.5q-152 0 -260 -107.5t-108 -260.5q0 -25 2 -37q-66 -14 -108.5 -67.5t-42.5 -122.5zM300 200l300 300 l300 -300h-200v-300h-200v300h-200z" />
+<glyph unicode="&#xe199;" d="M100 200h400v-155l-75 -45h350l-75 45v155h400l-270 300h170l-270 300h170l-300 333l-300 -333h170l-270 -300h170z" />
+<glyph unicode="&#xe200;" d="M121 700q0 -53 28.5 -97t75.5 -65q-4 -16 -4 -38q0 -74 52.5 -126.5t126.5 -52.5q56 0 100 30v-306l-75 -45h350l-75 45v306q46 -30 100 -30q74 0 126.5 52.5t52.5 126.5q0 24 -9 55q50 32 79.5 83t29.5 112q0 90 -61.5 155.5t-150.5 71.5q-26 89 -99.5 145.5 t-167.5 56.5q-116 0 -197.5 -81.5t-81.5 -197.5q0 -4 1 -11.5t1 -11.5q-14 2 -23 2q-74 0 -126.5 -52.5t-52.5 -126.5z" />
+</font>
+</defs></svg>