render expander at layout vector

kity @ 022e5cb4

-Subproject commit f62ec70beb8198072693e1b7f1748cca46b685fb
+Subproject commit 022e5cb489e65df8a38eedf8508478ee1d29c29c

src/core/connect.js

@@ -56,9 +56,8 @@ kity.extendClass(Minder, {
         connection.setVisible(true);
 
         var provider = KityMinder.getConnectProvider(node.getLayout());
-        var pathData = provider(node, parent);
 
-        connection.setPathData(pathData);
+        provider(node, parent, connection);
     }
 });
 

src/layout/default.js

@@ -79,12 +79,12 @@ KityMinder.registerLayout('default', kity.createClass({
                 x = nodeContentBox.right - childContentBox.left;
                 x += parent.getStyle('margin-right') + child.getStyle('margin-left');
 
-                child.setLayoutVector(new kity.Vector(childContentBox.left, childContentBox.cy));
+                child.setLayoutVector(new kity.Vector(childContentBox.right, 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));
+                child.setLayoutVector(new kity.Vector(childContentBox.left, childContentBox.cy));
             }
 
             // 竖直方向上的布局
@@ -110,7 +110,14 @@ KityMinder.registerLayout('default', kity.createClass({
     }
 }));
 
-KityMinder.registerConnectProvider('default', function(node, parent) {
+var connectMarker = new kity.Marker().pipe(function() {
+    var r = 4;
+    var dot = new kity.Circle(r).fill('white');
+    this.addShape(dot);
+    this.setRef(r, 0).setViewBox(-r, -r, r + r, r + r).setWidth(r).setHeight(r);
+});
+
+KityMinder.registerConnectProvider('default', function(node, parent, connection) {
 
     var box = node.getLayoutBox(),
         pBox = parent.getLayoutBox();
@@ -120,17 +127,23 @@ KityMinder.registerConnectProvider('default', function(node, parent) {
     var pathData = [];
     var side = box.cx > pBox.cx ? 'right' : 'left';
 
+    node.getMinder().getPaper().addResource(connectMarker);
+
     switch (node.getType()) {
 
         case 'main':
 
             start = new kity.Point(pBox.cx, pBox.cy);
             end = side == 'left' ?
-                new kity.Point(box.right, box.cy) :
-                new kity.Point(box.left, box.cy);
+                new kity.Point(box.right + 2, box.cy) :
+                new kity.Point(box.left - 2, box.cy);
+
             vector = kity.Vector.fromPoints(start, end);
             pathData.push('M', start);
             pathData.push('A', abs(vector.x), abs(vector.y), 0, 0, (vector.x * vector.y > 0 ? 0 : 1), end);
+
+            connection.setMarker(connectMarker);
+
             break;
 
         case 'sub':
@@ -139,10 +152,10 @@ KityMinder.registerConnectProvider('default', function(node, parent) {
 
             if (side == 'right') {
                 start = new kity.Point(box.left - node.getStyle('margin-left') / 2, pBox.cy);
-                end = new kity.Point(box.right + node.getStyle('margin-right') / 2, box.bottom);
+                end = new kity.Point(box.right + node.getStyle('margin-right'), box.bottom);
             } else {
                 start = new kity.Point(box.right + node.getStyle('margin-right') / 2, pBox.cy);
-                end = new kity.Point(box.left - node.getStyle('margin-left') / 2, box.bottom);
+                end = new kity.Point(box.left - node.getStyle('margin-left'), box.bottom);
             }
 
             end.y += 1;
@@ -157,7 +170,11 @@ KityMinder.registerConnectProvider('default', function(node, parent) {
 
             pathData.push('A', radius, radius, 0, 0, sf, ex, end.y);
             pathData.push('L', end);
+
+            connection.setMarker(null);
+
+            break;
     }
 
-    return pathData;
+    connection.setPathData(pathData);
 });
\ No newline at end of file

src/module/expand.js

@@ -203,17 +203,13 @@ KityMinder.registerModule('Expand', function() {
 
             var x, y;
 
-            var right = node.getLayoutPoint().x > node.parent.getLayoutPoint().x;
+            var pos = node.getLayoutVector();
 
-            x = right ?
-                node.getContentBox().right + node.getStyle('margin-right') :
-                node.getContentBox().left - node.getStyle('margin-left');
+            pos = new kity.Vector(pos.x, pos.y);
 
-            y = node.getType() == 'main' ?
-                node.getContentBox().cy :
-                node.getContentBox().bottom;
+            pos = pos.normalize(pos.length() + expander.radius + 1);
 
-            this.expander.setTranslate(x, y);
+            this.expander.setTranslate(pos);
         }
     });
     return {

src/module/outline.js

@@ -17,7 +17,7 @@ KityMinder.registerModule('OutlineModule', function() {
                     var shadow = this.shadow = new kity.Rect()
                         .setId(KityMinder.uuid('node_shadow'))
                         .fill('black')
-                        .setOpacity(0.2);
+                        .setOpacity(0.25);
 
                     group.addShapes([shadow, outline]);
 
@@ -62,7 +62,7 @@ KityMinder.registerModule('OutlineModule', function() {
                     if (node.getLevel() < 2) {
                         this.shadow
                             .setVisible(true)
-                            .setPosition(outlineBox.x + 3, outlineBox.y + 4)
+                            .setPosition(outlineBox.x + 4, outlineBox.y + 5)
                             .setSize(outlineBox.width, outlineBox.height)
                             .setRadius(node.getStyle('radius'));
                     } else {

src/theme/default.js

@@ -13,7 +13,7 @@ KityMinder.registerTheme('default', {
     'main-stroke': 'none',
     'main-font-size': 16,
     'main-padding': [6, 20],
-    'main-margin': [30, 6],
+    'main-margin': [30, 10],
     'main-radius': 10,
     'main-space': 5,
 
@@ -22,7 +22,8 @@ KityMinder.registerTheme('default', {
     'sub-stroke': 'white',
     'sub-font-size': 12,
     'sub-padding': [5, 10],
-    'sub-margin': [5, 15],
+    'sub-margin': 10,
+    'sub-tree-margin': 30,
     'sub-radius': 5,
     'sub-space': 5,