2012-05-03 20:21:13 +00:00
|
|
|
/**
|
|
|
|
* ContentEditable surface.
|
2012-05-03 23:02:21 +00:00
|
|
|
*
|
2012-05-03 20:21:13 +00:00
|
|
|
* @class
|
|
|
|
* @constructor
|
|
|
|
* @param model {ve.dm.Surface} Model to observe
|
|
|
|
*/
|
2012-05-03 21:02:35 +00:00
|
|
|
ve.ce.Surface = function( $container, model ) {
|
2012-05-03 23:02:21 +00:00
|
|
|
// Inheritance
|
|
|
|
ve.EventEmitter.call( this );
|
2012-05-04 00:19:01 +00:00
|
|
|
|
2012-05-03 20:21:13 +00:00
|
|
|
// Properties
|
2012-05-03 23:14:54 +00:00
|
|
|
this.model = model;
|
2012-05-04 22:20:14 +00:00
|
|
|
this.documentView = new ve.ce.Document( model.getDocument() );
|
2012-05-21 23:06:30 +00:00
|
|
|
this.contextView = new ve.ui.Context( this );
|
2012-05-04 00:19:01 +00:00
|
|
|
this.$ = $container;
|
|
|
|
|
|
|
|
// Initialization
|
|
|
|
this.$.append( this.documentView.documentNode.$ );
|
2012-05-18 18:40:22 +00:00
|
|
|
|
|
|
|
try {
|
|
|
|
document.execCommand( "enableObjectResizing", false, false );
|
2012-05-21 23:06:30 +00:00
|
|
|
document.execCommand( "enableInlineTableEditing", false, false );
|
2012-05-18 18:40:22 +00:00
|
|
|
} catch (e) { }
|
2012-05-03 20:21:13 +00:00
|
|
|
};
|
2012-05-03 23:02:21 +00:00
|
|
|
|
2012-05-18 22:19:31 +00:00
|
|
|
|
|
|
|
/* Methods */
|
|
|
|
|
2012-05-23 20:34:52 +00:00
|
|
|
ve.ce.Surface.prototype.proxy = function( func ) {
|
|
|
|
var _this = this;
|
|
|
|
return( function() {
|
|
|
|
return func.apply( _this, arguments );
|
|
|
|
});
|
|
|
|
};
|
2012-05-18 22:19:31 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* @method
|
|
|
|
*/
|
|
|
|
ve.ce.Surface.prototype.getDOMNodeAndOffset = function( offset ) {
|
|
|
|
var $node = this.documentView.documentNode.getNodeFromOffset( offset ).parent.$,
|
|
|
|
nodeOffset = this.documentView.documentNode.getOffsetFromNode( $node.data('node') ) + 1,
|
|
|
|
current = [$node.contents(), 0],
|
|
|
|
stack = [current],
|
|
|
|
localNode,
|
|
|
|
localOffset;
|
|
|
|
|
|
|
|
while ( stack.length > 0 ) {
|
|
|
|
if ( current[1] >= current[0].length ) {
|
|
|
|
stack.pop();
|
|
|
|
current = stack[ stack.length - 1 ];
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
var item = current[0][current[1]],
|
|
|
|
$item = current[0].eq( current[1] );
|
|
|
|
|
|
|
|
if ( item.nodeType === 3 ) {
|
|
|
|
var length = item.textContent.length;
|
|
|
|
if ( offset >= nodeOffset && offset <= nodeOffset + length ) {
|
|
|
|
return {
|
|
|
|
node: item,
|
|
|
|
offset: offset - nodeOffset
|
|
|
|
};
|
|
|
|
} else {
|
|
|
|
nodeOffset += length;
|
|
|
|
}
|
|
|
|
} else if ( item.nodeType === 1 ) {
|
|
|
|
if ( $( item ).attr('contentEditable') === 'false' ) {
|
|
|
|
nodeOffset += 1;
|
|
|
|
} else {
|
|
|
|
stack.push( [$item.contents(), 0] );
|
|
|
|
current[1]++;
|
|
|
|
current = stack[stack.length-1];
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
current[1]++;
|
|
|
|
}
|
|
|
|
console.log('returning null, like an asshole');
|
|
|
|
return null;
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @method
|
|
|
|
*/
|
|
|
|
ve.ce.Surface.prototype.showCursor = function( offset ) {
|
|
|
|
this.showSelection( new ve.Range( offset ) );
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @method
|
|
|
|
*/
|
|
|
|
ve.ce.Surface.prototype.showSelection = function( range ) {
|
|
|
|
var start = this.getDOMNodeAndOffset( range.start ),
|
|
|
|
stop = this.getDOMNodeAndOffset( range.end ),
|
|
|
|
rangySel = rangy.getSelection(),
|
|
|
|
rangyRange = rangy.createRange();
|
|
|
|
|
|
|
|
rangyRange.setStart( start.node, start.offset );
|
|
|
|
rangyRange.setEnd( stop.node, stop.offset );
|
|
|
|
rangySel.setSingleRange( rangyRange, range.start !== range.from );
|
|
|
|
};
|
|
|
|
|
2012-05-21 23:06:30 +00:00
|
|
|
ve.ce.Surface.prototype.getSelectionRect = function() {
|
|
|
|
var rangySel = rangy.getSelection();
|
|
|
|
return {
|
|
|
|
start: rangySel.getStartDocumentPos(),
|
|
|
|
end: rangySel.getEndDocumentPos()
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
2012-05-03 23:02:21 +00:00
|
|
|
/* Inheritance */
|
|
|
|
|
|
|
|
ve.extendClass( ve.ce.Surface, ve.EventEmitter );
|