| Index: trunk/extensions/WikiLove/modules/ext.wikiLove/ext.wikiLove.css |
| — | — | @@ -8,6 +8,7 @@ |
| 9 | 9 | } |
| 10 | 10 | |
| 11 | 11 | #mw-wikilove-preview-form { |
| | 12 | + position: relative; |
| 12 | 13 | clear: both; /* for monobook skin */ |
| 13 | 14 | } |
| 14 | 15 | |
| — | — | @@ -210,7 +211,7 @@ |
| 211 | 212 | } |
| 212 | 213 | |
| 213 | 214 | /*#mw-wikilove-dialog #mw-wikilove-add-details*/ #mw-wikilove-subtype-description { |
| 214 | | - margin: 5px 0px 8px 15px; |
| | 215 | + margin: 5px 85px 8px 15px; |
| 215 | 216 | font-size: 1.0em; |
| 216 | 217 | line-height: 1.2em; |
| 217 | 218 | } |
| — | — | @@ -218,7 +219,6 @@ |
| 219 | 220 | /*#mw-wikilove-dialog*/ #mw-wikilove-add-details .mw-wikilove-note { |
| 220 | 221 | font-weight: light; |
| 221 | 222 | font-size: 0.9em; |
| 222 | | - float: right; |
| 223 | 223 | color: #999; |
| 224 | 224 | } |
| 225 | 225 | |
| — | — | @@ -349,6 +349,24 @@ |
| 350 | 350 | padding-bottom: 3px; |
| 351 | 351 | } |
| 352 | 352 | |
| | 353 | +#mw-wikilove-dialog #mw-wikilove-image-preview { |
| | 354 | + position: absolute; |
| | 355 | + top: 1em; |
| | 356 | + right: 0; |
| | 357 | + width: 75px; |
| | 358 | + height: 68px; |
| | 359 | +} |
| | 360 | + |
| | 361 | +#mw-wikilove-dialog #mw-wikilove-image-preview-content { |
| | 362 | + text-align: center; |
| | 363 | +} |
| | 364 | + |
| | 365 | +#mw-wikilove-dialog #mw-wikilove-image-preview-spinner { |
| | 366 | + float: none; |
| | 367 | + margin-left:auto; |
| | 368 | + margin-right:auto; |
| | 369 | +} |
| | 370 | + |
| 353 | 371 | #mw-wikilove-dialog a { |
| 354 | 372 | color: #0645AD; |
| 355 | 373 | } |
| Index: trunk/extensions/WikiLove/modules/ext.wikiLove/ext.wikiLove.core.js |
| — | — | @@ -64,6 +64,10 @@ |
| 65 | 65 | <span class="mw-wikilove-number">2</span>\ |
| 66 | 66 | <h3><html:msg key="wikilove-add-details"/></h3>\ |
| 67 | 67 | <form id="mw-wikilove-preview-form">\ |
| | 68 | + <div id="mw-wikilove-image-preview">\ |
| | 69 | + <div id="mw-wikilove-image-preview-spinner" class="mw-wikilove-spinner"></div>\ |
| | 70 | + <div id="mw-wikilove-image-preview-content"></div>\ |
| | 71 | + </div>\ |
| 68 | 72 | <label for="mw-wikilove-subtype" id="mw-wikilove-subtype-label"></label>\ |
| 69 | 73 | <select id="mw-wikilove-subtype"></select>\ |
| 70 | 74 | <div id="mw-wikilove-subtype-description"></div>\ |
| — | — | @@ -200,6 +204,7 @@ |
| 201 | 205 | currentTypeOrSubtype = options.types[currentTypeId]; |
| 202 | 206 | $( '#mw-wikilove-subtype' ).hide(); |
| 203 | 207 | $( '#mw-wikilove-subtype-label' ).hide(); |
| | 208 | + $( '#mw-wikilove-image-preview' ).hide(); |
| 204 | 209 | $.wikiLove.updateAllDetails(); // update controls depending on this type |
| 205 | 210 | } |
| 206 | 211 | |
| — | — | @@ -221,6 +226,13 @@ |
| 222 | 227 | currentTypeOrSubtype = options.types[currentTypeId] |
| 223 | 228 | .subtypes[currentSubtypeId]; |
| 224 | 229 | $( '#mw-wikilove-subtype-description' ).html( currentTypeOrSubtype.descr ); |
| | 230 | + |
| | 231 | + if( currentTypeOrSubtype.gallery === undefined && currentTypeOrSubtype.image ) { // not a gallery |
| | 232 | + $.wikiLove.showImagePreview(); |
| | 233 | + } else { |
| | 234 | + $( '#mw-wikilove-image-preview' ).hide(); |
| | 235 | + } |
| | 236 | + |
| 225 | 237 | $.wikiLove.updateAllDetails(); |
| 226 | 238 | $( '#mw-wikilove-preview' ).hide(); |
| 227 | 239 | } |
| — | — | @@ -263,6 +275,56 @@ |
| 264 | 276 | }, |
| 265 | 277 | |
| 266 | 278 | /* |
| | 279 | + * Show a preview of the image for a subtype. |
| | 280 | + */ |
| | 281 | + showImagePreview: function() { |
| | 282 | + $( '#mw-wikilove-image-preview' ).show(); |
| | 283 | + $( '#mw-wikilove-image-preview-content' ).html( '' ); |
| | 284 | + $( '#mw-wikilove-image-preview-spinner' ).fadeIn( 200 ); |
| | 285 | + var title = $.wikiLove.addFilePrefix( currentTypeOrSubtype.image ); |
| | 286 | + var loadingType = currentTypeOrSubtype; |
| | 287 | + $.ajax({ |
| | 288 | + url: mw.util.wikiScript( 'api' ), |
| | 289 | + data: { |
| | 290 | + 'action' : 'query', |
| | 291 | + 'format' : 'json', |
| | 292 | + 'prop' : 'imageinfo', |
| | 293 | + 'iiprop' : 'mime|url', |
| | 294 | + 'titles' : title, |
| | 295 | + 'iiurlwidth' : 75, |
| | 296 | + 'iiurlheight' : 68 |
| | 297 | + }, |
| | 298 | + dataType: 'json', |
| | 299 | + type: 'POST', |
| | 300 | + success: function( data ) { |
| | 301 | + if ( !data || !data.query || !data.query.pages ) { |
| | 302 | + $( '#mw-wikilove-image-preview-spinner' ).fadeOut( 200 ); |
| | 303 | + return; |
| | 304 | + } |
| | 305 | + if ( loadingType != currentTypeOrSubtype ) { |
| | 306 | + return; |
| | 307 | + } |
| | 308 | + $.each( data.query.pages, function( id, page ) { |
| | 309 | + if ( page.imageinfo && page.imageinfo.length ) { |
| | 310 | + // build an image tag with the correct url |
| | 311 | + var $img = $( '<img/>' ) |
| | 312 | + .attr( 'src', page.imageinfo[0].thumburl ) |
| | 313 | + .hide() |
| | 314 | + .load( function() { |
| | 315 | + $( '#mw-wikilove-image-preview-spinner' ).hide(); |
| | 316 | + $( this ).css( 'display', 'inline-block' ); |
| | 317 | + } ); |
| | 318 | + $( '#mw-wikilove-image-preview-content' ).append( $img ); |
| | 319 | + } |
| | 320 | + }); |
| | 321 | + }, |
| | 322 | + error: function() { |
| | 323 | + $( '#mw-wikilove-image-preview-spinner' ).fadeOut( 200 ); |
| | 324 | + } |
| | 325 | + }); |
| | 326 | + }, |
| | 327 | + |
| | 328 | + /* |
| 267 | 329 | * Called when type or subtype changes, updates controls. |
| 268 | 330 | */ |
| 269 | 331 | updateAllDetails: function() { |
| — | — | @@ -662,6 +724,7 @@ |
| 663 | 725 | if ( loadingType != currentTypeOrSubtype ) { |
| 664 | 726 | return; |
| 665 | 727 | } |
| | 728 | + var galleryNumber = currentTypeOrSubtype.gallery.number; |
| 666 | 729 | |
| 667 | 730 | $.each( data.query.pages, function( id, page ) { |
| 668 | 731 | if ( page.imageinfo && page.imageinfo.length ) { |
| — | — | @@ -672,7 +735,7 @@ |
| 673 | 736 | .load( function() { |
| 674 | 737 | $( this ).css( 'display', 'inline-block' ); |
| 675 | 738 | loadingIndex++; |
| 676 | | - if ( loadingIndex >= currentTypeOrSubtype.gallery.number ) { |
| | 739 | + if ( loadingIndex >= galleryNumber ) { |
| 677 | 740 | $( '#mw-wikilove-gallery-spinner' ).fadeOut( 200 ); |
| 678 | 741 | } |
| 679 | 742 | } ); |