| Index: trunk/extensions/VisualEditor/demos/playground/playground.js |
| — | — | @@ -32,109 +32,123 @@ |
| 33 | 33 | this.$editor.html("<b>Lorem Ipsum is simply dummy text</b> of the printing and typesetting industry. <b>Lorem Ipsum has been the <i>industry's</i> standard</b> dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it <u>to <b>make <i>a type</i> specimen</b> book.</u>");
|
| 34 | 34 | this.$editor.addClass('leafNode');
|
| 35 | 35 |
|
| | 36 | + this.lastKeydown = null;
|
| 36 | 37 | this.keydown = false;
|
| 37 | 38 | this.keyup = false;
|
| 38 | 39 | this.keypress = false;
|
| 39 | 40 | this.mousedown = false;
|
| 40 | | - this.inime = false;
|
| | 41 | + this.diff = false;
|
| 41 | 42 | this.prevText = app.getDOMText(this.$editor[0]);
|
| | 43 | + this.prevOffset = null;
|
| | 44 | + this.loop = false;
|
| 42 | 45 |
|
| 43 | | - setInterval(function() {
|
| 44 | | - _this.loopFunc();
|
| 45 | | - }, 100);
|
| | 46 | + this.logkey = false;
|
| 46 | 47 | };
|
| 47 | 48 |
|
| 48 | 49 | app.prototype.onKeyDown = function( e ) {
|
| 49 | | - console.log("onKeyDown");
|
| | 50 | + if(this.logkey) console.log("onKeyDown", e.which);
|
| 50 | 51 | this.keydown = true;
|
| 51 | | - if ( e.which === 229 ) {
|
| 52 | | - this.inime = true;
|
| 53 | | - }
|
| | 52 | + this.lastKeydown = e.which;
|
| 54 | 53 | };
|
| 55 | 54 |
|
| 56 | 55 | app.prototype.onKeyUp = function( e ) {
|
| 57 | | - console.log("onKeyUp");
|
| | 56 | + if(this.logkey) console.log("onKeyUp", e.which);
|
| 58 | 57 | this.keyup = true;
|
| 59 | | - if ( this.inime ) {
|
| 60 | | - this.inime = false;
|
| 61 | | - }
|
| 62 | 58 | };
|
| 63 | 59 |
|
| 64 | 60 | app.prototype.onKeyPress = function( e ) {
|
| 65 | | - //console.log("onKeyPress");
|
| | 61 | + if(this.logkey) console.log("onKeyPress");
|
| 66 | 62 | this.keypress = true;
|
| 67 | | - if ( e.which === 229 ) {
|
| 68 | | - this.inime = true;
|
| 69 | | - }
|
| 70 | 63 | };
|
| 71 | 64 |
|
| 72 | 65 | app.prototype.onMouseDown = function( e ) {
|
| | 66 | + if(this.logkey) console.log("onMouseDown");
|
| 73 | 67 | this.mousedown = true;
|
| 74 | 68 |
|
| 75 | | - if ( this.inime ) {
|
| 76 | | - this.inime = false;
|
| | 69 | + if(this.loop == false) {
|
| | 70 | + var _this = this;
|
| | 71 | + setInterval(function() {
|
| | 72 | + _this.loopFunc();
|
| | 73 | + }, 100);
|
| 77 | 74 | }
|
| 78 | 75 | };
|
| 79 | 76 |
|
| 80 | 77 | app.prototype.loopFunc = function() {
|
| 81 | | - var text = app.getDOMText(this.$editor[0]);
|
| | 78 | + var text = app.getDOMText(this.$editor[0]).replace(String.fromCharCode(32), " ").replace(String.fromCharCode(160), " ");
|
| | 79 | + var selection = rangy.getSelection();
|
| | 80 | + if ( !selection.anchorNode ) {
|
| | 81 | + console.log("och");
|
| | 82 | + return;
|
| | 83 | + }
|
| | 84 | + var offset = this.getOffset(selection.anchorNode, selection.anchorOffset);
|
| 82 | 85 |
|
| 83 | 86 | if(text != this.prevText) {
|
| | 87 | + var textDiffLength = text.length - this.prevText.length;
|
| | 88 | + var offsetDiff = offset - this.prevOffset;
|
| | 89 | + var sameFromLeft = 0;
|
| | 90 | + var l = text.length;
|
| | 91 | + while ( sameFromLeft < l && this.prevText[sameFromLeft] == text[sameFromLeft] ) {
|
| | 92 | + ++sameFromLeft;
|
| | 93 | + }
|
| | 94 | +
|
| 84 | 95 |
|
| 85 | | - console.log("text is different");
|
| 86 | | -
|
| 87 | | - if(this.keydown) {
|
| 88 | | - console.log("keyboard");
|
| 89 | | - } else {
|
| 90 | | - console.log("not keyboard");
|
| | 96 | + if(false) {
|
| | 97 | + console.log("change start", sameFromLeft, offset);
|
| | 98 | + console.log("different content", textDiffLength);
|
| | 99 | + console.log("different offset", offsetDiff);
|
| 91 | 100 | }
|
| 92 | 101 |
|
| 93 | | - this.prevText = text;
|
| 94 | | - }
|
| 95 | | -
|
| 96 | | - this.keypress = false;
|
| 97 | | - this.keyup = false;
|
| 98 | | - this.keydown = false;
|
| 99 | | - this.mousedown = false;
|
| | 102 | + if ( sameFromLeft != offset - textDiffLength ) {
|
| | 103 | + console.log('spell');
|
| | 104 | + }
|
| 100 | 105 |
|
| 101 | | - /*
|
| 102 | 106 |
|
| 103 | | - var selection = rangy.getSelection();
|
| 104 | 107 |
|
| | 108 | +
|
| | 109 | + /*
|
| | 110 | + else if(textDiffLength === -1 && offsetDiff === -1 && offset === sameFromLeft ) {
|
| | 111 | + console.log("IME.1");
|
| | 112 | + } else if(textDiffLength === 0 && offsetDiff === 0 && offset-1 === sameFromLeft ) {
|
| | 113 | + console.log("IME.2");
|
| | 114 | + } else if ( textDiffLength < 0 || ( offset - textDiffLength ) !== sameFromLeft ) {
|
| | 115 | + console.log("SPELLCHECK");
|
| | 116 | + } else {
|
| | 117 | + console.log("!");
|
| | 118 | + }
|
| | 119 | + */
|
| | 120 | +
|
| | 121 | +
|
| | 122 | +
|
| | 123 | + if ( textDiffLength !== offsetDiff ) {
|
| | 124 | + //console.log("!!!!#####!!!!!");
|
| | 125 | + }
|
| 105 | 126 |
|
| 106 | | -
|
| 107 | | - // keyup in IE
|
| 108 | | - // keypress and keydown in FF and Chrome
|
| 109 | | - if ( (($.browser.msie && !this.keyup) || (!$.browser.msie && !this.keypress && !this.mousedown)) && !this.inime ) {
|
| 110 | | - console.log(this.inime);
|
| 111 | | - console.log('SPELLCHECK');
|
| 112 | | - this.prevText = text;
|
| 113 | | - this.keypress = false;
|
| 114 | | - this.keyup = false;
|
| 115 | | - this.mousedown = false;
|
| 116 | | - return;
|
| | 127 | + if(!this.keydown) {
|
| | 128 | + //console.log("## not keyboard");
|
| | 129 | + } else {
|
| | 130 | + //console.log("@@ keyboard");
|
| 117 | 131 | }
|
| 118 | 132 |
|
| 119 | | - console.log("keyboard");
|
| 120 | | - // we are going to need a cursor position
|
| 121 | | - var offset = this.getOffset( selection.anchorNode, selection.anchorOffset );
|
| 122 | | - var diffLength = text.length - this.prevText.length;
|
| 123 | | - //console.log("diffLength: " + diffLength);
|
| 124 | | -
|
| 125 | | - if ( diffLength > 0 ) {
|
| 126 | | - //console.log( text.substring(offset - diffLength, offset) );
|
| 127 | | - } else if ( diffLength === 0 ) {
|
| 128 | | - //console.log( text.substring(offset - 1, offset) );
|
| | 133 | +
|
| | 134 | +
|
| | 135 | +/*
|
| | 136 | + if((this.keydown || this.keyup) && this.lastKeydown !== 229) {
|
| | 137 | + console.log("");
|
| | 138 | + } else {
|
| | 139 | + console.log("Do NOT re-render");
|
| 129 | 140 | }
|
| 130 | | -
|
| 131 | | -
|
| | 141 | +*/
|
| 132 | 142 | this.prevText = text;
|
| | 143 | + this.diff = true;
|
| | 144 | + } else {
|
| | 145 | + this.diff = false;
|
| 133 | 146 | }
|
| | 147 | +
|
| | 148 | + this.prevOffset = offset;
|
| 134 | 149 | this.keypress = false;
|
| 135 | 150 | this.keyup = false;
|
| 136 | 151 | this.keydown = false;
|
| 137 | 152 | this.mousedown = false;
|
| 138 | | - */
|
| 139 | 153 | };
|
| 140 | 154 |
|
| 141 | 155 | app.getDOMText = function( elem ) {
|
| — | — | @@ -158,7 +172,7 @@ |
| 159 | 173 | return elem.nodeValue;
|
| 160 | 174 | }
|
| 161 | 175 |
|
| 162 | | - return ret;
|
| | 176 | + return ret;
|
| 163 | 177 | };
|
| 164 | 178 |
|
| 165 | 179 | app.prototype.getOffset = function( localNode, localOffset ) {
|