mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-11-24 14:33:59 +00:00
Add basic thumb rendering support
* DOM based on Wikia's thumb output: HTML5, clean caption without magnify icon. * basic RDFa annotations, but most options additionally in data-mw object- might want to move more (or all?) of those into RDFa data using meta tags. * no support yet for framed or other formats, image scaling etc * also tweaked some config options in the environment Change-Id: Ie461fcdce060cfc2dec65cc057709ae650ef3368
This commit is contained in:
parent
f99cb06e10
commit
403be4af42
|
@ -107,9 +107,6 @@ WikiLinkHandler.prototype.renderFile = function ( token, manager, cb, title ) {
|
|||
|
||||
var content = token.attribs.slice(1, -1);
|
||||
|
||||
// TODO: get /wiki from config!
|
||||
var a = new TagTk( 'a', [ new KV( 'href', '/wiki' + title.makeLink() ) ] );
|
||||
a.dataAttribs = token.dataAttribs;
|
||||
|
||||
var MD5 = new jshashes.MD5(),
|
||||
hash = MD5.hex( title.key ),
|
||||
|
@ -122,7 +119,7 @@ WikiLinkHandler.prototype.renderFile = function ( token, manager, cb, title ) {
|
|||
// extract options
|
||||
var options = [],
|
||||
oHash = {},
|
||||
caption = null;
|
||||
caption = [];
|
||||
for( var i = 0, l = content.length; i<l; i++ ) {
|
||||
var oContent = content[i],
|
||||
oText = manager.env.tokensToString( oContent.v, true );
|
||||
|
@ -148,7 +145,9 @@ WikiLinkHandler.prototype.renderFile = function ( token, manager, cb, title ) {
|
|||
options.push(new KV( 'height', y ) );
|
||||
oHash.height = y;
|
||||
}
|
||||
//console.log( JSON.stringify( oHash ) );
|
||||
} else {
|
||||
// XXX: check handling of multiple captions in default MW!
|
||||
caption = caption.concat( oContent.v );
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -157,10 +156,11 @@ WikiLinkHandler.prototype.renderFile = function ( token, manager, cb, title ) {
|
|||
if ( bits.length > 1 && this._prefixImageOptions[ bits[0].trim() ] ) {
|
||||
console.log('handle prefix ' + bits );
|
||||
} else {
|
||||
caption = oContent;
|
||||
caption = caption.concat( oContent.v );
|
||||
}
|
||||
}
|
||||
}
|
||||
//console.warn('caption: ' + JSON.stringify( caption ) );
|
||||
|
||||
|
||||
//var contentPos = token.dataAttribs.contentPos;
|
||||
|
@ -172,18 +172,117 @@ WikiLinkHandler.prototype.renderFile = function ( token, manager, cb, title ) {
|
|||
//console.log( JSON.stringify( options, null, 2 ) );
|
||||
// XXX: check if the file exists, generate thumbnail, get size
|
||||
// XXX: render according to mode (inline, thumb, framed etc)
|
||||
var img = new SelfclosingTagTk( 'img',
|
||||
[
|
||||
// FIXME!
|
||||
new KV( 'height', oHash.height || '120' ),
|
||||
new KV( 'width', oHash.width || '120' ),
|
||||
new KV( 'src', path ),
|
||||
new KV( 'alt', oHash.alt || title.key )
|
||||
] );
|
||||
|
||||
if ( oHash.format && oHash.format === 'thumb' ) {
|
||||
return this.renderThumb( token, manager, cb, title, path, caption, oHash, options );
|
||||
} else {
|
||||
// TODO: get /wiki from config!
|
||||
var a = new TagTk( 'a', [ new KV( 'href', title.makeLink() ) ] );
|
||||
a.dataAttribs = token.dataAttribs;
|
||||
|
||||
return { tokens: [ a, img, new EndTagTk( 'a' )] };
|
||||
var width, height;
|
||||
if ( ! height in oHash && ! width in oHash ) {
|
||||
width = '120px';
|
||||
height = '120px';
|
||||
} else {
|
||||
width = oHash.width;
|
||||
height = oHash.height;
|
||||
}
|
||||
|
||||
var img = new SelfclosingTagTk( 'img',
|
||||
[
|
||||
// FIXME!
|
||||
new KV( 'height', height || '' ),
|
||||
new KV( 'width', width || '' ),
|
||||
new KV( 'src', path ),
|
||||
new KV( 'alt', oHash.alt || title.key )
|
||||
] );
|
||||
|
||||
return { tokens: [ a, img, new EndTagTk( 'a' )] };
|
||||
}
|
||||
};
|
||||
|
||||
WikiLinkHandler.prototype.renderThumb = function ( token, manager, cb, title, path, caption, oHash, options ) {
|
||||
// TODO: get /wiki from config!
|
||||
var a = new TagTk( 'a', [ new KV( 'href', title.makeLink() ) ] );
|
||||
a.dataAttribs = token.dataAttribs;
|
||||
a.dataAttribs.optionHash = oHash;
|
||||
a.dataAttribs.optionList = options;
|
||||
|
||||
var thumb =
|
||||
[
|
||||
new TagTk(
|
||||
'figure',
|
||||
[
|
||||
new KV('class', 'thumb tright thumbinner'),
|
||||
new KV('style', 'width: 125px'),
|
||||
new KV('typeof', 'http://mediawiki.org/rdf/Thumb'),
|
||||
new KV('prefix', "mw: http://mediawiki.org/rdf/terms/")
|
||||
]
|
||||
),
|
||||
new TagTk(
|
||||
'a',
|
||||
[
|
||||
new KV('href', title.makeLink()),
|
||||
new KV('class', 'image')
|
||||
]
|
||||
),
|
||||
new SelfclosingTagTk(
|
||||
'img',
|
||||
[
|
||||
new KV('src', path),
|
||||
new KV('width', '120px'),
|
||||
new KV('height', '120px'),
|
||||
new KV('class', 'thumbimage'),
|
||||
new KV('alt', oHash.alt || title.key ),
|
||||
new KV('resource', title.getPrefixedText())
|
||||
]
|
||||
),
|
||||
new EndTagTk( 'a' ),
|
||||
new SelfclosingTagTk (
|
||||
'a',
|
||||
[
|
||||
new KV('href', title.makeLink()),
|
||||
new KV('class', 'internal sprite details magnify'),
|
||||
new KV('title', 'View photo details')
|
||||
]
|
||||
),
|
||||
new TagTk( 'figcaption',
|
||||
[
|
||||
new KV('class', 'thumbcaption'),
|
||||
new KV('property', 'mw:thumbcaption')
|
||||
] )
|
||||
].concat(
|
||||
caption,
|
||||
[
|
||||
new EndTagTk( 'figcaption' ),
|
||||
new EndTagTk( 'figure' )
|
||||
]
|
||||
);
|
||||
|
||||
// set round-trip information on the wrapping figure token
|
||||
thumb[0].dataAttribs = token.dataAttribs;
|
||||
|
||||
/*
|
||||
* Wikia DOM:
|
||||
<figure class="thumb tright thumbinner" style="width:270px;">
|
||||
<a href="Delorean.jpg" class="image" data-image-name="DeLorean.jpg" id="DeLorean-jpg">
|
||||
<img alt="" src="Delorean.jpg" width="268" height="123" class="thumbimage">
|
||||
</a>
|
||||
<a href="File:DeLorean.jpg" class="internal sprite details magnify" title="View photo details"></a>
|
||||
<figcaption class="thumbcaption">
|
||||
A DeLorean DMC-12 from the front with the gull-wing doors open
|
||||
<table><tr><td>test</td></tr></table>
|
||||
Continuation of the caption
|
||||
</figcaption>
|
||||
<div class="picture-attribution">
|
||||
<img src="Christian-Avatar.png" width="16" height="16" class="avatar" alt="Christian">Added by <a href="User:Christian">Christian</a>
|
||||
</div>
|
||||
</figure>
|
||||
*/
|
||||
//console.warn( 'thumbtokens: ' + JSON.stringify( thumb, null, 2 ) );
|
||||
return { tokens: thumb };
|
||||
};
|
||||
|
||||
|
||||
function ExternalLinkHandler( manager, isInclude ) {
|
||||
|
@ -237,6 +336,7 @@ ExternalLinkHandler.prototype.onUrlLink = function ( token, manager, cb ) {
|
|||
}
|
||||
};
|
||||
|
||||
|
||||
// Bracketed external link
|
||||
ExternalLinkHandler.prototype.onExtLink = function ( token, manager, cb ) {
|
||||
var env = this.manager.env,
|
||||
|
|
|
@ -412,7 +412,7 @@ function TemplateRequest ( manager, title ) {
|
|||
// Increase the number of maximum listeners a bit..
|
||||
this.setMaxListeners( 10000 );
|
||||
var self = this,
|
||||
url = manager.env.wgScriptPath + '/api' +
|
||||
url = manager.env.wgScript + '/api' +
|
||||
manager.env.wgScriptExtension +
|
||||
'?' +
|
||||
qs.stringify( {
|
||||
|
|
|
@ -23,6 +23,20 @@ Title.prototype.makeLink = function () {
|
|||
}
|
||||
};
|
||||
|
||||
Title.prototype.getPrefixedText = function () {
|
||||
// XXX: links always point to the canonical namespace name.
|
||||
if ( this.nskey ) {
|
||||
return this.env.sanitizeURI( this.nskey + ':' + this.key );
|
||||
} else {
|
||||
var ns = this.ns.getDefaultName();
|
||||
|
||||
if ( ns ) {
|
||||
ns += ':';
|
||||
}
|
||||
return this.env.sanitizeURI( ns + this.key );
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
function Namespace ( id ) {
|
||||
this.id = id;
|
||||
|
|
|
@ -115,6 +115,7 @@ PegTokenizer.prototype.inline_breaks = function (input, pos, stops ) {
|
|||
case '|':
|
||||
return counters.pipe ||
|
||||
counters.template ||
|
||||
counters.linkdesc ||
|
||||
( stops.onStack('table') &&
|
||||
( input[pos + 1].match(/[|}]/) !== null ||
|
||||
counters.tableCellArg
|
||||
|
|
|
@ -38,11 +38,16 @@ var ParserPipeline = require('./mediawiki.parser.js').ParserPipeline,
|
|||
'boolean': false,
|
||||
'default': 40
|
||||
},
|
||||
'wgScriptPath': {
|
||||
'wgScript': {
|
||||
description: 'http path to remote API, e.g. http://wiki.sample.com/w',
|
||||
'boolean': false,
|
||||
'default': 'http://en.wikipedia.org/w'
|
||||
},
|
||||
'wgScriptPath': {
|
||||
description: 'http path to remote web interface, e.g. http://wiki.sample.com/wiki',
|
||||
'boolean': false,
|
||||
'default': 'http://en.wikipedia.org/wiki'
|
||||
},
|
||||
'wgScriptExtension': {
|
||||
description: 'Extension for PHP files on remote API server, if any. Include the period, e.g. ".php"',
|
||||
'boolean': false,
|
||||
|
@ -63,6 +68,7 @@ var ParserPipeline = require('./mediawiki.parser.js').ParserPipeline,
|
|||
|
||||
var env = new ParserEnv( {
|
||||
// fetch templates from enwiki by default..
|
||||
wgScript: argv.wgScript,
|
||||
wgScriptPath: argv.wgScriptPath,
|
||||
wgScriptExtension: argv.wgScriptExtension,
|
||||
// XXX: add options for this!
|
||||
|
|
Loading…
Reference in a new issue