MediaWiki:PrettyLinkWidget.js
Appearance
Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
/**
* @fileoverview File containing and invoking widget object
* @author <a href="mailto:magnusmanske@googlemail.com">Magnus Manske</a>
* Pretty Link Widget
* (c) 2011 by Magnus Manske
* Released under GPL v2 or higher
* USAGE : Add the following line to Special:MyPage/common.js
*
* mw.loader.load('https://en.wikipedia.org/w/index.php?title=MediaWiki:PrettyLinkWidget.js&action=raw&ctype=text/javascript')
*
*/
jQuery.fn.exists = function(){return jQuery(this).length>0;}
var prettylinkwidget =
{
thumbsize : 0 ,
loaded : 0 ,
load_max : 0 ,
desc : 0 ,
title : 0 ,
lang : 0 ,
use_desc : 0 ,
hide_flags : 0 ,
images : {} ,
ignore_images : [ 'Commons-logo.svg','Disambig-dark.svg','Wikisource-logo.svg','Wiktfavicon en.svg','Loudspeaker.svg','Portal.svg','Qsicon Lücke.svg','Wikinews-logo.svg','Wikiquote-logo.svg','Reddot.svg',
'Qsicon lesenswert.svg','Wiktionary-logo-en.svg','Wikiversity-logo-Snorky.svg','Wikibooks-logo.svg','North.svg','South.svg','East.svg','West.svg','Red pog.svg','Compass rose pale-50x50.png',
'Speaker Icon.svg','Cscr-featured.svg','Wikispecies-logo.svg','Padlock-silver.svg' ] ,
createDialog : function () {
if ( jQuery('#prettylinkwidget_dialog').exists() ) return ;
var h = "\
<div id='prettylinkwidget_dialog' style='display:none;font-size:10pt;overflow:none' title='Pretty link widget'>\
<div id='loading' style='float:right;color:white;background:#888888;padding:2px;display:none'><span id='loading-text'>Loading…</span> <img src='//upload.wikimedia.org/wikipedia/commons/d/de/Ajax-loader.gif' /></div>\
<p>This widget can help you to generate pretty references to Wikipedia.</p>\
\
<table>\
<tr>\
<th>Thumbnail</th><td><input id='thumbsize' type='number' size='5' value='128' /> pixel</td>\
<td><input id='hide_flags' name='hide_flags' type='checkbox' checked /><label for='hide_flags'>Hide flags in image list</label></td>\
<td><input type='button' value='Update image list' onclick='prettylinkwidget.run()' /></td></tr>\
</table>\
\
<div id='results' style='display:none'>\
<hr/>\
Choose an image:\
<div id='prettylinkwidget_images' style='position:absloute;right:2px;padding:2px;margin-top:2px;border:5px solid #DDDDDD;overflow-x:auto;overflow-y:none;'></div><br/>\
<table>\
<tr>\
<td><input id='use_rev' name='use_rev' type='checkbox' /><label for='use_rev'>Use this revision</label></td>\
<td><input id='use_desc' name='use_desc' type='checkbox' checked /><label for='use_desc'>Use description</label></td>\
<th>Sentences</th><td><input id='sentences' type='number' value='1' size='4' /> (max. <span id='max_sentences'></span>)</td>\
<th>Box width</th><td><input id='div_width' type='number' value='7' size='4' /> × 50px = <span id='cur_width'></span>px</td>\
</tr>\
</table>\
<br/>\
<table border='1' cellpadding='3px' style='width:100%'>\
<tr><th>Preview</th><th>HTML code</th></tr>\
<tr>\
<td id='render' align='center' style='width:100%;padding:10px;vertical-align:center'></td>\
<td align='center'><textarea id='source' style='width:500px;font-size:7pt' rows='17'></textarea></td>\
</tr>\
</table>\
</div>\
</div>" ;
jQuery('#footer').append(h);
} ,
run : function () {
prettylinkwidget.createDialog();
jQuery('#prettylinkwidget_dialog').dialog({
width : 950 ,
height : 650 ,
modal : true
});
prettylinkwidget.title = mw.config.get ( 'wgTitle' ) ;
prettylinkwidget.lang = mediaWiki.user.options.get ( 'language' ) ;
prettylinkwidget.thumbsize = jQuery('#thumbsize').val() ;
prettylinkwidget.images = {} ;
prettylinkwidget.use_desc = jQuery('#use_desc').attr('checked') ;
prettylinkwidget.hide_flags = jQuery('#hide_flags').attr('checked') ;
prettylinkwidget.loaded = 0 ;
prettylinkwidget.desc = '' ;
jQuery('#results').hide() ;
jQuery('#loading').show() ;
prettylinkwidget.load_max = prettylinkwidget.use_desc + 1 ;
// Images
if ( 1 ) {
var url = "//" + prettylinkwidget.lang + ".wikipedia.org/w/api.php?action=query&generator=images&titles=" ;
url += escape(prettylinkwidget.title) ;
url += "&prop=imageinfo&gimlimit=500&format=json&iiprop=url|mime&iiurlwidth="+prettylinkwidget.thumbsize+"&iiurlheight="+prettylinkwidget.thumbsize+"&callback=?" ;
jQuery.getJSON ( url,
function ( data ) {
prettylinkwidget.images = data.query ? data.query.pages : [];
prettylinkwidget.check_loaded ( 1 ) ;
} ) ;
}
// First paragraph
if ( prettylinkwidget.use_desc ) {
var url = "//toolserver.org/~magnus/get_article_intro.php?language=" + prettylinkwidget.lang + "&title=" + prettylinkwidget.title + "&callback=?" ;
jQuery.getJSON ( url,
function ( data ) {
prettylinkwidget.desc = String ( data ) ;
prettylinkwidget.check_loaded ( 1 ) ;
} ) ;
}
} ,
show_images : function () {
var h = '<table cellpadding=2>' ;
var h1 = "<td style='width:" + prettylinkwidget.thumbsize + ";text-align:center' nowrap>No image</a></td>" ;
var h2 = "<td style='text-align:center'><input type='radio' name='irb' value='noimage' checked /></td>" ;
jQuery.each ( prettylinkwidget.images , function ( k , v ) {
var t = v.title.split(':');
t.shift();
t = t.join(':');
var ignore = false ;
jQuery.each ( prettylinkwidget.ignore_images , function ( a , b ) {
if ( b == t ) ignore = true ;
} ) ;
if ( prettylinkwidget.hide_flags && t.match(/^Flag of /) ) ignore = true ;
if ( ignore ) return ;
if ( undefined === v.imageinfo ) return ;
jQuery.each ( v.imageinfo , function ( k2 , v2 ) {
v.thumb_url = v2.thumburl ;
v.desc_url = v2.descriptionurl ;
v.mime = v2.mime ;
} ) ;
if ( ! v.mime.match(/^image/) ) return ;
var it = v.title ;
it = it.replace("'",'');
h1 += "<td style='width:" + this.thumbsize + ";text-align:center'><a title='" + it + "' href='" + v.desc_url + "' target='_blank'><img border='0' src='" + v.thumb_url + "' /></a></td>" ;
h2 += "<td style='text-align:center'><input type='radio' name='irb' value='" + k + "' /></td>" ;
} ) ;
h += '<tr>' + h1 + '</tr>' ;
h += '<tr>' + h2 + '</tr>' ;
h += '</table>' ;
jQuery('#prettylinkwidget_images').html ( h ) ;
jQuery('#prettylinkwidget_images :radio').click ( function () {
prettylinkwidget.load_image_license() ;
} ) ;
} ,
load_image_license : function () {
var i = jQuery('#prettylinkwidget_images input:radio[name=irb]:checked').val();
if ( i == 'noimage' ) {
prettylinkwidget.show_results() ;
return ;
}
jQuery.each ( prettylinkwidget.images , function ( k , v ) {
if ( k != i ) return ;
var url = '//commons.wikimedia.org' ;
if ( v.imagerepository == 'local' ) url = '//' + prettylinkwidget.lang + '.wikipedia.org' ;
var t = v.title.split(':') ;
t.shift() ;
t = "File:" + t.join(':');
url += '/w/api.php?action=query&prop=categories&format=json&cllimit=500&titles=' + escape ( t ) + '&callback=?' ;
jQuery.getJSON ( url,
function ( data ) {
jQuery.each ( data.query.pages , function ( k2 , v2 ) {
jQuery.each ( v2.categories , function ( k3 , v3 ) {
var cat = v3.title ;
cat = cat.split(':') ;
cat.shift() ; // "Category:"
cat = cat.join(':') ;
if ( cat.match(/^CC-/) ) v.license = cat ;
else if ( cat.match(/^Creative Commons/) ) v.license = cat ;
else if ( cat.match(/^PD-/) ) v.license = cat ;
else if ( cat.match(/^PD/) ) v.license = cat ;
else if ( cat.match(/^Copyright by Wikimedia/) ) v.license = cat ;
if ( v.license === undefined ) { // "Second-rate"...
if ( cat.match(/^GFDL/) ) v.license = cat ;
else if ( cat.match(/^LGPL/) ) v.license = cat ;
}
} ) ;
} ) ;
prettylinkwidget.show_results();
} ) ;
} ) ;
} ,
show_results : function () {
var nl = "\n" ;
var rev = ''
if ( jQuery('#use_rev').attr('checked') ) {
rev = mediaWiki.config.get('wgCurRevisionId');
}
var w = jQuery('#div_width').val() * 50 ;
jQuery('#cur_width').html ( w ) ;
var h = '<div style="border:2px solid #DDDDDD;width:' + w + 'px">' + nl ;
h += '<table border="0"><tr>' + nl ;
var i = jQuery('#prettylinkwidget_images input:radio[name=irb]:checked').val();
var image_license ;
if ( i != 'noimage' ) {
var url ;
var du ;
var imagelink ;
jQuery.each ( prettylinkwidget.images , function ( k , v ) {
if ( k != i ) return ;
url = v.thumb_url ;
du = v.desc_url ;
imagelink = '<a href="' + du + '">Image</a>' ;
image_license = v.license ;
} ) ;
h += '<td style="vertical-align:top">' ;
h += '<a href="' + du + '">' ;
h += '<img border="0" src="' + url + '" />' ;
h += '</a>' ;
h += '</td>' + nl ;
if ( image_license === undefined || image_license == '' ) image_license = imagelink + ' has an unknown license.' ;
else if ( image_license == 'Copyright by Wikimedia' ) image_license = imagelink + ' is ' + image_license + '.' ;
else image_license = imagelink + ' license is ' + image_license + '.' ;
}
h += '<td style="vertical-align:top;text-align:justify">' ;
var url_title = escape ( prettylinkwidget.title.replace(' ','_') ) ;
var wp_url ;
if ( rev === undefined || rev == '' ) wp_url = '//' + prettylinkwidget.lang + '.wikipedia.org/wiki/' + url_title ;
else wp_url = "//" + prettylinkwidget.lang + ".wikipedia.org/w/index.php?title=" + url_title + "&oldid=" + rev ;
h += '<div style="margin-bottom:3px"><a href="' + wp_url + '"><b>' + prettylinkwidget.title.replace('_',' ') + '</b></a> on Wikipedia</div>' + nl ;
if ( jQuery('#use_desc').attr('checked') ) {
var d = prettylinkwidget.desc.split('.') ;
var nos = jQuery('#sentences').val() ;
while ( d.length > nos ) d.pop();
d = d.join('.') ;
if ( d != '' ) d += '.' ;
h += '<div style="font-size:80%;margin-bottom:2px">' + d + '</div>' + nl ;
}
h += '<div style="font-size:60%">Wikipedia article <a href="//en.wikipedia.org/wiki/Wikipedia:Text_of_Creative_Commons_Attribution-ShareAlike_3.0_Unported_License">CC-BY-SA-3.0</a>.' ;
if ( image_license !== undefined && image_license != '' ) h += ' ' + image_license ;
h += '</div>' + nl ;
h += '</td>' ;
h += '</tr>' ;
h += '</table>' ;
h += '</div>' ;
jQuery('#render').html ( h ) ;
jQuery('#source').val ( h ) ;
jQuery('#render a').css('color','blue');
jQuery('#results').show() ;
} ,
check_loaded : function ( add ) {
this.loaded += add ;
if ( this.loaded < this.load_max ) return ;
jQuery('#use_desc').change(this.show_results);
jQuery('#use_rev').change(this.show_results);
jQuery('#sentences').val ( 1 ) ;
jQuery('#sentences').change(this.show_results);
jQuery('#div_width').change(this.show_results);
jQuery('#sentences').click(this.show_results);
jQuery('#div_width').click(this.show_results);
jQuery('#max_sentences').html ( this.desc.split('.').length ) ;
jQuery('#loading').hide() ;
this.show_images() ;
this.show_results () ;
} ,
getParameterByName : function ( name , def ) {
if ( typeof def == 'undefined' ) def = '' ;
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null ) return def;
else return decodeURIComponent(results[1].replace(/\+/g, " "));
} ,
the_end_of_the_object : '' // To avoid worrying about the final comma...
} ;
jQuery(document).ready ( function () {
if ( mw.config.get ( 'wgAction' ) != 'view' ) return ;
// prettylinkwidget.createDialog();
mw.util.addPortletLink('p-tb', 'javascript:prettylinkwidget.run()', 'Pretty link widget', 't-prettylinkwidget', 'Pretty link widget', '', '#t-print');
} ) ;
// mw.loader.load('//toolserver.org/~magnus/lib/jquery-ui-1.7.2.custom/css/ui-lightness/jquery-ui-1.7.2.custom.css', 'text/css');
// mw.loader.load('//toolserver.org/~magnus/lib/jquery-ui-1.7.2.custom/js/jquery-ui-1.7.2.custom.min.js');