Merge branch 'dev' of https://github.com/kitygraph/kityminder into dev

demo/dev.html

@@ -22,6 +22,6 @@
 </div>
 </body>
 <script>
-    var km = KM.getKityMinder('kityminder');
+    window.km = KM.getKityMinder('kityminder');
 </script>
 </html>
\ No newline at end of file

dist/dev.php

@@ -51,7 +51,8 @@ $dependency = Array(
     ,'src/adapter/adapter.js'
     ,'src/adapter/button.js'
     ,'src/adapter/combobox.js'
-
+    ,'src/protocal/plain.js'
+    ,'src/protocal/json.js'
 );
 
 $content = "";

src/adapter/adapter.js

-utils.extend(KityMinder,function(){
+utils.extend( KityMinder, function () {
     var _kityminderUI = {},
         _activeWidget = null,
         _widgetData = {},
         _widgetCallBack = {};
     return {
-        registerUI:function(uiname,fn){
-            utils.each(uiname.split(/\s+/), function (i,name) {
-                _kityminderUI[name] = fn;
-            })
+        registerUI: function ( uiname, fn ) {
+            utils.each( uiname.split( /\s+/ ), function ( i, name ) {
+                _kityminderUI[ name ] = fn;
+            } )
         },
-        _createUI:function(id){
-            var $cont = $('<div class="kmui-container"></div>'),
+        _createUI: function ( id ) {
+            var $cont = $( '<div class="kmui-container"></div>' ),
                 $toolbar = $.kmuitoolbar(),
-                $kmbody = $('<div class="kmui-editor-body"></div>'),
-                $statusbar = $('<div class="kmui-statusbar"></div>');
+                $kmbody = $( '<div class="kmui-editor-body"></div>' ),
+                $statusbar = $( '<div class="kmui-statusbar"></div>' );
 
-            $cont.append($toolbar).append($kmbody).append($statusbar);
-            $(utils.isString(id) ? '#' + id : id).append($cont);
+            $cont.append( $toolbar ).append( $kmbody ).append( $statusbar );
+            $( utils.isString( id ) ? '#' + id : id ).append( $cont );
             return {
-                '$container':$cont,
-                '$toolbar':$toolbar,
-                '$body':$kmbody,
-                '$statusbar':$statusbar
+                '$container': $cont,
+                '$toolbar': $toolbar,
+                '$body': $kmbody,
+                '$statusbar': $statusbar
             };
         },
-        _createToolbar:function($toolbar,km){
-            var toolbars = km.getOptions('toolbars');
-            if (toolbars && toolbars.length) {
+        _createToolbar: function ( $toolbar, km ) {
+            var toolbars = km.getOptions( 'toolbars' );
+            if ( toolbars && toolbars.length ) {
                 var btns = [];
-                $.each(toolbars,function(i,uiNames){
-                    $.each(uiNames.split(/\s+/),function(index,name){
-                        if(name == '|'){
-                            $.kmuiseparator && btns.push($.kmuiseparator());
-                        }else{
-                            if(_kityminderUI[name]){
-                                var ui = _kityminderUI[name].call(km,name);
-                                ui && btns.push(ui);
+                $.each( toolbars, function ( i, uiNames ) {
+                    $.each( uiNames.split( /\s+/ ), function ( index, name ) {
+                        if ( name == '|' ) {
+                            $.kmuiseparator && btns.push( $.kmuiseparator() );
+                        } else {
+                            if ( _kityminderUI[ name ] ) {
+                                var ui = _kityminderUI[ name ].call( km, name );
+                                ui && btns.push( ui );
                             }
 
                         }
 
-                    });
-                    btns.length && $toolbar.kmui().appendToBtnmenu(btns);
-                });
+                    } );
+                    btns.length && $toolbar.kmui().appendToBtnmenu( btns );
+                } );
             }
-            $toolbar.append($('<div class="kmui-dialog-container"></div>'));
+            $toolbar.append( $( '<div class="kmui-dialog-container"></div>' ) );
         },
-        _createStatusbar:function($statusbar,km){
+        _createStatusbar: function ( $statusbar, km ) {
 
         },
-        getKityMinder:function(id,options){
-            var containers = this._createUI(id);
-            var km = this.getMinder(containers.$body.get(0),options);
-            this._createToolbar(containers.$toolbar,km);
-            this._createStatusbar(containers.$statusbar,km);
+        getKityMinder: function ( id, options ) {
+            var containers = this._createUI( id );
+            var km = this.getMinder( containers.$body.get( 0 ), options );
+            this._createToolbar( containers.$toolbar, km );
+            this._createStatusbar( containers.$statusbar, km );
             km.$container = containers.$container;
             return km;
         },
-        registerWidget : function(name,pro,cb){
-            _widgetData[name] = $.extend2(pro,{
-                $root : '',
-                _preventDefault:false,
-                root:function($el){
-                    return this.$root || (this.$root = $el);
+        registerWidget: function ( name, pro, cb ) {
+            _widgetData[ name ] = $.extend2( pro, {
+                $root: '',
+                _preventDefault: false,
+                root: function ( $el ) {
+                    return this.$root || ( this.$root = $el );
                 },
-                preventDefault:function(){
+                preventDefault: function () {
                     this._preventDefault = true;
                 },
-                clear:false
-            });
-            if(cb){
-                _widgetCallBack[name] = cb;
+                clear: false
+            } );
+            if ( cb ) {
+                _widgetCallBack[ name ] = cb;
             }
         },
-        getWidgetData : function(name){
-            return _widgetData[name]
+        getWidgetData: function ( name ) {
+            return _widgetData[ name ]
         },
-        setWidgetBody : function(name,$widget,km){
-            if(!km._widgetData){
+        setWidgetBody: function ( name, $widget, km ) {
+            if ( !km._widgetData ) {
 
-                utils.extend(km,{
-                    _widgetData : {},
-                    getWidgetData : function(name){
-                        return this._widgetData[name];
+                utils.extend( km, {
+                    _widgetData: {},
+                    getWidgetData: function ( name ) {
+                        return this._widgetData[ name ];
                     },
-                    getWidgetCallback : function(widgetName){
+                    getWidgetCallback: function ( widgetName ) {
                         var me = this;
-                        return function(){
-                            return  _widgetCallBack[widgetName].apply(me,[me,$widget].concat(utils.argsToArray(arguments,0)))
+                        return function () {
+                            return _widgetCallBack[ widgetName ].apply( me, [ me, $widget ].concat( utils.argsToArray( arguments, 0 ) ) )
                         }
                     }
-                })
+                } )
 
             }
-            var pro = _widgetData[name];
-            if(!pro){
+            var pro = _widgetData[ name ];
+            if ( !pro ) {
                 return null;
             }
-            pro = km._widgetData[name];
-            if(!pro){
-                pro = _widgetData[name];
-                pro = km._widgetData[name] = $.type(pro) == 'function' ? pro : utils.clone(pro);
+            pro = km._widgetData[ name ];
+            if ( !pro ) {
+                pro = _widgetData[ name ];
+                pro = km._widgetData[ name ] = $.type( pro ) == 'function' ? pro : utils.clone( pro );
             }
 
-            pro.root($widget.kmui().getBodyContainer());
+            pro.root( $widget.kmui().getBodyContainer() );
 
-            pro.initContent(km,$widget);
-            if(!pro._preventDefault){
-                pro.initEvent(km,$widget);
+            pro.initContent( km, $widget );
+            if ( !pro._preventDefault ) {
+                pro.initEvent( km, $widget );
             }
 
-            pro.width &&  $widget.width(pro.width);
+            pro.width && $widget.width( pro.width );
         },
-        setActiveWidget : function($widget){
+        setActiveWidget: function ( $widget ) {
             _activeWidget = $widget;
         }
     }
-}());
+}() );

src/core/minder.data.js

+Utils.extend( KityMinder, {
+    _protocals: {},
+    registerProtocal: function ( name, protocalDeal ) {
+        KityMinder._protocals[ name ] = protocalDeal();
+    },
+    findProtocal: function ( name ) {
+        return KityMinder._protocals[ name ] || null;
+    },
+    getSupportedProtocals: function () {
+        return Utils.keys( KityMinder._protocals );
+    }
+} );
+
+// 这里的 Json 是一个对象
+function exportNode( node ) {
+    var exported = {};
+    exported.data = node.getData();
+    var childNodes = node.getChildren();
+    if ( childNodes.length ) {
+        exported.children = [];
+        for ( var i = 0; i < childNodes.length; i++ ) {
+            exported.children.push( exportNode( childNodes[ i ] ) );
+        }
+    }
+    return exported;
+}
+
+function importNode( node, json ) {
+    var data = json.data;
+    for ( var field in data ) {
+        node.setData( field, data[ field ] );
+    }
+
+    var childrenTreeData = json.children;
+    if ( !childrenTreeData ) return;
+    for ( var i = 0; i < childrenTreeData.length; i++ ) {
+        var childNode = new MinderNode();
+        importNode( childNode, childrenTreeData[ i ] );
+        node.appendChild( childNode );
+    }
+    return node;
+}
+
 // 导入导出
 kity.extendClass( Minder, {
-    exportData: function ( node ) {
-        var exported = {};
-        node = node || this.getRoot();
-        exported.data = node.getData();
-        var childNodes = node.getChildren();
-        if ( childNodes.length ) {
-            exported.children = [];
-            for ( var i = 0; i < childNodes.length; i++ ) {
-                exported.children.push( this.exportData( childNodes[ i ] ) );
-            }
+    exportData: function ( protocalName ) {
+        var json, protocal;
+
+        json = exportNode( this.getRoot() );
+        protocal = KityMinder.findProtocal( protocalName );
+        if ( protocal ) {
+            return protocal.encode( json );
+        } else {
+            return json;
         }
-        return exported;
     },
 
-    importData: function ( treeData ) {
-        function importToNode( treeData, node ) {
-            var data = treeData.data;
-            for ( var field in data ) {
-                node.setData( field, data[ field ] );
-            }
-
-            var childrenTreeData = treeData.children;
-            if ( !childrenTreeData ) return;
-            for ( var i = 0; i < childrenTreeData.length; i++ ) {
-                var childNode = new MinderNode();
-                importToNode( childrenTreeData[ i ], childNode );
-                node.appendChild( childNode );
-            }
+    importData: function ( local, protocalName ) {
+        var json, protocal;
+
+        if ( protocalName ) {
+            protocal = KityMinder.findProtocal( protocalName );
+        } else {
+            KityMinder.getSupportedProtocals().every( function ( name ) {
+                var test = KityMinder.findProtocal( name );
+                if ( test.recognize && test.recognize( local ) ) {
+                    protocal = test;
+                }
+                return !test;
+            } );
+        }
+
+        if ( !protocal ) {
+            throw new Error( "Unsupported protocal: " + protocalName );
         }
 
         var params = {
-            importData: treeData
+            local: local,
+            protocalName: protocalName,
+            protocal: protocal
         };
 
+        // 是否需要阻止导入
         var stoped = this._fire( new MinderEvent( 'beforeimport', params, true ) );
-
         if ( stoped ) return this;
 
+        json = params.json || ( params.json = protocal.decode( local ) );
+
         this._fire( new MinderEvent( 'preimport', params, false ) );
 
+
+        // 删除当前所有节点
         while ( this._root.getChildren().length ) {
             this._root.removeChild( 0 );
         }
-        importToNode( treeData, this._root );
+
+        importNode( this._root, json );
 
         this._fire( new MinderEvent( 'import', params, false ) );
         this._firePharse( {
@@ -52,6 +103,7 @@ kity.extendClass( Minder, {
         this._firePharse( {
             type: 'interactchange'
         } );
+
         return this;
     }
 } );
\ No newline at end of file

src/core/minder.node.js

@@ -3,7 +3,7 @@ kity.extendClass( Minder, {
     getRoot: function () {
         return this._root;
     },
-    setRoot:function(root){
+    setRoot: function ( root ) {
         this._root = root;
     },
     handelNodeInsert: function ( node ) {

src/core/node.js

@@ -227,7 +227,7 @@ var MinderNode = KityMinder.MinderNode = kity.createClass( "MinderNode", {
     },
     clone: function () {
         function cloneNode( parent, isClonedNode ) {
-            var _tmp = new KM.MinderNode(isClonedNode.getText());
+            var _tmp = new KM.MinderNode( isClonedNode.getText() );
 
             _tmp.data = Utils.clonePlainObject( isClonedNode.getData() );
             _tmp.parent = parent;
@@ -266,5 +266,8 @@ var MinderNode = KityMinder.MinderNode = kity.createClass( "MinderNode", {
     },
     isSelected: function () {
         return this.getData( 'highlight' ) === true;
+    },
+    clearChildren: function () {
+        this.children = [];
     }
 } );
\ No newline at end of file

src/module/font.js

 KityMinder.registerModule( "fontmodule", function () {
 
     return {
-        defaultOptions:{
-            'fontfamily': [
-                { name: 'songti', val: '宋体,SimSun'},
-                { name: 'yahei', val: '微软雅黑,Microsoft YaHei'},
-                { name: 'kaiti', val: '楷体,楷体_GB2312, SimKai'},
-                { name: 'heiti', val: '黑体, SimHei'},
-                { name: 'lishu', val: '隶书, SimLi'},
-                { name: 'andaleMono', val: 'andale mono'},
-                { name: 'arial', val: 'arial, helvetica,sans-serif'},
-                { name: 'arialBlack', val: 'arial black,avant garde'},
-                { name: 'comicSansMs', val: 'comic sans ms'},
-                { name: 'impact', val: 'impact,chicago'},
-                { name: 'timesNewRoman', val: 'times new roman'},
-                { name: 'sans-serif',val:'sans-serif'}
-            ],
-            'fontsize': [10, 12,  16, 18,24, 32,48]
+        defaultOptions: {
+            'fontfamily': [ {
+                name: 'songti',
+                val: '宋体,SimSun'
+            }, {
+                name: 'yahei',
+                val: '微软雅黑,Microsoft YaHei'
+            }, {
+                name: 'kaiti',
+                val: '楷体,楷体_GB2312, SimKai'
+            }, {
+                name: 'heiti',
+                val: '黑体, SimHei'
+            }, {
+                name: 'lishu',
+                val: '隶书, SimLi'
+            }, {
+                name: 'andaleMono',
+                val: 'andale mono'
+            }, {
+                name: 'arial',
+                val: 'arial, helvetica,sans-serif'
+            }, {
+                name: 'arialBlack',
+                val: 'arial black,avant garde'
+            }, {
+                name: 'comicSansMs',
+                val: 'comic sans ms'
+            }, {
+                name: 'impact',
+                val: 'impact,chicago'
+            }, {
+                name: 'timesNewRoman',
+                val: 'times new roman'
+            }, {
+                name: 'sans-serif',
+                val: 'sans-serif'
+            } ],
+            'fontsize': [ 10, 12, 16, 18, 24, 32, 48 ]
         },
         "commands": {
             "forecolor": kity.createClass( "fontcolorCommand", {
@@ -39,7 +62,7 @@ KityMinder.registerModule( "fontmodule", function () {
                     utils.each( nodes, function ( i, n ) {
                         n.setData( 'fontfamily', family );
                         n.getTextShape().setAttr( 'font-family', family );
-                        km.updateLayout(n)
+                        km.updateLayout( n )
                     } )
                 }
             } ),
@@ -50,8 +73,8 @@ KityMinder.registerModule( "fontmodule", function () {
                     var nodes = km.getSelectedNodes();
                     utils.each( nodes, function ( i, n ) {
                         n.setData( 'fontsize', size );
-                        n.getTextShape().setSize(size);
-                        km.updateLayout(n)
+                        n.getTextShape().setSize( size );
+                        km.updateLayout( n )
                     } )
                 }
             } )

src/module/history.js

@@ -51,6 +51,7 @@ KityMinder.registerModule( "HistoryModule", function () {
         },
         restore: function () {
             var scene = this.list[ this.index ];
+            debugger;
             this.km.setRoot( scene.cloneData() );
             this.km.initStyle();
             this.update();
@@ -59,6 +60,7 @@ KityMinder.registerModule( "HistoryModule", function () {
             return new Scene( this.km.getRoot() )
         },
         saveScene: function () {
+            debugger;
             var currentScene = this.getScene();
             var lastScene = this.list[ this.index ];
             if ( lastScene && lastScene.equals( currentScene ) ) {

src/module/layout.default.js

@@ -27,7 +27,6 @@ KityMinder.registerModule( "LayoutDefault", function () {
 				dec.stroke( "gray" );
 				minder.getRenderContainer().addShape( iconShape );
 				iconShape.addShapes( [ circle, plus, dec ] );
-				node.setData( "shicon", this );
 				this.update();
 				this.switchState();
 			},
@@ -107,15 +106,13 @@ KityMinder.registerModule( "LayoutDefault", function () {
 		switch ( node.getType() ) {
 		case "root":
 		case "main":
-			if ( !Layout.bgRect ) {
-				node.getBgRc().addShape( Layout.bgRect = new kity.Rect() );
-			}
+			node.getBgRc().clear().addShape( Layout.bgRect = new kity.Rect() );
 			Layout.bgRect.fill( nodeStyle.fill ).setRadius( nodeStyle.radius );
 			break;
 		case "sub":
 			var underline = Layout.underline = new kity.Path();
 			var highlightshape = Layout.highlightshape = new kity.Rect();
-			node.getBgRc().addShapes( [ highlightshape, underline ] );
+			node.getBgRc().clear().addShapes( [ highlightshape, underline ] );
 			break;
 		default:
 			break;
@@ -134,6 +131,7 @@ KityMinder.registerModule( "LayoutDefault", function () {
 			Layout.leftHeight = 0;
 			Layout.rightHeight = 0;
 		}
+		minder.highlightNode( node );
 	};
 	//根据内容调整节点尺寸
 	var updateShapeByCont = function ( node ) {
@@ -153,7 +151,6 @@ KityMinder.registerModule( "LayoutDefault", function () {
 			var _contWidth = contRc.getWidth();
 			var _contHeight = contRc.getHeight();
 			Layout.underline.getDrawer()
-				.clear()
 				.moveTo( 0, _contHeight + nodeStyle.padding[ 2 ] + nodeStyle.padding[ 0 ] )
 				.lineTo( _contWidth + nodeStyle.padding[ 1 ] + nodeStyle.padding[ 3 ], _contHeight + nodeStyle.padding[ 2 ] + nodeStyle.padding[ 0 ] );
 			Layout.underline.stroke( nodeStyle.stroke );
@@ -208,7 +205,7 @@ KityMinder.registerModule( "LayoutDefault", function () {
 		} else {
 			if ( action === "append" || action === "contract" ) {
 				Layout.branchheight = node.getRenderContainer().getHeight() + nodeStyle.margin[ 0 ] + nodeStyle.margin[ 2 ];
-			} else if ( action === "expand" || action === "change" ) { //展开
+			} else if ( action === "change" ) { //展开
 				Layout.branchheight = countBranchHeight( node );
 			}
 			var parentLayout = parent.getData( "layout" );
@@ -293,6 +290,7 @@ KityMinder.registerModule( "LayoutDefault", function () {
 			nodeShape.setTransform( new kity.Matrix().translate( Layout.x, Layout.y - _rectHeight / 2 ) );
 			break;
 		}
+		node.setPoint( Layout.x, Layout.y );
 	};
 	var updateConnectAndshIcon = function ( node ) {
 		var nodeType = node.getType();
@@ -430,11 +428,26 @@ KityMinder.registerModule( "LayoutDefault", function () {
 			updateLayoutHorizon( _root );
 			updateLayoutVertical( _root );
 			translateNode( _root );
+			var _buffer = [ _root ];
+			var _cleanbuffer = [];
+			//打散结构
+			while ( _buffer.length !== 0 ) {
+				var children = _buffer[ 0 ].getChildren();
+				_buffer = _buffer.concat( children );
+				for ( var i = 0; i < children.length; i++ ) {
+					children[ i ].getData( "layout" ).parent = _buffer[ 0 ];
+				}
+				_buffer[ 0 ].clearChildren();
+				if ( _buffer[ 0 ] !== _root ) _cleanbuffer.push( _buffer[ 0 ] );
+				_buffer.shift();
+			}
+			//重组结构
+			for ( var j = 0; j < _cleanbuffer.length; j++ ) {
+				this.appendChildNode( _cleanbuffer[ j ].getData( "layout" ).parent, _cleanbuffer[ j ] );
+			}
 		},
 		appendChildNode: function ( parent, node, sibling ) {
 			minder.handelNodeInsert( node );
-			//设置align和appendside属性并在合适的位置插入节点
-			var insert = ( parent.getChildren().indexOf( node ) === -1 );
 			var Layout = node.getData( "layout" );
 			var parentLayout = parent.getData( "layout" );
 			if ( sibling ) {
@@ -452,24 +465,35 @@ KityMinder.registerModule( "LayoutDefault", function () {
 					var prtLayout = parent.getData( "layout" );
 					Layout.appendside = prtLayout.appendside;
 					Layout.align = prtLayout.align;
+					parent.appendChild( node );
 				} else {
-					if ( parentLayout.rightList.length > 1 && parentLayout.rightList.length > parentLayout.leftList.length ) {
-						Layout.appendside = "left";
-						Layout.align = "right";
+					var nodeP = node.getPoint();
+					if ( nodeP && nodeP.x && nodeP.y ) {
+						if ( nodeP.x > parentLayout.x ) {
+							Layout.appendside = "right";
+							Layout.align = "left";
+						} else {
+							Layout.appendside = "left";
+							Layout.align = "right";
+						}
 					} else {
-						Layout.appendside = "right";
-						Layout.align = "left";
+						if ( parentLayout.rightList.length > 1 && parentLayout.rightList.length > parentLayout.leftList.length ) {
+							Layout.appendside = "left";
+							Layout.align = "right";
+						} else {
+							Layout.appendside = "right";
+							Layout.align = "left";
+						}
 					}
-				}
-				if ( insert ) {
-					if ( parent.getType() === "root" ) {
-						var sideList1 = parentLayout[ Layout.appendside + "List" ];
-						var idx1 = sideList1.length;
-						parent.insertChild( node, idx1 );
-						sideList1.push( node );
+					var sideList1 = parentLayout[ Layout.appendside + "List" ];
+					sideList1.push( node );
+					var idx1;
+					if ( Layout.appendside === "right" ) {
+						idx1 = sideList1.length;
 					} else {
-						parent.insertChild( node );
+						idx1 = parent.getChildren().length;
 					}
+					parent.insertChild( node, idx1 );
 				}
 			}
 			//设置分支类型
@@ -539,12 +563,15 @@ KityMinder.registerModule( "LayoutDefault", function () {
 			var isExpand = ico.icon.switchState();
 			var node = ico.icon._node;
 			var _buffer = node.getChildren();
+			var _cleanbuffer = [];
 
 			while ( _buffer.length !== 0 ) {
 				var Layout = _buffer[ 0 ].getData( "layout" );
 				if ( isExpand ) {
 					var parent = _buffer[ 0 ].getParent();
-					minder.appendChildNode( parent, _buffer[ 0 ] );
+					Layout.parent = parent;
+					_cleanbuffer.push( _buffer[ 0 ] );
+					//minder.appendChildNode( parent, _buffer[ 0 ] );
 					Layout.connect = null;
 					Layout.shicon = null;
 				} else {
@@ -555,53 +582,21 @@ KityMinder.registerModule( "LayoutDefault", function () {
 				_buffer = _buffer.concat( _buffer[ 0 ].getChildren() );
 				_buffer.shift();
 			}
-			var set;
-			if ( isExpand ) set = updateLayoutVertical( node, node.getParent(), "expand" );
-			else set = updateLayoutVertical( node, node.getParent(), "contract" );
+			if ( isExpand ) {
+				node.clearChildren();
+				for ( var j = 0; j < _cleanbuffer.length; j++ ) {
+					_cleanbuffer[ j ].clearChildren();
+					minder.appendChildNode( _cleanbuffer[ j ].getData( "layout" ).parent, _cleanbuffer[ j ] );
+				}
+			}
+			var set = [];
+			if ( !isExpand ) set = updateLayoutVertical( node, node.getParent(), "contract" );
 			for ( var i = 0; i < set.length; i++ ) {
 				translateNode( set[ i ] );
 				updateConnectAndshIcon( set[ i ] );
 			}
-
 		}
 	};
 	this.addLayoutStyle( "default", _style );
-	return {
-		// "events": {
-		// 	"click": function ( e ) {
-		// 		var ico = e.kityEvent.targetShape.container;
-		// 		if ( ico.class === "shicon" ) {
-		// 			var isShow = ico.icon.switchState();
-		// 			var node = ico.icon._node;
-		// 			var _buffer;
-		// 			if ( isShow ) {
-		// 				_buffer = node.getChildren();
-		// 				while ( _buffer.length !== 0 ) {
-		// 					minder.appendChildNode( _buffer[ 0 ].getParent(), _buffer[ 0 ] );
-		// 					_buffer = _buffer.concat( _buffer[ 0 ].getChildren() );
-		// 					_buffer.shift();
-		// 				}
-		// 			} else {
-		// 				var Layout = node.getData( "layout" );
-		// 				var marginTop = Layout.margin[ 0 ];
-		// 				var marginBottom = Layout.margin[ 2 ];
-		// 				Layout.branchheight = node.getRenderContainer().getHeight() + marginTop + marginBottom;
-		// 				_buffer = node.getChildren();
-		// 				while ( _buffer.length !== 0 ) {
-		// 					try {
-		// 						_buffer[ 0 ].getData( "layout" ).shape.clear();
-		// 						_buffer[ 0 ].getRenderContainer().remove();
-		// 					} catch ( error ) {}
-		// 					_buffer = _buffer.concat( _buffer[ 0 ].getChildren() );
-		// 					_buffer.shift();
-		// 				}
-		// 				var set = updateLayoutVertical( node, node.getParent(), "append" );
-		// 				for ( var i = 0; i < set.length; i++ ) {
-		// 					translateNode( set[ i ] );
-		// 				}
-		// 			}
-		// 		}
-		// 	}
-		// }
-	};
+	return {};
 } );
\ No newline at end of file

src/module/layout.js

@@ -25,7 +25,15 @@ KityMinder.registerModule( "LayoutModule", function () {
 		},
 		initStyle: function () {
 			var curStyle = this.getCurrentStyle();
-			this.getRenderContainer().clear();
+			//this.getRenderContainer().clear();
+			this._rc.remove();
+			this._rc = new kity.Group();
+			this._paper.addShape( this._rc );
+
+			var _root = this.getRoot();
+			_root.preTraverse( function ( n ) {
+				n.clearLayout();
+			} );
 			this.getLayoutStyle( curStyle ).initStyle.call( this );
 		},
 		appendChildNode: function ( parent, node, index ) {
@@ -79,7 +87,7 @@ KityMinder.registerModule( "LayoutModule", function () {
 	var switchLayout = function ( km, style ) {
 		var _root = km.getRoot();
 		_root.preTraverse( function ( n ) {
-			n.clearLayout();
+			//n.clearLayout();
 			n.setPoint();
 			n.getBgRc().clear();
 		} );

src/protocal/json.js

+KityMinder.registerProtocal( 'json', function () {
+	function filter( key, value ) {
+		if ( key == 'layout' || key == 'shicon' ) {
+			return undefined;
+		}
+		return value;
+	}
+	return {
+		encode: function ( json ) {
+			return JSON.stringify( json, filter );
+		},
+		decode: function ( local ) {
+			return JSON.parse( local );
+		},
+		recognize: function ( local ) {
+			return Utils.isString( local ) && local.charAt( 0 ) == '{' && local.charAt( local.length - 1 ) == '}';
+		}
+	};
+} );
\ No newline at end of file

src/protocal/plain.js

+KityMinder.registerProtocal( "plain", function () {
+	var LINE_ENDING = '\n',
+		TAB_CHAR = '\t';
+
+	function repeat( s, n ) {
+		var result = "";
+		while ( n-- ) result += s;
+		return result;
+	}
+
+	function encode( json, level ) {
+		var local = "";
+		level = level || 0;
+		local += repeat( TAB_CHAR, level );
+		local += json.data.text + LINE_ENDING;
+		if ( json.children ) {
+			json.children.forEach( function ( child ) {
+				local += encode( child, level + 1 );
+			} );
+		}
+		return local;
+	}
+
+	function isEmpty( line ) {
+		return !/\S/.test( line );
+	}
+
+	function getLevel( line ) {
+		var level = 0;
+		while ( line.charAt( level ) === TAB_CHAR ) level++;
+		return level;
+	}
+
+	function getNode( line ) {
+		return {
+			data: {
+				text: line.replace( new RegExp( '^' + TAB_CHAR + '*' ), '' )
+			}
+		};
+	}
+
+	function decode( local ) {
+		var json,
+			parentMap = {},
+			lines = local.split( LINE_ENDING ),
+			line, level, node;
+
+		function addChild( parent, child ) {
+			var children = parent.children || ( parent.children = [] );
+			children.push( child );
+		}
+
+		for ( var i = 0; i < lines.length; i++ ) {
+			line = lines[ i ];
+			if ( isEmpty( line ) ) continue;
+
+			level = getLevel( line );
+			node = getNode( line );
+
+			if ( level === 0 ) {
+				if ( json ) {
+					throw new Error( 'Invalid local format' );
+				}
+				json = node;
+			} else {
+				if ( !parentMap[ level - 1 ] ) {
+					throw new Error( 'Invalid local format' );
+				}
+				addChild( parentMap[ level - 1 ], node );
+			}
+			parentMap[ level ] = node;
+		}
+		return json;
+	}
+	var lastTry, lastResult;
+
+	function recognize( local ) {
+		if ( !Utils.isString( local ) ) return false;
+		lastTry = local;
+		try {
+			lastResult = decode( local );
+		} catch ( e ) {
+			lastResult = null;
+		}
+		return !!lastResult;
+	}
+	return {
+		encode: function ( json ) {
+			return encode( json, 0 );
+		},
+		decode: function ( local ) {
+			if ( lastTry == local && lastResult ) {
+				return lastResult;
+			}
+			return decode( local );
+		},
+		recognize: recognize
+	};
+} );
\ No newline at end of file