Merge branch 'dev' of github.com:fex-team/kityminder into dev

import.js

@@ -26,7 +26,9 @@
             'core/render.js',
             'core/theme.js',
             'layout/default.js',
+            'layout/bottom.js',
             'theme/default.js',
+            'theme/bottom.js',
             'module/node.js',
             'module/text.js',
             'module/outline.js',

kity @ f62ec70b

-Subproject commit 38e17411060a02d0601985ca1a2553057c3f9e40
+Subproject commit f62ec70beb8198072693e1b7f1748cca46b685fb

src/layout/bottom.js

+/* global Layout:true */
+window.layoutSwitch = true;
+KityMinder.registerLayout('bottom', kity.createClass({
+    base: Layout,
+
+    doLayout: function(node) {
+        var layout = this;
+
+        if (node.isLayoutRoot()) {
+            this.doLayoutRoot(node);
+        } else {
+            this.arrange(node);
+        }
+    },
+    doLayoutRoot: function(root) {
+        this.arrange(root);
+    },
+    arrange: function(node) {
+        var children = node.getChildren();
+        var _this = this;
+        if (!children.length) {
+            return false;
+        } else {
+            var totalTreeWidth = 0;
+            // 计算每个 child 的树所占的矩形区域
+            var childTreeBoxes = children.map(function(node, index, children) {
+                var box = _this.getTreeBox([node]);
+                totalTreeWidth += box.width;
+                if (index > 0) {
+                    totalTreeWidth += children[index - 1].getStyle('margin-left');
+                    totalTreeWidth += node.getStyle('margin-right');
+                }
+                return box;
+            });
+            var nodeContentBox = node.getContentBox();
+            var i, x, y, child, childTreeBox, childContentBox;
+            var transform = new kity.Matrix();
+            x = -totalTreeWidth / 2;
+
+            for (var i = 0; i < children.length; i++) {
+                child = children[i];
+                childTreeBox = childTreeBoxes[i];
+                childContentBox = child.getContentBox();
+                if (!childContentBox.width) continue;
+                //水平方向上的布局
+                x += childTreeBox.width / 2;
+                if (i > 1) {
+                    x += children[i].getStyle('margin-left');
+                }
+                y = nodeContentBox.height + node.getStyle('margin-bottom') + children[i].getStyle('margin-top');
+                console.log(y);
+                children[i].setLayoutTransform(new kity.Matrix().translate(x, y));
+                x += childTreeBox.width / 2 + children[i].getStyle('margin-right');
+            }
+        }
+
+        //     if (!children.length) return;
+        //     var _this = this;
+
+        //     // children 所占的总树高
+        //     var totalTreeHeight = 0;
+
+        //     // 计算每个 child 的树所占的矩形区域
+        //     var childTreeBoxes = children.map(function(node, index, children) {
+        //         var box = _this.getTreeBox([node]);
+
+        //         // 计算总树高，需要把竖直方向上的 margin 加入计算
+        //         totalTreeHeight += box.height;
+
+        //         if (index > 0) {
+        //             totalTreeHeight += children[index - 1].getStyle('margin-bottom');
+        //             totalTreeHeight += node.getStyle('margin-top');
+        //         }
+
+        //         return box;
+        //     });
+
+        //     var nodeContentBox = parent.getContentBox();
+        //     var i, x, y, child, childTreeBox, childContentBox;
+        //     var transform = new kity.Matrix();
+
+        //     y = -totalTreeHeight / 2 - 200;
+
+        //     for (i = 0; i < children.length; i++) {
+        //         child = children[i];
+        //         childTreeBox = childTreeBoxes[i];
+        //         childContentBox = child.getContentBox();
+
+        //         if (!childContentBox.height) continue;
+
+        //         // 水平方向上的布局
+        //         if (side == 'right') {
+        //             x = nodeContentBox.right - childContentBox.left;
+        //             x += parent.getStyle('margin-right') + child.getStyle('margin-left');
+
+        //             child.setLayoutVector(new kity.Vector(childContentBox.left, childContentBox.cy));
+        //         } else {
+        //             x = nodeContentBox.left - childContentBox.right;
+        //             x -= parent.getStyle('margin-left') + child.getStyle('margin-right');
+
+        //             child.setLayoutVector(new kity.Vector(childContentBox.right, childContentBox.cy));
+        //         }
+
+        //         // 竖直方向上的布局
+        //         y += childTreeBox.height / 2;
+
+        //         if (i > 0) {
+        //             y += children[i].getStyle('margin-top');
+        //         }
+
+        //         children[i].setLayoutTransform(new kity.Matrix().translate(x, y));
+
+        //         y += childTreeBox.height / 2 + children[i].getStyle('margin-bottom');
+        //     }
+
+        //     if (parent.isRoot()) {
+        //         var branchBox = this.getBranchBox(children);
+        //         var dy = branchBox.cy - nodeContentBox.cy;
+
+        //         children.forEach(function(child) {
+        //             child.getLayoutTransform().translate(0, -dy);
+        //         });
+        //     }
+        // }
+    }
+}));
\ No newline at end of file

src/theme/bottom.js

+KityMinder.registerTheme('bottom', {
+    'root-color': '#430',
+    'root-background': '#e9df98',
+    'root-stroke': 'none',
+    'root-font-size': 24,
+    'root-padding': [15, 25],
+    'root-margin': 100,
+    'root-radius': 30,
+    'root-space': 10,
+
+    'main-color': '#333',
+    'main-background': '#a4c5c0',
+    'main-stroke': 'none',
+    'main-font-size': 16,
+    'main-padding': [6, 20],
+    'main-margin': [30, 0, 10, 0],
+    'main-radius': 10,
+    'main-space': 5,
+
+    'sub-color': 'white',
+    'sub-background': 'none',
+    'sub-stroke': 'white',
+    'sub-font-size': 12,
+    'sub-padding': [5, 10],
+    'sub-margin': [5, 15, 10, 5],
+    'sub-radius': 5,
+    'sub-space': 5,
+
+    'connect-color': 'white',
+    'connect-width': 2,
+    'connect-radius': 5,
+
+    'selected-background': 'rgb(254, 219, 0)'
+});
\ No newline at end of file