Jump to content

MediaWiki:PrettyLinkWidget.js

From Wikipedia, the free encyclopedia
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' /> &times; 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');