2011-11-03 18:15:24 +00:00
|
|
|
/**
|
|
|
|
* Serializes a WikiDom plain object into an HTML string.
|
|
|
|
*
|
|
|
|
* @class
|
|
|
|
* @constructor
|
|
|
|
* @param {Object} options List of options for serialization
|
|
|
|
*/
|
|
|
|
es.HtmlSerializer = function( options ) {
|
|
|
|
this.options = $.extend( {
|
|
|
|
// defaults
|
|
|
|
}, options || {} );
|
|
|
|
};
|
|
|
|
|
|
|
|
/* Static Methods */
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Get a serialized version of data.
|
|
|
|
*
|
|
|
|
* @static
|
|
|
|
* @method
|
|
|
|
* @param {Object} data Data to serialize
|
|
|
|
* @param {Object} options Options to use, @see {es.WikitextSerializer} for details
|
|
|
|
* @returns {String} Serialized version of data
|
|
|
|
*/
|
|
|
|
es.HtmlSerializer.stringify = function( data, options ) {
|
|
|
|
return ( new es.HtmlSerializer( options ) ).document( data );
|
|
|
|
};
|
|
|
|
|
2011-11-03 19:39:12 +00:00
|
|
|
es.HtmlSerializer.getHtmlAttributes = function( attributes ) {
|
|
|
|
var htmlAttributes = {},
|
|
|
|
count = 0;
|
|
|
|
for ( var key in attributes ) {
|
|
|
|
if ( key.indexOf( 'html/' ) === 0 ) {
|
|
|
|
htmlAttributes[key.substr( 5 )] = attributes[key];
|
|
|
|
count++;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return count ? htmlAttributes : null;
|
|
|
|
};
|
|
|
|
|
2011-11-03 18:15:24 +00:00
|
|
|
/* Methods */
|
|
|
|
|
|
|
|
es.HtmlSerializer.prototype.document = function( node, rawFirstParagraph ) {
|
|
|
|
var lines = [];
|
|
|
|
for ( var i = 0, length = node.children.length; i < length; i++ ) {
|
|
|
|
var childNode = node.children[i];
|
|
|
|
if ( childNode.type in this ) {
|
|
|
|
// Special case for paragraphs which have particular wrapping needs
|
|
|
|
if ( childNode.type === 'paragraph' ) {
|
2011-11-03 19:39:12 +00:00
|
|
|
lines.push( this.paragraph( childNode, rawFirstParagraph && i === 0 ) );
|
2011-11-03 18:15:24 +00:00
|
|
|
} else {
|
|
|
|
lines.push( this[childNode.type].call( this, childNode ) );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return lines.join( '\n' );
|
|
|
|
};
|
|
|
|
|
|
|
|
es.HtmlSerializer.prototype.comment = function( node ) {
|
2011-11-07 14:39:12 +00:00
|
|
|
return '<!--(' + node.text + ')-->';
|
|
|
|
};
|
|
|
|
|
|
|
|
es.HtmlSerializer.prototype.pre = function( node ) {
|
|
|
|
return es.Html.makeTag(
|
2011-11-08 16:08:05 +00:00
|
|
|
'pre', {}, this.content( node.content, true )
|
2011-11-07 14:39:12 +00:00
|
|
|
);
|
2011-11-03 18:15:24 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
es.HtmlSerializer.prototype.horizontalRule = function( node ) {
|
|
|
|
return es.Html.makeTag( 'hr', {}, false );
|
|
|
|
};
|
|
|
|
|
2011-11-03 19:39:12 +00:00
|
|
|
es.HtmlSerializer.prototype.heading = function( node ) {
|
2011-11-03 18:15:24 +00:00
|
|
|
return es.Html.makeTag(
|
2011-11-03 19:39:12 +00:00
|
|
|
'h' + node.attributes.level, {}, this.content( node.content )
|
2011-11-03 18:15:24 +00:00
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
es.HtmlSerializer.prototype.paragraph = function( node, raw ) {
|
|
|
|
if ( raw ) {
|
|
|
|
return this.content( node.content );
|
|
|
|
} else {
|
|
|
|
return es.Html.makeTag( 'p', {}, this.content( node.content ) );
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
es.HtmlSerializer.prototype.list = function( node ) {
|
2011-11-04 10:02:59 +00:00
|
|
|
var out = [], // List of list nodes
|
2011-11-07 20:31:30 +00:00
|
|
|
bstack = [], // Bullet stack, previous element's listStyles
|
|
|
|
bnext = [], // Next element's listStyles
|
|
|
|
closeTags = []; // Stack of close tags for currently active lists
|
2011-11-04 10:02:59 +00:00
|
|
|
|
2011-11-07 19:57:41 +00:00
|
|
|
function commonPrefixLength( x, y ) {
|
2011-11-04 10:02:59 +00:00
|
|
|
var minLength = Math.min(x.length, y.length);
|
|
|
|
for(var i = 0; i < minLength; i++) {
|
2011-11-04 11:08:11 +00:00
|
|
|
if (x[i] !== y[i]) {
|
2011-11-07 20:36:34 +00:00
|
|
|
// Both description and term are
|
2011-11-07 20:31:30 +00:00
|
|
|
// inside dls, so consider them equivalent here.
|
|
|
|
var diffs = [x[i], y[i]].sort();
|
2011-11-07 20:36:34 +00:00
|
|
|
if (diffs[0] !== 'description' &&
|
2011-11-07 21:05:37 +00:00
|
|
|
diffs[1] !== 'term' ) {
|
|
|
|
break;
|
|
|
|
}
|
2011-11-04 10:02:59 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
return i;
|
2011-12-07 21:17:34 +00:00
|
|
|
}
|
2011-11-04 10:02:59 +00:00
|
|
|
|
2011-11-07 19:57:41 +00:00
|
|
|
function popTags( n ) {
|
2011-11-04 10:02:59 +00:00
|
|
|
for (var i = 0; i < n; i++ ) {
|
|
|
|
out.push(closeTags.pop());
|
|
|
|
}
|
2011-12-07 21:17:34 +00:00
|
|
|
}
|
2011-11-04 10:02:59 +00:00
|
|
|
|
2011-11-07 19:57:41 +00:00
|
|
|
function openLists( bs, bn, attribs ) {
|
2011-11-04 10:02:59 +00:00
|
|
|
var prefix = commonPrefixLength (bs, bn);
|
|
|
|
// pop close tags from stack
|
|
|
|
popTags(closeTags.length - prefix);
|
|
|
|
for(var i = prefix; i < bn.length; i++) {
|
|
|
|
var c = bn[i];
|
|
|
|
switch (c) {
|
|
|
|
case 'bullet':
|
|
|
|
out.push(es.Html.makeOpeningTag('ul', attribs));
|
|
|
|
closeTags.push(es.Html.makeClosingTag('ul'));
|
|
|
|
break;
|
|
|
|
case 'number':
|
|
|
|
out.push(es.Html.makeOpeningTag('ol', attribs));
|
|
|
|
closeTags.push(es.Html.makeClosingTag('ol'));
|
|
|
|
break;
|
2011-11-07 20:36:34 +00:00
|
|
|
case 'term':
|
|
|
|
case 'description':
|
2011-11-04 10:02:59 +00:00
|
|
|
out.push(es.Html.makeOpeningTag('dl', attribs));
|
|
|
|
closeTags.push(es.Html.makeClosingTag('dl'));
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
throw("Unknown node prefix " + c);
|
|
|
|
}
|
2011-11-07 19:57:41 +00:00
|
|
|
}
|
2011-12-07 21:17:34 +00:00
|
|
|
}
|
2011-11-04 10:02:59 +00:00
|
|
|
|
2011-11-04 12:25:01 +00:00
|
|
|
for (var i = 0, length = node.children.length; i < length; i++) {
|
2011-11-04 10:02:59 +00:00
|
|
|
var e = node.children[i];
|
|
|
|
bnext = e.attributes.styles;
|
2011-11-07 19:57:41 +00:00
|
|
|
delete e.attributes.styles;
|
2011-11-04 10:02:59 +00:00
|
|
|
openLists( bstack, bnext, e.attributes );
|
|
|
|
var tag;
|
|
|
|
switch(bnext[bnext.length - 1]) {
|
2011-11-07 20:36:34 +00:00
|
|
|
case 'term':
|
2011-11-04 10:02:59 +00:00
|
|
|
tag = 'dt'; break;
|
2011-11-07 20:36:34 +00:00
|
|
|
case 'description':
|
2011-11-04 10:02:59 +00:00
|
|
|
tag = 'dd'; break;
|
|
|
|
default:
|
|
|
|
tag = 'li'; break;
|
|
|
|
}
|
2011-12-07 21:17:34 +00:00
|
|
|
out.push( es.Html.makeTag(tag, e.attributes, this.document( e ) ) );
|
2011-11-04 10:02:59 +00:00
|
|
|
bstack = bnext;
|
2011-11-07 19:57:41 +00:00
|
|
|
}
|
2011-11-04 10:02:59 +00:00
|
|
|
popTags(closeTags.length);
|
|
|
|
return out.join("\n");
|
2011-11-03 18:15:24 +00:00
|
|
|
};
|
|
|
|
|
2011-11-03 18:25:04 +00:00
|
|
|
es.HtmlSerializer.prototype.table = function( node ) {
|
2011-11-03 19:39:12 +00:00
|
|
|
var lines = [],
|
|
|
|
attributes = es.HtmlSerializer.getHtmlAttributes( node.attributes );
|
|
|
|
lines.push( es.Html.makeOpeningTag( 'table', attributes ) );
|
2011-11-03 18:15:24 +00:00
|
|
|
for ( var i = 0, length = node.children.length; i < length; i++ ) {
|
2011-11-04 12:06:49 +00:00
|
|
|
var child = node.children[i];
|
|
|
|
lines.push( this[child.type]( child ) );
|
2011-11-03 18:15:24 +00:00
|
|
|
}
|
|
|
|
lines.push( es.Html.makeClosingTag( 'table' ) );
|
|
|
|
return lines.join( '\n' );
|
|
|
|
};
|
|
|
|
|
2011-11-03 18:25:04 +00:00
|
|
|
es.HtmlSerializer.prototype.tableRow = function( node ) {
|
2011-11-03 19:39:12 +00:00
|
|
|
var lines = [],
|
|
|
|
attributes = es.HtmlSerializer.getHtmlAttributes( node.attributes );
|
|
|
|
lines.push( es.Html.makeOpeningTag( 'tr', attributes ) );
|
2011-11-03 18:15:24 +00:00
|
|
|
for ( var i = 0, length = node.children.length; i < length; i++ ) {
|
|
|
|
lines.push( this.tableCell( node.children[i] ) );
|
|
|
|
}
|
|
|
|
lines.push( es.Html.makeClosingTag( 'tr' ) );
|
|
|
|
return lines.join( '\n' );
|
|
|
|
};
|
|
|
|
|
2011-11-03 18:25:04 +00:00
|
|
|
es.HtmlSerializer.prototype.tableCell = function( node ) {
|
2011-11-03 18:15:24 +00:00
|
|
|
var symbolTable = {
|
2011-11-03 19:39:12 +00:00
|
|
|
'tableHeading': 'th',
|
|
|
|
'tableCell': 'td'
|
|
|
|
},
|
|
|
|
attributes = es.HtmlSerializer.getHtmlAttributes( node.attributes );
|
|
|
|
return es.Html.makeTag( symbolTable[node.type], attributes, this.document( node, true ) );
|
2011-11-03 18:15:24 +00:00
|
|
|
};
|
|
|
|
|
2011-11-04 12:06:49 +00:00
|
|
|
es.HtmlSerializer.prototype.tableCaption = function( node ) {
|
|
|
|
attributes = es.HtmlSerializer.getHtmlAttributes( node.attributes );
|
|
|
|
return es.Html.makeTag( 'caption', attributes, this.content( node.content ) );
|
|
|
|
};
|
|
|
|
|
2011-11-03 18:15:24 +00:00
|
|
|
es.HtmlSerializer.prototype.transclusion = function( node ) {
|
|
|
|
var title = [];
|
|
|
|
if ( node.namespace !== 'Main' ) {
|
|
|
|
title.push( node.namespace );
|
|
|
|
}
|
|
|
|
title.push( node.title );
|
|
|
|
title = title.join( ':' );
|
|
|
|
return es.Html.makeTag( 'a', { 'href': '/wiki/' + title }, title );
|
|
|
|
};
|
|
|
|
|
|
|
|
es.HtmlSerializer.prototype.parameter = function( node ) {
|
|
|
|
return '{{{' + node.name + '}}}';
|
|
|
|
};
|
|
|
|
|
|
|
|
es.HtmlSerializer.prototype.content = function( node ) {
|
|
|
|
if ( 'annotations' in node && node.annotations.length ) {
|
|
|
|
var annotationSerializer = new es.AnnotationSerializer(),
|
|
|
|
tagTable = {
|
|
|
|
'textStyle/bold': 'b',
|
|
|
|
'textStyle/italic': 'i',
|
|
|
|
'textStyle/strong': 'strong',
|
2011-11-07 19:28:47 +00:00
|
|
|
'textStyle/emphasize': 'em',
|
2011-11-03 18:15:24 +00:00
|
|
|
'textStyle/big': 'big',
|
|
|
|
'textStyle/small': 'small',
|
|
|
|
'textStyle/superScript': 'sup',
|
|
|
|
'textStyle/subScript': 'sub'
|
|
|
|
};
|
|
|
|
for ( var i = 0, length = node.annotations.length; i < length; i++ ) {
|
|
|
|
var annotation = node.annotations[i];
|
|
|
|
if ( annotation.type in tagTable ) {
|
|
|
|
annotationSerializer.addTags( annotation.range, tagTable[annotation.type] );
|
|
|
|
} else {
|
|
|
|
switch ( annotation.type ) {
|
|
|
|
case 'link/external':
|
|
|
|
annotationSerializer.addTags(
|
|
|
|
annotation.range, 'a', { 'href': annotation.data.url }
|
|
|
|
);
|
|
|
|
break;
|
|
|
|
case 'link/internal':
|
|
|
|
annotationSerializer.addTags(
|
|
|
|
annotation.range, 'a', { 'href': '/wiki/' + annotation.data.title }
|
|
|
|
);
|
|
|
|
break;
|
|
|
|
case 'object/template':
|
|
|
|
case 'object/hook':
|
|
|
|
annotationSerializer.add( annotation.range, annotation.data.html, '' );
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return annotationSerializer.render( node.text );
|
|
|
|
} else {
|
|
|
|
return node.text;
|
|
|
|
}
|
|
|
|
};
|