http://www.mediawiki.org/wiki/Special:Code/MediaWiki/88773
Revision: 88773
Author: kaldari
Date: 2011-05-25 01:15:09 +0000 (Wed, 25 May 2011)
Log Message:
-----------
adding simple method for building galleries from an array of images
Modified Paths:
--------------
trunk/extensions/WikiLove/defaultTypes.js
trunk/extensions/WikiLove/wikiLove.js
Modified: trunk/extensions/WikiLove/defaultTypes.js
===================================================================
--- trunk/extensions/WikiLove/defaultTypes.js 2011-05-25 00:49:51 UTC (rev
88772)
+++ trunk/extensions/WikiLove/defaultTypes.js 2011-05-25 01:15:09 UTC (rev
88773)
@@ -36,19 +36,29 @@
},
icon: mw.config.get( 'wgServer' ) + mw.config.get(
'wgScriptPath' ) +
'/extensions/WikiLove/images/icons/wikilove-icon-barnstar.png' // icon for
left-side menu
},
- 'cats': {
- name: 'Cat',
+ 'puppy': {
+ name: 'Puppy',
fields: [ 'header' ],
- header: 'A kitten for you!',
+ header: 'A puppy for you!',
text: '[[$3|left|150px]]\n$1\n\n~~~~\n<br style="clear:
both"/>', // custom text
gallery: {
// right now we can only query the local wiki (not e.g.
commons)
- category: 'Category:Cats',
+ category: 'Category:Puppies',
total: 100, // total number of pictures to retrieve,
and to randomise
num: 3, // number of pictures to show from the
randomised set
width: 145 // width of each picture in pixels in the
interface (not in the template)
}
},
+ 'kitten': {
+ name: 'Kitten',
+ fields: [ 'header' ],
+ header: 'A kitten for you!',
+ text: '[[$3|left|150px]]\n$1\n\n~~~~\n<br style="clear:
both"/>', // $3 is the image filename
+ gallery: {
+ imageList: ['File:Cucciolo gatto Bibo.jpg','File:Kitten
(06) by Ron.jpg','File:Kitten-stare.jpg'],
+ width: 145
+ }
+ },
// default type, nice to leave this one in place when adding other types
'makeyourown': {
name: mw.msg( 'wikilove-type-makeyourown' ),
Modified: trunk/extensions/WikiLove/wikiLove.js
===================================================================
--- trunk/extensions/WikiLove/wikiLove.js 2011-05-25 00:49:51 UTC (rev
88772)
+++ trunk/extensions/WikiLove/wikiLove.js 2011-05-25 01:15:09 UTC (rev
88773)
@@ -245,10 +245,18 @@
$( '#wlImage' ).val( $.wikiLove.currentTypeOrSubtype.image ||
'' );
if( typeof $.wikiLove.currentTypeOrSubtype.gallery == 'object'
) {
- $( '#wlGalleryLabel' ).show();
- $( '#wlGallery' ).show();
- $( '#wlGallerySpinner' ).show();
- $.wikiLove.makeGallery();
+ if( $.wikiLove.currentTypeOrSubtype.gallery.imageList
instanceof Array) {
+ $( '#wlGalleryLabel' ).show();
+ $( '#wlGallery' ).show();
+ $( '#wlGallerySpinner' ).show();
+ $.wikiLove.showGallery(); // build gallery from
array of images
+ } else {
+ // gallery is a category
+ $( '#wlGalleryLabel' ).show();
+ $( '#wlGallery' ).show();
+ $( '#wlGallerySpinner' ).show();
+ $.wikiLove.makeGallery(); // build gallery from
category
+ }
}
else {
$( '#wlGalleryLabel' ).hide();
@@ -435,6 +443,62 @@
},
/*
+ * This function is called if the gallery is an array of images. It
retrieves the image
+ * thumbnails from the API, and constructs a thumbnail gallery with
them.
+ */
+ showGallery: function() {
+ $( '#wlGallery' ).html( '' );
+ $.wikiLove.gallery = {};
+ $( '#wlGallerySpinner .wlSpinner' ).fadeIn( 200 );
+
+ $.each( $.wikiLove.currentTypeOrSubtype.gallery.imageList,
function(index, value) {
+
+ $.ajax({
+ url: mw.config.get( 'wgServer' ) +
mw.config.get( 'wgScriptPath' ) + '/api.php',
+ data: {
+ 'action' : 'query',
+ 'format' : 'json',
+ 'prop' : 'imageinfo',
+ 'iiprop' : 'mime|url',
+ 'titles' : value,
+ 'iiurlwidth' :
$.wikiLove.currentTypeOrSubtype.gallery.width
+ },
+ dataType: 'json',
+ type: 'POST',
+ success: function( data ) {
+ if ( !data || !data.query ||
!data.query.pages ) {
+ return;
+ }
+ $.each( data.query.pages, function( id,
page ) {
+ if ( page.imageinfo &&
page.imageinfo.length ) {
+ // build an image tag
with the correct url and width
+ $img = $( '<img/>' )
+ .attr( 'src',
page.imageinfo[0].thumburl )
+ .attr( 'width',
$.wikiLove.currentTypeOrSubtype.gallery.width )
+ .hide()
+ .load(
function() { $( this ).css( 'display', 'inline-block' ); } );
+ $( '#wlGallery'
).append(
+ $( '<a
href="#"></a>' )
+ .attr(
'id', 'wlGalleryImg' + index )
+
.append( $img )
+ .click(
function( e ) {
+
e.preventDefault();
+
$( '#wlGallery a' ).removeClass( 'selected' );
+
$( this ).addClass( 'selected' );
+
$( '#wlImage' ).val( $.wikiLove.gallery[$( this ).attr( 'id' )] );
+
return false;
+ })
+ );
+
$.wikiLove.gallery['wlGalleryImg' + index] = page.title;
+ }
+ } );
+ }
+ });
+
+ });
+ },
+
+ /*
* This is a bit of a hack to show some random images. A predefined set
of image infos are
* retrieved using the API. Then we randomise this set ourselves and
select some images to
* show. Eventually we probably want to make a custom API call that
does this properly and
_______________________________________________
MediaWiki-CVS mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-cvs
