| Index: trunk/extensions/UploadWizard/resources/jquery/jquery.showThumbCtrl.js |
| — | — | @@ -0,0 +1,14 @@ |
| | 2 | +/** |
| | 3 | + * Create 'show thumbnail' control, with optional tooltips. works like the 'remove' control. |
| | 4 | + */ |
| | 5 | +( function ( $j ) { |
| | 6 | + $j.fn.showThumbCtrl = function( msgKey, tooltipMsgKey, callback ) { |
| | 7 | + var msg = (msgKey === null) ? '' : gM( msgKey ); |
| | 8 | + return $j( '<div class="mwe-upwiz-show-thumb-ctrl ui-corner-all" />' ) |
| | 9 | + .attr( 'title', gM( tooltipMsgKey ) ) |
| | 10 | + .click( function() { $j( this ).removeClass( 'hover' ).addClass( 'disabled' ).unbind( 'mouseenter mouseover mouseleave mouseout mouseup mousedown' ); callback(); } ) |
| | 11 | + .hover( function() { $j( this ).addClass( 'hover' ); }, |
| | 12 | + function() { $j( this ).removeClass( 'hover' ); } ) |
| | 13 | + .append( $j( '<div class="ui-icon" /><div class="mwe-upwiz-show-thumb-ctrl-msg">' + msg + '</div>' ) ); |
| | 14 | + }; |
| | 15 | +} )( jQuery ); |
| Property changes on: trunk/extensions/UploadWizard/resources/jquery/jquery.showThumbCtrl.js |
| ___________________________________________________________________ |
| Added: svn:eol-style |
| 1 | 16 | + native |
| Index: trunk/extensions/UploadWizard/resources/jquery/jquery.showThumbCtrl.css |
| — | — | @@ -0,0 +1,22 @@ |
| | 2 | +.mwe-upwiz-show-thumb-ctrl { |
| | 3 | + outline: none; |
| | 4 | + cursor: pointer; |
| | 5 | +} |
| | 6 | + |
| | 7 | +.mwe-upwiz-show-thumb-ctrl.hover .mwe-upwiz-show-thumb-ctrl-msg { |
| | 8 | + text-decoration: underline; |
| | 9 | +} |
| | 10 | + |
| | 11 | +.mwe-upwiz-show-thumb-ctrl.disabled .mwe-upwiz-show-thumb-ctrl-msg { |
| | 12 | + text-decoration: none; |
| | 13 | + color: #cccccc; |
| | 14 | + cursor: default; |
| | 15 | +} |
| | 16 | + |
| | 17 | +.mwe-upwiz-show-thumb-ctrl div { |
| | 18 | + color: #0645ad; |
| | 19 | + font-variant: bold; |
| | 20 | + float: left; |
| | 21 | +} |
| | 22 | + |
| | 23 | + |
| Property changes on: trunk/extensions/UploadWizard/resources/jquery/jquery.showThumbCtrl.css |
| ___________________________________________________________________ |
| Added: svn:eol-style |
| 1 | 24 | + native |
| Index: trunk/extensions/UploadWizard/resources/mw.UploadWizardUploadInterface.js |
| — | — | @@ -16,6 +16,8 @@ |
| 17 | 17 | _this.div = $j('<div class="mwe-upwiz-file"></div>').get(0); |
| 18 | 18 | _this.isFilled = false; |
| 19 | 19 | |
| | 20 | + _this.previewLoaded = false; |
| | 21 | + |
| 20 | 22 | _this.$fileInputCtrl = $j( '<input size="1" class="mwe-upwiz-file-input" name="file" type="file"/>' ); |
| 21 | 23 | if( mw.UploadWizard.config['enableMultiFileSelect'] ) { |
| 22 | 24 | _this.$fileInputCtrl.attr( 'multiple', '1' ); |
| — | — | @@ -25,7 +27,7 @@ |
| 26 | 28 | |
| 27 | 29 | _this.$indicator = $j( '<div class="mwe-upwiz-file-indicator"></div>' ); |
| 28 | 30 | |
| 29 | | - var visibleFilenameDiv = $j('<div class="mwe-upwiz-visible-file"></div>') |
| | 31 | + _this.visibleFilenameDiv = $j('<div class="mwe-upwiz-visible-file"></div>') |
| 30 | 32 | .append( _this.$indicator ) |
| 31 | 33 | .append( '<div class="mwe-upwiz-visible-file-filename">' |
| 32 | 34 | + '<div class="mwe-upwiz-file-preview"/>' |
| — | — | @@ -44,8 +46,10 @@ |
| 45 | 47 | function() { _this.upload.remove(); } |
| 46 | 48 | ).addClass( "mwe-upwiz-file-status-line-item" ); |
| 47 | 49 | |
| 48 | | - visibleFilenameDiv.find( '.mwe-upwiz-file-status-line' ) |
| | 50 | + _this.visibleFilenameDiv.find( '.mwe-upwiz-file-status-line' ) |
| 49 | 51 | .append( _this.$removeCtrl ); |
| | 52 | + |
| | 53 | + // Add show thumbnail control |
| 50 | 54 | |
| 51 | 55 | //_this.errorDiv = $j('<div class="mwe-upwiz-upload-error mwe-upwiz-file-indicator" style="display: none;"></div>').get(0); |
| 52 | 56 | |
| — | — | @@ -69,7 +73,7 @@ |
| 70 | 74 | // XXX caution -- if the add file input changes size we won't match, unless we add some sort of event to catch this. |
| 71 | 75 | _this.form = $j( '<form method="POST" encType="multipart/form-data" class="mwe-upwiz-form"></form>' ) |
| 72 | 76 | .attr( { action: _this.upload.api.url } ) |
| 73 | | - .append( visibleFilenameDiv ) |
| | 77 | + .append( _this.visibleFilenameDiv ) |
| 74 | 78 | .append( _this.fileCtrlContainer |
| 75 | 79 | .append( _this.$fileInputCtrl ) |
| 76 | 80 | ) |
| — | — | @@ -116,10 +120,16 @@ |
| 117 | 121 | .unbind( 'mouseenter mouseover mouseleave mouseout' ); |
| 118 | 122 | |
| 119 | 123 | // remove delete control |
| 120 | | - $j( _this.div ) |
| | 124 | + $j( _this.visibleFilenameDiv ) |
| 121 | 125 | .find( '.mwe-upwiz-remove-ctrl' ) |
| 122 | 126 | .unbind( 'mouseenter mouseover mouseleave mouseout' ) |
| 123 | 127 | .remove(); |
| | 128 | + |
| | 129 | + // remove thumb control |
| | 130 | + $j( _this.visibleFilenameDiv ) |
| | 131 | + .find( '.mwe-upwiz-show-thumb-ctrl' ) |
| | 132 | + .unbind( 'mouseenter mouseover mouseleave mouseout' ) |
| | 133 | + .remove(); |
| 124 | 134 | }, |
| 125 | 135 | |
| 126 | 136 | /** |
| — | — | @@ -204,6 +214,10 @@ |
| 205 | 215 | showStashed: function() { |
| 206 | 216 | this.$removeCtrl.detach(); |
| 207 | 217 | this.$fileInputCtrl.detach(); |
| | 218 | + if( this.$showThumbCtrl ) { |
| | 219 | + this.$showThumbCtrl.detach(); |
| | 220 | + } |
| | 221 | + |
| 208 | 222 | this.showIndicator( 'stashed' ); |
| 209 | 223 | this.setStatus( 'mwe-upwiz-stashed-upload' ); // this is just "OK", say something more. |
| 210 | 224 | }, |
| — | — | @@ -260,6 +274,7 @@ |
| 261 | 275 | } ); |
| 262 | 276 | } |
| 263 | 277 | } |
| | 278 | + |
| 264 | 279 | return files; |
| 265 | 280 | }, |
| 266 | 281 | |
| — | — | @@ -296,6 +311,35 @@ |
| 297 | 312 | this.clearStatus(); |
| 298 | 313 | this.setStatusString( statusItems.join( ' \u00b7 ' ) ); |
| 299 | 314 | |
| | 315 | + // Only do this for images. Other things get no thumbnail. |
| | 316 | + // TODO: a more complete check for thumbnail-ability might be needed here. |
| | 317 | + if ( this.upload.imageinfo && this.upload.imageinfo.width && this.upload.imageinfo.height ) { |
| | 318 | + if( this.upload.wizard.makePreviewsFlag ) { |
| | 319 | + // make the preview now. |
| | 320 | + this.makePreview(); |
| | 321 | + } else { |
| | 322 | + // add a control for showing the preview if the user needs it |
| | 323 | + this.$showThumbCtrl = $j.fn.showThumbCtrl( |
| | 324 | + 'mwe-upwiz-show-thumb', |
| | 325 | + 'mwe-upwiz-show-thumb-tip', |
| | 326 | + function() { _this.makePreview(); } |
| | 327 | + ).addClass( "mwe-upwiz-file-status-line-item" ); |
| | 328 | + |
| | 329 | + this.visibleFilenameDiv.find( '.mwe-upwiz-file-status-line' ) |
| | 330 | + .append( '<br/>' ).append( _this.$showThumbCtrl ); |
| | 331 | + |
| | 332 | + } |
| | 333 | + } |
| | 334 | + }, |
| | 335 | + |
| | 336 | + makePreview: function() { |
| | 337 | + var _this = this; |
| | 338 | + |
| | 339 | + // don't run this repeatedly. |
| | 340 | + if( _this.previewLoaded ) { |
| | 341 | + return; |
| | 342 | + } |
| | 343 | + |
| 300 | 344 | // do preview if we can |
| 301 | 345 | if ( mw.fileApi.isAvailable() && _this.upload.file && mw.fileApi.isPreviewableFile( _this.upload.file ) ) { |
| 302 | 346 | var dataUrlReader = new FileReader(); |
| — | — | @@ -303,13 +347,16 @@ |
| 304 | 348 | var image = document.createElement( 'img' ); |
| 305 | 349 | image.onload = function() { |
| 306 | 350 | $.publishReady( 'thumbnails.' + _this.upload.index, image ); |
| | 351 | + _this.previewLoaded = true; |
| 307 | 352 | }; |
| | 353 | + |
| | 354 | + // this step (inserting image-as-dataurl into image object) is slow for large images, which |
| | 355 | + // is why this is optional and has a control attached to it to load the preview. |
| 308 | 356 | image.src = dataUrlReader.result; |
| 309 | 357 | _this.upload.thumbnails['*'] = image; |
| 310 | 358 | }; |
| 311 | 359 | dataUrlReader.readAsDataURL( _this.upload.file ); |
| 312 | | - } |
| 313 | | - |
| | 360 | + } |
| 314 | 361 | }, |
| 315 | 362 | |
| 316 | 363 | fileChangedError: function( code, info ) { |
| Index: trunk/extensions/UploadWizard/resources/uploadWizard.css |
| — | — | @@ -106,8 +106,8 @@ |
| 107 | 107 | background: #f5f5f5; |
| 108 | 108 | } |
| 109 | 109 | |
| 110 | | -.mwe-upwiz-visible-file .mwe-upwiz-remove-ctrl { |
| 111 | | - visibility: hidden; |
| | 110 | +.mwe-upwiz-visible-file .mwe-upwiz-remove-ctrl .mwe-upwiz-show-thumb-ctrl { |
| | 111 | + visibility: visible; |
| 112 | 112 | } |
| 113 | 113 | |
| 114 | 114 | .mwe-upwiz-file-indicator, .mwe-upwiz-count { |
| — | — | @@ -207,7 +207,7 @@ |
| 208 | 208 | background: #e0f0ff !important; |
| 209 | 209 | } |
| 210 | 210 | |
| 211 | | -.mwe-upwiz-file.hover .mwe-upwiz-remove-ctrl { |
| | 211 | +.mwe-upwiz-file.hover .mwe-upwiz-remove-ctrl .mwe-upwiz-show-thumb-ctrl { |
| 212 | 212 | visibility: visible; |
| 213 | 213 | } |
| 214 | 214 | |
| Index: trunk/extensions/UploadWizard/resources/mw.UploadWizard.js |
| — | — | @@ -17,6 +17,8 @@ |
| 18 | 18 | this.maxUploads = mw.UploadWizard.config[ 'maxUploads' ] || 10; |
| 19 | 19 | this.maxSimultaneousConnections = mw.UploadWizard.config[ 'maxSimultaneousConnections' ] || 2; |
| 20 | 20 | |
| | 21 | + this.makePreviewsFlag = true; |
| | 22 | + |
| 21 | 23 | }; |
| 22 | 24 | |
| 23 | 25 | mw.UploadWizard.DEBUG = true; |
| Index: trunk/extensions/UploadWizard/resources/mw.FormDataTransport.js |
| — | — | @@ -58,6 +58,7 @@ |
| 59 | 59 | }); |
| 60 | 60 | formData.append('filename', file.name); |
| 61 | 61 | formData.append('file', file); |
| | 62 | + formData.append( 'ignorewarnings', true ); |
| 62 | 63 | |
| 63 | 64 | this.xhr.open("POST", _this.postUrl, true); |
| 64 | 65 | this.xhr.send(formData); |
| — | — | @@ -99,9 +100,11 @@ |
| 100 | 101 | //failed to upload, try again in 3 second |
| 101 | 102 | _this.retries++; |
| 102 | 103 | if (_this.maxRetries > 0 && _this.retries >= _this.maxRetries) { |
| | 104 | + mw.log( 'max retries exceeded on unknown response' ); |
| 103 | 105 | //upload failed, raise response |
| 104 | 106 | _this.transportedCb(response); |
| 105 | 107 | } else { |
| | 108 | + mw.log( 'retry #' + _this.retries + ' on unknown response' ); |
| 106 | 109 | setTimeout(function() { |
| 107 | 110 | _this.uploadChunk(offset); |
| 108 | 111 | }, 3000); |
| — | — | @@ -113,8 +116,10 @@ |
| 114 | 117 | //failed to upload, try again in 3 second |
| 115 | 118 | _this.retries++; |
| 116 | 119 | if (_this.maxRetries > 0 && _this.retries >= _this.maxRetries) { |
| | 120 | + mw.log( 'max retries exceeded on error event' ); |
| 117 | 121 | _this.parseResponse(evt, _this.transportedCb); |
| 118 | 122 | } else { |
| | 123 | + mw.log( 'retry #' + _this.retries + ' on error event' ); |
| 119 | 124 | setTimeout(function() { |
| 120 | 125 | _this.uploadChunk(offset); |
| 121 | 126 | }, 3000); |
| — | — | @@ -141,6 +146,7 @@ |
| 142 | 147 | }); |
| 143 | 148 | formData.append('offset', offset); |
| 144 | 149 | formData.append('filename', file.name); |
| | 150 | + formData.append( 'ignorewarnings', true ); |
| 145 | 151 | |
| 146 | 152 | if (_this.filekey) { |
| 147 | 153 | formData.append('filekey', _this.filekey); |
| Index: trunk/extensions/UploadWizard/resources/mw.UploadWizardUpload.js |
| — | — | @@ -41,6 +41,7 @@ |
| 42 | 42 | this.filename = undefined; |
| 43 | 43 | this.providedFile = providedFile; |
| 44 | 44 | this.file = undefined; |
| | 45 | + this.fileCount = undefined; |
| 45 | 46 | |
| 46 | 47 | this.fileKey = undefined; |
| 47 | 48 | |
| — | — | @@ -291,7 +292,10 @@ |
| 292 | 293 | // TODO sanitize filename |
| 293 | 294 | var basename = mw.UploadWizardUtil.getBasename( filename ); |
| 294 | 295 | |
| 295 | | - |
| | 296 | + if( files.length > 1 ) { |
| | 297 | + this.wizard.makePreviewsFlag = false; |
| | 298 | + } |
| | 299 | + |
| 296 | 300 | // check to see if the file has already been selected for upload. |
| 297 | 301 | var duplicate = false; |
| 298 | 302 | $j.each( this.wizard.uploads, function ( i, upload ) { |
| Index: trunk/extensions/UploadWizard/resources/mw.UploadWizardDetails.js |
| — | — | @@ -236,7 +236,6 @@ |
| 237 | 237 | _this.submittingDiv.find( '.mwe-upwiz-file-status-line' ) |
| 238 | 238 | .append( _this.$removeCtrl ); |
| 239 | 239 | |
| 240 | | - |
| 241 | 240 | $j( _this.dataDiv ).append( |
| 242 | 241 | _this.$form, |
| 243 | 242 | _this.submittingDiv |