Commit 47d3b6f5 authored by Akikonata's avatar Akikonata

重构

parent 6b68f6ec
......@@ -25,15 +25,7 @@
</body>
<script>
var minder = KM.createMinder(kityminder);
document.getElementById("StyleChange").addEventListener("change",function(e){
var val = e.target.value;
minder.execCommand("switchlayout",val);
},false);
minder.select(minder.getRoot());
var node = new KM.MinderNode('test');
node.setData('fontcolor','red');
minder.execCommand('appendChildNode',node);
// var b = new kity.Bezier([new kity.BezierPoint(0,0).setVertex(100,100),new kity.BezierPoint(100,0).setVertex(100,100)]);
// minder.getRenderContainer().addShape(b.stroke("white"));
minder.getRoot().setData('fontcolor','red');
minder.updateLayout(minder.getRoot());
</script>
</html>
\ No newline at end of file
Subproject commit cfe7d5a248f0634d85dab3e51dc2d90d2d23ac5e
Subproject commit 1bfcdd712725d25d54bfe88d0ee0fac6ee33830a
......@@ -2,12 +2,12 @@
kity.extendClass( Minder, function () {
function highlightNode( km, node ) {
node.setData( "highlight", true );
km.renderNode( node );
km.highlightNode( node );
}
function unhighlightNode( km, node ) {
node.setData( "highlight", false );
km.renderNode( node );
km.highlightNode( node );
}
return {
_initSelection: function () {
......
......@@ -8,8 +8,8 @@ var MinderNode = KityMinder.MinderNode = kity.createClass( "MinderNode", {
} else {
this.setData( options );
}
this._createShapeDom()
this._createShapeDom();
this.setData( "layout", {} );
},
_createShapeDom: function () {
this.rc = new kity.Group();
......@@ -26,10 +26,10 @@ var MinderNode = KityMinder.MinderNode = kity.createClass( "MinderNode", {
this.rc.appendShape( g );
},
_createBgGroup: function () {
this._createGroup( 'bgrc' )
this._createGroup( 'bgrc' );
},
_createContGroup: function () {
this._createGroup( 'contrc' )
this._createGroup( 'contrc' );
},
_createTextShape: function () {
this.getContRc().appendShape( new kity.Text( this.getData( 'text' ) || '' ) );
......@@ -37,24 +37,24 @@ var MinderNode = KityMinder.MinderNode = kity.createClass( "MinderNode", {
getContRc: function () {
var groups = this.rc.getShapesByType( 'group' ),
result;
utils.each( groups, function ( i, p ) {
Utils.each( groups, function ( i, p ) {
if ( p.getData( 'rctype' ) == 'contrc' ) {
result = p;
return false;
}
} );
return result
return result;
},
getBgRc: function () {
var groups = this.rc.getShapesByType( 'group' ),
result;
utils.each( groups, function ( i, p ) {
Utils.each( groups, function ( i, p ) {
if ( p.getData( 'rctype' ) == 'bgrc' ) {
result = p;
return false;
}
} );
return result
return result;
},
setPoint: function ( x, y ) {
this.setData( 'point', {
......
//接收者
Minder.Receiver = kity.createClass('Receiver',{
clear : function(){
Minder.Receiver = kity.createClass( 'Receiver', {
clear: function () {
this.container.innerHTML = '';
this.cursor.setHide();
this.index = 0;
return this;
},
setTextEditStatus : function(status){
setTextEditStatus: function ( status ) {
this.textEditStatus = status || false;
return this;
},
isTextEditStatus:function(){
isTextEditStatus: function () {
return this.textEditStatus;
},
constructor : function(km){
this.setKityMinder(km);
constructor: function ( km ) {
this.setKityMinder( km );
this.textEditStatus = false;
var _div = document.createElement('div');
_div.setAttribute('contenteditable',true);
var _div = document.createElement( 'div' );
_div.setAttribute( 'contenteditable', true );
_div.className = 'km_receiver';
this.container = document.body.insertBefore(_div,document.body.firstChild);
utils.addCssRule('km_receiver_css',' .km_receiver{position:absolute;padding:0;margin:0;word-wrap:break-word;clip:rect(1em 1em 1em 1em);}');//
this.km.on('beforekeyup', utils.proxy(this.keyboardEvents,this));
this.container = document.body.insertBefore( _div, document.body.firstChild );
utils.addCssRule( 'km_receiver_css', ' .km_receiver{position:absolute;padding:0;margin:0;word-wrap:break-word;clip:rect(1em 1em 1em 1em);}' ); //
this.km.on( 'beforekeyup', utils.proxy( this.keyboardEvents, this ) );
this.timer = null;
this.index = 0;
},
setRange : function(range,index){
setRange: function ( range, index ) {
this.index = index || this.index;
var text = this.container.firstChild;
this.range = range;
range.setStart(text || this.container, this.index).collapse(true);
setTimeout(function(){
range.setStart( text || this.container, this.index ).collapse( true );
setTimeout( function () {
range.select()
});
} );
return this;
},
setTextShape:function(textShape){
if(!textShape){
setTextShape: function ( textShape ) {
if ( !textShape ) {
textShape = new kity.Text();
}
this.textShape = textShape;
this.container.innerHTML = textShape.getContent();
return this;
},
setTextShapeSize:function(size){
this.textShape.setSize(size);
setTextShapeSize: function ( size ) {
this.textShape.setSize( size );
return this;
},
getTextShapeHeight:function(){
getTextShapeHeight: function () {
return this.textShape.getRenderBox().height;
},
appendTextShapeToPaper:function(paper){
paper.addShape(this.textShape);
appendTextShapeToPaper: function ( paper ) {
paper.addShape( this.textShape );
return this;
},
setKityMinder:function(km){
setKityMinder: function ( km ) {
this.km = km;
return this;
},
setMinderNode:function(node){
setMinderNode: function ( node ) {
this.minderNode = node;
return this;
},
keyboardEvents : function(e){
keyboardEvents: function ( e ) {
clearTimeout(this.timer);
clearTimeout( this.timer );
var me = this;
var keyCode = e.originEvent.keyCode;
switch(e.type){
switch ( e.type ) {
case 'beforekeyup':
if(this.isTextEditStatus()){
switch(keyCode){
if ( this.isTextEditStatus() ) {
switch ( keyCode ) {
case keymap.Enter:
case keymap.Tab:
this.setTextEditStatus(false);
this.setTextEditStatus( false );
this.clear();
e.stopPropagation();
return;
}
var text = (this.container.textContent || this.container.innerText).replace(/\u200b/g,'');
var text = ( this.container.textContent || this.container.innerText ).replace( /\u200b/g, '' );
this.textShape.setContent(text);
this.textShape.setContent( text );
this.setContainerStyle();
this.minderNode.setText(text);
this.km.renderNode(this.minderNode);
this.km.updateLayout(this.minderNode);
this.minderNode.setText( text );
this.km.updateLayout( this.minderNode );
this.setBaseOffset();
this.updateTextData();
this.updateIndex();
this.updateCursor();
this.timer = setTimeout(function(){
this.timer = setTimeout( function () {
me.cursor.setShow()
},500);
}, 500 );
return true;
}
}
},
updateIndex:function(){
updateIndex: function () {
this.index = this.range.getStart().startOffset;
},
updateTextData : function(){
updateTextData: function () {
this.textShape.textData = this.getTextOffsetData();
},
setCursor : function(cursor){
setCursor: function ( cursor ) {
this.cursor = cursor;
return this;
},
updateCursor : function(){
updateCursor: function () {
this.cursor.setShowHold();
if(this.index == this.textData.length){
this.cursor.setPosition({
x : this.textData[this.index-1].x + this.textData[this.index-1].width,
y : this.textData[this.index-1].y
})
}else{
this.cursor.setPosition(this.textData[this.index])
if ( this.index == this.textData.length ) {
this.cursor.setPosition( {
x: this.textData[ this.index - 1 ].x + this.textData[ this.index - 1 ].width,
y: this.textData[ this.index - 1 ].y
} )
} else {
this.cursor.setPosition( this.textData[ this.index ] )
}
return this;
},
setBaseOffset :function(){
setBaseOffset: function () {
var nodeOffset = this.minderNode.getRenderContainer().getRenderBox();
// var textOffset = this.textShape.getRenderBox();
// var textOffset = this.textShape.getRenderBox();
var contRcOffset = this.minderNode.getContRc().getRenderBox();
this.offset = {
x : nodeOffset.x + contRcOffset.x,
y : nodeOffset.y + contRcOffset.y
x: nodeOffset.x + contRcOffset.x,
y: nodeOffset.y + contRcOffset.y
};
return this;
},
setContainerStyle : function(){
setContainerStyle: function () {
var textShapeBox = this.textShape.getRenderBox();
this.container.style.cssText = ";left:" + this.offset.x
+ 'px;top:' + (this.offset.y+textShapeBox.height)
+ 'px;width:' + textShapeBox.width
+ 'px;height:' + textShapeBox.height + 'px;';
this.container.style.cssText = ";left:" + this.offset.x + 'px;top:' + ( this.offset.y + textShapeBox.height ) + 'px;width:' + textShapeBox.width + 'px;height:' + textShapeBox.height + 'px;';
return this;
},
getTextOffsetData:function(){
getTextOffsetData: function () {
var text = this.textShape.getContent();
this.textData = [];
for(var i= 0,l = text.length;i<l;i++){
var box = this.textShape.getExtentOfChar(i);
this.textData.push({
x:box.x + this.offset.x,
y:this.offset.y,
width:box.width,
height:box.height
})
for ( var i = 0, l = text.length; i < l; i++ ) {
var box = this.textShape.getExtentOfChar( i );
this.textData.push( {
x: box.x + this.offset.x,
y: this.offset.y,
width: box.width,
height: box.height
} )
}
return this;
},
setCurrentIndex:function(offset){
setCurrentIndex: function ( offset ) {
var me = this;
this.getTextOffsetData();
var hadChanged = false;
utils.each(this.textData,function(i,v){
utils.each( this.textData, function ( i, v ) {
//点击开始之前
if(i == 0 && offset.x <= v.x){
if ( i == 0 && offset.x <= v.x ) {
me.index = 0;
return false;
}
if(i == me.textData.length -1 && offset.x >= v.x){
if ( i == me.textData.length - 1 && offset.x >= v.x ) {
me.index = me.textData.length;
return false;
}
if(offset.x >= v.x && offset.x <= v.x + v.width){
if(offset.x - v.x > v.width/2){
if ( offset.x >= v.x && offset.x <= v.x + v.width ) {
if ( offset.x - v.x > v.width / 2 ) {
me.index = i + 1;
}else {
} else {
me.index = i
}
hadChanged = true;
return false;
}
});
} );
return this;
},
setCursorHeight:function(){
this.cursor.setHeight(this.getTextShapeHeight());
setCursorHeight: function () {
this.cursor.setHeight( this.getTextShapeHeight() );
return this;
}
});
\ No newline at end of file
} );
\ No newline at end of file
......@@ -35,6 +35,7 @@ KityMinder.registerModule( "fontmodule", function () {
e.node.getTextShape().setAttr( 'font-family', val );
}
if ( val = e.node.getData( 'fontcolor' ) ) {
console.log( val );
e.node.getTextShape().fill( val );
}
}
......
This diff is collapsed.
......@@ -16,9 +16,9 @@ KityMinder.registerModule( "LayoutModule", function () {
_root.setData( "currentstyle", name );
return name;
},
renderNode: function ( node ) {
highlightNode: function ( node ) {
var curStyle = this.getCurrentStyle();
this.getLayoutStyle( curStyle ).renderNode.call( this, node );
this.getLayoutStyle( curStyle ).highlightNode.call( this, node );
},
initStyle: function () {
var curStyle = this.getCurrentStyle();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment