From f486ff64412ec59c4f03e7cb64dc6d41018c3928 Mon Sep 17 00:00:00 2001 From: sebastiaan Date: Tue, 4 Sep 2012 07:44:23 -0200 Subject: [PATCH] Improving fileUploader.js with jsLint suggestions --- .../FileUploader/js/jquery.fileUploader.js | 264 ++++++++---------- 1 file changed, 114 insertions(+), 150 deletions(-) diff --git a/src/Umbraco.Web.UI/umbraco_client/FileUploader/js/jquery.fileUploader.js b/src/Umbraco.Web.UI/umbraco_client/FileUploader/js/jquery.fileUploader.js index 14e78ab17c..936d36231c 100644 --- a/src/Umbraco.Web.UI/umbraco_client/FileUploader/js/jquery.fileUploader.js +++ b/src/Umbraco.Web.UI/umbraco_client/FileUploader/js/jquery.fileUploader.js @@ -5,7 +5,7 @@ * Version: 1.0 */ -; (function ($, window, document, undefined) { +(function ($, window, document, undefined) { $.event.props.push('dataTransfer'); @@ -28,15 +28,14 @@ var isHtml5 = (window.FormData) ? true : false; - function FileUploader(el, options) - { + function FileUploader(el, options) { var self = this; var $el = $(el); - + // Setup instance self.input = el; self.form = $el.parents("form"); - self.uploaderId = ++$.fileUploader.count; + self.uploaderId = $.fileUploader.count + 1; self.opts = $.extend({}, defaultOptions, options); @@ -45,15 +44,14 @@ // Return configures component return self; - }; + } FileUploader.prototype = { - + // Private methods - _init: function () - { + _init: function () { var self = this; - + // Init vars self.wrapperId = 'fu-fileUploader-' + self.uploaderId; self.wrapper = ' \ @@ -79,25 +77,22 @@ $(":file", self.form).each(function () { $(this).val(''); }); - + // Hide the form (we'll just use it as a template) self.form.hide(); // Create the actual form users will interact with self._createNewForm(); - + // Hookup drag and drop support - $(self.opts.dropTarget !== null ? self.opts.dropTarget : self.wrapperSelector) - .bind('dragenter dragover', false) - .bind('drop', function (e) { + $(self.opts.dropTarget !== null ? self.opts.dropTarget : self.wrapperSelector).bind('dragenter dragover', false).bind('drop', function (e) { e.stopPropagation(); e.preventDefault(); self._addFileHtml5(e.dataTransfer); }); }, - - _getFileName: function (filePath) - { + + _getFileName: function (filePath) { var fileName = filePath; if (fileName.indexOf('/') > -1) { fileName = fileName.substring(fileName.lastIndexOf('/') + 1); @@ -106,9 +101,8 @@ } return fileName; }, - - _validateFileName: function (fileName) - { + + _validateFileName: function (fileName) { var self = this; var extensions = new RegExp(self.opts.allowedExtension + '$', 'i'); if (extensions.test(fileName)) { @@ -117,9 +111,8 @@ return -1; } }, - - _getFileSize: function (file) - { + + _getFileSize: function (file) { var fileSize = 0; if (file.size > 1024 * 1024) { fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB'; @@ -128,12 +121,11 @@ } return fileSize; }, - - _createNewForm: function () - { + + _createNewForm: function () { var self = this; - var id = ++self.itemCount; - + var id = self.itemCount + 1; + var itemId = 'fu-item-' + self.uploaderId + '-' + id; var iframeId = 'fu-frame-' + self.uploaderId + '-' + id; var formId = 'fu-form-' + self.uploaderId + '-' + id; @@ -155,14 +147,14 @@ }).prependTo(item).show(); // Remove any id's / css classes from file inputs - $(":file", newForm).each(function(idx, itm) { + $(":file", newForm).each(function (idx, itm) { $(itm).removeAttr("id").removeAttr("class"); }); // Hide everything in the form, other than file inputs newForm.children().each(function () { var isFile = $(this).is(':file'); - if (!isFile && $(this).find(':file').length == 0) { + if (!isFile && $(this).find(':file').length === 0) { $(this).hide(); } }); @@ -179,18 +171,16 @@ } }); }, - - _addFileHtml5: function (input) - { + + _addFileHtml5: function (input) { var self = this; $.each(input.files, function (index, file) { self._addFile(file); }); self._afterAddFile(); }, - - _addFile: function(input) - { + + _addFile: function (input) { var self = this; var id = self.itemCount; var $item = $('#fu-item-' + self.uploaderId + '-' + id); @@ -247,29 +237,26 @@ self._afterAddFile(); } }, - - _afterAddFile: function () - { + + _afterAddFile: function () { var self = this; - if (self.opts.autoUpload) - { + if (self.opts.autoUpload) { self._processNextItemInQueue(true); } }, - - _processNextItemInQueue: function(autoProceed) - { + + _processNextItemInQueue: function (autoProceed) { var self = this; var totalItems = $(self.itemContainerSelector + " .fu-item"); - if (totalItems.length > 0) - { + if (totalItems.length > 0) { var $pendingUpload = $(totalItems.get(0)); var data = $pendingUpload.data('data'); //before upload var response = self.opts.onUpload(data); - if (response === false) + if (response === false) { return false; //TODO: Raise onDone event? + } self.inProgressItemId = data.itemId; @@ -285,18 +272,16 @@ } } }, - - _uploadHtml5: function($item, autoProceed) - { + + _uploadHtml5: function ($item, autoProceed) { var self = this; var $form = $item.find("form"); var data = $item.data('data'); var file = data.input; - if (file) - { + if (file) { var fd = new FormData(); fd.append($(":file", $form).first().attr('name'), file); - + //get other form input and append to formData $form.find(':input').each(function () { if (!$(this).is(':file')) { @@ -312,7 +297,7 @@ contentType: false, processData: false, type: 'POST', - xhr: function() { + xhr: function () { var req = $.ajaxSettings.xhr(); if (req) { req.upload.addEventListener('progress', function (ev) { @@ -322,28 +307,21 @@ } return req; } - }) - .success(function (d) - { + }).success(function (d) { data.status = 'success'; self.opts.onDone(data); - }) - .error(function (jqXhr, textStatus, errorThrown) - { + }).error(function (jqXhr, textStatus, errorThrown) { data.status = 'error'; data.message = errorThrown; self.opts.onDone(data); - }) - .complete(function (jqXhr, textStatus) - { + }).complete(function (jqXhr, textStatus) { self._afterUpload($item, autoProceed); }); } }, - - _uploadIFrame: function ($item, autoProceed) - { + + _uploadIFrame: function ($item, autoProceed) { var self = this; var $form = $item.find("form"); var $iframe = $item.find("iframe"); @@ -353,10 +331,9 @@ $form.submit(); - $iframe.load(function () - { + $iframe.load(function () { self._stopDummyProgress(data, true); - + // Read content returned var rawResponse; @@ -368,7 +345,7 @@ var response = $.parseJSON(rawResponse); - if(response.success) { + if (response.success) { data.status = 'success'; } else { data.status = 'error'; @@ -380,13 +357,13 @@ self._afterUpload($item, autoProceed); }); }, - - _startDummyProgress: function (data, count) - { + + _startDummyProgress: function (data, count) { var self = this; - - if (count === undefined) + + if (count === undefined) { count = 0; + } if ($.fileUploader.percentageInterval[count]) { data.progress = $.fileUploader.percentageInterval[count] + Math.floor(Math.random() * 5 + 1); @@ -395,69 +372,63 @@ if ($.fileUploader.timeInterval[count]) { self.progressTimeout = setTimeout(function () { - self._startDummyProgress(data, ++count); + self._startDummyProgress(data, count + 1); }, $.fileUploader.timeInterval[count] * 1000); } }, - - _stopDummyProgress: function (data, success) - { + + _stopDummyProgress: function (data, success) { var self = this; - + clearTimeout(self.progressTimeout); - - if (success) - { + + if (success) { // Force a 100% onProgress event data.progress = 100; self.opts.onProgress(data); } }, - - _afterUpload: function ($item, autoProceed) - { + + _afterUpload: function ($item, autoProceed) { var self = this; var data = $item.data('data'); - - if (data.itemId == self.inProgressItemId) - { + + if (data.itemId == self.inProgressItemId) { self.inProgressItemId = 0; self.inProgressJqXhr = null; } $item.remove(); - - if ($(self.itemContainerSelector + " .fu-item").length > 0) - { - if (autoProceed) + + if ($(self.itemContainerSelector + " .fu-item").length > 0) { + if (autoProceed) { self._processNextItemInQueue(autoProceed); + } } - else - { + else { self.opts.onDoneAll(); } }, - + // Public methods - uploadAll: function () - { + uploadAll: function () { var self = this; var result = self.opts.onUploadAll(self); - if (result === false) + if (result === false) { return false; + } self._processNextItemInQueue(true); }, - - cancelAll: function () - { + + cancelAll: function () { var self = this; - + // Remove current form $(self.formContainerSelector).empty(); var queuedItems = $(self.itemContainerSelector + " .fu-item"); - for (var i = 0; i < queuedItems.length; i++) { + for (var i = 0; i < queuedItems.length; i + 1) { var data = $(queuedItems.get(i)).data('data'); self.cancelItem(data.itemId); } @@ -467,21 +438,18 @@ // Recreate the form self._createNewForm(); }, - - cancelItem: function(itemId) - { + + cancelItem: function (itemId) { var self = this; var $item = $("#fu-item-" + self.uploaderId + "-" + itemId); var data = $item.data('data'); // If the item to cancel is in progress, abort the upload - if (self.inProgressItemId == itemId && self.inProgressJqXhr) - { + if (self.inProgressItemId == itemId && self.inProgressJqXhr) { //NB: The abort event handler will cleanup the aborted item from the queue self.inProgressJqXhr.abort(); } - else - { + else { // Update the status data.status = 'canceled'; @@ -492,46 +460,42 @@ } }; - $.fileUploader = { - version: '1.0', - count: 0, - timeInterval: [1, 2, 4, 2, 1, 5, 5, 5, 5], + $.fileUploader = { + version: '1.0', + count: 0, + timeInterval: [1, 2, 4, 2, 1, 5, 5, 5, 5], percentageInterval: [10, 20, 30, 40, 60, 80, 85, 90, 95] - }; + }; - $.fn.fileUploader = function (o) - { - var args = arguments; - if (typeof o === 'string') - { - var api = this.fileUploaderApi(); - if (api[o]) - return api[o].apply(api, Array.prototype.slice.call(args, 1)); - else - $.error('Method ' + o + ' does not exist on jQuery.fileUploader'); - } - else if (typeof o === 'object' || !o) - { - return this.each(function () { - var fileUploader = new FileUploader(this, o); - $(this).data("fileuploader_api", fileUploader); - }); - } - }; - - $.fn.fileUploaderApi = function () - { - //ensure there's only 1 - if (this.length != 1) { - throw "Requesting the API can only match one element"; - } + $.fn.fileUploader = function (o) { + var args = arguments; + if (typeof o === 'string') { + var api = this.fileUploaderApi(); + if (api[o]) { + return api[o].apply(api, Array.prototype.slice.call(args, 1)); + } else { + $.error('Method ' + o + ' does not exist on jQuery.fileUploader'); + } + } else if (typeof o === 'object' || !o) { + return this.each(function () { + var fileUploader = new FileUploader(this, o); + $(this).data("fileuploader_api", fileUploader); + }); + } + }; - //ensure thsi is a collapse panel - if (this.data("fileuploader_api") == null) { - throw "The matching element had not been bound to a fileUploader"; - } + $.fn.fileUploaderApi = function () { + //ensure there's only 1 + if (this.length != 1) { + throw "Requesting the API can only match one element"; + } + + //ensure thsi is a collapse panel + if (this.data("fileuploader_api") === null) { + throw "The matching element had not been bound to a fileUploader"; + } + + return this.data("fileuploader_api"); + }; - return this.data("fileuploader_api"); - }; - })(jQuery, window, document); \ No newline at end of file