mediawiki-extensions-Visual.../modules/ve/ce/ve.ce.Content.js

260 lines
6.9 KiB
JavaScript
Raw Normal View History

ve.ce.Content = function( model, $container, parent ) {
2012-02-07 19:13:19 +00:00
// Inheritance
ve.EventEmitter.call( this );
// Properties
this.$ = $container;
this.model = model;
this.parent = parent;
2012-02-07 19:13:19 +00:00
if ( model ) {
// Events
var _this = this;
2012-02-07 19:13:19 +00:00
this.model.on( 'update', function( offset ) {
var surfaceView = _this.getSurfaceView();
if (surfaceView.autoRender) {
_this.render( offset || 0 );
}
2012-02-07 19:13:19 +00:00
} );
}
};
/* Static Members */
/**
* List of annotation rendering implementations.
*
* Each supported annotation renderer must have an open and close property, each either a string or
* a function which accepts a data argument.
*
* @static
* @member
*/
ve.ce.Content.annotationRenderers = {
2012-02-07 19:13:19 +00:00
'object/template': {
'open': function( data ) {
return '<span class="ve-ce-content-format-object">' + data.html;
2012-02-07 19:13:19 +00:00
},
'close': '</span>'
},
'object/hook': {
'open': function( data ) {
return '<span class="ve-ce-content-format-object">' + data.html;
2012-02-07 19:13:19 +00:00
},
'close': '</span>'
},
'textStyle/bold': {
'open': '<b>',
'close': '</b>'
2012-02-07 19:13:19 +00:00
},
'textStyle/italic': {
'open': '<i>',
'close': '</i>'
2012-02-07 19:13:19 +00:00
},
'textStyle/strong': {
'open': '<span class="ve-ce-content-format-textStyle-strong">',
2012-02-07 19:13:19 +00:00
'close': '</span>'
},
'textStyle/emphasize': {
'open': '<span class="ve-ce-content-format-textStyle-emphasize">',
2012-02-07 19:13:19 +00:00
'close': '</span>'
},
'textStyle/big': {
'open': '<span class="ve-ce-content-format-textStyle-big">',
2012-02-07 19:13:19 +00:00
'close': '</span>'
},
'textStyle/small': {
'open': '<span class="ve-ce-content-format-textStyle-small">',
2012-02-07 19:13:19 +00:00
'close': '</span>'
},
'textStyle/superScript': {
'open': '<span class="ve-ce-content-format-textStyle-superScript">',
2012-02-07 19:13:19 +00:00
'close': '</span>'
},
'textStyle/subScript': {
'open': '<span class="ve-ce-content-format-textStyle-subScript">',
2012-02-07 19:13:19 +00:00
'close': '</span>'
},
'link/external': {
'open': function( data ) {
return '<span class="ve-ce-content-format-link" data-href="' + data.href + '">';
2012-02-07 19:13:19 +00:00
},
'close': '</span>'
},
'link/internal': {
'open': function( data ) {
return '<span class="ve-ce-content-format-link" data-title="wiki/' + data.title + '">';
2012-02-07 19:13:19 +00:00
},
'close': '</span>'
}
};
/**
* Mapping of character and HTML entities or renderings.
*
* @static
* @member
*/
ve.ce.Content.htmlCharacters = {
2012-02-07 19:13:19 +00:00
'&': '&amp;',
'<': '&lt;',
'>': '&gt;',
'\'': '&#039;',
'"': '&quot;',
'\n': '<span class="ve-ce-content-whitespace">&#182;</span>',
'\t': '<span class="ve-ce-content-whitespace">&#8702;</span>'
2012-02-07 19:13:19 +00:00
};
/* Static Methods */
/**
* Gets a rendered opening or closing of an annotation.
*
* Tag nesting is handled using a stack, which keeps track of what is currently open. A common stack
* argument should be used while rendering content.
*
* @static
* @method
* @param {String} bias Which side of the annotation to render, either "open" or "close"
* @param {Object} annotation Annotation to render
* @param {Array} stack List of currently open annotations
* @returns {String} Rendered annotation
*/
ve.ce.Content.renderAnnotation = function( bias, annotation, stack ) {
var renderers = ve.ce.Content.annotationRenderers,
2012-02-07 19:13:19 +00:00
type = annotation.type,
out = '';
if ( type in renderers ) {
if ( bias === 'open' ) {
// Add annotation to the top of the stack
stack.push( annotation );
// Open annotation
out += typeof renderers[type].open === 'function' ?
renderers[type].open( annotation.data ) : renderers[type].open;
} else {
if ( stack[stack.length - 1] === annotation ) {
// Remove annotation from top of the stack
stack.pop();
// Close annotation
out += typeof renderers[type].close === 'function' ?
renderers[type].close( annotation.data ) : renderers[type].close;
} else {
// Find the annotation in the stack
var depth = ve.inArray( annotation, stack ),
i;
if ( depth === -1 ) {
throw 'Invalid stack error. An element is missing from the stack.';
}
// Close each already opened annotation
for ( i = stack.length - 1; i >= depth + 1; i-- ) {
out += typeof renderers[stack[i].type].close === 'function' ?
renderers[stack[i].type].close( stack[i].data ) :
renderers[stack[i].type].close;
}
// Close the buried annotation
out += typeof renderers[type].close === 'function' ?
renderers[type].close( annotation.data ) : renderers[type].close;
// Re-open each previously opened annotation
for ( i = depth + 1; i < stack.length; i++ ) {
out += typeof renderers[stack[i].type].open === 'function' ?
renderers[stack[i].type].open( stack[i].data ) :
renderers[stack[i].type].open;
}
// Remove the annotation from the middle of the stack
stack.splice( depth, 1 );
}
}
}
return out;
};
/* Methods */
ve.ce.Content.prototype.render = function( offset ) {
this.$.html( this.getHtml( 0, this.model.getContentLength() ) );
2012-02-07 19:13:19 +00:00
};
ve.ce.Content.prototype.setContainer = function( $container ) {
this.$ = $container;
this.render();
};
2012-02-07 19:13:19 +00:00
/**
* Gets an HTML rendering of a range of data within content model.
*
* @method
* @param {ve.Range} range Range of content to render
* @param {String} Rendered HTML of data within content model
*/
ve.ce.Content.prototype.getHtml = function( range, options ) {
2012-02-07 19:13:19 +00:00
if ( range ) {
range.normalize();
} else {
range = { 'start': 0, 'end': undefined };
}
var data = this.model.getContentData(),
render = ve.ce.Content.renderAnnotation,
htmlChars = ve.ce.Content.htmlCharacters;
2012-02-07 19:13:19 +00:00
var out = '',
left = '',
right,
leftPlain,
rightPlain,
stack = [],
chr,
i,
j;
for ( i = 0; i < data.length; i++ ) {
right = data[i];
leftPlain = typeof left === 'string';
rightPlain = typeof right === 'string';
if ( !leftPlain && rightPlain ) {
// [formatted][plain] pair, close any annotations for left
for ( j = 1; j < left.length; j++ ) {
out += render( 'close', left[j], stack );
}
} else if ( leftPlain && !rightPlain ) {
// [plain][formatted] pair, open any annotations for right
for ( j = 1; j < right.length; j++ ) {
out += render( 'open', right[j], stack );
}
} else if ( !leftPlain && !rightPlain ) {
// [formatted][formatted] pair, open/close any differences
for ( j = 1; j < left.length; j++ ) {
if ( ve.inArray( left[j], right ) === -1 ) {
out += render( 'close', left[j], stack );
}
}
for ( j = 1; j < right.length; j++ ) {
if ( ve.inArray( right[j], left ) === -1 ) {
out += render( 'open', right[j], stack );
}
}
}
chr = rightPlain ? right : right[0];
out += chr in htmlChars ? htmlChars[chr] : chr;
left = right;
}
// Close all remaining tags at the end of the content
if ( !rightPlain && right ) {
for ( j = 1; j < right.length; j++ ) {
out += render( 'close', right[j], stack );
}
}
return out;
};
ve.ce.Content.prototype.getSurfaceView = function() {
var view = this;
while(!view.surfaceView) {
view = view.parent;
}
return view.surfaceView;
2012-03-09 22:51:00 +00:00
};
2012-02-07 19:13:19 +00:00
/* Inheritance */
2012-03-09 22:51:00 +00:00
ve.extendClass( ve.ce.Content, ve.EventEmitter );