- Timestamp:
- 05/04/12 18:00:28 (12 years ago)
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/prototype/plugins/fileupload/jquery.fileupload-ui.js
r5341 r6107 1 1 /* 2 * jQuery File Upload User Interface Plugin 5.0.162 * jQuery File Upload User Interface Plugin 6.7 3 3 * https://github.com/blueimp/jQuery-File-Upload 4 4 * … … 7 7 * 8 8 * Licensed under the MIT license: 9 * http:// creativecommons.org/licenses/MIT/9 * http://www.opensource.org/licenses/MIT 10 10 */ 11 11 12 12 /*jslint nomen: true, unparam: true, regexp: true */ 13 /*global window, document, URL, webkitURL, FileReader, jQuery*/14 15 (function ( $) {13 /*global define, window, document, URL, webkitURL, FileReader */ 14 15 (function (factory) { 16 16 'use strict'; 17 18 // The UI version extends the basic fileupload widget and adds 19 // a complete user interface based on the given upload/download 20 // templates. 21 $.widget('blueimpUI.fileupload', $.blueimp.fileupload, { 22 17 if (typeof define === 'function' && define.amd) { 18 // Register as an anonymous AMD module: 19 define([ 20 'jquery', 21 'tmpl', 22 'load-image', 23 './jquery.fileupload-fp' 24 ], factory); 25 } else { 26 // Browser globals: 27 factory( 28 window.jQuery, 29 window.tmpl, 30 window.loadImage 31 ); 32 } 33 }(function ($, tmpl, loadImage) { 34 'use strict'; 35 36 // The UI version extends the FP (file processing) version or the basic 37 // file upload widget and adds complete user interface interaction: 38 var parentWidget = ($.blueimpFP || $.blueimp).fileupload; 39 $.widget('blueimpUI.fileupload', parentWidget, { 40 23 41 options: { 24 42 // By default, files added to the widget are uploaded as soon … … 32 50 maxFileSize: undefined, 33 51 // The minimum allowed file size: 34 minFileSize: 1,52 minFileSize: undefined, 35 53 // The regular expression for allowed file types, matches 36 54 // against either file type or file name: … … 38 56 // The regular expression to define for which files a preview 39 57 // image is shown, matched against the file type: 40 previewFileTypes: /^image\/(gif|jpeg|png)$/, 58 previewSourceFileTypes: /^image\/(gif|jpeg|png)$/, 59 // The maximum file size of images that are to be displayed as preview: 60 previewSourceMaxFileSize: 5000000, // 5MB 41 61 // The maximum width of the preview images: 42 62 previewMaxWidth: 80, … … 47 67 // to always display preview images as img elements: 48 68 previewAsCanvas: true, 49 // The file upload template that is given as first argument to the 50 // jQuery.tmpl method to render the file uploads: 51 uploadTemplate: $('#template-upload'), 52 // The file download template, that is given as first argument to the 53 // jQuery.tmpl method to render the file downloads: 54 downloadTemplate: $('#template-download'), 69 // The ID of the upload template: 70 uploadTemplateId: 'template-upload', 71 // The ID of the download template: 72 downloadTemplateId: 'template-download', 73 // The container for the list of files. If undefined, it is set to 74 // an element with class "files" inside of the widget element: 75 filesContainer: undefined, 76 // By default, files are appended to the files container. 77 // Set the following option to true, to prepend files instead: 78 prependFiles: false, 55 79 // The expected data type of the upload response, sets the dataType 56 80 // option of the $.ajax upload requests: 57 81 dataType: 'json', 58 82 59 83 // The add callback is invoked as soon as files are added to the fileupload 60 84 // widget (via file input selection, drag & drop or add API call). 61 85 // See the basic file upload widget for more information: 62 86 add: function (e, data) { 63 var that = $(this).data('fileupload'); 64 that._adjustMaxNumberOfFiles(-data.files.length); 65 data.isAdjusted = true; 66 data.isValidated = that._validate(data.files); 67 data.context = that._renderUpload(data.files) 68 .appendTo($(this).find('.files')).fadeIn(function () { 69 // Fix for IE7 and lower: 70 $(this).show(); 71 }).data('data', data); 72 if ((that.options.autoUpload || data.autoUpload) && 73 data.isValidated) { 74 data.jqXHR = data.submit(); 75 } 87 var that = $(this).data('fileupload'), 88 options = that.options, 89 files = data.files; 90 $(this).fileupload('process', data).done(function () { 91 that._adjustMaxNumberOfFiles(-files.length); 92 data.isAdjusted = true; 93 data.files.valid = data.isValidated = that._validate(files); 94 data.context = that._renderUpload(files).data('data', data); 95 options.filesContainer[ 96 options.prependFiles ? 'prepend' : 'append' 97 ](data.context); 98 that._renderPreviews(files, data.context); 99 that._forceReflow(data.context); 100 that._transition(data.context).done( 101 function () { 102 if ((that._trigger('added', e, data) !== false) && 103 (options.autoUpload || data.autoUpload) && 104 data.autoUpload !== false && data.isValidated) { 105 data.submit(); 106 } 107 } 108 ); 109 }); 76 110 }, 77 111 // Callback for the start of each file upload request: 78 112 send: function (e, data) { 113 var that = $(this).data('fileupload'); 79 114 if (!data.isValidated) { 80 var that = $(this).data('fileupload');81 115 if (!data.isAdjusted) { 82 116 that._adjustMaxNumberOfFiles(-data.files.length); … … 91 125 // In lack of an indeterminate progress bar, we set 92 126 // the progress to 100%, showing the full animated bar: 93 data.context.find('.ui-progressbar').progressbar( 94 'value', 95 parseInt(100, 10) 96 ); 97 } 127 data.context 128 .find('.progress').addClass( 129 !$.support.transition && 'progress-animated' 130 ) 131 .find('.bar').css( 132 'width', 133 parseInt(100, 10) + '%' 134 ); 135 } 136 return that._trigger('sent', e, data); 98 137 }, 99 138 // Callback for successful uploads: 100 139 done: function (e, data) { 101 var that = $(this).data('fileupload'); 140 var that = $(this).data('fileupload'), 141 template, 142 preview; 102 143 if (data.context) { 103 144 data.context.each(function (index) { … … 107 148 that._adjustMaxNumberOfFiles(1); 108 149 } 109 $(this).fadeOut(function () { 110 that._renderDownload([file]) 111 .css('display', 'none') 112 .replaceAll(this) 113 .fadeIn(function () { 114 // Fix for IE7 and lower: 115 $(this).show(); 116 }); 117 }); 150 that._transition($(this)).done( 151 function () { 152 var node = $(this); 153 template = that._renderDownload([file]) 154 .css('height', node.height()) 155 .replaceAll(node); 156 that._forceReflow(template); 157 that._transition(template).done( 158 function () { 159 data.context = $(this); 160 that._trigger('completed', e, data); 161 } 162 ); 163 } 164 ); 118 165 }); 119 166 } else { 120 that._renderDownload(data.result) 121 .css('display', 'none') 122 .appendTo($(this).find('.files')) 123 .fadeIn(function () { 124 // Fix for IE7 and lower: 125 $(this).show(); 126 }); 167 template = that._renderDownload(data.result) 168 .appendTo(that.options.filesContainer); 169 that._forceReflow(template); 170 that._transition(template).done( 171 function () { 172 data.context = $(this); 173 that._trigger('completed', e, data); 174 } 175 ); 127 176 } 128 177 }, 129 178 // Callback for failed (abort or error) uploads: 130 179 fail: function (e, data) { 131 var that = $(this).data('fileupload'); 180 var that = $(this).data('fileupload'), 181 template; 132 182 that._adjustMaxNumberOfFiles(data.files.length); 133 183 if (data.context) { 134 184 data.context.each(function (index) { 135 $(this).fadeOut(function () { 136 if (data.errorThrown !== 'abort') { 137 var file = data.files[index]; 138 file.error = file.error || data.errorThrown 139 || true; 140 that._renderDownload([file]) 141 .css('display', 'none') 142 .replaceAll(this) 143 .fadeIn(function () { 144 // Fix for IE7 and lower: 145 $(this).show(); 146 }); 147 } else { 148 data.context.remove(); 149 } 150 }); 185 if (data.errorThrown !== 'abort') { 186 var file = data.files[index]; 187 file.error = file.error || data.errorThrown || 188 true; 189 that._transition($(this)).done( 190 function () { 191 var node = $(this); 192 template = that._renderDownload([file]) 193 .replaceAll(node); 194 that._forceReflow(template); 195 that._transition(template).done( 196 function () { 197 data.context = $(this); 198 that._trigger('failed', e, data); 199 } 200 ); 201 } 202 ); 203 } else { 204 that._transition($(this)).done( 205 function () { 206 $(this).remove(); 207 that._trigger('failed', e, data); 208 } 209 ); 210 } 151 211 }); 152 212 } else if (data.errorThrown !== 'abort') { 153 213 that._adjustMaxNumberOfFiles(-data.files.length); 154 214 data.context = that._renderUpload(data.files) 155 .css('display', 'none') 156 .appendTo($(this).find('.files')) 157 .fadeIn(function () { 158 // Fix for IE7 and lower: 159 $(this).show(); 160 }).data('data', data); 215 .appendTo(that.options.filesContainer) 216 .data('data', data); 217 that._forceReflow(data.context); 218 that._transition(data.context).done( 219 function () { 220 data.context = $(this); 221 that._trigger('failed', e, data); 222 } 223 ); 224 } else { 225 that._trigger('failed', e, data); 161 226 } 162 227 }, … … 164 229 progress: function (e, data) { 165 230 if (data.context) { 166 data.context.find('. ui-progressbar').progressbar(167 ' value',168 parseInt(data.loaded / data.total * 100, 10) 231 data.context.find('.progress .bar').css( 232 'width', 233 parseInt(data.loaded / data.total * 100, 10) + '%' 169 234 ); 170 235 } … … 172 237 // Callback for global upload progress events: 173 238 progressall: function (e, data) { 174 $(this).find('.fileupload- progressbar').progressbar(175 ' value',176 parseInt(data.loaded / data.total * 100, 10) 239 $(this).find('.fileupload-buttonbar .progress .bar').css( 240 'width', 241 parseInt(data.loaded / data.total * 100, 10) + '%' 177 242 ); 178 243 }, 179 244 // Callback for uploads start, equivalent to the global ajaxStart event: 180 start: function () { 181 $(this).find('.fileupload-progressbar') 182 .progressbar('value', 0).fadeIn(); 245 start: function (e) { 246 var that = $(this).data('fileupload'); 247 that._transition($(this).find('.fileupload-buttonbar .progress')).done( 248 function () { 249 that._trigger('started', e); 250 } 251 ); 183 252 }, 184 253 // Callback for uploads stop, equivalent to the global ajaxStop event: 185 stop: function () { 186 $(this).find('.fileupload-progressbar').fadeOut(); 254 stop: function (e) { 255 var that = $(this).data('fileupload'); 256 that._transition($(this).find('.fileupload-buttonbar .progress')).done( 257 function () { 258 $(this).find('.bar').css('width', '0%'); 259 that._trigger('stopped', e); 260 } 261 ); 187 262 }, 188 263 // Callback for file deletion: … … 190 265 var that = $(this).data('fileupload'); 191 266 if (data.url) { 192 $.ajax(data) 193 .success(function () { 194 that._adjustMaxNumberOfFiles(1); 195 $(this).fadeOut(function () { 196 $(this).remove(); 197 }); 198 }); 199 } else { 200 that._adjustMaxNumberOfFiles(1); 201 data.context.fadeOut(function () { 267 $.ajax(data); 268 } 269 that._adjustMaxNumberOfFiles(1); 270 that._transition(data.context).done( 271 function () { 202 272 $(this).remove(); 203 }); 204 } 205 } 206 }, 207 208 // Scales the given image (img HTML element) 209 // using the given options. 210 // Returns a canvas object if the canvas option is true 211 // and the browser supports canvas, else the scaled image: 212 _scaleImage: function (img, options) { 213 options = options || {}; 214 var canvas = document.createElement('canvas'), 215 scale = Math.min( 216 (options.maxWidth || img.width) / img.width, 217 (options.maxHeight || img.height) / img.height 273 that._trigger('destroyed', e, data); 274 } 218 275 ); 219 if (scale >= 1) {220 scale = Math.max(221 (options.minWidth || img.width) / img.width,222 (options.minHeight || img.height) / img.height223 );224 }225 img.width = parseInt(img.width * scale, 10);226 img.height = parseInt(img.height * scale, 10);227 if (!options.canvas || !canvas.getContext) {228 return img;229 }230 canvas.width = img.width;231 canvas.height = img.height;232 canvas.getContext('2d')233 .drawImage(img, 0, 0, img.width, img.height);234 return canvas;235 },236 237 _createObjectURL: function (file) {238 var undef = 'undefined',239 urlAPI = (typeof window.createObjectURL !== undef && window) ||240 (typeof URL !== undef && URL) ||241 (typeof webkitURL !== undef && webkitURL);242 return urlAPI ? urlAPI.createObjectURL(file) : false;243 },244 245 _revokeObjectURL: function (url) {246 var undef = 'undefined',247 urlAPI = (typeof window.revokeObjectURL !== undef && window) ||248 (typeof URL !== undef && URL) ||249 (typeof webkitURL !== undef && webkitURL);250 return urlAPI ? urlAPI.revokeObjectURL(url) : false;251 },252 253 // Loads a given File object via FileReader interface,254 // invokes the callback with a data url:255 _loadFile: function (file, callback) {256 if (typeof FileReader !== 'undefined' &&257 FileReader.prototype.readAsDataURL) {258 var fileReader = new FileReader();259 fileReader.onload = function (e) {260 callback(e.target.result);261 };262 fileReader.readAsDataURL(file);263 return true;264 }265 return false;266 },267 268 // Loads an image for a given File object.269 // Invokes the callback with an img or optional canvas270 // element (if supported by the browser) as parameter:271 _loadImage: function (file, callback, options) {272 var that = this,273 url,274 img;275 if (!options || !options.fileTypes ||276 options.fileTypes.test(file.type)) {277 url = this._createObjectURL(file);278 img = $('<img>').bind('load', function () {279 $(this).unbind('load');280 that._revokeObjectURL(url);281 callback(that._scaleImage(img[0], options));282 });283 if (url) {284 img.prop('src', url);285 } else {286 this._loadFile(file, function (url) {287 img.prop('src', url);288 });289 }290 276 } 291 277 }, … … 296 282 var link = $(this), 297 283 url = link.prop('href'), 298 name = decodeURIComponent(url.split('/').pop()) 299 .replace(/:/g, '-'), 284 name = link.prop('download'), 300 285 type = 'application/octet-stream'; 301 286 link.bind('dragstart', function (e) { … … 320 305 }, 321 306 322 _formatFileSize: function ( file) {323 if (typeof file.size!== 'number') {307 _formatFileSize: function (bytes) { 308 if (typeof bytes !== 'number') { 324 309 return ''; 325 310 } 326 if ( file.size>= 1000000000) {327 return ( file.size/ 1000000000).toFixed(2) + ' GB';328 } 329 if ( file.size>= 1000000) {330 return ( file.size/ 1000000).toFixed(2) + ' MB';331 } 332 return ( file.size/ 1000).toFixed(2) + ' KB';311 if (bytes >= 1000000000) { 312 return (bytes / 1000000000).toFixed(2) + ' GB'; 313 } 314 if (bytes >= 1000000) { 315 return (bytes / 1000000).toFixed(2) + ' MB'; 316 } 317 return (bytes / 1000).toFixed(2) + ' KB'; 333 318 }, 334 319 … … 373 358 }, 374 359 375 _ uploadTemplateHelper: function (file) {376 file.sizef = this._formatFileSize(file);377 return file;378 },379 380 _renderUploadTemplate: function (files) {381 var that = this;382 return $.tmpl(383 this.options.uploadTemplate,384 $.map(files, function (file) {385 return that._uploadTemplateHelper(file);386 })387 );388 }, 389 390 _render Upload: function (files) {360 _renderTemplate: function (func, files) { 361 if (!func) { 362 return $(); 363 } 364 var result = func({ 365 files: files, 366 formatFileSize: this._formatFileSize, 367 options: this.options 368 }); 369 if (result instanceof $) { 370 return result; 371 } 372 return $(this.options.templatesContainer).html(result).children(); 373 }, 374 375 _renderPreview: function (file, node) { 391 376 var that = this, 392 377 options = this.options, 393 tmpl = this._renderUploadTemplate(files), 394 isValidated = this._validate(files); 395 if (!(tmpl instanceof $)) { 396 return $(); 397 } 398 tmpl.css('display', 'none'); 399 // .slice(1).remove().end().first() removes all but the first 400 // element and selects only the first for the jQuery collection: 401 tmpl.find('.progress div').slice( 402 isValidated ? 1 : 0 403 ).remove().end().first() 404 .progressbar(); 405 tmpl.find('.start button').slice( 406 this.options.autoUpload || !isValidated ? 0 : 1 407 ).remove().end().first() 408 .button({ 409 text: false, 410 icons: {primary: 'ui-icon-circle-arrow-e'} 411 }); 412 tmpl.find('.cancel button').slice(1).remove().end().first() 413 .button({ 414 text: false, 415 icons: {primary: 'ui-icon-cancel'} 416 }); 417 tmpl.find('.preview').each(function (index, node) { 418 that._loadImage( 419 files[index], 420 function (img) { 421 $(img).hide().appendTo(node).fadeIn(); 422 }, 423 { 424 maxWidth: options.previewMaxWidth, 425 maxHeight: options.previewMaxHeight, 426 fileTypes: options.previewFileTypes, 427 canvas: options.previewAsCanvas 378 dfd = $.Deferred(); 379 return ((loadImage && loadImage( 380 file, 381 function (img) { 382 node.append(img); 383 that._forceReflow(node); 384 that._transition(node).done(function () { 385 dfd.resolveWith(node); 386 }); 387 if (!$.contains(document.body, node[0])) { 388 // If the element is not part of the DOM, 389 // transition events are not triggered, 390 // so we have to resolve manually: 391 dfd.resolveWith(node); 428 392 } 429 ); 393 }, 394 { 395 maxWidth: options.previewMaxWidth, 396 maxHeight: options.previewMaxHeight, 397 canvas: options.previewAsCanvas 398 } 399 )) || dfd.resolveWith(node)) && dfd; 400 }, 401 402 _renderPreviews: function (files, nodes) { 403 var that = this, 404 options = this.options; 405 nodes.find('.preview span').each(function (index, element) { 406 var file = files[index]; 407 if (options.previewSourceFileTypes.test(file.type) && 408 ($.type(options.previewSourceMaxFileSize) !== 'number' || 409 file.size < options.previewSourceMaxFileSize)) { 410 that._processingQueue = that._processingQueue.pipe(function () { 411 var dfd = $.Deferred(); 412 that._renderPreview(file, $(element)).done( 413 function () { 414 dfd.resolveWith(that); 415 } 416 ); 417 return dfd.promise(); 418 }); 419 } 430 420 }); 431 return tmpl; 432 }, 433 434 _downloadTemplateHelper: function (file) { 435 file.sizef = this._formatFileSize(file); 436 return file; 437 }, 438 439 _renderDownloadTemplate: function (files) { 440 var that = this; 441 return $.tmpl( 421 return this._processingQueue; 422 }, 423 424 _renderUpload: function (files) { 425 return this._renderTemplate( 426 this.options.uploadTemplate, 427 files 428 ); 429 }, 430 431 _renderDownload: function (files) { 432 return this._renderTemplate( 442 433 this.options.downloadTemplate, 443 $.map(files, function (file) { 444 return that._downloadTemplateHelper(file); 445 }) 446 ); 447 }, 448 449 _renderDownload: function (files) { 450 var tmpl = this._renderDownloadTemplate(files); 451 if (!(tmpl instanceof $)) { 452 return $(); 453 } 454 tmpl.css('display', 'none'); 455 tmpl.find('.delete button').button({ 456 text: false, 457 icons: {primary: 'ui-icon-trash'} 458 }); 459 tmpl.find('a').each(this._enableDragToDesktop); 460 return tmpl; 461 }, 462 434 files 435 ).find('a[download]').each(this._enableDragToDesktop).end(); 436 }, 437 463 438 _startHandler: function (e) { 464 439 e.preventDefault(); 465 var tmpl = $(this).closest('.template-upload'),466 data = tmpl.data('data');467 if (data && data.submit && !data.jqXHR) {468 data.jqXHR = data.submit();469 $(this).fadeOut();470 } 471 }, 472 440 var button = $(this), 441 template = button.closest('.template-upload'), 442 data = template.data('data'); 443 if (data && data.submit && !data.jqXHR && data.submit()) { 444 button.prop('disabled', true); 445 } 446 }, 447 473 448 _cancelHandler: function (e) { 474 449 e.preventDefault(); 475 var t mpl= $(this).closest('.template-upload'),476 data = t mpl.data('data') || {};450 var template = $(this).closest('.template-upload'), 451 data = template.data('data') || {}; 477 452 if (!data.jqXHR) { 478 453 data.errorThrown = 'abort'; … … 482 457 } 483 458 }, 484 459 485 460 _deleteHandler: function (e) { 486 461 e.preventDefault(); … … 489 464 context: button.closest('.template-download'), 490 465 url: button.attr('data-url'), 491 type: button.attr('data-type') ,466 type: button.attr('data-type') || 'DELETE', 492 467 dataType: e.data.fileupload.options.dataType 493 468 }); 494 469 }, 495 496 _initEventHandlers: function () { 497 $.blueimp.fileupload.prototype._initEventHandlers.call(this); 498 var filesList = this.element.find('.files'), 499 eventData = {fileupload: this}; 500 filesList.find('.start button') 501 .live( 502 'click.' + this.options.namespace, 503 eventData, 504 this._startHandler 505 ); 506 filesList.find('.cancel button') 507 .live( 508 'click.' + this.options.namespace, 509 eventData, 510 this._cancelHandler 511 ); 512 filesList.find('.delete button') 513 .live( 514 'click.' + this.options.namespace, 515 eventData, 516 this._deleteHandler 517 ); 518 }, 519 520 _destroyEventHandlers: function () { 521 var filesList = this.element.find('.files'); 522 filesList.find('.start button') 523 .die('click.' + this.options.namespace); 524 filesList.find('.cancel button') 525 .die('click.' + this.options.namespace); 526 filesList.find('.delete button') 527 .die('click.' + this.options.namespace); 528 $.blueimp.fileupload.prototype._destroyEventHandlers.call(this); 529 }, 530 531 _initFileUploadButtonBar: function () { 470 471 _forceReflow: function (node) { 472 this._reflow = $.support.transition && 473 node.length && node[0].offsetWidth; 474 }, 475 476 _transition: function (node) { 477 var that = this, 478 dfd = $.Deferred(); 479 if ($.support.transition && node.hasClass('fade')) { 480 node.bind( 481 $.support.transition.end, 482 function (e) { 483 // Make sure we don't respond to other transitions events 484 // in the container element, e.g. from button elements: 485 if (e.target === node[0]) { 486 node.unbind($.support.transition.end); 487 dfd.resolveWith(node); 488 } 489 } 490 ).toggleClass('in'); 491 } else { 492 node.toggleClass('in'); 493 dfd.resolveWith(node); 494 } 495 return dfd; 496 }, 497 498 _initButtonBarEventHandlers: function () { 532 499 var fileUploadButtonBar = this.element.find('.fileupload-buttonbar'), 533 filesList = this. element.find('.files'),500 filesList = this.options.filesContainer, 534 501 ns = this.options.namespace; 535 fileUploadButtonBar536 .addClass('ui-widget-header ui-corner-top');537 this.element.find('.fileinput-button').each(function () {538 var fileInput = $(this).find('input:file').detach();539 $(this).button({icons: {primary: 'ui-icon-plusthick'}})540 .append(fileInput);541 });542 502 fileUploadButtonBar.find('.start') 543 .button({icons: {primary: 'ui-icon-circle-arrow-e'}})544 503 .bind('click.' + ns, function (e) { 545 504 e.preventDefault(); … … 547 506 }); 548 507 fileUploadButtonBar.find('.cancel') 549 .button({icons: {primary: 'ui-icon-cancel'}})550 508 .bind('click.' + ns, function (e) { 551 509 e.preventDefault(); … … 553 511 }); 554 512 fileUploadButtonBar.find('.delete') 555 .button({icons: {primary: 'ui-icon-trash'}})556 513 .bind('click.' + ns, function (e) { 557 514 e.preventDefault(); 558 filesList.find('.delete button').click(); 515 filesList.find('.delete input:checked') 516 .siblings('button').click(); 517 fileUploadButtonBar.find('.toggle') 518 .prop('checked', false); 559 519 }); 560 },561 562 _destroyFileUploadButtonBar: function () {563 this.element.find('.fileupload-buttonbar')564 .removeClass('ui-widget-header ui-corner-top');565 this.element.find('.fileinput-button').each(function () {566 var fileInput = $(this).find('input:file').detach();567 $(this).button('destroy')568 .append(fileInput); 569 });520 fileUploadButtonBar.find('.toggle') 521 .bind('change.' + ns, function (e) { 522 filesList.find('.delete input').prop( 523 'checked', 524 $(this).is(':checked') 525 ); 526 }); 527 }, 528 529 _destroyButtonBarEventHandlers: function () { 570 530 this.element.find('.fileupload-buttonbar button') 571 .unbind('click.' + this.options.namespace) 572 .button('destroy'); 531 .unbind('click.' + this.options.namespace); 532 this.element.find('.fileupload-buttonbar .toggle') 533 .unbind('change.' + this.options.namespace); 534 }, 535 536 _initEventHandlers: function () { 537 parentWidget.prototype._initEventHandlers.call(this); 538 var eventData = {fileupload: this}; 539 this.options.filesContainer 540 .delegate( 541 '.start button', 542 'click.' + this.options.namespace, 543 eventData, 544 this._startHandler 545 ) 546 .delegate( 547 '.cancel button', 548 'click.' + this.options.namespace, 549 eventData, 550 this._cancelHandler 551 ) 552 .delegate( 553 '.delete button', 554 'click.' + this.options.namespace, 555 eventData, 556 this._deleteHandler 557 ); 558 this._initButtonBarEventHandlers(); 559 }, 560 561 _destroyEventHandlers: function () { 562 var options = this.options; 563 this._destroyButtonBarEventHandlers(); 564 options.filesContainer 565 .undelegate('.start button', 'click.' + options.namespace) 566 .undelegate('.cancel button', 'click.' + options.namespace) 567 .undelegate('.delete button', 'click.' + options.namespace); 568 parentWidget.prototype._destroyEventHandlers.call(this); 573 569 }, 574 570 575 571 _enableFileInputButton: function () { 576 this.element.find('.fileinput-button input:file:disabled') 577 .each(function () { 578 var fileInput = $(this), 579 button = fileInput.parent(); 580 fileInput.detach().prop('disabled', false); 581 button.button('enable').append(fileInput); 582 }); 572 this.element.find('.fileinput-button input') 573 .prop('disabled', false) 574 .parent().removeClass('disabled'); 583 575 }, 584 576 585 577 _disableFileInputButton: function () { 586 this.element.find('.fileinput-button input:file:enabled') 587 .each(function () { 588 var fileInput = $(this), 589 button = fileInput.parent(); 590 fileInput.detach().prop('disabled', true); 591 button.button('disable').append(fileInput); 592 }); 578 this.element.find('.fileinput-button input') 579 .prop('disabled', true) 580 .parent().addClass('disabled'); 593 581 }, 594 582 595 583 _initTemplates: function () { 596 // Handle cases where the templates are defined 597 // after the widget library has been included: 598 if (this.options.uploadTemplate instanceof $ && 599 !this.options.uploadTemplate.length) { 600 this.options.uploadTemplate = $( 601 this.options.uploadTemplate.selector 602 ); 603 } 604 if (this.options.downloadTemplate instanceof $ && 605 !this.options.downloadTemplate.length) { 606 this.options.downloadTemplate = $( 607 this.options.downloadTemplate.selector 608 ); 609 } 584 var options = this.options; 585 options.templatesContainer = document.createElement( 586 options.filesContainer.prop('nodeName') 587 ); 588 if (tmpl) { 589 if (options.uploadTemplateId) { 590 options.uploadTemplate = tmpl(options.uploadTemplateId); 591 } 592 if (options.downloadTemplateId) { 593 options.downloadTemplate = tmpl(options.downloadTemplateId); 594 } 595 } 596 }, 597 598 _initFilesContainer: function () { 599 var options = this.options; 600 if (options.filesContainer === undefined) { 601 options.filesContainer = this.element.find('.files'); 602 } else if (!(options.filesContainer instanceof $)) { 603 options.filesContainer = $(options.filesContainer); 604 } 605 }, 606 607 _initSpecialOptions: function () { 608 parentWidget.prototype._initSpecialOptions.call(this); 609 this._initFilesContainer(); 610 this._initTemplates(); 610 611 }, 611 612 612 613 _create: function () { 613 $.blueimp.fileupload.prototype._create.call(this); 614 this._initTemplates(); 615 this.element 616 .addClass('ui-widget'); 617 this._initFileUploadButtonBar(); 618 this.element.find('.fileupload-content') 619 .addClass('ui-widget-content ui-corner-bottom'); 620 this.element.find('.fileupload-progressbar') 621 .hide().progressbar(); 622 }, 623 624 destroy: function () { 625 this.element.find('.fileupload-progressbar') 626 .progressbar('destroy'); 627 this.element.find('.fileupload-content') 628 .removeClass('ui-widget-content ui-corner-bottom'); 629 this._destroyFileUploadButtonBar(); 630 this.element.removeClass('ui-widget'); 631 $.blueimp.fileupload.prototype.destroy.call(this); 632 }, 633 614 parentWidget.prototype._create.call(this); 615 this._refreshOptionsList.push( 616 'filesContainer', 617 'uploadTemplateId', 618 'downloadTemplateId' 619 ); 620 if (!$.blueimpFP) { 621 this._processingQueue = $.Deferred().resolveWith(this).promise(); 622 this.process = function () { 623 return this._processingQueue; 624 }; 625 } 626 }, 627 634 628 enable: function () { 635 $.blueimp.fileupload.prototype.enable.call(this); 636 this.element.find(':ui-button').not('.fileinput-button') 637 .button('enable'); 629 parentWidget.prototype.enable.call(this); 630 this.element.find('input, button').prop('disabled', false); 638 631 this._enableFileInputButton(); 639 632 }, 640 633 641 634 disable: function () { 642 this.element.find(':ui-button').not('.fileinput-button') 643 .button('disable'); 635 this.element.find('input, button').prop('disabled', true); 644 636 this._disableFileInputButton(); 645 $.blueimp.fileupload.prototype.disable.call(this);637 parentWidget.prototype.disable.call(this); 646 638 } 647 639 648 640 }); 649 641 650 } (jQuery));642 }));
Note: See TracChangeset
for help on using the changeset viewer.