r111430 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:< r111429‎ | r111430 | r111431 >
Date:22:45, 13 February 2012
Author:inez
Status:deferred
Tags:
Comment:
New approach to text input and IME (part I)
Modified paths:
  • /trunk/extensions/VisualEditor/modules/ve/ce/ve.es.Surface.js (modified) (history)

Diff [purge]

Index: trunk/extensions/VisualEditor/modules/ve/ce/ve.es.Surface.js
——@@ -24,8 +24,29 @@
2525 .addClass( 'es-surfaceView' )
2626 .append( this.documentView.$ );
2727 this.emitUpdateTimeout = undefined;
 28+ this.node = null;
2829
2930 // Events
 31+ this.documentView.$.bind( {
 32+ 'focus': function( e ) {
 33+ $document.unbind( '.ce-surfaceView' );
 34+ $document.bind( {
 35+ 'keydown.ce-surfaceView': function( e ) {
 36+ return _this.onKeyDown( e );
 37+ },
 38+ } );
 39+ _this.setNode();
 40+ },
 41+ 'blur': function( e ) {
 42+ $document.unbind( '.ce-surfaceView' );
 43+ }
 44+ } );
 45+
 46+ this.$.mousedown( function(e) {
 47+ return _this.onMouseDown( e );
 48+ } );
 49+
 50+ /*
3051 this.model.getDocument().on( 'update', function() {
3152 _this.emitUpdate( 25 );
3253 } );
——@@ -46,17 +67,206 @@
4768 this.$.on('cut copy', function( e ) {
4869 _this.onCutCopy( e );
4970 } );
 71+ */
5072
5173 // Initialization
5274 this.documentView.renderContent();
 75+};
 76+
 77+/* Methods */
 78+
 79+ve.es.Surface.prototype.attachContextView = function( contextView ) {
 80+ this.contextView = contextView;
 81+};
 82+
 83+ve.es.Surface.prototype.getModel = function() {
 84+ return this.model;
 85+};
 86+
 87+ve.es.Surface.prototype.onKeyDown = function( e ) {
 88+ switch ( e.keyCode ) {
 89+ // Page up
 90+ case 33:
 91+ // Page down
 92+ case 34:
 93+ // Home
 94+ case 36:
 95+ // End
 96+ case 35:
 97+ // Up arrow
 98+ case 38:
 99+ // Down arrow
 100+ case 40:
 101+ this.setNode();
 102+ break;
 103+ // Left arrow
 104+ case 37:
 105+ this.setNode( 'left' );
 106+ break;
 107+ // Right arrow
 108+ case 39:
 109+ this.setNode( 'right' );
 110+ break;
 111+ }
 112+};
 113+
 114+ve.es.Surface.prototype.onMouseDown = function( e ) {
 115+ this.setNode();
 116+};
 117+
 118+ve.es.Surface.prototype.setNode = function( direction ) {
 119+ var _this = this;
53120
54 - this.worker = null;
55 - this.node = null;
 121+ setTimeout( function() {
 122+ var rangySelection = rangy.getSelection();
56123
 124+ if ( rangySelection.anchorNode === _this.node ) {
 125+ return;
 126+ }
 127+
 128+ if ( rangySelection.anchorNode.nodeType !== 3 ) {
 129+ if ( _this.node === null ) {
 130+ throw "Value of this.node shouldn't be a null";
 131+ }
 132+ if ( direction !== 'left' && direction !== 'right' ) {
 133+ throw "At this point value of direction should be 'left' or 'right'";
 134+ }
 135+ var oldOffset = _this.getOffset( _this.node, 0 ),
 136+ newOffset;
 137+
 138+ if ( direction === 'left' ) {
 139+ newOffset = _this.documentView.model.getRelativeContentOffset( oldOffset, -1 );
 140+ } else if ( direction === 'right' ) {
 141+ newOffset = _this.documentView.model.getRelativeContentOffset( oldOffset + _this.node.length, 1 );
 142+ }
 143+ _this.showCursorAt( newOffset );
 144+ _this.setNode();
 145+ return;
 146+ }
 147+
 148+ _this.node = rangySelection.anchorNode;
 149+
 150+ console.log(_this.node);
 151+ }, 0 );
57152 };
58153
59 -/* Methods */
 154+ve.es.Surface.prototype.getSelection = function() {
 155+ var selection = rangy.getSelection();
60156
 157+ if ( selection.anchorNode === selection.focusNode && selection.anchorOffset === selection.focusOffset ) {
 158+ // cursor
 159+ var offset = this.getOffset( selection.anchorNode, selection.anchorOffset );
 160+ return new ve.Range( offset, offset );
 161+ } else {
 162+ // selection
 163+ var offset1 = this.getOffset( selection.anchorNode, selection.anchorOffset );
 164+ var offset2 = this.getOffset( selection.focusNode, selection.focusOffset );
 165+ return new ve.Range( offset1, offset2 );
 166+ }
 167+};
 168+
 169+ve.es.Surface.prototype.getOffset = function( localNode, localOffset ) {
 170+ var $node = $( localNode );
 171+
 172+ if ( $node.hasClass( 'ce-leafNode' ) ) {
 173+ return this.documentView.getOffsetFromNode( $node.data('view') ) + 1;
 174+ }
 175+
 176+ while( !$node.hasClass( 'ce-leafNode' ) ) {
 177+ $node = $node.parent();
 178+ }
 179+
 180+ var current = [$node.contents(), 0];
 181+ var stack = [current];
 182+
 183+ var offset = 0;
 184+
 185+ while ( stack.length > 0 ) {
 186+ if ( current[1] >= current[0].length ) {
 187+ stack.pop();
 188+ current = stack[ stack.length - 1 ];
 189+ continue;
 190+ }
 191+ var item = current[0][current[1]];
 192+ var $item = current[0].eq( current[1] );
 193+
 194+ if ( item.nodeType === 3 ) {
 195+ if ( item === localNode ) {
 196+ offset += localOffset;
 197+ break;
 198+ } else {
 199+ offset += item.textContent.length;
 200+ }
 201+ } else if ( item.nodeType === 1 ) {
 202+ if ( $( item ).attr('contentEditable') === "false" ) {
 203+ offset += 1;
 204+ } else {
 205+ if ( item === localNode ) {
 206+ offset += localOffset;
 207+ break;
 208+ }
 209+
 210+ stack.push( [$item.contents(), 0] );
 211+ current[1]++;
 212+ current = stack[stack.length-1];
 213+ continue;
 214+ }
 215+ }
 216+ current[1]++;
 217+ }
 218+
 219+ return this.documentView.getOffsetFromNode( $node.data('view') ) + 1 + offset;
 220+};
 221+
 222+ve.es.Surface.prototype.showCursorAt = function( offset ) {
 223+ var $node = this.documentView.getNodeFromOffset( offset ).$;
 224+ var current = [$node.contents(), 0];
 225+ var stack = [current];
 226+ var node;
 227+ var localOffset;
 228+
 229+ var index = 1 + this.documentView.getOffsetFromNode( $node.data('view') );
 230+
 231+ while ( stack.length > 0 ) {
 232+ if ( current[1] >= current[0].length ) {
 233+ stack.pop();
 234+ current = stack[ stack.length - 1 ];
 235+ continue;
 236+ }
 237+ var item = current[0][current[1]];
 238+ var $item = current[0].eq( current[1] );
 239+
 240+ if ( item.nodeType === 3 ) {
 241+ var length = item.textContent.length;
 242+ if ( offset >= index && offset <= index + length ) {
 243+ node = item;
 244+ localOffset = offset - index;
 245+ break;
 246+ } else {
 247+ index += length;
 248+ }
 249+ } else if ( item.nodeType === 1 ) {
 250+ if ( $( item ).attr('contentEditable') === "false" ) {
 251+ index += 1;
 252+ } else {
 253+ stack.push( [$item.contents(), 0] );
 254+ current[1]++;
 255+ current = stack[stack.length-1];
 256+ continue;
 257+ }
 258+ }
 259+ current[1]++;
 260+ }
 261+ var range = document.createRange();
 262+ range.collapsed = true;
 263+ range.setStart(node, localOffset);
 264+
 265+ var sel = window.getSelection();
 266+ sel.removeAllRanges();
 267+ sel.addRange(range);
 268+};
 269+
 270+/*
61271 ve.es.Surface.prototype.onCutCopy = function( e ) {
62272 var _this = this,
63273 key = rangy.getSelection().getRangeAt(0).toString().replace(/( |\r\n|\n|\r|\t)/gm,"");
——@@ -159,14 +369,6 @@
160370 }, 1 );
161371 };
162372
163 -ve.es.Surface.prototype.attachContextView = function( contextView ) {
164 - this.contextView = contextView;
165 -};
166 -
167 -ve.es.Surface.prototype.getModel = function() {
168 - return this.model;
169 -};
170 -
171373 ve.es.Surface.prototype.emitUpdate = function( delay ) {
172374 if ( delay ) {
173375 if ( this.emitUpdateTimeout !== undefined ) {
——@@ -182,76 +384,6 @@
183385 }
184386 };
185387
186 -ve.es.Surface.prototype.getOffset = function( localNode, localOffset ) {
187 - var $node = $( localNode );
188 -
189 - if ( $node.hasClass( 'ce-leafNode' ) ) {
190 - return this.documentView.getOffsetFromNode( $node.data('view') ) + 1;
191 - }
192 -
193 - while( !$node.hasClass( 'ce-leafNode' ) ) {
194 - $node = $node.parent();
195 - }
196 -
197 - var current = [$node.contents(), 0];
198 - var stack = [current];
199 -
200 - var offset = 0;
201 -
202 - while ( stack.length > 0 ) {
203 - if ( current[1] >= current[0].length ) {
204 - stack.pop();
205 - current = stack[ stack.length - 1 ];
206 - continue;
207 - }
208 - var item = current[0][current[1]];
209 - var $item = current[0].eq( current[1] );
210 -
211 - if ( item.nodeType === 3 ) {
212 - if ( item === localNode ) {
213 - offset += localOffset;
214 - break;
215 - } else {
216 - offset += item.textContent.length;
217 - }
218 - } else if ( item.nodeType === 1 ) {
219 - if ( $( item ).attr('contentEditable') === "false" ) {
220 - offset += 1;
221 - } else {
222 - if ( item === localNode ) {
223 - offset += localOffset;
224 - break;
225 - }
226 -
227 - stack.push( [$item.contents(), 0] );
228 - current[1]++;
229 - current = stack[stack.length-1];
230 - continue;
231 - }
232 - }
233 - current[1]++;
234 - }
235 -
236 - return this.documentView.getOffsetFromNode( $node.data('view') ) + 1 + offset;
237 -}
238 -
239 -ve.es.Surface.prototype.getSelection = function() {
240 - var selection = rangy.getSelection();
241 -
242 - if ( selection.anchorNode === selection.focusNode && selection.anchorOffset === selection.focusOffset ) {
243 - // only one offset
244 - var offset = this.getOffset( selection.anchorNode, selection.anchorOffset );
245 - return new ve.Range( offset, offset );
246 - } else {
247 - // two offsets
248 - var offset1 = this.getOffset( selection.anchorNode, selection.anchorOffset );
249 - var offset2 = this.getOffset( selection.focusNode, selection.focusOffset );
250 -
251 - return new ve.Range( offset1, offset2 );
252 - }
253 -};
254 -
255 -
256388 ve.es.Surface.prototype.showCursorAt = function( offset ) {
257389 var $node = this.documentView.getNodeFromOffset( offset ).$;
258390 var current = [$node.contents(), 0];
——@@ -358,8 +490,8 @@
359491 sel.setSingleRange(range1);
360492 }, 3000);
361493 }
 494+*/
362495
363 -
364496 /* Inheritance */
365497
366498 ve.extendClass( ve.es.Surface, ve.EventEmitter );

Status & tagging log