r88140 MediaWiki - Code Review archive

Repository:	MediaWiki
Revision:	< r88139‎ \| r88140 \| r88141 >
Date:	10:16, 15 May 2011
Author:	janpaul123
Status:	ok (Comments)
Tags:
Comment:	* Basic gallery functionality * Basic error messages This still needs major cleanup but I wanted to commit this huge thing first.
Modified paths:	/trunk/extensions/WikiLove/README (modified) (history) /trunk/extensions/WikiLove/WikiLove.i18n.php (modified) (history) /trunk/extensions/WikiLove/WikiLove.php (modified) (history) /trunk/extensions/WikiLove/wikiLove.css (modified) (history) /trunk/extensions/WikiLove/wikiLove.js (modified) (history)

Diff [purge]

Index: trunk/extensions/WikiLove/WikiLove.php
—	—	@@ -88,6 +88,7 @@
89	89	'wikilove-get-started-list-2',
90	90	'wikilove-get-started-list-3',
91	91	'wikilove-add-details',
	92	+ 'wikilove-gallery',
92	93	'wikilove-title',
93	94	'wikilove-enter-message',
94	95	'wikilove-omit-sig',
—	—	@@ -95,6 +96,10 @@
96	97	'wikilove-preview',
97	98	'wikilove-button-send',
98	99	'wikilove-type-makeyourown',
	100	+ 'wikilove-err-title',
	101	+ 'wikilove-err-msg',
	102	+ 'wikilove-err-image',
	103	+ 'wikilove-err-sig',
99	104	),
100	105	'dependencies' => array(
101	106	'jquery.ui.dialog',
Index: trunk/extensions/WikiLove/wikiLove.css
—	—	@@ -254,23 +254,45 @@
255	255	resize: none;
256	256	}
257	257
	258	+#wikiLoveDialog #wlAddDetails #wlNotify {
	259	+ float: left;
	260	+}
	261	+
258	262	#wikiLoveDialog .wlSpinner {
259	263	float: right;
260	264	margin-top: 6px;
261	265	display: none;
262	266	}
263	267
	268	+/* add details gallery */
	269	+#wikiLoveDialog #wlGallery img {
	270	+ margin-right: 5px;
	271	+ margin-bottom: 5px;
	272	+ padding: 5px;
	273	+}
	274	+
	275	+#wikiLoveDialog #wlGallery a:hover img,
	276	+#wikiLoveDialog #wlGallery a:focus img {
	277	+ background-color: #aacfe9;
	278	+}
	279	+
	280	+#wikiLoveDialog #wlGallery a.selected img {
	281	+ background-color: #f56427;
	282	+}
	283	+
264	284	/* dialog preview */
265	285	#wikiLoveDialog #wlPreview {
266	286	float: right;
267	287	width: 480px;
268	288	}
269	289
270		~~-#wikiLoveDialog #wlPreview div {~~
	290	+#wikiLoveDialog #wlPreview #wlPreviewArea {
271	291	margin-left: 15px;
	292	+ width: 465px;
	293	+ overflow: auto;
272	294	}
273	295
274		~~-#wikiLoveDialog #wlPreview .editsection {~~
	296	+#wikiLoveDialog #wlPreview #wlPreviewArea .editsection {
275	297	display: none;
276	298	}
277	299
Index: trunk/extensions/WikiLove/wikiLove.js
—	—	@@ -10,14 +10,14 @@
11	11	'original': {
12	12	title: 'An Original Barnstar for you!', // subject title for the message
13	13	descr: 'Original barnstar', // description in the menu
14		~~- text: '{{subst:The Original Barnstar\|$1}}', // message text, $1 is replaced by the user message~~
	14	+ text: '{{subst:The Original Barnstar\|$1 ~~~~}}', // message text, $1 is replaced by the user message
15	15	template: 'The Original Barnstar', // template that is used, for statistics
16	16	message: 'Hello '+wgTitle+'!\n\nI just awarded you a barnstar.' // message to use in email notification
17	17	},
18	18	'special': {
19	19	title: null, // no predefined title, allows the user to enter a title
20	20	descr: 'Special barnstar',
21		~~- text: '{{subst:The Special Barnstarl\|$1}}',~~
	21	+ text: '{{subst:The Special Barnstarl\|$1 ~~~~}}',
22	22	template: 'The Special Barnstar',
23	23	message: 'Hello '+wgTitle+'!\n\nI just awarded you the special barnstar.'
24	24	}
—	—	@@ -25,6 +25,18 @@
26	26	email: true, // add email notices as an option for each award of this type
27	27	icon: mw.config.get( 'wgServer' ) + mw.config.get( 'wgScriptPath' ) + '/extensions/WikiLove/images/icons/wikilove-icon-barnstar.png'
28	28	},
	29	+ 'cat': {
	30	+ descr: 'Cat',
	31	+ title: null,
	32	+ text: "[[$2\|left\|150px]]\n$1\n\n~~~~",
	33	+ template: '',
	34	+ gallery: {
	35	+ category: 'Category:Tropical',
	36	+ total: 100,
	37	+ num: 3,
	38	+ width: 150
	39	+ }
	40	+ },
29	41	// default type, nice to leave this one in place when adding other types
30	42	'makeyourown': {
31	43	title: null,
—	—	@@ -40,6 +52,8 @@
41	53	currentTypeOrSubtype: null, // content of the current (sub)type (i.e. an object with title, descr, text, etc.)
42	54	previewData: null, // data of the currently previewed thing is set here
43	55	emailable: false,
	56	+ gallery: {},
	57	+ imageTitle: '',
44	58
45	59	/*
46	60	* Opens the dialog and builds it if necessary.
—	—	@@ -115,7 +129,9 @@
116	130	.append( '<h3>' + mw.msg( 'wikilove-add-details' ) + '</h3>' )
117	131	.append( '<label for="wlSubtype" id="wlSubtypeLabel"></label>' )
118	132	.append( $( '<form id="wlPreviewForm"></form>' )
119		~~- .append( '<select id="wlSubtype"></select>' )~~
	133	+ .append( '<select id="wlSubtype"></select>' )
	134	+ .append( '<label id="wlGalleryLabel">' + mw.msg( 'wikilove-gallery' ) + '</label>' )
	135	+ .append( '<div id="wlGallery"/>' )
120	136	.append( '<label for="wlTitle" id="wlTitleLabel">' + mw.msg( 'wikilove-title' ) + '</label>' )
121	137	.append( '<input type="text" class="text" id="wlTitle"/>' )
122	138	.append( '<label for="wlMessage" id="wlMessageLabel">' + mw.msg( 'wikilove-enter-message' ) + '</label>' )
—	—	@@ -273,6 +289,17 @@
274	290	$( '#wlTitle' ).show();
275	291	$( '#wlTitle' ).val( '' );
276	292	}
	293	+
	294	+ if( typeof $.wikiLove.currentTypeOrSubtype.gallery == 'object' ) {
	295	+ $( '#wlGalleryLabel' ).show();
	296	+ $( '#wlGallery' ).show();
	297	+ $.wikiLove.makeGallery();
	298	+ }
	299	+ else {
	300	+ $( '#wlGalleryLabel' ).hide();
	301	+ $( '#wlGallery' ).hide();
	302	+ }
	303	+
277	304	if( $.wikiLove.types[$.wikiLove.currentTypeId].email ) {
278	305	$( '#wlNotify' ).show();
279	306	} else {
—	—	@@ -286,13 +313,28 @@
287	314	*/
288	315	submitPreview: function( e ) {
289	316	e.preventDefault();
	317	+ if( $( '#wlTitle' ).val().length <= 0 ) {
	318	+ $.wikiLove.showError( 'wikilove-err-title' ); return false;
	319	+ }
	320	+ if( $( '#wlMessage' ).val().length <= 0 ) {
	321	+ $.wikiLove.showError( 'wikilove-err-msg' ); return false;
	322	+ }
	323	+
290	324	var title = '==' + $( '#wlTitle' ).val() + "==\n";
291	325	var rawMessage = $( '#wlMessage' ).val();
292		~~- // If there isn't a signature already in the message, add one to the end.~~
293		~~- if ( rawMessage.indexOf( '~~~' ) == -1 ) {~~
294		~~- rawMessage += ' ~~~~';~~
	326	+ // If there isn't a signature already in the message, throw an error
	327	+ if ( rawMessage.indexOf( '~~~' ) >= 0 ) {
	328	+ $.wikiLove.showError( 'wikilove-err-sig' ); return false;
295	329	}
296	330	var msg = $.wikiLove.currentTypeOrSubtype.text.replace( '$1', rawMessage );
	331	+ if( typeof $.wikiLove.currentTypeOrSubtype.gallery == 'object' ) {
	332	+ if ( $.wikiLove.imageTitle ) {
	333	+ msg = msg.replace( '$2', $.wikiLove.imageTitle );
	334	+ }
	335	+ else {
	336	+ $.wikiLove.showError( 'wikilove-err-img' ); return false;
	337	+ }
	338	+ }
297	339	$.wikiLove.doPreview( title + msg );
298	340	$.wikiLove.previewData = {
299	341	'title': title,
—	—	@@ -305,6 +347,10 @@
306	348	return false;
307	349	},
308	350
	351	+ showError: function( errmsg ) {
	352	+ $.wikiLove.showPreview( mw.msg( errmsg ) );
	353	+ },
	354	+
309	355	/*
310	356	* Fires AJAX request for previewing wikitext.
311	357	*/
—	—	@@ -396,6 +442,65 @@
397	443	});
398	444	},
399	445
	446	+ makeGallery: function() {
	447	+ $( '#wlGallery' ).html( '' );
	448	+ $.wikiLove.gallery = {};
	449	+ $.ajax({
	450	+ url: mw.config.get( 'wgServer' ) + mw.config.get( 'wgScriptPath' ) + '/api.php?',
	451	+ data: {
	452	+ 'action' : 'query',
	453	+ 'format' : 'json',
	454	+ 'prop' : 'imageinfo',
	455	+ 'iiprop' : 'mime\|url',
	456	+ 'iiurlwidth' : $.wikiLove.currentTypeOrSubtype.gallery.width,
	457	+ 'generator' : 'categorymembers',
	458	+ 'gcmtitle' : $.wikiLove.currentTypeOrSubtype.gallery.category,
	459	+ 'gcmnamespace': 6,
	460	+ 'gcmsort' : 'timestamp',
	461	+ 'gcmlimit' : $.wikiLove.currentTypeOrSubtype.gallery.total
	462	+ },
	463	+ dataType: 'json',
	464	+ type: 'POST',
	465	+ success: function( data ) {
	466	+ $( '#wlGallery' ).html( '' );
	467	+ $.wikiLove.gallery = {};
	468	+ if( data.query) {
	469	+ var keys = Object.keys( data.query.pages );
	470	+ for( var i=0; i<$.wikiLove.currentTypeOrSubtype.gallery.num; i++ ) {
	471	+ while( keys.length > 0 ) {
	472	+ var id = Math.floor( Math.random() * keys.length );
	473	+ var page = data.query.pages[keys[id]];
	474	+ keys.splice(id, 1);
	475	+ if( page.imageinfo[0].mime.substr(0,5) == 'image' ) {
	476	+ $img = $( '<img/>' );
	477	+ $img.attr( 'src', page.imageinfo[0].url );
	478	+ $img.attr( 'width', $.wikiLove.currentTypeOrSubtype.gallery.width );
	479	+ $( '#wlGallery' ).append(
	480	+ $( '<a href="#"></a>' )
	481	+ .attr( 'id', 'wlGalleryImg' + i )
	482	+ .append( $img )
	483	+ .click( function( e ) {
	484	+ e.preventDefault();
	485	+ $( '#wlGallery a' ).removeClass( 'selected' );
	486	+ $( this ).addClass( 'selected' );
	487	+ $.wikiLove.imageTitle = $.wikiLove.gallery[$( this ).attr( 'id' )];
	488	+ return false;
	489	+ })
	490	+ );
	491	+ $.wikiLove.gallery['wlGalleryImg' + i] = page.title;
	492	+ break;
	493	+ }
	494	+ }
	495	+ }
	496	+ }
	497	+ if( $( '#wlGallery' ).html().length <= 0 ) {
	498	+ $( '#wlGallery' ).hide();
	499	+ $( '#wlGalleryTitle' ).hide();
	500	+ }
	501	+ }
	502	+ });
	503	+ },
	504	+
400	505	/*
401	506	* Init function which is called upon page load. Binds the WikiLove icon to opening the dialog.
402	507	*/
Index: trunk/extensions/WikiLove/README
—	—	@@ -1,5 +1,5 @@
2		~~-WikiLove is an extension designed to promote the spread of WikiLove within~~
3		~~-Wikipedia.~~
	2	+WikiLove is an extension designed to promote the spread of WikiLove,
	3	+message of positive reinforcement that users can send to each other.
4	4
5	5	See documentation at the MediaWiki wiki:
6	6	http://www.mediawiki.org/wiki/Extension:WikiLove
Index: trunk/extensions/WikiLove/WikiLove.i18n.php
—	—	@@ -24,6 +24,7 @@
25	25	'wikilove-get-started-list-2' => 'Add details to your WikiLove',
26	26	'wikilove-get-started-list-3' => 'Send your WikiLove!',
27	27	'wikilove-add-details' => 'Add details',
	28	+ 'wikilove-gallery' => 'Picture:',
28	29	'wikilove-title' => 'Title:',
29	30	'wikilove-enter-message' => 'Enter a message:',
30	31	'wikilove-omit-sig' => '(without a signature)',
—	—	@@ -31,5 +32,9 @@
32	33	'wikilove-preview' => 'Preview',
33	34	'wikilove-button-send' => 'Send WikiLove',
34	35	'wikilove-type-makeyourown' => 'Make your own',
	36	+ 'wikilove-err-title' => 'Please enter a title.',
	37	+ 'wikilove-err-msg' => 'Please enter a message.',
	38	+ 'wikilove-err-image' => 'Please select an image.',
	39	+ 'wikilove-err-sig' => 'Please do not include a signature in the message.',
35	40	);
36	41

Comments

#Comment by Krinkle (talk | contribs) 23:22, 31 May 2011

Marking OK.

A little hint, the Message contructor in the mw.js lib supports $(N) parameters natively since a few months now. Documentation isn't great yet, but here's a basic example (look at mediawiki.js)

/**
 * suppose we have a message key "user-welcome" with value
 * "Hello $1. Welcome to $2. Last visit by $1: $3".
 * mw.message(key /* , ... */ )
 * mw.message is something like:
 * var parameters = arguments.shift(); return new Message(msgBlob, key, parameters);
 * not to confuse with mw.msg(), which is like: return mw.message(key).toString()
 */

// Get instance of Message
var welcome = mw.message('user-welcome', 'Krinkle', 'Wikipedia', 'now');

// Get it as a plain string
welcome.format = 'plain';
welcome.toString();

// Shortcut for the above
welcome.plain();

// Returns: "Hello Krinkle. Welcome to Wikipedia. Last visit by Krinkle: now"

#Comment by Krinkle (talk | contribs) 23:24, 31 May 2011

Might as well save it here: ResourceLoader/Default_modules#mediaWiki.message

Status & tagging log

23:22, 31 May 2011 Krinkle (talk | contribs) changed the status of r88140 [removed: new added: ok]