| Index: trunk/parsers/wikidom/lib/es/es.js |
| — | — | @@ -31,13 +31,17 @@ |
| 32 | 32 | /** |
| 33 | 33 | * Pixel position, a 2D position within a rendered document. |
| 34 | 34 | * |
| 35 | | - * @param x {Integer} Horizontal position |
| 36 | | - * @param y {Integer} Vertical position |
| | 35 | + * This can also support an optional bottom field, to represent a vertical line, such as a cursor. |
| | 36 | + * |
| | 37 | + * @param left {Integer} Horizontal position |
| | 38 | + * @param top {Integer} Vertical position (of top, if bottom is used) |
| | 39 | + * @param bottom {Integer} Vertical position of bottom (optional) |
| 37 | 40 | * @returns {Position} |
| 38 | 41 | */ |
| 39 | | -function Position( x, y ) { |
| 40 | | - this.x = x || 0; |
| 41 | | - this.y = y || 0; |
| | 42 | +function Position( left, top, bottom ) { |
| | 43 | + this.left = left || 0; |
| | 44 | + this.top = top || 0; |
| | 45 | + this.bottom = bottom || 0; |
| 42 | 46 | } |
| 43 | 47 | |
| 44 | 48 | /** |
| Index: trunk/parsers/wikidom/lib/es/es.Surface.js |
| — | — | @@ -35,6 +35,7 @@ |
| 36 | 36 | |
| 37 | 37 | // Cursor |
| 38 | 38 | this.cursor = new Cursor( this ); |
| | 39 | + this.$.after( this.cursor.$ ); |
| 39 | 40 | |
| 40 | 41 | // Hidden input |
| 41 | 42 | this.$input = $( '<input/>' ); |
| — | — | @@ -90,9 +91,12 @@ |
| 91 | 92 | } |
| 92 | 93 | var block = $block.data( 'block' ) |
| 93 | 94 | blockOffset = $block.offset() |
| 94 | | - position = new Position( e.pageX - blockOffset.left, e.pageY - blockOffset.top ) |
| 95 | | - offset = block.flow.getOffset( position ); |
| 96 | | - this.cursor.show( new Location( block, offset ) ); |
| | 95 | + mousePosition = new Position( e.pageX - blockOffset.left, e.pageY - blockOffset.top ) |
| | 96 | + nearestOffset = block.flow.getOffset( mousePosition ), |
| | 97 | + cursorPosition = block.flow.getPosition( nearestOffset ); |
| | 98 | + |
| | 99 | + this.cursor.show( cursorPosition, blockOffset ); |
| | 100 | + |
| 97 | 101 | this.$input.focus(); |
| 98 | 102 | return false; |
| 99 | 103 | }; |
| — | — | @@ -158,8 +162,8 @@ |
| 159 | 163 | location.block = block.previous(); |
| 160 | 164 | } |
| 161 | 165 | var above = this.getPosition( location ); |
| 162 | | - if ( above.y < below.y ) { |
| 163 | | - var distance = below.x - above.x; |
| | 166 | + if ( above.top < below.top ) { |
| | 167 | + var distance = below.left - above.left; |
| 164 | 168 | if ( minDistance > distance ) { |
| 165 | 169 | location.offset++; |
| 166 | 170 | break; |
| — | — | @@ -184,8 +188,8 @@ |
| 185 | 189 | location.block = block.next(); |
| 186 | 190 | } |
| 187 | 191 | var below = this.getPosition( location ); |
| 188 | | - if ( above.y < below.y ) { |
| 189 | | - var distance = below.x - above.x; |
| | 192 | + if ( above.top < below.top ) { |
| | 193 | + var distance = below.left - above.left; |
| 190 | 194 | if ( minDistance > distance ) { |
| 191 | 195 | location.offset++; |
| 192 | 196 | break; |
| Index: trunk/parsers/wikidom/lib/es/es.TextFlow.js |
| — | — | @@ -63,7 +63,7 @@ |
| 64 | 64 | */ |
| 65 | 65 | while ( line < lineCount ) { |
| 66 | 66 | bottom += this.lines[line].height; |
| 67 | | - if ( position.y >= top && position.y < bottom ) { |
| | 67 | + if ( position.top >= top && position.top < bottom ) { |
| 68 | 68 | break; |
| 69 | 69 | } |
| 70 | 70 | top = bottom; |
| — | — | @@ -74,14 +74,16 @@ |
| 75 | 75 | * Offset finding |
| 76 | 76 | * |
| 77 | 77 | * Now that we know which line we are on, we can just use the "fitCharacters" method to get the |
| 78 | | - * last offset before "position.x". |
| | 78 | + * last offset before "position.left". |
| 79 | 79 | * |
| 80 | 80 | * TODO: The offset needs to be chosen based on nearest offset to the cursor, not offset before |
| 81 | 81 | * the cursor. |
| 82 | 82 | */ |
| 83 | 83 | var $ruler = $( '<div class="editSurface-line"></div>' ).appendTo( this.$ ) |
| 84 | 84 | ruler = $ruler[0], |
| 85 | | - fit = this.fitCharacters( this.lines[line].start, this.lines[line].end, ruler, position.x ); |
| | 85 | + fit = this.fitCharacters( |
| | 86 | + this.lines[line].start, this.lines[line].end, ruler, position.left |
| | 87 | + ); |
| 86 | 88 | ruler.innerHTML = this.escape( this.text.substring( this.lines[line].start, fit.end ) ); |
| 87 | 89 | var left = ruler.clientWidth; |
| 88 | 90 | ruler.innerHTML = this.escape( this.text.substring( this.lines[line].start, fit.end + 1 ) ); |
| — | — | @@ -93,7 +95,10 @@ |
| 94 | 96 | var virtual = line < this.lines.length - 1 |
| 95 | 97 | && this.boundaryTest( this.lines[line].text.substr( -1, 1 ) ) |
| 96 | 98 | ? -1 : 0; |
| 97 | | - return Math.min( fit.end + ( position.x >= center ? 1 : 0 ), this.lines[line].end + virtual ); |
| | 99 | + return Math.min( |
| | 100 | + fit.end + ( position.left >= center ? 1 : 0 ), |
| | 101 | + this.lines[line].end + virtual |
| | 102 | + ); |
| 98 | 103 | }; |
| 99 | 104 | |
| 100 | 105 | /** |
| Index: trunk/parsers/wikidom/lib/es/es.Cursor.js |
| — | — | @@ -2,54 +2,44 @@ |
| 3 | 3 | *
|
| 4 | 4 | * @returns {Cursor}
|
| 5 | 5 | */
|
| 6 | | -function Cursor( surface ) {
|
| 7 | | - this.surface = surface;
|
| | 6 | +function Cursor() {
|
| 8 | 7 | this.cursorInterval = null;
|
| 9 | | - this.$cursor = $( '<div class="editSurface-cursor"></div>' );
|
| 10 | | - this.surface.$.after( this.$cursor );
|
| | 8 | + this.$ = $( '<div class="editSurface-cursor"></div>' );
|
| 11 | 9 | }
|
| 12 | 10 |
|
| 13 | 11 | /**
|
| 14 | | - * Shows the cursor in a new location.
|
| | 12 | + * Shows the cursor in a new position.
|
| 15 | 13 | *
|
| 16 | | - * @param location {Location} Location to show the cursor in
|
| | 14 | + * @param position {Position} Position to show the cursor at
|
| | 15 | + * @param offset {Position} Offset to be added to position
|
| 17 | 16 | */
|
| 18 | | -Cursor.prototype.show = function( location ) {
|
| 19 | | - this.surface.location = location;
|
| 20 | | -
|
| 21 | | - var position = this.surface.location.block.getPosition( this.surface.location.offset );
|
| 22 | | - var offset = this.surface.location.block.$.offset();
|
| 23 | | -
|
| 24 | | - this.$cursor.css({
|
| 25 | | - 'left': position.left + offset.left,
|
| 26 | | - 'top': position.top + offset.top
|
| | 17 | +Cursor.prototype.show = function( position, offset ) {
|
| | 18 | + if ( $.isPlainObject( offset ) ) {
|
| | 19 | + position.left += offset.left;
|
| | 20 | + position.top += offset.top;
|
| | 21 | + position.bottom += offset.top;
|
| | 22 | + }
|
| | 23 | + this.$.css({
|
| | 24 | + 'left': position.left,
|
| | 25 | + 'top': position.top,
|
| | 26 | + 'height': position.bottom - position.top
|
| 27 | 27 | }).show();
|
| 28 | 28 |
|
| 29 | | - if( this.cursorInterval ) {
|
| | 29 | + if ( this.cursorInterval ) {
|
| 30 | 30 | clearInterval( this.cursorInterval );
|
| 31 | 31 | }
|
| 32 | 32 | this.cursorInterval = setInterval( function( cursor ) {
|
| 33 | | - cursor.$cursor.css( 'display' ) == 'block' ? cursor.$cursor.hide() : cursor.$cursor.show();
|
| | 33 | + cursor.$.css( 'display' ) == 'block'
|
| | 34 | + ? cursor.$.hide() : cursor.$.show();
|
| 34 | 35 | }, 500, this );
|
| 35 | 36 | };
|
| 36 | 37 |
|
| 37 | 38 | /**
|
| 38 | 39 | * Hides the cursor.
|
| 39 | | - *
|
| 40 | | - * @returns {Location}
|
| 41 | 40 | */
|
| 42 | 41 | Cursor.prototype.hide = function() {
|
| 43 | 42 | if( this.cursorInterval ) {
|
| 44 | 43 | clearInterval( this.cursorInterval );
|
| 45 | 44 | }
|
| 46 | | - this.$cursor.hide()
|
| | 45 | + this.$.hide()
|
| 47 | 46 | };
|
| 48 | | -
|
| 49 | | -/**
|
| 50 | | - * Gets the current location of the cursor.
|
| 51 | | - *
|
| 52 | | - * @returns {Location}
|
| 53 | | - */
|
| 54 | | -Cursor.prototype.get = function() {
|
| 55 | | - return this.surface.location;
|
| 56 | | -}; |
| \ No newline at end of file |