update dropzone.js

source/inbox/index.html.slim

@@ -1,4 +1,3 @@
-== javascript_include_tag "jquery-1.9.1.min.js"
 == javascript_include_tag "dropzone.js"
 
 h1 Inbox

source/javascripts/dropzone.js

@@ -70,6 +70,7 @@ require.aliases = {};
  */
 
 require.resolve = function(path) {
+  if (path.charAt(0) === '/') path = path.slice(1);
   var index = path + '/index.js';
 
   var paths = [
@@ -182,17 +183,18 @@ require.relative = function(parent) {
    */
 
   localRequire.resolve = function(path) {
+    var c = path.charAt(0);
+    if ('/' == c) return path.slice(1);
+    if ('.' == c) return require.normalize(p, path);
+
     // resolve deps by returning
     // the dep in the nearest "deps"
     // directory
-    if ('.' != path.charAt(0)) {
+    var segs = parent.split('/');
-      var segs = parent.split('/');
+    var i = lastIndexOf(segs, 'deps') + 1;
-      var i = lastIndexOf(segs, 'deps') + 1;
+    if (!i) i = 0;
-      if (!i) i = 0;
+    path = segs.slice(0, i + 1).join('/') + '/deps/' + path;
-      path = segs.slice(0, i + 1).join('/') + '/deps/' + path;
+    return path;
-      return path;
-    }
-    return require.normalize(p, path);
   };
 
   /**
@@ -396,21 +398,19 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
 
 (function() {
-  var Dropzone, Em, camelize, o, without,
+  var Dropzone, Em, camelize, contentLoaded, createElement, noop, without,
     __hasProp = {}.hasOwnProperty,
     __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
     __slice = [].slice;
 
-  o = typeof jQuery !== "undefined" && jQuery !== null ? jQuery : require("jquery");
-
   Em = typeof Emitter !== "undefined" && Emitter !== null ? Emitter : require("emitter");
 
+  noop = function() {};
+
   Dropzone = (function(_super) {
 
     __extends(Dropzone, _super);
 
-    Dropzone.prototype.version = "1.3.5";
-
     /*
       This is a list of all available events you can register on a dropzone object.
     
@@ -420,9 +420,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
     */
 
 
-    Dropzone.prototype.events = ["drop", "dragstart", "dragend", "dragenter", "dragover", "dragleave", "selectedfiles", "addedfile", "thumbnail", "error", "processingfile", "uploadprogress", "sending", "success", "complete"];
+    Dropzone.prototype.events = ["drop", "dragstart", "dragend", "dragenter", "dragover", "dragleave", "selectedfiles", "addedfile", "removedfile", "thumbnail", "error", "processingfile", "uploadprogress", "sending", "success", "complete", "reset"];
-
-    Dropzone.prototype.blacklistedBrowsers = [/opera.*Macintosh.*version\/12/i];
 
     Dropzone.prototype.defaultOptions = {
       url: null,
@@ -433,86 +431,123 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       maxThumbnailFilesize: 2,
       thumbnailWidth: 100,
       thumbnailHeight: 100,
+      params: {},
       clickable: true,
+      enqueueForUpload: true,
+      previewsContainer: null,
+      dictDefaultMessage: "Drop files here to upload",
+      dictFallbackMessage: "Your browser does not support drag'n'drop file uploads.",
+      dictFallbackText: "Please use the fallback form below to upload your files like in the olden days.",
       accept: function(file, done) {
         return done();
       },
+      init: function() {
+        return noop;
+      },
       fallback: function() {
-        this.element.addClass("browser-not-supported");
+        var child, messageElement, span, _i, _len, _ref;
-        this.element.find(".message").removeClass("default");
+        this.element.className = "" + this.element.className + " browser-not-supported";
-        this.element.find(".message span").html("Your browser does not support drag'n'drop file uploads.");
+        _ref = this.element.getElementsByTagName("div");
-        this.element.append("Please use the fallback form below to upload your files like in the olden days.</p>");
+        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-        return this.element.append(this.getFallbackForm());
+          child = _ref[_i];
+          if (/(^| )message($| )/.test(child.className)) {
+            messageElement = child;
+            child.className = "message";
+            continue;
+          }
+        }
+        if (!messageElement) {
+          messageElement = createElement("<div class=\"message\"><span></span></div>");
+          this.element.appendChild(messageElement);
+        }
+        span = messageElement.getElementsByTagName("span")[0];
+        if (span) {
+          span.textContent = this.options.dictFallbackMessage;
+        }
+        return this.element.appendChild(this.getFallbackForm());
       },
       /*
-          Those functions register themselves to the events on init.
+          Those functions register themselves to the events on init and handle all
-          You can overwrite them if you don't like the default behavior. If you just want to add an additional
+          the user interface specific stuff. Overwriting them won't break the upload
-          event handler, register it on the dropzone object and don't overwrite those options.
+          but can break the way it's displayed.
+          You can overwrite them if you don't like the default behavior. If you just
+          want to add an additional event handler, register it on the dropzone object
+          and don't overwrite those options.
       */
 
       drop: function(e) {
-        return this.element.removeClass("drag-hover");
+        return this.element.classList.remove("drag-hover");
       },
-      dragstart: o.noop,
+      dragstart: noop,
       dragend: function(e) {
-        return this.element.removeClass("drag-hover");
+        return this.element.classList.remove("drag-hover");
       },
       dragenter: function(e) {
-        return this.element.addClass("drag-hover");
+        return this.element.classList.add("drag-hover");
       },
       dragover: function(e) {
-        return this.element.addClass("drag-hover");
+        return this.element.classList.add("drag-hover");
       },
       dragleave: function(e) {
-        return this.element.removeClass("drag-hover");
+        return this.element.classList.remove("drag-hover");
       },
       selectedfiles: function(files) {
-        return this.element.addClass("started");
+        if (this.element === this.previewsContainer) {
+          return this.element.classList.add("started");
+        }
+      },
+      reset: function() {
+        return this.element.classList.remove("started");
       },
       addedfile: function(file) {
-        file.previewTemplate = o(this.options.previewTemplate);
+        file.previewTemplate = createElement(this.options.previewTemplate);
-        this.element.append(file.previewTemplate);
+        this.previewsContainer.appendChild(file.previewTemplate);
-        file.previewTemplate.find(".filename span").text(file.name);
+        file.previewTemplate.querySelector(".filename span").textContent = file.name;
-        return file.previewTemplate.find(".details").append(o("<div class=\"size\">" + (this.filesize(file.size)) + "</div>"));
+        return file.previewTemplate.querySelector(".details").appendChild(createElement("<div class=\"size\">" + (this.filesize(file.size)) + "</div>"));
+      },
+      removedfile: function(file) {
+        return file.previewTemplate.parentNode.removeChild(file.previewTemplate);
       },
       thumbnail: function(file, dataUrl) {
-        file.previewTemplate.removeClass("file-preview").addClass("image-preview");
+        file.previewTemplate.classList.remove("file-preview");
-        return file.previewTemplate.find(".details").append(o("<img alt=\"" + file.name + "\" src=\"" + dataUrl + "\"/>"));
+        file.previewTemplate.classList.add("image-preview");
+        return file.previewTemplate.querySelector(".details").appendChild(createElement("<img alt=\"" + file.name + "\" src=\"" + dataUrl + "\"/>"));
       },
       error: function(file, message) {
-        file.previewTemplate.addClass("error");
+        file.previewTemplate.classList.add("error");
-        return file.previewTemplate.find(".error-message span").text(message);
+        return file.previewTemplate.querySelector(".error-message span").textContent = message;
       },
       processingfile: function(file) {
-        return file.previewTemplate.addClass("processing");
+        return file.previewTemplate.classList.add("processing");
       },
       uploadprogress: function(file, progress) {
-        return file.previewTemplate.find(".progress .upload").css({
+        return file.previewTemplate.querySelector(".progress .upload").style.width = "" + progress + "%";
-          width: "" + progress + "%"
-        });
       },
-      sending: o.noop,
+      sending: noop,
       success: function(file) {
-        return file.previewTemplate.addClass("success");
+        return file.previewTemplate.classList.add("success");
       },
-      complete: o.noop,
+      complete: noop,
       previewTemplate: "<div class=\"preview file-preview\">\n  <div class=\"details\">\n   <div class=\"filename\"><span></span></div>\n  </div>\n  <div class=\"progress\"><span class=\"upload\"></span></div>\n  <div class=\"success-mark\"><span>✔</span></div>\n  <div class=\"error-mark\"><span>✘</span></div>\n  <div class=\"error-message\"><span></span></div>\n</div>"
     };
 
     function Dropzone(element, options) {
-      var elementId, elementOptions, extend, _ref;
+      var elementId, elementOptions, extend, fallback, _ref;
+      this.element = element;
+      this.version = Dropzone.version;
       this.defaultOptions.previewTemplate = this.defaultOptions.previewTemplate.replace(/\n*/g, "");
-      this.element = o(element);
+      if (typeof this.element === "string") {
-      if (this.element.length !== 1) {
+        this.element = document.querySelector(this.element);
-        throw new Error("You can only instantiate dropzone on a single element.");
       }
-      if (this.element.data("dropzone")) {
+      if (!(this.element && (this.element.nodeType != null))) {
+        throw new Error("Invalid dropzone element.");
+      }
+      if (Dropzone.forElement(this.element)) {
         throw new Error("Dropzone already attached.");
       }
-      this.element.data("dropzone", this);
+      Dropzone.instances.push(this);
-      elementId = this.element.attr("id");
+      elementId = this.element.id;
       elementOptions = (_ref = (elementId ? Dropzone.options[camelize(elementId)] : void 0)) != null ? _ref : {};
-      this.elementTagName = this.element.get(0).tagName;
       extend = function() {
         var key, object, objects, target, val, _i, _len;
         target = arguments[0], objects = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
@@ -527,115 +562,175 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       };
       this.options = extend({}, this.defaultOptions, elementOptions, options != null ? options : {});
       if (this.options.url == null) {
-        this.options.url = this.element.attr("action");
+        this.options.url = this.element.action;
       }
       if (!this.options.url) {
         throw new Error("No URL provided.");
       }
+      if (!Dropzone.isBrowserSupported()) {
+        return this.options.fallback.call(this);
+      }
+      if ((fallback = this.getExistingFallback()) && fallback.parentNode) {
+        fallback.parentNode.removeChild(fallback);
+      }
+      this.previewsContainer = this.options.previewsContainer ? createElement(this.options.previewsContainer) : this.element;
       this.init();
     }
 
     Dropzone.prototype.init = function() {
-      var capableBrowser, regex, _i, _len, _ref, _ref1,
+      var eventName, noPropagation, _i, _len, _ref, _ref1,
         _this = this;
-      if (this.elementTagName === "form" && this.element.attr("enctype") !== "multipart/form-data") {
+      if (this.element.tagName === "form") {
-        this.element.attr("enctype", "multipart/form-data");
+        this.element.setAttribute("enctype", "multipart/form-data");
       }
-      if (this.element.find(".message").length === 0) {
+      if (this.element.classList.contains("dropzone") && !this.element.querySelector(".message")) {
-        this.element.append(o("<div class=\"default message\"><span>Drop files here to upload</span></div>"));
+        this.element.appendChild(createElement("<div class=\"default message\"><span>" + this.options.dictDefaultMessage + "</span></div>"));
-      }
-      capableBrowser = true;
-      if (window.File && window.FileReader && window.FileList && window.Blob && window.FormData) {
-        _ref = this.blacklistedBrowsers;
-        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-          regex = _ref[_i];
-          if (regex.test(navigator.userAgent)) {
-            capableBrowser = false;
-            continue;
-          }
-        }
-      } else {
-        capableBrowser = false;
-      }
-      if (!capableBrowser) {
-        return this.options.fallback.call(this);
       }
       if (this.options.clickable) {
-        this.element.addClass("clickable");
+        this.hiddenFileInput = document.createElement("input");
-        this.hiddenFileInput = o("<input type=\"file\" multiple />");
+        this.hiddenFileInput.setAttribute("type", "file");
-        this.element.click(function(evt) {
+        this.hiddenFileInput.setAttribute("multiple", "multiple");
-          var target;
+        this.hiddenFileInput.style.display = "none";
-          target = o(evt.target);
+        document.body.appendChild(this.hiddenFileInput);
-          if (target.is(_this.element) || target.is(_this.element.find(".message"))) {
+        this.hiddenFileInput.addEventListener("change", function() {
-            return _this.hiddenFileInput.click();
-          }
-        });
-        this.hiddenFileInput.change(function() {
           var files;
-          files = _this.hiddenFileInput.get(0).files;
+          files = _this.hiddenFileInput.files;
-          _this.emit("selectedfiles", files);
           if (files.length) {
+            _this.emit("selectedfiles", files);
             return _this.handleFiles(files);
           }
         });
       }
       this.files = [];
-      this.files.queue = [];
+      this.filesQueue = [];
-      this.files.processing = [];
+      this.filesProcessing = [];
-      this.URL = (_ref1 = window.URL) != null ? _ref1 : window.webkitURL;
+      this.URL = (_ref = window.URL) != null ? _ref : window.webkitURL;
-      return this.setupEventListeners();
+      _ref1 = this.events;
-    };
+      for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
-
+        eventName = _ref1[_i];
-    Dropzone.prototype.getFallbackForm = function() {
-      var fields;
-      fields = o("<div class=\"fallback-elements\"><input type=\"file\" name=\"" + this.options.paramName + "\" multiple=\"multiple\" /><button type=\"submit\">Upload!</button></div>");
-      if (this.elementTagName !== "FORM") {
-        fields = o("<form action=\"" + this.options.url + "\" enctype=\"multipart/form-data\" method=\"post\"></form>").append(fields);
-      } else {
-        if (!this.element.attr("enctype")) {
-          this.element.attr("enctype", "multipart/form-data");
-        }
-        if (!this.element.attr("method")) {
-          this.element.attr("method", "post");
-        }
-      }
-      return fields;
-    };
-
-    Dropzone.prototype.setupEventListeners = function() {
-      var eventName, noPropagation, _i, _len, _ref,
-        _this = this;
-      _ref = this.events;
-      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-        eventName = _ref[_i];
         this.on(eventName, this.options[eventName]);
       }
       noPropagation = function(e) {
         e.stopPropagation();
-        return e.preventDefault();
+        if (e.preventDefault) {
+          return e.preventDefault();
+        } else {
+          return e.returnValue = false;
+        }
       };
-      this.element.on("dragstart", function(e) {
+      this.listeners = {
-        return _this.emit("dragstart", e);
+        "dragstart": function(e) {
-      });
+          return _this.emit("dragstart", e);
-      this.element.on("dragenter", function(e) {
+        },
-        noPropagation(e);
+        "dragenter": function(e) {
-        return _this.emit("dragenter", e);
+          noPropagation(e);
-      });
+          return _this.emit("dragenter", e);
-      this.element.on("dragover", function(e) {
+        },
-        noPropagation(e);
+        "dragover": function(e) {
-        return _this.emit("dragover", e);
+          noPropagation(e);
-      });
+          return _this.emit("dragover", e);
-      this.element.on("dragleave", function(e) {
+        },
-        return _this.emit("dragleave", e);
+        "dragleave": function(e) {
-      });
+          return _this.emit("dragleave", e);
-      this.element.on("drop", function(e) {
+        },
-        noPropagation(e);
+        "drop": function(e) {
-        _this.drop(e);
+          noPropagation(e);
-        return _this.emit("drop", e);
+          _this.drop(e);
-      });
+          return _this.emit("drop", e);
-      return this.element.on("dragend", function(e) {
+        },
-        return _this.emit("dragend", e);
+        "dragend": function(e) {
-      });
+          return _this.emit("dragend", e);
+        },
+        "click": function(evt) {
+          if (!_this.options.clickable) {
+            return;
+          }
+          if (evt.target === _this.element || evt.target === _this.element.querySelector(".message")) {
+            return _this.hiddenFileInput.click();
+          }
+        }
+      };
+      this.enable();
+      return this.options.init.call(this);
+    };
+
+    Dropzone.prototype.getFallbackForm = function() {
+      var existingFallback, fields, fieldsString, form;
+      if (existingFallback = this.getExistingFallback()) {
+        return existingFallback;
+      }
+      fieldsString = "<div class=\"fallback\">";
+      if (this.options.dictFallbackText) {
+        fieldsString += "<p>" + this.options.dictFallbackText + "</p>";
+      }
+      fieldsString += "<input type=\"file\" name=\"" + this.options.paramName + "\" multiple=\"multiple\" /><button type=\"submit\">Upload!</button></div>";
+      fields = createElement(fieldsString);
+      if (this.element.tagName !== "FORM") {
+        form = createElement("<form action=\"" + this.options.url + "\" enctype=\"multipart/form-data\" method=\"post\"></form>");
+        form.appendChild(fields);
+      } else {
+        this.element.setAttribute("enctype", "multipart/form-data");
+        this.element.setAttribute("method", "post");
+      }
+      return form != null ? form : fields;
+    };
+
+    Dropzone.prototype.getExistingFallback = function() {
+      var fallback, getFallback, tagName, _i, _len, _ref;
+      getFallback = function(elements) {
+        var el, _i, _len;
+        for (_i = 0, _len = elements.length; _i < _len; _i++) {
+          el = elements[_i];
+          if (/(^| )fallback($| )/.test(el.className)) {
+            return el;
+          }
+        }
+      };
+      _ref = ["div", "form"];
+      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+        tagName = _ref[_i];
+        if (fallback = getFallback(this.element.getElementsByTagName("div"))) {
+          return fallback;
+        }
+      }
+    };
+
+    Dropzone.prototype.setupEventListeners = function() {
+      var event, listener, _ref, _results;
+      _ref = this.listeners;
+      _results = [];
+      for (event in _ref) {
+        listener = _ref[event];
+        _results.push(this.element.addEventListener(event, listener, false));
+      }
+      return _results;
+    };
+
+    Dropzone.prototype.removeEventListeners = function() {
+      var event, listener, _ref, _results;
+      _ref = this.listeners;
+      _results = [];
+      for (event in _ref) {
+        listener = _ref[event];
+        _results.push(this.element.removeEventListener(event, listener, false));
+      }
+      return _results;
+    };
+
+    Dropzone.prototype.disable = function() {
+      if (this.options.clickable) {
+        this.element.classList.remove("clickable");
+      }
+      this.removeEventListeners();
+      this.filesProcessing = [];
+      return this.filesQueue = [];
+    };
+
+    Dropzone.prototype.enable = function() {
+      if (this.options.clickable) {
+        this.element.classList.add("clickable");
+      }
+      return this.setupEventListeners();
     };
 
     Dropzone.prototype.filesize = function(size) {
@@ -661,10 +756,10 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.drop = function(e) {
       var files;
-      if (!e.originalEvent.dataTransfer) {
+      if (!e.dataTransfer) {
         return;
       }
-      files = e.originalEvent.dataTransfer.files;
+      files = e.dataTransfer.files;
       this.emit("selectedfiles", files);
       if (files.length) {
         return this.handleFiles(files);
@@ -700,12 +795,26 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
         if (error) {
           return _this.errorProcessing(file, error);
         } else {
-          _this.files.queue.push(file);
+          if (_this.options.enqueueForUpload) {
-          return _this.processQueue();
+            _this.filesQueue.push(file);
+            return _this.processQueue();
+          }
         }
       });
     };
 
+    Dropzone.prototype.removeFile = function(file) {
+      if (file.processing) {
+        throw new Error("Can't remove file currently processing");
+      }
+      this.files = without(this.files, file);
+      this.filesQueue = without(this.filesQueue, file);
+      this.emit("removedfile", file);
+      if (this.files.length === 0) {
+        return this.emit("reset");
+      }
+    };
+
     Dropzone.prototype.createThumbnail = function(file) {
       var fileReader,
         _this = this;
@@ -757,52 +866,40 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
     Dropzone.prototype.processQueue = function() {
       var i, parallelUploads, processingLength;
       parallelUploads = this.options.parallelUploads;
-      processingLength = this.files.processing.length;
+      processingLength = this.filesProcessing.length;
       i = processingLength;
       while (i < parallelUploads) {
-        if (!this.files.queue.length) {
+        if (!this.filesQueue.length) {
           return;
         }
-        this.processFile(this.files.queue.shift());
+        this.processFile(this.filesQueue.shift());
         i++;
       }
     };
 
     Dropzone.prototype.processFile = function(file) {
-      this.files.processing.push(file);
+      this.filesProcessing.push(file);
+      file.processing = true;
       this.emit("processingfile", file);
       return this.uploadFile(file);
     };
 
     Dropzone.prototype.uploadFile = function(file) {
-      var formData, handleError, input, inputElement, inputName, progressObj, xhr, _i, _len, _ref, _ref1,
+      var formData, handleError, input, inputName, inputType, key, progressObj, value, xhr, _i, _len, _ref, _ref1, _ref2,
         _this = this;
       xhr = new XMLHttpRequest();
-      formData = new FormData();
-      formData.append(this.options.paramName, file);
-      if (this.elementTagName = "FORM") {
-        _ref = this.element.find("input, textarea, select, button");
-        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-          inputElement = _ref[_i];
-          input = o(inputElement);
-          inputName = input.attr("name");
-          if (!input.attr("type") || input.attr("type").toLowerCase() !== "checkbox" || inputElement.checked) {
-            formData.append(input.attr("name"), input.val());
-          }
-        }
-      }
       xhr.open("POST", this.options.url, true);
       handleError = function() {
         return _this.errorProcessing(file, xhr.responseText || ("Server responded with " + xhr.status + " code."));
       };
       xhr.onload = function(e) {
-        var response;
+        var response, _ref;
-        if (xhr.status !== 200) {
+        if (!((200 <= (_ref = xhr.status) && _ref < 300))) {
           return handleError();
         } else {
           _this.emit("uploadprogress", file, 100);
           response = xhr.responseText;
-          if (~xhr.getResponseHeader("content-type").indexOf("application/json")) {
+          if (xhr.getResponseHeader("content-type") && ~xhr.getResponseHeader("content-type").indexOf("application/json")) {
             response = JSON.parse(response);
           }
           return _this.finished(file, response, e);
@@ -811,7 +908,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       xhr.onerror = function() {
         return handleError();
       };
-      progressObj = (_ref1 = xhr.upload) != null ? _ref1 : xhr;
+      progressObj = (_ref = xhr.upload) != null ? _ref : xhr;
       progressObj.onprogress = function(e) {
         return _this.emit("uploadprogress", file, Math.max(0, Math.min(100, (e.loaded / e.total) * 100)));
       };
@@ -819,31 +916,96 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       xhr.setRequestHeader("Cache-Control", "no-cache");
       xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
       xhr.setRequestHeader("X-File-Name", file.name);
-      this.emit("sending", file, xhr);
+      formData = new FormData();
+      if (this.options.params) {
+        _ref1 = this.options.params;
+        for (key in _ref1) {
+          value = _ref1[key];
+          formData.append(key, value);
+        }
+      }
+      if (this.element.tagName = "FORM") {
+        _ref2 = this.element.querySelectorAll("input, textarea, select, button");
+        for (_i = 0, _len = _ref2.length; _i < _len; _i++) {
+          input = _ref2[_i];
+          inputName = input.getAttribute("name");
+          inputType = input.getAttribute("type");
+          if (!inputType || inputType.toLowerCase() !== "checkbox" || input.checked) {
+            formData.append(inputName, input.value);
+          }
+        }
+      }
+      this.emit("sending", file, xhr, formData);
+      formData.append(this.options.paramName, file);
       return xhr.send(formData);
     };
 
     Dropzone.prototype.finished = function(file, responseText, e) {
-      this.files.processing = without(this.files.processing, file);
+      this.filesProcessing = without(this.filesProcessing, file);
+      file.processing = false;
+      this.processQueue();
       this.emit("success", file, responseText, e);
       this.emit("finished", file, responseText, e);
-      this.emit("complete", file);
+      return this.emit("complete", file);
-      return this.processQueue();
     };
 
     Dropzone.prototype.errorProcessing = function(file, message) {
-      this.files.processing = without(this.files.processing, file);
+      this.filesProcessing = without(this.filesProcessing, file);
+      file.processing = false;
+      this.processQueue();
       this.emit("error", file, message);
-      this.emit("complete", file);
+      return this.emit("complete", file);
-      return this.processQueue();
     };
 
     return Dropzone;
 
   })(Em);
 
+  Dropzone.version = "2.0.3";
+
   Dropzone.options = {};
 
+  Dropzone.instances = [];
+
+  Dropzone.forElement = function(element) {
+    var instance, _i, _len, _ref;
+    if (typeof element === "string") {
+      element = document.querySelector(element);
+    }
+    _ref = Dropzone.instances;
+    for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+      instance = _ref[_i];
+      if (instance.element === element) {
+        return instance;
+      }
+    }
+    return null;
+  };
+
+  Dropzone.blacklistedBrowsers = [/opera.*Macintosh.*version\/12/i];
+
+  Dropzone.isBrowserSupported = function() {
+    var capableBrowser, regex, _i, _len, _ref;
+    capableBrowser = true;
+    if (window.File && window.FileReader && window.FileList && window.Blob && window.FormData) {
+      if (!("classList" in document.createElement("a"))) {
+        capableBrowser = false;
+      } else {
+        _ref = Dropzone.blacklistedBrowsers;
+        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+          regex = _ref[_i];
+          if (regex.test(navigator.userAgent)) {
+            capableBrowser = false;
+            continue;
+          }
+        }
+      }
+    } else {
+      capableBrowser = false;
+    }
+    return capableBrowser;
+  };
+
   without = function(list, rejectedItem) {
     var item, _i, _len, _results;
     _results = [];
@@ -862,15 +1024,20 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
     });
   };
 
-  o.fn.dropzone = function(options) {
+  createElement = function(string) {
-    return this.each(function() {
+    var div;
-      return new Dropzone(this, options);
+    div = document.createElement("div");
-    });
+    div.innerHTML = string;
+    return div.childNodes[0];
   };
 
-  o(function() {
+  if (typeof jQuery !== "undefined" && jQuery !== null) {
-    return o(".dropzone").dropzone();
+    jQuery.fn.dropzone = function(options) {
-  });
+      return this.each(function() {
+        return new Dropzone(this, options);
+      });
+    };
+  }
 
   if (typeof module !== "undefined" && module !== null) {
     module.exports = Dropzone;
@@ -878,6 +1045,78 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
     window.Dropzone = Dropzone;
   }
 
+  contentLoaded = function(win, fn) {
+    var add, doc, done, init, poll, pre, rem, root, top;
+    done = false;
+    top = true;
+    doc = win.document;
+    root = doc.documentElement;
+    add = (doc.addEventListener ? "addEventListener" : "attachEvent");
+    rem = (doc.addEventListener ? "removeEventListener" : "detachEvent");
+    pre = (doc.addEventListener ? "" : "on");
+    init = function(e) {
+      if (e.type === "readystatechange" && doc.readyState !== "complete") {
+        return;
+      }
+      (e.type === "load" ? win : doc)[rem](pre + e.type, init, false);
+      if (!done && (done = true)) {
+        return fn.call(win, e.type || e);
+      }
+    };
+    poll = function() {
+      try {
+        root.doScroll("left");
+      } catch (e) {
+        setTimeout(poll, 50);
+        return;
+      }
+      return init("poll");
+    };
+    if (doc.readyState !== "complete") {
+      if (doc.createEventObject && root.doScroll) {
+        try {
+          top = !win.frameElement;
+        } catch (_error) {}
+        if (top) {
+          poll();
+        }
+      }
+      doc[add](pre + "DOMContentLoaded", init, false);
+      doc[add](pre + "readystatechange", init, false);
+      return win[add](pre + "load", init, false);
+    }
+  };
+
+  contentLoaded(window, function() {
+    var checkElements, dropzone, dropzones, _i, _len, _results;
+    if (false) {
+      dropzones = document.querySelectorAll(".dropzone");
+    } else {
+      dropzones = [];
+      checkElements = function(elements) {
+        var el, _i, _len, _results;
+        _results = [];
+        for (_i = 0, _len = elements.length; _i < _len; _i++) {
+          el = elements[_i];
+          if (/(^| )dropzone($| )/.test(el.className)) {
+            _results.push(dropzones.push(el));
+          } else {
+            _results.push(void 0);
+          }
+        }
+        return _results;
+      };
+      checkElements(document.getElementsByTagName("div"));
+      checkElements(document.getElementsByTagName("form"));
+    }
+    _results = [];
+    for (_i = 0, _len = dropzones.length; _i < _len; _i++) {
+      dropzone = dropzones[_i];
+      _results.push(new Dropzone(dropzone));
+    }
+    return _results;
+  });
+
 }).call(this);
 
 });
@@ -886,7 +1125,7 @@ require.alias("component-emitter/index.js", "dropzone/deps/emitter/index.js");
 if (typeof exports == "object") {
   module.exports = require("dropzone");
 } else if (typeof define == "function" && define.amd) {
-  define(require("dropzone"));
+  define(function(){ return require("dropzone"); });
 } else {
   window["Dropzone"] = require("dropzone");
 }})();

source/stylesheets/dropzone.css

@@ -1,5 +1,8 @@
+/* The MIT License */
 .dropzone,
-.dropzone * {
+.dropzone *,
+.dropzone-previews,
+.dropzone-previews * {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
@@ -31,55 +34,68 @@
 .dropzone.started .message {
   display: none;
 }
-.dropzone .preview {
+.dropzone .preview,
+.dropzone-previews .preview {
   background: rgba(255,255,255,0.8);
   position: relative;
   display: inline-block;
   margin: 17px;
   vertical-align: top;
   border: 1px solid #acacac;
-  padding: 6px 6px 28px 6px;
+  padding: 6px 6px 6px 6px;
 }
-.dropzone .preview .details {
+.dropzone .preview .details,
+.dropzone-previews .preview .details {
   width: 100px;
   height: 100px;
   position: relative;
   background: #ebebeb;
   padding: 5px;
+  margin-bottom: 22px;
 }
-.dropzone .preview .details .filename {
+.dropzone .preview .details .filename,
+.dropzone-previews .preview .details .filename {
   overflow: hidden;
   height: 100%;
 }
-.dropzone .preview .details img {
+.dropzone .preview .details img,
+.dropzone-previews .preview .details img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100px;
   height: 100px;
 }
-.dropzone .preview .details .size {
+.dropzone .preview .details .size,
+.dropzone-previews .preview .details .size {
   position: absolute;
   bottom: -28px;
   left: 3px;
   height: 28px;
   line-height: 28px;
 }
-.dropzone .preview.error .error-mark {
+.dropzone .preview.error .error-mark,
+.dropzone-previews .preview.error .error-mark {
   display: block;
 }
-.dropzone .preview.success .success-mark {
+.dropzone .preview.success .success-mark,
+.dropzone-previews .preview.success .success-mark {
   display: block;
 }
-.dropzone .preview:hover .details img {
+.dropzone .preview:hover .details img,
+.dropzone-previews .preview:hover .details img {
   display: none;
 }
 .dropzone .preview:hover .success-mark,
-.dropzone .preview:hover .error-mark {
+.dropzone-previews .preview:hover .success-mark,
+.dropzone .preview:hover .error-mark,
+.dropzone-previews .preview:hover .error-mark {
   display: none;
 }
 .dropzone .preview .success-mark,
-.dropzone .preview .error-mark {
+.dropzone-previews .preview .success-mark,
+.dropzone .preview .error-mark,
+.dropzone-previews .preview .error-mark {
   display: none;
   position: absolute;
   width: 40px;
@@ -89,21 +105,26 @@
   right: -10px;
   top: -10px;
 }
-.dropzone .preview .success-mark {
+.dropzone .preview .success-mark,
+.dropzone-previews .preview .success-mark {
   color: #8cc657;
 }
-.dropzone .preview .error-mark {
+.dropzone .preview .error-mark,
+.dropzone-previews .preview .error-mark {
   color: #ee162d;
 }
-.dropzone .preview .progress {
+.dropzone .preview .progress,
+.dropzone-previews .preview .progress {
   position: absolute;
   top: 100px;
   left: 6px;
   right: 6px;
   height: 6px;
   background: #d7d7d7;
+  display: none;
 }
-.dropzone .preview .progress .upload {
+.dropzone .preview .progress .upload,
+.dropzone-previews .preview .progress .upload {
   position: absolute;
   top: 0;
   bottom: 0;
@@ -111,10 +132,12 @@
   width: 0%;
   background-color: #8cc657;
 }
-.dropzone .preview.success .progress {
+.dropzone .preview.processing .progress,
-  display: none;
+.dropzone-previews .preview.processing .progress {
+  display: block;
 }
-.dropzone .preview .error-message {
+.dropzone .preview .error-message,
+.dropzone-previews .preview .error-message {
   display: none;
   position: absolute;
   top: -5px;
@@ -126,7 +149,8 @@
   max-width: 500px;
   z-index: 500;
 }
-.dropzone .preview:hover.error .error-message {
+.dropzone .preview:hover.error .error-message,
+.dropzone-previews .preview:hover.error .error-message {
   display: block;
 }
 .dropzone {
@@ -186,36 +210,44 @@
   filter: alpha(opacity=0);
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 }
-.dropzone .preview {
+.dropzone .preview,
+.dropzone-previews .preview {
   -webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.16);
   box-shadow: 1px 1px 4px rgba(0,0,0,0.16);
   font-size: 14px;
 }
-.dropzone .preview .details img {
+.dropzone .preview .details img,
+.dropzone-previews .preview .details img {
   width: 100px;
   height: 100px;
 }
-.dropzone .preview.image-preview:hover .details img {
+.dropzone .preview.image-preview:hover .details img,
+.dropzone-previews .preview.image-preview:hover .details img {
   display: block;
   opacity: 0.1;
   filter: alpha(opacity=10);
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
 }
-.dropzone .preview.success .success-mark {
+.dropzone .preview.success .success-mark,
+.dropzone-previews .preview.success .success-mark {
   opacity: 1;
   -ms-filter: none;
   filter: none;
 }
-.dropzone .preview.error .error-mark {
+.dropzone .preview.error .error-mark,
+.dropzone-previews .preview.error .error-mark {
   opacity: 1;
   -ms-filter: none;
   filter: none;
 }
-.dropzone .preview.error .progress .upload {
+.dropzone .preview.error .progress .upload,
+.dropzone-previews .preview.error .progress .upload {
   background: #ee1e2d;
 }
 .dropzone .preview .error-mark,
-.dropzone .preview .success-mark {
+.dropzone-previews .preview .error-mark,
+.dropzone .preview .success-mark,
+.dropzone-previews .preview .success-mark {
   display: block;
   opacity: 0;
   filter: alpha(opacity=0);
@@ -230,7 +262,9 @@
 }
 @media all and (-webkit-min-device-pixel-ratio: 1.5) {
   .dropzone .preview .error-mark,
-  .dropzone .preview .success-mark {
+  .dropzone-previews .preview .error-mark,
+  .dropzone .preview .success-mark,
+  .dropzone-previews .preview .success-mark {
     background-image: url("../images/spritemap@2x.png");
     -webkit-background-size: 428px 406px;
     -moz-background-size: 428px 406px;
@@ -238,16 +272,21 @@
   }
 }
 .dropzone .preview .error-mark span,
-.dropzone .preview .success-mark span {
+.dropzone-previews .preview .error-mark span,
+.dropzone .preview .success-mark span,
+.dropzone-previews .preview .success-mark span {
   display: none;
 }
-.dropzone .preview .error-mark {
+.dropzone .preview .error-mark,
+.dropzone-previews .preview .error-mark {
   background-position: -268px -123px;
 }
-.dropzone .preview .success-mark {
+.dropzone .preview .success-mark,
+.dropzone-previews .preview .success-mark {
   background-position: -268px -163px;
 }
-.dropzone .preview .progress .upload {
+.dropzone .preview .progress .upload,
+.dropzone-previews .preview .progress .upload {
   -webkit-animation: loading 0.4s linear infinite;
   -moz-animation: loading 0.4s linear infinite;
   -o-animation: loading 0.4s linear infinite;
@@ -270,14 +309,16 @@
   background-position: 0px -400px;
 }
 @media all and (-webkit-min-device-pixel-ratio: 1.5) {
-  .dropzone .preview .progress .upload {
+  .dropzone .preview .progress .upload,
+  .dropzone-previews .preview .progress .upload {
     background-image: url("../images/spritemap@2x.png");
     -webkit-background-size: 428px 406px;
     -moz-background-size: 428px 406px;
     background-size: 428px 406px;
   }
 }
-.dropzone .preview.success .progress {
+.dropzone .preview.success .progress,
+.dropzone-previews .preview.success .progress {
   display: block;
   opacity: 0;
   filter: alpha(opacity=0);
@@ -288,7 +329,8 @@
   -ms-transition: opacity 0.4s ease-in-out;
   transition: opacity 0.4s ease-in-out;
 }
-.dropzone .preview .error-message {
+.dropzone .preview .error-message,
+.dropzone-previews .preview .error-message {
   display: block;
   opacity: 0;
   filter: alpha(opacity=0);
@@ -299,7 +341,8 @@
   -ms-transition: opacity 0.3s ease-in-out;
   transition: opacity 0.3s ease-in-out;
 }
-.dropzone .preview:hover.error .error-message {
+.dropzone .preview:hover.error .error-message,
+.dropzone-previews .preview:hover.error .error-message {
   opacity: 1;
   -ms-filter: none;
   filter: none;