fine_uploader 3.1.1 → 3.4.1

data/vendor/assets/javascripts/fine_uploader/handler.form.js

@@ -1,161 +1,143 @@
-/**
- * Class for uploading files using form and iframe
- * @inherits qq.UploadHandlerAbstract
- */
-qq.UploadHandlerForm = function(o){
-    qq.UploadHandlerAbstract.apply(this, arguments);
-
-    this._inputs = {};
-    this._detach_load_events = {};
-};
-// @inherits qq.UploadHandlerAbstract
-qq.extend(qq.UploadHandlerForm.prototype, qq.UploadHandlerAbstract.prototype);
+/*globals qq, document, setTimeout*/
+/*globals clearTimeout*/
+qq.UploadHandlerForm = function(o, uploadCompleteCallback, logCallback) {
+    "use strict";
 
-qq.extend(qq.UploadHandlerForm.prototype, {
-    add: function(fileInput){
-        fileInput.setAttribute('name', this._options.inputName);
-        var id = qq.getUniqueId();
+    var options = o,
+        inputs = [],
+        uuids = [],
+        detachLoadEvents = {},
+        postMessageCallbackTimers = {},
+        uploadComplete = uploadCompleteCallback,
+        log = logCallback,
+        corsMessageReceiver = new qq.WindowReceiveMessage({log: log}),
+        onloadCallbacks = {},
+        api;
 
-        this._inputs[id] = fileInput;
 
-        // remove file input from DOM
-        if (fileInput.parentNode){
-            qq(fileInput).remove();
+    function detachLoadEvent(id) {
+        if (detachLoadEvents[id] !== undefined) {
+            detachLoadEvents[id]();
+            delete detachLoadEvents[id];
         }
+    }
 
-        return id;
-    },
-    getName: function(id){
-        // get input value and remove path to normalize
-        return this._inputs[id].value.replace(/.*(\/|\\)/, "");
-    },
-    isValid: function(id) {
-        return this._inputs[id] !== undefined;
-    },
-    reset: function() {
-        qq.UploadHandlerAbstract.prototype.reset.apply(this, arguments);
-        this._inputs = {};
-        this._detach_load_events = {};
-    },
-    _cancel: function(id){
-        this._options.onCancel(id, this.getName(id));
-
-        delete this._inputs[id];
-        delete this._detach_load_events[id];
-
-        var iframe = document.getElementById(id);
-        if (iframe){
-            // to cancel request set src to something else
-            // we use src="javascript:false;" because it doesn't
-            // trigger ie6 prompt on https
-            iframe.setAttribute('src', 'javascript:false;');
-
-            qq(iframe).remove();
-        }
-    },
-    _upload: function(id){
-        this._options.onUpload(id, this.getName(id), false);
-        var input = this._inputs[id];
+    function registerPostMessageCallback(iframe, callback) {
+        var id = iframe.id;
 
-        if (!input){
-            throw new Error('file with passed id was not added, or already uploaded or cancelled');
-        }
+        onloadCallbacks[uuids[id]] = callback;
 
-        var fileName = this.getName(id);
+        detachLoadEvents[id] = qq(iframe).attach('load', function() {
+            if (inputs[id]) {
+                log("Received iframe load event for CORS upload request (file id " + id + ")");
 
-        var iframe = this._createIframe(id);
-        var form = this._createForm(iframe, this._options.paramsStore.getParams(id));
-        form.appendChild(input);
+                postMessageCallbackTimers[id] = setTimeout(function() {
+                    var errorMessage = "No valid message received from loaded iframe for file id " + id;
+                    log(errorMessage, "error");
+                    callback({
+                        error: errorMessage
+                    });
+                }, 1000);
+            }
+        });
 
-        var self = this;
-        this._attachLoadEvent(iframe, function(){
-            self.log('iframe loaded');
+        corsMessageReceiver.receiveMessage(id, function(message) {
+            log("Received the following window message: '" + message + "'");
+            var response = qq.parseJson(message),
+                uuid = response.uuid,
+                onloadCallback;
 
-            var response = self._getIframeContentJSON(iframe);
+            if (uuid && onloadCallbacks[uuid]) {
+                clearTimeout(postMessageCallbackTimers[id]);
+                delete postMessageCallbackTimers[id];
 
-            // timeout added to fix busy state in FF3.6
-            setTimeout(function(){
-                self._detach_load_events[id]();
-                delete self._detach_load_events[id];
-                qq(iframe).remove();
-            }, 1);
+                detachLoadEvent(id);
 
-            if (!response.success) {
-                if (self._options.onAutoRetry(id, fileName, response)) {
-                    return;
-                }
+                onloadCallback = onloadCallbacks[uuid];
+
+                delete onloadCallbacks[uuid];
+                corsMessageReceiver.stopReceivingMessages(id);
+                onloadCallback(response);
+            }
+            else if (!uuid) {
+                log("'" + message + "' does not contain a UUID - ignoring.");
             }
-            self._options.onComplete(id, fileName, response);
-            self._dequeue(id);
         });
+    }
 
-        this.log('Sending upload request for ' + id);
-        form.submit();
-        qq(form).remove();
-
-        return id;
-    },
-    _attachLoadEvent: function(iframe, callback){
-        var self = this;
-        this._detach_load_events[iframe.id] = qq(iframe).attach('load', function(){
-            self.log('Received response for ' + iframe.id);
-
-            // when we remove iframe from dom
-            // the request stops, but in IE load
-            // event fires
-            if (!iframe.parentNode){
-                return;
-            }
+    function attachLoadEvent(iframe, callback) {
+        /*jslint eqeq: true*/
 
-            try {
-                // fixing Opera 10.53
-                if (iframe.contentDocument &&
-                    iframe.contentDocument.body &&
-                    iframe.contentDocument.body.innerHTML == "false"){
-                    // In Opera event is fired second time
-                    // when body.innerHTML changed from false
-                    // to server response approx. after 1 sec
-                    // when we upload file with iframe
+        if (options.cors.expected) {
+            registerPostMessageCallback(iframe, callback);
+        }
+        else {
+            detachLoadEvents[iframe.id] = qq(iframe).attach('load', function(){
+                log('Received response for ' + iframe.id);
+
+                // when we remove iframe from dom
+                // the request stops, but in IE load
+                // event fires
+                if (!iframe.parentNode){
                     return;
                 }
-            }
-            catch (error) {
-                //IE may throw an "access is denied" error when attempting to access contentDocument on the iframe in some cases
-                self.log('Error when attempting to access iframe during handling of upload response (' + error + ")", 'error');
-            }
 
-            callback();
-        });
-    },
+                try {
+                    // fixing Opera 10.53
+                    if (iframe.contentDocument &&
+                        iframe.contentDocument.body &&
+                        iframe.contentDocument.body.innerHTML == "false"){
+                        // In Opera event is fired second time
+                        // when body.innerHTML changed from false
+                        // to server response approx. after 1 sec
+                        // when we upload file with iframe
+                        return;
+                    }
+                }
+                catch (error) {
+                    //IE may throw an "access is denied" error when attempting to access contentDocument on the iframe in some cases
+                    log('Error when attempting to access iframe during handling of upload response (' + error + ")", 'error');
+                }
+
+                callback();
+            });
+        }
+    }
+
     /**
      * Returns json object received by iframe from server.
      */
-    _getIframeContentJSON: function(iframe){
+    function getIframeContentJson(iframe) {
+        /*jshint evil: true*/
+
+        var response;
+
         //IE may throw an "access is denied" error when attempting to access contentDocument on the iframe in some cases
         try {
             // iframe.contentWindow.document - for IE<7
-            var doc = iframe.contentDocument ? iframe.contentDocument: iframe.contentWindow.document,
-                response;
+            var doc = iframe.contentDocument || iframe.contentWindow.document,
+                innerHTML = doc.body.innerHTML;
 
-            var innerHTML = doc.body.innerHTML;
-            this.log("converting iframe's innerHTML to JSON");
-            this.log("innerHTML = " + innerHTML);
+            log("converting iframe's innerHTML to JSON");
+            log("innerHTML = " + innerHTML);
             //plain text response may be wrapped in <pre> tag
             if (innerHTML && innerHTML.match(/^<pre/i)) {
                 innerHTML = doc.body.firstChild.firstChild.nodeValue;
             }
-            response = eval("(" + innerHTML + ")");
+
+            response = qq.parseJson(innerHTML);
         } catch(error){
-            this.log('Error when attempting to parse form upload response (' + error + ")", 'error');
+            log('Error when attempting to parse form upload response (' + error + ")", 'error');
             response = {success: false};
         }
 
         return response;
-    },
+    }
+
     /**
      * Creates iframe with unique name
      */
-    _createIframe: function(id){
+    function createIframe(id){
         // We can't use following code as the name attribute
         // won't be properly registered in IE6, and new window
         // on form submit will open
@@ -163,7 +145,6 @@ qq.extend(qq.UploadHandlerForm.prototype, {
         // iframe.setAttribute('name', id);
 
         var iframe = qq.toElement('<iframe src="javascript:false;" name="' + id + '" />');
-        // src="javascript:false;" removes ie6 prompt on https
 
         iframe.setAttribute('id', id);
 
@@ -171,22 +152,22 @@ qq.extend(qq.UploadHandlerForm.prototype, {
         document.body.appendChild(iframe);
 
         return iframe;
-    },
+    }
+
     /**
      * Creates form, that will be submitted to iframe
      */
-    _createForm: function(iframe, params){
-        // We can't use the following code in IE6
-        // var form = document.createElement('form');
-        // form.setAttribute('method', 'post');
-        // form.setAttribute('enctype', 'multipart/form-data');
-        // Because in this case file won't be attached to request
-        var protocol = this._options.demoMode ? "GET" : "POST",
+    function createForm(id, iframe){
+        var params = options.paramsStore.getParams(id),
+            protocol = options.demoMode ? "GET" : "POST",
             form = qq.toElement('<form method="' + protocol + '" enctype="multipart/form-data"></form>'),
-            url = this._options.endpoint;
+            endpoint = options.endpointStore.getEndpoint(id),
+            url = endpoint;
+
+        params[options.uuidParamName] = uuids[id];
 
-        if (!this._options.paramsInBody) {
-            url = qq.obj2url(params, this._options.endpoint);
+        if (!options.paramsInBody) {
+            url = qq.obj2url(params, endpoint);
         }
         else {
             qq.obj2Inputs(params, form);
@@ -199,4 +180,110 @@ qq.extend(qq.UploadHandlerForm.prototype, {
 
         return form;
     }
-});
+
+
+    api = {
+        add: function(fileInput) {
+            fileInput.setAttribute('name', options.inputName);
+
+            var id = inputs.push(fileInput) - 1;
+            uuids[id] = qq.getUniqueId();
+
+            // remove file input from DOM
+            if (fileInput.parentNode){
+                qq(fileInput).remove();
+            }
+
+            return id;
+        },
+        getName: function(id) {
+            /*jslint regexp: true*/
+
+            if (api.isValid(id)) {
+                // get input value and remove path to normalize
+                return inputs[id].value.replace(/.*(\/|\\)/, "");
+            }
+            else {
+                log(id + " is not a valid item ID.", "error");
+            }
+        },
+        isValid: function(id) {
+            return inputs[id] !== undefined;
+        },
+        reset: function() {
+            inputs = [];
+            uuids = [];
+            detachLoadEvents = {};
+        },
+        getUuid: function(id) {
+            return uuids[id];
+        },
+        cancel: function(id) {
+            options.onCancel(id, this.getName(id));
+
+            delete inputs[id];
+            delete uuids[id];
+            delete detachLoadEvents[id];
+
+            if (options.cors.expected) {
+                clearTimeout(postMessageCallbackTimers[id]);
+                delete postMessageCallbackTimers[id];
+                corsMessageReceiver.stopReceivingMessages(id);
+            }
+
+            var iframe = document.getElementById(id);
+            if (iframe) {
+                // to cancel request set src to something else
+                // we use src="javascript:false;" because it doesn't
+                // trigger ie6 prompt on https
+                iframe.setAttribute('src', 'java' + String.fromCharCode(115) + 'cript:false;'); //deal with "JSLint: javascript URL" warning, which apparently cannot be turned off
+
+                qq(iframe).remove();
+            }
+        },
+        upload: function(id){
+            var input = inputs[id],
+                fileName = api.getName(id),
+                iframe = createIframe(id),
+                form;
+
+            if (!input){
+                throw new Error('file with passed id was not added, or already uploaded or cancelled');
+            }
+
+            options.onUpload(id, this.getName(id));
+
+            form = createForm(id, iframe);
+            form.appendChild(input);
+
+            attachLoadEvent(iframe, function(responseFromMessage){
+                log('iframe loaded');
+
+                var response = responseFromMessage ? responseFromMessage : getIframeContentJson(iframe);
+
+                detachLoadEvent(id);
+
+                //we can't remove an iframe if the iframe doesn't belong to the same domain
+                if (!options.cors.expected) {
+                    qq(iframe).remove();
+                }
+
+                if (!response.success) {
+                    if (options.onAutoRetry(id, fileName, response)) {
+                        return;
+                    }
+                }
+                options.onComplete(id, fileName, response);
+                uploadComplete(id);
+            });
+
+            log('Sending upload request for ' + id);
+            form.submit();
+            qq(form).remove();
+
+            return id;
+        }
+    };
+
+    return api;
+};