Skip to content

K
kityminder-core
Commit 37f7f353 authored by campaign's avatar campaign
Browse files
Options

添加编辑功能

parent a537a5ff
Hide whitespace changes
Inline Side-by-side
Showing with 136 additions and 66 deletions
demo/dev.html
View file @ 37f7f353
......@@ -8,6 +8,9 @@
.km_receiver{
width:300px;height:300px;
}
/*.km-minderNode{*/
/*cursor:default;*/
/*}*/
</style>
</head>
<body style="background:#262626; margin:0; padding:0">
......
dist/dev.php
View file @ 37f7f353
......@@ -13,6 +13,7 @@ $dependency = Array(
,'src/core/minder.module.js'
,'src/core/minder.command.js'
,'src/core/minder.node.js'
,'src/core/keymap.js'
,'src/module/history.js'
,'src/module/icon.js'
,'src/module/layout.js'
......@@ -22,10 +23,10 @@ $dependency = Array(
,'src/module/keyboard.js'
,'src/module/mouse.js'
,'src/module/history.js'
// ,'src/module/editor.js'
// ,'src/module/editor.range.js'
// ,'src/module/editor.receiver.js'
// ,'src/module/editor.cursor.js'
,'src/module/editor.js'
,'src/module/editor.range.js'
,'src/module/editor.receiver.js'
,'src/module/editor.cursor.js'
);
......
src/core/keymap.js 0 → 100644
View file @ 37f7f353
var keymap = KityMinder.keymap = {
'Backspace' : 8,
'Tab' : 9,
'Enter' : 13,
'Shift':16,
'Control':17,
'Alt':18,
'CapsLock':20,
'Esc':27,
'Spacebar':32,
'PageUp':33,
'PageDown':34,
'End':35,
'Home':36,
'Left':37,
'Up':38,
'Right':39,
'Down':40,
'Insert':45,
'Del':46,
'NumLock':144
};
\ No newline at end of file
src/core/node.js
View file @ 37f7f353
......@@ -9,6 +9,8 @@ var MinderNode = KityMinder.MinderNode = kity.createClass( "MinderNode", {
this.setData( options );
}
this.rc = new kity.Group();
this.rc.addClass('km-minderNode');
this.rc.minderNode = this;
},
setPoint:function(x,y){
......@@ -218,8 +220,6 @@ var MinderNode = KityMinder.MinderNode = kity.createClass( "MinderNode", {
},
getTextShape:function(){
var rc = this.getRenderContainer();
var text = rc.getElementsByTagName('text');
return this.getRenderContainer().getShapesByType('text')[0]
}
} );
\ No newline at end of file
src/module/editor.js
View file @ 37f7f353
KityMinder.registerModule( "TextEditModule", function () {
var cursor = new Minder.Cursor();
var receiver = new Minder.Receiver();
var receiver = new Minder.Receiver(this);
var range = new Minder.Range();
......@@ -14,39 +14,20 @@ KityMinder.registerModule( "TextEditModule", function () {
if(this.isSingleSelect()){
var node = this.getSelectedNode();
var node_rc = node.getRenderContainer();
if(node_rc.getType() != 'Text'){
var offset = e.getPosition();
cursor.setShow().setPosition(offset);
// receiver.clear()
// .setTextShape()
// .setTextShapeSize(cursor.height)
// .appendTextShapeToPaper(this.getPaper())
// .setPosition(position)
// .setRange(range,0)
// .setCursor(cursor)
// receiver.setCursor(cursor)
// .setKityMinder(this)
// .setMinderNode(node)
// .setTextShape(node_rc)
// .setCursorHeight()
// .setCurrentIndex(position)
// .updateCursor()
// .setRange(range,0);
}else{
// receiver.setCursor(cursor)
// .setKityMinder(this)
// .setMinderNode(e.getTargetNode())
// .setTextShape(node_rc)
// .setCursorHeight()
// .setCurrentIndex(position)
// .updateCursor()
// .setRange(range);
}
var textShape = node.getTextShape();
// node.getRenderContainer().setStyle('cursor','text');
receiver.setTextEditStatus(true)
.setCursor(cursor)
.setKityMinder(this)
.setMinderNode(node)
.setTextShape(textShape)
.setBaseOffset()
.setContainerStyle()
.setCursorHeight()
.setCurrentIndex(e.getPosition())
.updateCursor()
.setRange(range);
}
}
......
src/module/editor.range.js
View file @ 37f7f353
......@@ -23,6 +23,13 @@ Minder.Range = kity.createClass('Range',{
this.nativeRange.setEnd(node,index);
return this;
},
getStart:function(){
var range = this.nativeSel.getRangeAt(0);
return {
startContainer:range.startContainer,
startOffset:range.startOffset
}
},
collapse:function(toStart){
this.nativeRange.collapse(toStart === true);
return this;
......
src/module/editor.receiver.js
View file @ 37f7f353
......@@ -2,16 +2,27 @@
Minder.Receiver = kity.createClass('Receiver',{
clear : function(){
this.container.innerHTML = '';
this.cursor.setHide();
this.index = 0;
return this;
},
constructor : function(){
setTextEditStatus : function(status){
this.textEditStatus = status || false;
return this;
},
isTextEditStatus:function(){
return this.textEditStatus;
},
constructor : function(km){
this.setKityMinder(km);
this.textEditStatus = false;
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);}');
utils.listen(_div,'keydown keypress keyup', utils.proxy(this.keyboardEvents,this));
utils.addCssRule('km_receiver_css',' .km_receiver{position:absolute;padding:0;margin:0;word-wrap:break-word;clip:rect(1em 1em 1em 1em);}');//
// utils.listen(_div,'keydown keypress keyup', utils.proxy(this.keyboardEvents,this));
this.km.on('beforekeyup', utils.proxy(this.keyboardEvents,this));
this.timer = null;
this.index = 0;
},
......@@ -26,7 +37,7 @@ Minder.Receiver = kity.createClass('Receiver',{
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.select()
......@@ -61,28 +72,47 @@ Minder.Receiver = kity.createClass('Receiver',{
return this;
},
keyboardEvents : function(e){
clearTimeout(this.timer);
var me = this;
var keyCode = e.originEvent.keyCode;
switch(e.type){
case 'keyup':
var text = (this.container.textContent || this.container.innerText).replace(/\u200b/g,'');
this.textShape.setContent(text);
this.minderNode.setText(text);
this.km.renderNode(this.minderNode);
this.updateTextData();
this.updateCursor();
this.timer = setTimeout(function(){
me.cursor.setShow()
},500);
break;
case 'keypress':
case 'keyup':
case 'beforekeyup':
if(this.isTextEditStatus()){
if(keyCode == keymap.Enter){
this.setTextEditStatus(false);
this.clear();
e.stopPropagation();
return;
}
var text = (this.container.textContent || this.container.innerText).replace(/\u200b/g,'');
this.textShape.setContent(text);
this.setContainerStyle();
this.minderNode.setText(text);
this.km.renderNode(this.minderNode);
this.km.updateLayout(this.minderNode);
this.updateTextData();
this.updateIndex();
this.updateCursor();
this.timer = setTimeout(function(){
me.cursor.setShow()
},500);
return true;
}
}
},
updateIndex:function(){
this.index = this.range.getStart().startOffset;
},
updateTextData : function(){
this.textShape.textData = this.getTextOffsetData();
this.index = this.index + 1;
},
setCursor : function(cursor){
this.cursor = cursor;
......@@ -115,17 +145,35 @@ Minder.Receiver = kity.createClass('Receiver',{
}
return this;
},
setBaseOffset :function(){
var nodeOffset = this.minderNode.getRenderContainer().getRenderBox();
var textOffset = this.textShape.getRenderBox();
this.offset = {
x : nodeOffset.x + textOffset.x,
y : nodeOffset.y + textOffset.y
};
return this;
},
setContainerStyle : function(){
var textShapeBox = this.textShape.getRenderBox();
var size = this.textShape.getSize();
this.container.style.cssText += ";left:" + this.offset.x
+ 'px;top:' + (this.offset.y + size)
+ 'px;width:' + textShapeBox.width
+ 'px;height:' + textShapeBox.height + 'px;font-size:' + size + 'px';
return this;
},
getTextOffsetData:function(){
var text = this.textShape.getContent();
this.textData = [];
// this.textShape.clearContent();
var containerOffset = this.textShape.container.getRenderBox();
for(var i= 0,l = text.length;i<l;i++){
var box = this.textShape.getExtentOfChar(i);
this.textData.push({
x:box.x + containerOffset.x,
y:box.y + containerOffset.y,
x:box.x + this.offset.x,
y:this.offset.y,
width:box.width,
height:box.height
})
......@@ -155,7 +203,7 @@ Minder.Receiver = kity.createClass('Receiver',{
},
setCursorHeight:function(){
this.cursor.setHeight(this.getTextShapeHeight())
this.cursor.setHeight(this.getTextShapeHeight());
return this;
}
});
\ No newline at end of file
src/module/keyboard.js
View file @ 37f7f353
......@@ -59,7 +59,7 @@ KityMinder.registerModule( "KeyboardModule", function () {
contentchange: function () {
buildPositionNetwork( this.getRoot() );
},
keydown: function ( e ) {
keyup: function ( e ) {
switch ( e.originEvent.keyCode ) {
......
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