/*global rangy */
/**
* VisualEditor content editable Surface class.
*
* @copyright 2011-2012 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* ContentEditable surface.
*
* @class
* @constructor
* @extends {ve.EventEmitter}
* @param {jQuery} $container
* @param {ve.dm.Surface} model Model to observe
* @param {ve.Surface} surface The surface of this view
*/
ve.ce.Surface = function VeCeSurface( $container, model, surface ) {
// Parent constructor
ve.EventEmitter.call( this );
// Properties
this.surface = surface;
this.inIme = false;
this.model = model;
this.documentView = new ve.ce.Document( model.getDocument(), this );
this.surfaceObserver = new ve.ce.SurfaceObserver( this.documentView );
this.selectionTimeout = null;
this.$ = $container;
this.$document = $( document );
this.clipboard = {};
this.renderingEnabled = true;
this.dragging = false;
this.selecting = false;
this.$phantoms = $( '
' );
this.pasting = false;
// Events
this.surfaceObserver.addListenerMethods(
this, { 'contentChange': 'onContentChange', 'selectionChange': 'onSelectionChange' }
);
this.model.addListenerMethods(
this, { 'change': 'onChange', 'lock': 'onLock', 'unlock': 'onUnlock' }
);
this.documentView.getDocumentNode().$.on( {
'focus': ve.bind( this.documentOnFocus, this ),
'blur': ve.bind( this.documentOnBlur, this )
} );
this.$.on( {
'cut': ve.bind( this.onCut, this ),
'copy': ve.bind( this.onCopy, this ),
'paste': ve.bind( this.onPaste, this ),
'dragover drop': function ( e ) {
// Prevent content drag & drop
e.preventDefault();
return false;
}
} );
if ( $.browser.msie ) {
this.$.on( 'beforepaste', ve.bind( this.onPaste, this ) );
}
// Initialization
rangy.init();
ve.ce.Surface.clearLocalStorage();
this.$.append( this.documentView.getDocumentNode().$ );
this.$.append( this.$phantoms );
};
/* Inheritance */
ve.inheritClass( ve.ce.Surface, ve.EventEmitter );
/* Static Members */
ve.ce.Surface.static = {};
ve.ce.Surface.static.$phantomTemplate = $( '
' )
.attr( 'title', ve.msg ( 'visualeditor-aliennode-tooltip' ) );
/* Methods */
/**
* Destroy the surface, removing all DOM elements.
*
* @method
* @returns {ve.ui.Context} Context user interface
*/
ve.ce.Surface.prototype.destroy = function () {
this.$.remove();
};
ve.ce.Surface.prototype.handleInsertion = function () {
var slug, data, range, annotations, insertionAnnotations, placeholder,
selection = this.model.getSelection();
// Handles removing expanded selection before inserting new text
if ( !selection.isCollapsed() ) {
// Pull annotations from the first character in the selection
annotations = this.model.documentModel.getAnnotationsFromRange(
new ve.Range( selection.start, selection.start + 1 )
);
this.model.change(
ve.dm.Transaction.newFromRemoval( this.documentView.model, selection ),
new ve.Range( selection.start )
);
this.surfaceObserver.clear();
selection = this.model.getSelection();
this.model.setInsertionAnnotations( annotations );
}
insertionAnnotations = this.model.getInsertionAnnotations() || new ve.AnnotationSet();
if ( selection.isCollapsed() ) {
slug = this.documentView.getSlugAtOffset( selection.start );
// Is this a slug or are the annotations to the left different than the insertion
// annotations?
if (
slug || (
selection.start > 0 &&
!ve.compareObjects (
this.model.getDocument().getAnnotationsFromOffset( selection.start - 1 ),
insertionAnnotations
)
)
) {
placeholder = '\u2659';
if ( !insertionAnnotations.isEmpty() ) {
placeholder = [placeholder, insertionAnnotations];
}
// is this a slug and if so, is this a block slug?
if ( slug && ve.dm.Document.isStructuralOffset(
this.documentView.model.data, selection.start
) ) {
range = new ve.Range( selection.start + 1, selection.start + 2 );
data = [{ 'type' : 'paragraph' }, placeholder, { 'type' : '/paragraph' }];
} else {
range = new ve.Range( selection.start, selection.start + 1 );
data = [placeholder];
}
this.model.change(
ve.dm.Transaction.newFromInsertion(
this.documentView.model, selection.start, data
),
range
);
this.surfaceObserver.clear();
}
}
this.surfaceObserver.stop( true );
};
/**
* Responds to 'contentChange' events emitted in {ve.ce.SurfaceObserver.prototype.poll}.
*
* @method
* @param {HTMLElement} node DOM node the change occured in
* @param {Object} previous Old data
* @param {Object} previous.text Old plain text content
* @param {Object} previous.hash Old DOM hash
* @param {Object} previous.range Old selection
* @param {Object} next New data
* @param {Object} next.text New plain text content
* @param {Object} next.hash New DOM hash
* @param {Object} next.range New selection
*/
ve.ce.Surface.prototype.onContentChange = function ( node, previous, next ) {
var data, range, len, annotations, offsetDiff, lengthDiff, sameLeadingAndTrailing,
previousStart, nextStart, newRange,
fromLeft = 0,
fromRight = 0,
nodeOffset = node.getModel().getOffset();
if ( previous.range && next.range ) {
offsetDiff = ( previous.range.isCollapsed() && next.range.isCollapsed() ) ?
next.range.start - previous.range.start : null;
lengthDiff = next.text.length - previous.text.length;
previousStart = previous.range.start - nodeOffset - 1;
nextStart = next.range.start - nodeOffset - 1;
sameLeadingAndTrailing = offsetDiff !== null && (
// TODO: rewrite to static method with tests
(
lengthDiff > 0 &&
previous.text.substring( 0, previousStart ) ===
next.text.substring( 0, previousStart ) &&
previous.text.substring( previousStart ) ===
next.text.substring( nextStart )
) ||
(
lengthDiff < 0 &&
previous.text.substring( 0, nextStart ) ===
next.text.substring( 0, nextStart ) &&
previous.text.substring( previousStart - lengthDiff + offsetDiff) ===
next.text.substring( nextStart )
)
);
// Simple insertion
if ( lengthDiff > 0 && offsetDiff === lengthDiff /* && sameLeadingAndTrailing */) {
data = next.text.substring(
previous.range.start - nodeOffset - 1,
next.range.start - nodeOffset - 1
).split( '' );
// Apply insertion annotations
annotations = this.model.getInsertionAnnotations();
if ( annotations instanceof ve.AnnotationSet ) {
ve.dm.Document.addAnnotationsToData( data, this.model.getInsertionAnnotations() );
}
this.disableRendering();
this.model.change(
ve.dm.Transaction.newFromInsertion(
this.documentView.model, previous.range.start, data
),
next.range
);
this.enableRendering();
return;
}
// Simple deletion
if ( ( offsetDiff === 0 || offsetDiff === lengthDiff ) && sameLeadingAndTrailing ) {
if ( offsetDiff === 0 ) {
range = new ve.Range( next.range.start, next.range.start - lengthDiff );
} else {
range = new ve.Range( next.range.start, previous.range.start );
}
this.disableRendering();
this.model.change(
ve.dm.Transaction.newFromRemoval( this.documentView.model, range ),
next.range
);
this.enableRendering();
return;
}
}
// Complex change
len = Math.min( previous.text.length, next.text.length );
// Count same characters from left
while ( fromLeft < len && previous.text[fromLeft] === next.text[fromLeft] ) {
++fromLeft;
}
// Count same characters from right
while (
fromRight < len - fromLeft &&
previous.text[previous.text.length - 1 - fromRight] ===
next.text[next.text.length - 1 - fromRight]
) {
++fromRight;
}
data = next.text.substring( fromLeft, next.text.length - fromRight ).split( '' );
// Get annotations to the left of new content and apply
annotations =
this.model.getDocument().getAnnotationsFromOffset( nodeOffset + 1 + fromLeft );
if ( annotations.getLength() ) {
ve.dm.Document.addAnnotationsToData( data, annotations );
}
newRange = next.range;
if ( newRange.isCollapsed() ) {
newRange = new ve.Range( this.getNearestCorrectOffset( newRange.start, 1 ) );
}
if ( data.length > 0 ) {
this.model.change(
ve.dm.Transaction.newFromInsertion(
this.documentView.model, nodeOffset + 1 + fromLeft, data
),
newRange
);
}
if ( fromLeft + fromRight < previous.text.length ) {
this.model.change(
ve.dm.Transaction.newFromRemoval(
this.documentView.model,
new ve.Range(
data.length + nodeOffset + 1 + fromLeft,
data.length + nodeOffset + 1 + previous.text.length - fromRight
)
),
newRange
);
}
};
/**
* Responds to 'selectionChange' events emitted in {ve.ce.SurfaceObserver.prototype.poll}.
*
* @method
*/
ve.ce.Surface.prototype.onSelectionChange = function ( oldRange, newRange ) {
this.disableRendering();
this.model.change( null, newRange );
this.enableRendering();
};
/**
* Responds to surface lock events.
*
* @method
*/
ve.ce.Surface.prototype.onLock = function () {
this.surfaceObserver.stop();
};
/**
* Responds to surface lock events.
*
* @method
*/
ve.ce.Surface.prototype.onUnlock = function () {
this.surfaceObserver.clear( this.model.getSelection() );
this.surfaceObserver.start();
};
/**
* Responds to document focus events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.documentOnFocus = function () {
this.$document.off( '.ve-ce-Surface' );
this.$document.on( {
'keydown.ve-ce-Surface': ve.bind( this.onKeyDown, this ),
'keyup.ve-ce-Surface': ve.bind( this.onKeyUp, this ),
'keypress.ve-ce-Surface': ve.bind( this.onKeyPress, this ),
'mousedown.ve-ce-Surface': ve.bind( this.onMouseDown, this ),
'mouseup.ve-ce-Surface': ve.bind( this.onMouseUp, this ),
'mousemove.ve-ce-Surface': ve.bind( this.onMouseMove, this ),
'compositionstart.ve-ce-Surface': ve.bind( this.onCompositionStart, this ),
'compositionend.ve-ce-Surface': ve.bind( this.onCompositionEnd, this ),
} );
this.surfaceObserver.start( true );
};
ve.ce.Surface.prototype.onCompositionStart = function () {
if ( $.browser.msie === true ) {
return;
}
this.inIme = true;
this.handleInsertion();
};
ve.ce.Surface.prototype.onCompositionEnd = function () {
this.inIme = false;
this.surfaceObserver.start();
};
/**
* Responds to document blur events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.documentOnBlur = function () {
this.$document.off( '.ve-ce-Surface' );
this.surfaceObserver.stop( true );
};
/**
* Responds to document mouse down events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onMouseDown = function ( e ) {
// Remember the mouse is down
this.dragging = true;
// Old code to figure out if user clicked inside the document or not - leave it here for now
// $( e.target ).closest( '.ve-ce-documentNode' ).length === 0
if ( e.which === 1 ) {
this.surfaceObserver.stop( true );
}
// Block / prevent triple click
if ( e.originalEvent.detail > 2 ) {
e.preventDefault();
}
};
/**
* Responds to document mouse up events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onMouseUp = function ( e ) {
this.surfaceObserver.start();
if ( !e.shiftKey && this.selecting ) {
this.emit( 'selectionEnd' );
this.selecting = false;
}
this.dragging = false;
};
/**
* Responds to document mouse move events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onMouseMove = function () {
// Detect beginning of selection by moving mouse while dragging
if ( this.dragging && !this.selecting ) {
this.selecting = true;
this.emit( 'selectionStart' );
}
};
/**
* Responds to document key up events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onKeyUp = function ( e ) {
// Detect end of selecting by letting go of shift
if ( !this.dragging && this.selecting && e.keyCode === 16 ) {
this.selecting = false;
this.emit( 'selectionEnd' );
}
};
/**
* Responds to document key down events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onKeyDown = function ( e ) {
if ( this.inIme === true ) {
return;
}
if ( e.which === 229 && $.browser.msie === true ) {
this.inIme = true;
this.handleInsertion();
return;
}
// Detect start of selecting using shift+arrow keys
if ( !this.dragging && !this.selecting && e.shiftKey && e.keyCode >= 37 && e.keyCode <= 40 ) {
this.selecting = true;
this.emit( 'selectionStart' );
}
switch ( e.keyCode ) {
// Left arrow
case 37:
if ( this.adjustCursor( -1 ) ) {
e.preventDefault();
}
break;
// Right arrow
case 39:
if ( this.adjustCursor( 1 ) ) {
e.preventDefault();
}
break;
// Enter
case 13:
e.preventDefault();
this.handleEnter( e );
break;
// Backspace
case 8:
this.handleDelete( e, true );
this.surfaceObserver.stop( true );
this.surfaceObserver.start();
break;
// Delete
case 46:
this.handleDelete( e, false );
this.surfaceObserver.stop( true );
this.surfaceObserver.start();
break;
default:
// Execute key command if available
this.surfaceObserver.stop( true );
if ( this.surface.execute( new ve.Command( e ) ) ) {
e.preventDefault();
}
this.surfaceObserver.start();
}
};
/**
* Responds to copy events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onCopy = function () {
var sel = rangy.getSelection(),
$frag = $( sel.getRangeAt(0).cloneContents() ),
slice = this.documentView.model.getSlice( this.model.getSelection() ),
key = '';
// Create key from text and element names
$frag.contents().each( function () {
key += this.textContent || this.nodeName;
} );
key = 've-' + key.replace( /\s/gm, '' );
// Set clipboard and localStorage
this.clipboard[key] = slice;
try {
localStorage.setItem(
key,
JSON.stringify( {
'time': new Date().getTime(),
'data': slice
} )
);
} catch ( e ) {
// Silently ignore
}
};
/**
* Responds to cut events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onCut = function ( e ) {
var surface = this;
this.surfaceObserver.stop();
this.onCopy( e );
setTimeout( function () {
var selection,
tx;
// We don't like how browsers cut, so let's undo it and do it ourselves.
document.execCommand( 'undo', false, false );
selection = surface.model.getSelection();
// Transact
tx = ve.dm.Transaction.newFromRemoval( surface.documentView.model, selection );
surface.model.change( tx, new ve.Range( selection.start ) );
surface.surfaceObserver.clear();
surface.surfaceObserver.start();
}, 1 );
};
/**
* Responds to paste events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onPaste = function ( e ) {
// Prevent pasting until after we are done
if ( this.pasting ) {
e.preventDefault();
return false;
}
this.pasting = true;
var tx, scrollTop,
$window = $( window ),
view = this,
selection = this.model.getSelection();
this.surfaceObserver.stop();
// Pasting into a range? Remove first.
if ( !rangy.getSelection().isCollapsed ) {
tx = ve.dm.Transaction.newFromRemoval( view.documentView.model, selection );
view.model.change( tx );
}
// Save scroll position and change focus to "offscreen" paste target
scrollTop = $window.scrollTop();
$( '#paste' ).html( '' ).show().focus();
setTimeout( function () {
var pasteText, pasteData, tx,
key = '';
// Create key from text and element names
$( '#paste' ).hide().contents().each( function () {
key += this.textContent || this.nodeName;
} );
key = 've-' + key.replace( /\s/gm, '' );
// Get linear model from clipboard, localStorage, or create array from unknown pasted content
if ( view.clipboard[key] ) {
pasteData = view.clipboard[key];
}
/*
else if ( localStorage.getItem( key ) ) {
pasteData = localStorage.getItem( key ).data;
}
*/
else {
pasteText = $( '#paste' ).text().replace( /\n/gm, '');
pasteData = new ve.dm.DocumentSlice( pasteText.split( '' ) );
}
// Transact
try {
tx = ve.dm.Transaction.newFromInsertion(
view.documentView.model,
selection.start,
pasteData.getData()
);
} catch ( e ) {
tx = ve.dm.Transaction.newFromInsertion(
view.documentView.model,
selection.start,
pasteData.getBalancedData()
);
}
// Restore focus and scroll position
view.documentView.documentNode.$.focus();
$window.scrollTop( scrollTop );
view.model.change( tx, tx.translateRange( selection ).truncate( 0 ) );
// Allow pasting again
view.pasting = false;
}, 0 );
};
/**
* Responds to document key press events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.onKeyPress = function ( e ) {
if ( ve.ce.Surface.isShortcutKey( e ) || e.which === 13 || e.which === 8 || e.which === 0 ) {
return;
}
this.handleInsertion();
setTimeout( ve.bind( function () {
this.surfaceObserver.start();
}, this ), 0 );
};
/**
* Called from ve.dm.Surface.prototype.change.
*
* @method
* @param {ve.dm.Transaction|null} transaction
* @param {ve.Range|undefined} selection
*/
ve.ce.Surface.prototype.onChange = function ( transaction, selection ) {
if ( selection && this.isRenderingEnabled() ) {
this.showSelection( selection );
}
};
/**
* Responds to enter key events.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.prototype.handleEnter = function ( e ) {
var tx, outerParent, outerChildrenCount, list,
selection = this.model.getSelection(),
documentModel = this.model.getDocument(),
emptyParagraph = [{ 'type': 'paragraph' }, { 'type': '/paragraph' }],
advanceCursor = true,
node = this.documentView.getNodeFromOffset( selection.from ),
nodeModel = node.getModel(),
cursor = selection.from,
contentBranchModel = nodeModel.isContent() ? nodeModel.getParent() : nodeModel,
contentBranchModelRange = contentBranchModel.getRange(),
stack = [],
outermostNode = null;
// Stop polling while we work
this.surfaceObserver.stop();
// Handle removal first
if ( selection.from !== selection.to ) {
tx = ve.dm.Transaction.newFromRemoval( documentModel, selection );
selection = tx.translateRange( selection );
this.model.change( tx, selection );
}
// Handle insertion
if (
contentBranchModel.getType() !== 'paragraph' &&
(
cursor === contentBranchModelRange.from ||
cursor === contentBranchModelRange.to
)
) {
// If we're at the start/end of something that's not a paragraph, insert a paragraph
// before/after
if ( cursor === contentBranchModelRange.from ) {
tx = ve.dm.Transaction.newFromInsertion(
documentModel, contentBranchModel.getOuterRange().from, emptyParagraph
);
} else if ( cursor === contentBranchModelRange.to ) {
tx = ve.dm.Transaction.newFromInsertion(
documentModel, contentBranchModel.getOuterRange().to, emptyParagraph
);
}
} else {
// Split
ve.Node.traverseUpstream( node, function ( node ) {
if ( !node.canBeSplit() ) {
return false;
}
stack.splice(
stack.length / 2,
0,
{ 'type': '/' + node.type },
node.model.getClonedElement()
);
outermostNode = node;
if ( e.shiftKey ) {
return false;
} else {
return true;
}
} );
outerParent = outermostNode.getModel().getParent();
outerChildrenCount = outerParent.getChildren().length;
if (
// This is a list item
outermostNode.type === 'listItem' &&
// This is the last list item
outerParent.getChildren()[outerChildrenCount - 1] === outermostNode.getModel() &&
// There is one child
outermostNode.children.length === 1 &&
// The child is empty
node.model.length === 0
) {
// Enter was pressed in an empty list item.
list = outermostNode.getModel().getParent();
// Remove the list item
tx = ve.dm.Transaction.newFromRemoval(
documentModel, outermostNode.getModel().getOuterRange()
);
this.model.change( tx );
// Insert a paragraph
tx = ve.dm.Transaction.newFromInsertion(
documentModel, list.getOuterRange().to, emptyParagraph
);
advanceCursor = false;
} else {
// We must process the transaction first because getRelativeContentOffset can't help us
// yet
tx = ve.dm.Transaction.newFromInsertion( documentModel, selection.from, stack );
}
}
// Commit the transaction
this.model.change( tx );
// Now we can move the cursor forward
if ( advanceCursor ) {
this.model.change(
null, new ve.Range( documentModel.getRelativeContentOffset( selection.from, 1 ) )
);
} else {
this.model.change(
null, new ve.Range( documentModel.getNearestContentOffset( selection.from ) )
);
}
// Reset and resume polling
this.surfaceObserver.clear();
this.surfaceObserver.start();
};
/**
* Adjusts the cursor position in a given distance.
*
* This method only affects the selection target, preserving selections that are not collapsed and
* the direction of the selection.
*
* @method
* @param {Number} adjustment Distance to adjust the cursor, can be positive or negative
* @returns {Boolean} Cursor was moved
*/
ve.ce.Surface.prototype.adjustCursor = function ( adjustment ) {
// Bypass for zero-adjustment
if ( !adjustment ) {
return false;
}
var adjustedTargetOffset,
bias = adjustment > 0 ? 1 : -1,
selection = this.model.getSelection(),
targetOffset = selection.to,
documentModel = this.model.getDocument(),
relativeContentOffset = documentModel.getRelativeContentOffset( targetOffset, adjustment ),
relativeStructuralOffset = documentModel.getRelativeStructuralOffset(
targetOffset + bias, adjustment, true
);
// Check if we've moved into a slug
if ( this.hasSlugAtOffset( relativeStructuralOffset ) ) {
// Check if the relative content offset is in the opposite direction we are trying to go
if ( ( relativeContentOffset - targetOffset < 0 ? -1 : 1 ) !== bias ) {
// There's nothing past the slug we are already in, stay in it
adjustedTargetOffset = relativeStructuralOffset;
} else {
// There's a slug neaby, go into it if it's closer
adjustedTargetOffset = adjustment < 0 ?
Math.max( relativeContentOffset, relativeStructuralOffset ) :
Math.min( relativeContentOffset, relativeStructuralOffset );
}
}
// Check if we've moved a different distance than we asked for
else if ( relativeContentOffset !== targetOffset + adjustment ) {
// We can't trust the browser, move programatically
adjustedTargetOffset = relativeContentOffset;
}
// If the target changed, update the model
if ( adjustedTargetOffset ) {
this.model.change(
null,
new ve.Range(
selection.isCollapsed() ?
adjustedTargetOffset : selection.from, adjustedTargetOffset
)
);
return true;
}
return false;
};
/**
* Responds to backspace and delete key events.
*
* @method
* @param {Boolean} Key was a backspace
*/
ve.ce.Surface.prototype.handleDelete = function ( e, backspace ) {
var sourceOffset,
targetOffset,
sourceSplitableNode,
targetSplitableNode,
tx,
cursorAt,
sourceNode,
targetNode,
sourceData,
nodeToDelete,
adjacentData,
adjacentText,
adjacentTextAfterMatch,
endOffset,
i,
selection = this.model.getSelection(),
containsInlineElements = false;
if ( selection.from === selection.to ) {
// Set source and target linmod offsets
if ( backspace ) {
sourceOffset = selection.to;
targetOffset = this.getNearestCorrectOffset( sourceOffset - 1, -1 );
// At the beginning of the document - don't do anything and preventDefault
if ( sourceOffset === targetOffset ) {
e.preventDefault();
return;
}
} else {
sourceOffset = this.model.getDocument().getRelativeContentOffset( selection.to, 1 );
targetOffset = selection.to;
// At the end of the document - don't do anything and preventDefault
if ( sourceOffset <= targetOffset ) {
e.preventDefault();
return;
}
}
// Set source and target nodes
sourceNode = this.documentView.getNodeFromOffset( sourceOffset, false ),
targetNode = this.documentView.getNodeFromOffset( targetOffset, false );
if ( sourceNode.type === targetNode.type ) {
sourceSplitableNode = ve.ce.Node.getSplitableNode( sourceNode );
targetSplitableNode = ve.ce.Node.getSplitableNode( targetNode );
}
//ve.log(sourceSplitableNode, targetSplitableNode);
// Save target location of cursor
cursorAt = targetOffset;
// Get text from cursor location to end of node in the proper direction
adjacentData = null;
adjacentText = '';
if ( backspace ) {
adjacentData = sourceNode.model.doc.data.slice(
sourceNode.model.getOffset() + ( sourceNode.model.isWrapped() ? 1 : 0 ) ,
sourceOffset
);
} else {
endOffset = targetNode.model.getOffset() +
targetNode.model.getLength() +
( targetNode.model.isWrapped() ? 1 : 0 );
adjacentData = targetNode.model.doc.data.slice( targetOffset, endOffset );
}
for ( i = 0; i < adjacentData.length; i++ ) {
if ( adjacentData[i].type !== undefined ) {
containsInlineElements = true;
break;
}
adjacentText += adjacentData[i][0];
}
if ( !containsInlineElements ) {
adjacentTextAfterMatch = adjacentText.match(
/[a-zA-Z\-_’'‘ÆÐƎƏƐƔIJŊŒẞÞǷȜæðǝəɛɣijŋœĸſßþƿȝĄƁÇĐƊĘĦĮƘŁØƠŞȘŢȚŦŲƯY̨Ƴąɓçđɗęħįƙłøơşșţțŧųưy̨ƴÁÀÂÄǍĂĀÃÅǺĄÆǼǢƁĆĊĈČÇĎḌĐƊÐÉÈĖÊËĚĔĒĘẸƎƏƐĠĜǦĞĢƔáàâäǎăāãåǻąæǽǣɓćċĉčçďḍđɗðéèėêëěĕēęẹǝəɛġĝǧğģɣĤḤĦIÍÌİÎÏǏĬĪĨĮỊIJĴĶƘĹĻŁĽĿʼNŃN̈ŇÑŅŊÓÒÔÖǑŎŌÕŐỌØǾƠŒĥḥħıíìiîïǐĭīĩįịijĵķƙĸĺļłľŀʼnńn̈ňñņŋóòôöǒŏōõőọøǿơœŔŘŖŚŜŠŞȘṢẞŤŢṬŦÞÚÙÛÜǓŬŪŨŰŮŲỤƯẂẀŴẄǷÝỲŶŸȲỸƳŹŻŽẒŕřŗſśŝšşșṣßťţṭŧþúùûüǔŭūũűůųụưẃẁŵẅƿýỳŷÿȳỹƴźżžẓ]/g
);
// If there are "normal" characters in the adjacent text, let the browser handle natively.
if ( adjacentTextAfterMatch !== null && adjacentTextAfterMatch.length ) {
return;
}
}
ve.log('handleDelete programatically');
e.preventDefault();
this.surfaceObserver.stop();
if (
// Source and target are the same node
sourceNode === targetNode ||
(
// Source and target have the same parent (list items)
sourceSplitableNode !== undefined &&
sourceSplitableNode.getParent() === targetSplitableNode.getParent()
)
) {
// Simple removal
tx = ve.dm.Transaction.newFromRemoval(
this.documentView.model, new ve.Range( targetOffset, sourceOffset )
);
this.model.change( tx, new ve.Range( cursorAt ) );
} else if ( sourceNode.getType() === 'document' ) {
// Source is a slug - move the cursor somewhere useful
this.model.change( null, new ve.Range( cursorAt ) );
} else {
// Source and target are different nodes or do not share a parent, perform tricky merge
// Get the data for the source node
sourceData = this.documentView.model.getData( sourceNode.model.getRange() );
// Find the node that should be completely removed
nodeToDelete = sourceNode;
ve.Node.traverseUpstream( nodeToDelete, function ( node ) {
if ( node.getParent().children.length === 1 ) {
nodeToDelete = node.getParent();
return true;
} else {
return false;
}
} );
this.model.change(
[
// Remove source node or source node ancestor
ve.dm.Transaction.newFromRemoval(
this.documentView.model, nodeToDelete.getModel().getOuterRange()
),
// Append source data to target
ve.dm.Transaction.newFromInsertion(
this.documentView.model, targetOffset, sourceData
)
],
new ve.Range( cursorAt )
);
}
} else {
// Selection removal
ve.log('selection removal - handle programatically');
e.preventDefault();
this.model.change(
ve.dm.Transaction.newFromRemoval( this.documentView.model, selection ),
new ve.Range( selection.start )
);
}
this.surfaceObserver.clear();
this.surfaceObserver.start();
};
/**
* Shows the cursor at a given offset.
*
* @method
* @param {Number} offset Offset to show cursor at
*/
ve.ce.Surface.prototype.showCursor = function ( offset ) {
this.showSelection( new ve.Range( offset ) );
};
/**
* Shows selection on a given range.
*
* @method
* @param {ve.Range} range Range to show selection on
*/
ve.ce.Surface.prototype.showSelection = function ( range ) {
var start, end,
rangySel = rangy.getSelection(),
rangyRange = rangy.createRange();
// Ensure the range we are asking to select is from and to correct offsets - failure to do so
// may cause getNodeAndOffset to throw an exception
range = new ve.Range(
this.getNearestCorrectOffset( range.start ),
this.getNearestCorrectOffset( range.end )
);
if ( range.start !== range.end ) {
start = this.getNodeAndOffset( range.start );
end = this.getNodeAndOffset( range.end );
if ( false && $.browser.msie ) {
if ( range.start === range.from ) {
if (
start.node === this.poll.rangySelection.anchorNode &&
start.offset === this.poll.rangySelection.anchorOffset &&
end.node === this.poll.rangySelection.focusNode &&
end.offset === this.poll.rangySelection.focusOffset
) {
return;
}
} else {
if (
end.node === this.poll.rangySelection.anchorNode &&
end.offset === this.poll.rangySelection.anchorOffset &&
start.node === this.poll.rangySelection.focusNode &&
start.offset === this.poll.rangySelection.focusOffset
) {
return;
}
}
}
rangyRange.setStart( start.node, start.offset );
rangyRange.setEnd( end.node, end.offset );
rangySel.removeAllRanges();
rangySel.addRange( rangyRange, range.start !== range.from );
} else {
start = end = this.getNodeAndOffset( range.start );
if ( false && $.browser.msie ) {
if (
start.node === this.poll.rangySelection.anchorNode &&
start.offset === this.poll.rangySelection.anchorOffset
) {
return;
}
}
rangyRange.setStart( start.node, start.offset );
rangySel.setSingleRange( rangyRange );
}
};
/**
* Gets the nearest offset that a cursor can actually be placed at.
*
* TODO: Find a better name and a better place for this method
*
* @method
* @param {Number} offset Offset to start looking at
* @param {Number} [direction=-1] Direction to look in, +1 or -1
*/
ve.ce.Surface.prototype.getNearestCorrectOffset = function ( offset, direction ) {
var contentOffset, structuralOffset;
direction = direction > 0 ? 1 : -1;
if (
ve.dm.Document.isContentOffset( this.documentView.model.data, offset ) ||
this.hasSlugAtOffset( offset )
) {
return offset;
}
contentOffset = this.documentView.model.getNearestContentOffset( offset, direction );
structuralOffset = this.documentView.model.getNearestStructuralOffset( offset, direction, true );
if ( !this.hasSlugAtOffset( structuralOffset ) ) {
return contentOffset;
}
if ( direction === 1 ) {
if ( contentOffset < offset ) {
return structuralOffset;
} else {
return Math.min( contentOffset, structuralOffset );
}
} else {
if ( contentOffset > offset ) {
return structuralOffset;
} else {
return Math.max( contentOffset, structuralOffset );
}
}
};
/**
* Checks if a given offset is inside a slug.
*
* TODO: Find a better name and a better place for this method - probably in a document view?
*
* @method
* @param {Number} offset Offset to check for a slug at
* @returns {Boolean} A slug exists at the given offset
*/
ve.ce.Surface.prototype.hasSlugAtOffset = function ( offset ) {
return !!this.documentView.getSlugAtOffset( offset );
};
/**
* Gets a DOM node and offset that can be used to place a cursor, based on a given offset.
*
* The results of this function are meant to be used with rangy.
*
* @method
* @param {Number} offset Linear model offset
* @returns {Object} Object containing a node and offset property where node is an HTML element and
* offset is the position within the element
* @throws {Error} Offset could not be translated to a DOM element and offset
*/
ve.ce.Surface.prototype.getNodeAndOffset = function ( offset ) {
var node, startOffset, current, stack, item, $item, length,
slug = this.documentView.getSlugAtOffset( offset );
if ( slug ) {
return { node: slug[0].childNodes[0], offset: 0 };
}
node = this.documentView.getNodeFromOffset( offset );
startOffset = this.documentView.getDocumentNode().getOffsetFromNode( node ) +
( ( node.isWrapped() ) ? 1 : 0 );
current = [node.$.contents(), 0];
stack = [current];
while ( stack.length > 0 ) {
if ( current[1] >= current[0].length ) {
stack.pop();
current = stack[ stack.length - 1 ];
continue;
}
item = current[0][current[1]];
if ( item.nodeType === Node.TEXT_NODE ) {
length = item.textContent.length;
if ( offset >= startOffset && offset <= startOffset + length ) {
return {
node: item,
offset: offset - startOffset
};
} else {
startOffset += length;
}
} else if ( item.nodeType === Node.ELEMENT_NODE ) {
$item = current[0].eq( current[1] );
if ( $item.hasClass('ve-ce-slug') ) {
if ( offset === startOffset ) {
return {
node: $item[0],
offset: 1
};
}
} else if ( $item.is( '.ve-ce-branchNode, .ve-ce-leafNode' ) ) {
length = $item.data( 'node' ).model.getOuterLength();
if ( offset >= startOffset && offset < startOffset + length ) {
stack.push( [$item.contents(), 0] );
current[1]++;
current = stack[stack.length-1];
continue;
} else {
startOffset += length;
}
} else {
stack.push( [$item.contents(), 0] );
current[1]++;
current = stack[stack.length-1];
continue;
}
}
current[1]++;
}
throw new Error( 'Offset could not be translated to a DOM element and offset: ' + offset );
};
/**
* Gets the coordinates of the selection anchor.
*
* @method
*/
ve.ce.Surface.prototype.getSelectionRect = function () {
var rangySel = rangy.getSelection();
return {
start: rangySel.getStartDocumentPos(),
end: rangySel.getEndDocumentPos()
};
};
/**
* Tests if the modifier key for keyboard shortcuts is pressed.
*
* @method
* @param {jQuery.Event} e
*/
ve.ce.Surface.isShortcutKey = function ( e ) {
if ( e.ctrlKey || e.metaKey ) {
return true;
}
return false;
};
/**
* Removes localStorage keys for copy and paste after a day.
*
* @method
*/
ve.ce.Surface.clearLocalStorage = function () {
var i, len, key, time, now,
keysToRemove = [];
for ( i = 0, len = localStorage.length; i < len; i++ ) {
key = localStorage.key( i );
if ( key.indexOf( 've-' ) !== 0 ) {
return false;
}
time = JSON.parse( localStorage.getItem( key ) ).time;
now = new Date().getTime();
// Offset: 24 days (in miliseconds)
if ( now - time > ( 24 * 3600 * 1000 ) ) {
// Don't remove keys while iterating. Store them for later removal.
keysToRemove.push( key );
}
}
$.each( keysToRemove, function ( i, val ) {
localStorage.removeItem( val );
} );
};
/**
* Gets the surface model.
*
* @method
* @returns {ve.dm.Surface} Surface model
*/
ve.ce.Surface.prototype.getModel = function () {
return this.model;
};
/**
* Gets the document view.
*
* @method
* @returns {ve.ce.Document} Document view
*/
ve.ce.Surface.prototype.getDocument = function () {
return this.documentView;
};
/**
* @method
*/
ve.ce.Surface.prototype.enableRendering = function () {
this.renderingEnabled = true;
};
/**
* @method
*/
ve.ce.Surface.prototype.disableRendering = function () {
this.renderingEnabled = false;
};
/**
* @method
*/
ve.ce.Surface.prototype.isRenderingEnabled = function () {
return this.renderingEnabled;
};