dropzonejs-rails 0.1.3 → 0.1.4

checksums.yaml

@@ -1,15 +1,15 @@
 ---
 !binary "U0hBMQ==":
   metadata.gz: !binary |-
-    YWJiY2ExYTZlZWYwOTM0Zjc5OWJiODI3MWE2YzJlNThlYmM3Nzg4MA==
+    NjA5NjgxODJhNTE2OTc2ZTEyMWViNWJlMzU2ZWJkMzE0NTBlMDk5Yg==
   data.tar.gz: !binary |-
-    NWFjMmRhNjcxZGMxODU0ODUxN2RlOTVmZDNiZjA3ZGQ4ODU4ZDNhMw==
+    MTZkYTE1ODU2N2MyYzJkNzBlZDY1MjA1NjdjMjA0MjQ2YWY2YzNlMw==
 !binary "U0hBNTEy":
   metadata.gz: !binary |-
-    ZTM2NmI3ZjQ1MWUyM2JmMmIyNjA3ZThhMmU0YzQ2ODU3NWVmYTBiYTk5NmUy
-    OTBkOWVlZjQyYjhlYjUzY2MwY2VlYzdlY2Q4YzM3MDlkOTZkYTZjZTMyMDRi
-    ODJiNGIyZGE2MThlMWMzMmJiOWZlNzI0NzFjMzg1NjMzZGY2Yzg=
+    YWY5NmIyNGQwNTRhNzI4NDBjMTUxN2RmMjliNTEyZTYyNGQ3MzZmMGNkNGNh
+    ZDBiMjY5ZTc5M2JlZTcwYTUzMjZmZjQzZTlmZTBkMjNjYTFiMDkxM2FmZDJh
+    MThlNjJlZjE5NjlkYjFiNjE2MzkyZmY1OGZiNzhhYTQyMWExNDU=
   data.tar.gz: !binary |-
-    MGFkMWE2YzYwNzI5ZTEzYTljMDg0OWZiOGM5MWMwMjZhOTA2YzVkYzc0YWRl
-    NDRjYzJkOGEzZTBkODhhMTQ5ZTAyOWI3NTRmMzlkMmFlZDY1ZTU1MDc0MDhl
-    NmFhZjNmMWVlZTQ0NGNlYWI3MTkzYTdjNjA2OWNjYTZjYjg1MmY=
+    NWY3NjI2N2JjNGE3MDQ4MjYxOThjMzhlMmM4NGNjNGJmNDNjYjE4NGQ5ZTUz
+    OGY0MzBhNjkyYzc5MTNiMjZkYjdjNzhmZTYwYTA4NzNiOTIwYzRjZmMwMmRl
+    OTJlMDdmZjg5Yjc3NmU2YjFjMGQ5NjVlMjI1NzUxMGZiZjgzNWM=

data/README.md

@@ -21,6 +21,15 @@ After that, you need to make `dropzone.js` available on your pages. To do that,
 //= require dropzone
 ```
 
+And if you would like to use one of the styles bundled with Dropzone, add to your `application.css`:
+```scss
+//= require dropzone/basic
+```
+or
+```scss
+//= require dropzone/dropzone
+```
+
 And **Bam!** - you're all set.
 
 

data/Rakefile

@@ -12,8 +12,26 @@ require 'open-uri'
 
 desc 'Get latest dropzone js build'
 task :get do
-  source = "https://raw.github.com/enyo/dropzone/v#{DropzonejsRails::DROPZONE_VERSION}/downloads/dropzone.js"
-  target = DropzonejsRails::Engine.root.join('vendor/assets/javascripts/dropzone.js')
+  download_dropzone_file 'dropzone.js', 'vendor/assets/javascripts/dropzone.js'
+  download_dropzone_file 'css/basic.css', 'vendor/assets/stylesheets/dropzone/basic.css.scss'
+  download_dropzone_file 'css/dropzone.css', 'vendor/assets/stylesheets/dropzone/dropzone.css.scss'
+  download_dropzone_file 'images/spritemap.png', 'vendor/assets/images/dropzone/spritemap.png'
+  download_dropzone_file 'images/spritemap@2x.png', 'vendor/assets/images/dropzone/spritemap@2x.png'
 
-  open(target, "w+") { |f| f << open(source).read }
+  fix_image_links 'vendor/assets/stylesheets/dropzone/basic.css.scss'
+  fix_image_links 'vendor/assets/stylesheets/dropzone/dropzone.css.scss'
+end
+
+def download_dropzone_file(source_file, target_file)
+  source = "https://raw.github.com/enyo/dropzone/v#{DropzonejsRails::DROPZONE_VERSION}/downloads/#{source_file}"
+  target = DropzonejsRails::Engine.root.join(target_file)
+
+  File.open(target, 'wb+') { |f| f << open(source, 'rb').read }
+end
+
+def fix_image_links(css_file)
+  file_name = DropzonejsRails::Engine.root.join(css_file)
+  original_css = File.read(file_name)
+  fixed_css = original_css.gsub(/url\(\"\.\.\/images\/(.+\.png)\"\)/, 'image-path("dropzone/\1")')
+  File.open(file_name, "w") {|file| file << fixed_css}
 end

data/lib/dropzonejs-rails/version.rb

@@ -1,4 +1,4 @@
 module DropzonejsRails
-  VERSION = '0.1.3'
-  DROPZONE_VERSION = '2.0.4'
+  VERSION = '0.1.4'
+  DROPZONE_VERSION = '2.0.11'
 end

data/vendor/assets/javascripts/dropzone.js

@@ -368,8 +368,6 @@ module.exports = require("./lib/dropzone.js");
 
 });
 require.register("dropzone/lib/dropzone.js", function(exports, require, module){
-// Generated by CoffeeScript 1.4.0
-
 /*
 #
 # More info at [www.dropzonejs.com](http://www.dropzonejs.com)
@@ -398,25 +396,25 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
 
 (function() {
-  var Dropzone, Em, camelize, contentLoaded, createElement, noop, without,
+  var Dropzone, Em, camelize, contentLoaded, 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;
+    __slice = [].slice,
+    __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; };
 
   Em = typeof Emitter !== "undefined" && Emitter !== null ? Emitter : require("emitter");
 
   noop = function() {};
 
   Dropzone = (function(_super) {
-
     __extends(Dropzone, _super);
 
     /*
-      This is a list of all available events you can register on a dropzone object.
+    This is a list of all available events you can register on a dropzone object.
     
-      You can register an event handler like this:
+    You can register an event handler like this:
     
-          dropzone.on("dragEnter", function() { });
+        dropzone.on("dragEnter", function() { });
     */
 
 
@@ -424,6 +422,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.defaultOptions = {
       url: null,
+      method: "post",
       parallelUploads: 2,
       maxFilesize: 256,
       paramName: "file",
@@ -446,6 +445,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       },
       fallback: function() {
         var child, messageElement, span, _i, _len, _ref;
+
         this.element.className = "" + this.element.className + " browser-not-supported";
         _ref = this.element.getElementsByTagName("div");
         for (_i = 0, _len = _ref.length; _i < _len; _i++) {
@@ -457,7 +457,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
           }
         }
         if (!messageElement) {
-          messageElement = createElement("<div class=\"message\"><span></span></div>");
+          messageElement = Dropzone.createElement("<div class=\"message\"><span></span></div>");
           this.element.appendChild(messageElement);
         }
         span = messageElement.getElementsByTagName("span")[0];
@@ -467,12 +467,12 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
         return this.element.appendChild(this.getFallbackForm());
       },
       /*
-          Those functions register themselves to the events on init and handle all
-          the user interface specific stuff. Overwriting them won't break the upload
-          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.
+      Those functions register themselves to the events on init and handle all
+      the user interface specific stuff. Overwriting them won't break the upload
+      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) {
@@ -500,10 +500,10 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
         return this.element.classList.remove("started");
       },
       addedfile: function(file) {
-        file.previewTemplate = createElement(this.options.previewTemplate);
+        file.previewTemplate = Dropzone.createElement(this.options.previewTemplate);
         this.previewsContainer.appendChild(file.previewTemplate);
         file.previewTemplate.querySelector(".filename span").textContent = file.name;
-        return file.previewTemplate.querySelector(".details").appendChild(createElement("<div class=\"size\">" + (this.filesize(file.size)) + "</div>"));
+        return file.previewTemplate.querySelector(".details").appendChild(Dropzone.createElement("<div class=\"size\">" + (this.filesize(file.size)) + "</div>"));
       },
       removedfile: function(file) {
         return file.previewTemplate.parentNode.removeChild(file.previewTemplate);
@@ -511,7 +511,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       thumbnail: function(file, dataUrl) {
         file.previewTemplate.classList.remove("file-preview");
         file.previewTemplate.classList.add("image-preview");
-        return file.previewTemplate.querySelector(".details").appendChild(createElement("<img alt=\"" + file.name + "\" src=\"" + dataUrl + "\"/>"));
+        return file.previewTemplate.querySelector(".details").appendChild(Dropzone.createElement("<img alt=\"" + file.name + "\" src=\"" + dataUrl + "\"/>"));
       },
       error: function(file, message) {
         file.previewTemplate.classList.add("error");
@@ -533,6 +533,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     function Dropzone(element, options) {
       var elementId, elementOptions, extend, fallback, _ref;
+
       this.element = element;
       this.version = Dropzone.version;
       this.defaultOptions.previewTemplate = this.defaultOptions.previewTemplate.replace(/\n*/g, "");
@@ -550,6 +551,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       elementOptions = (_ref = (elementId ? Dropzone.options[camelize(elementId)] : void 0)) != null ? _ref : {};
       extend = function() {
         var key, object, objects, target, val, _i, _len;
+
         target = arguments[0], objects = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
         for (_i = 0, _len = objects.length; _i < _len; _i++) {
           object = objects[_i];
@@ -567,6 +569,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       if (!this.options.url) {
         throw new Error("No URL provided.");
       }
+      this.options.method = this.options.method.toUpperCase();
       if (!Dropzone.isBrowserSupported()) {
         return this.options.fallback.call(this);
       }
@@ -589,28 +592,37 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
     }
 
     Dropzone.prototype.init = function() {
-      var eventName, noPropagation, _i, _len, _ref, _ref1,
+      var eventName, noPropagation, setupHiddenFileInput, _i, _len, _ref, _ref1,
         _this = this;
+
       if (this.element.tagName === "form") {
         this.element.setAttribute("enctype", "multipart/form-data");
       }
       if (this.element.classList.contains("dropzone") && !this.element.querySelector(".message")) {
-        this.element.appendChild(createElement("<div class=\"default message\"><span>" + this.options.dictDefaultMessage + "</span></div>"));
+        this.element.appendChild(Dropzone.createElement("<div class=\"default message\"><span>" + this.options.dictDefaultMessage + "</span></div>"));
       }
       if (this.options.clickable) {
-        this.hiddenFileInput = document.createElement("input");
-        this.hiddenFileInput.setAttribute("type", "file");
-        this.hiddenFileInput.setAttribute("multiple", "multiple");
-        this.hiddenFileInput.style.display = "none";
-        document.body.appendChild(this.hiddenFileInput);
-        this.hiddenFileInput.addEventListener("change", function() {
-          var files;
-          files = _this.hiddenFileInput.files;
-          if (files.length) {
-            _this.emit("selectedfiles", files);
-            return _this.handleFiles(files);
+        setupHiddenFileInput = function() {
+          if (_this.hiddenFileInput) {
+            document.body.removeChild(_this.hiddenFileInput);
           }
-        });
+          _this.hiddenFileInput = document.createElement("input");
+          _this.hiddenFileInput.setAttribute("type", "file");
+          _this.hiddenFileInput.setAttribute("multiple", "multiple");
+          _this.hiddenFileInput.style.display = "none";
+          document.body.appendChild(_this.hiddenFileInput);
+          return _this.hiddenFileInput.addEventListener("change", function() {
+            var files;
+
+            files = _this.hiddenFileInput.files;
+            if (files.length) {
+              _this.emit("selectedfiles", files);
+              _this.handleFiles(files);
+            }
+            return setupHiddenFileInput();
+          });
+        };
+        setupHiddenFileInput();
       }
       this.files = [];
       this.filesQueue = [];
@@ -656,7 +668,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
           if (!_this.options.clickable) {
             return;
           }
-          if (evt.target === _this.element || evt.target === _this.element.querySelector(".message")) {
+          if (evt.target === _this.element || Dropzone.elementInside(evt.target, _this.element.querySelector(".message"))) {
             return _this.hiddenFileInput.click();
           }
         }
@@ -667,6 +679,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.getFallbackForm = function() {
       var existingFallback, fields, fieldsString, form;
+
       if (existingFallback = this.getExistingFallback()) {
         return existingFallback;
       }
@@ -675,21 +688,23 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
         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);
+      fields = Dropzone.createElement(fieldsString);
       if (this.element.tagName !== "FORM") {
-        form = createElement("<form action=\"" + this.options.url + "\" enctype=\"multipart/form-data\" method=\"post\"></form>");
+        form = Dropzone.createElement("<form action=\"" + this.options.url + "\" enctype=\"multipart/form-data\" method=\"" + this.options.method + "\"></form>");
         form.appendChild(fields);
       } else {
         this.element.setAttribute("enctype", "multipart/form-data");
-        this.element.setAttribute("method", "post");
+        this.element.setAttribute("method", this.options.method);
       }
       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)) {
@@ -708,6 +723,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.setupEventListeners = function() {
       var event, listener, _ref, _results;
+
       _ref = this.listeners;
       _results = [];
       for (event in _ref) {
@@ -719,6 +735,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.removeEventListeners = function() {
       var event, listener, _ref, _results;
+
       _ref = this.listeners;
       _results = [];
       for (event in _ref) {
@@ -746,6 +763,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.filesize = function(size) {
       var string;
+
       if (size >= 100000000000) {
         size = size / 100000000000;
         string = "TB";
@@ -767,6 +785,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.drop = function(e) {
       var files;
+
       if (!e.dataTransfer) {
         return;
       }
@@ -779,6 +798,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.handleFiles = function(files) {
       var file, _i, _len, _results;
+
       _results = [];
       for (_i = 0, _len = files.length; _i < _len; _i++) {
         file = files[_i];
@@ -797,6 +817,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.addFile = function(file) {
       var _this = this;
+
       this.files.push(file);
       this.emit("addedfile", file);
       if (this.options.createImageThumbnails && file.type.match(/image.*/) && file.size <= this.options.maxThumbnailFilesize * 1024 * 1024) {
@@ -826,15 +847,31 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       }
     };
 
+    Dropzone.prototype.removeAllFiles = function() {
+      var file, _i, _len, _ref;
+
+      _ref = this.files.slice();
+      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+        file = _ref[_i];
+        if (__indexOf.call(this.filesProcessing, file) < 0) {
+          this.removeFile(file);
+        }
+      }
+      return null;
+    };
+
     Dropzone.prototype.createThumbnail = function(file) {
       var fileReader,
         _this = this;
+
       fileReader = new FileReader;
       fileReader.onload = function() {
         var img;
+
         img = new Image;
         img.onload = function() {
           var canvas, ctx, srcHeight, srcRatio, srcWidth, srcX, srcY, thumbnail, trgHeight, trgRatio, trgWidth, trgX, trgY;
+
           canvas = document.createElement("canvas");
           ctx = canvas.getContext("2d");
           srcX = 0;
@@ -876,6 +913,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
     Dropzone.prototype.processQueue = function() {
       var i, parallelUploads, processingLength;
+
       parallelUploads = this.options.parallelUploads;
       processingLength = this.filesProcessing.length;
       i = processingLength;
@@ -898,13 +936,15 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
     Dropzone.prototype.uploadFile = function(file) {
       var formData, handleError, input, inputName, inputType, key, progressObj, value, xhr, _i, _len, _ref, _ref1, _ref2,
         _this = this;
+
       xhr = new XMLHttpRequest();
-      xhr.open("POST", this.options.url, true);
+      xhr.open(this.options.method, this.options.url, true);
       handleError = function() {
         return _this.errorProcessing(file, xhr.responseText || ("Server responded with " + xhr.status + " code."));
       };
       xhr.onload = function(e) {
         var response, _ref;
+
         if (!((200 <= (_ref = xhr.status) && _ref < 300))) {
           return handleError();
         } else {
@@ -935,7 +975,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
           formData.append(key, value);
         }
       }
-      if (this.element.tagName = "FORM") {
+      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];
@@ -972,7 +1012,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
   })(Em);
 
-  Dropzone.version = "2.0.4";
+  Dropzone.version = "2.0.11";
 
   Dropzone.options = {};
 
@@ -980,6 +1020,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
   Dropzone.forElement = function(element) {
     var instance, _i, _len, _ref;
+
     if (typeof element === "string") {
       element = document.querySelector(element);
     }
@@ -997,6 +1038,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
   Dropzone.isBrowserSupported = function() {
     var capableBrowser, regex, _i, _len, _ref;
+
     capableBrowser = true;
     if (window.File && window.FileReader && window.FileList && window.Blob && window.FormData && document.querySelector) {
       if (!("classList" in document.createElement("a"))) {
@@ -1019,6 +1061,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
   without = function(list, rejectedItem) {
     var item, _i, _len, _results;
+
     _results = [];
     for (_i = 0, _len = list.length; _i < _len; _i++) {
       item = list[_i];
@@ -1035,13 +1078,26 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
     });
   };
 
-  createElement = function(string) {
+  Dropzone.createElement = function(string) {
     var div;
+
     div = document.createElement("div");
     div.innerHTML = string;
     return div.childNodes[0];
   };
 
+  Dropzone.elementInside = function(element, container) {
+    if (element === container) {
+      return true;
+    }
+    while (element = element.parentNode) {
+      if (element === container) {
+        return true;
+      }
+    }
+    return false;
+  };
+
   if (typeof jQuery !== "undefined" && jQuery !== null) {
     jQuery.fn.dropzone = function(options) {
       return this.each(function() {
@@ -1058,6 +1114,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
   contentLoaded = function(win, fn) {
     var add, doc, done, init, poll, pre, rem, root, top;
+
     done = false;
     top = true;
     doc = win.document;
@@ -1075,9 +1132,12 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       }
     };
     poll = function() {
+      var e;
+
       try {
         root.doScroll("left");
-      } catch (e) {
+      } catch (_error) {
+        e = _error;
         setTimeout(poll, 50);
         return;
       }
@@ -1100,12 +1160,14 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
 
   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];

data/vendor/assets/stylesheets/dropzone/basic.css.scss

@@ -0,0 +1,156 @@
+/* The MIT License */
+.dropzone,
+.dropzone *,
+.dropzone-previews,
+.dropzone-previews * {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+.dropzone {
+  position: relative;
+  border: 1px solid rgba(0,0,0,0.08);
+  background: rgba(0,0,0,0.02);
+  padding: 1em;
+}
+.dropzone.clickable {
+  cursor: pointer;
+}
+.dropzone.clickable .message,
+.dropzone.clickable .message span {
+  cursor: pointer;
+}
+.dropzone.clickable * {
+  cursor: default;
+}
+.dropzone .message {
+  opacity: 1;
+  -ms-filter: none;
+  filter: none;
+}
+.dropzone.drag-hover {
+  border-color: rgba(0,0,0,0.15);
+  background: rgba(0,0,0,0.04);
+}
+.dropzone.started .message {
+  display: none;
+}
+.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 6px 6px;
+}
+.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-previews .preview .details .filename {
+  overflow: hidden;
+  height: 100%;
+}
+.dropzone .preview .details img,
+.dropzone-previews .preview .details img {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100px;
+  height: 100px;
+}
+.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-previews .preview.error .error-mark {
+  display: block;
+}
+.dropzone .preview.success .success-mark,
+.dropzone-previews .preview.success .success-mark {
+  display: block;
+}
+.dropzone .preview:hover .details img,
+.dropzone-previews .preview:hover .details img {
+  display: none;
+}
+.dropzone .preview:hover .success-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-previews .preview .success-mark,
+.dropzone .preview .error-mark,
+.dropzone-previews .preview .error-mark {
+  display: none;
+  position: absolute;
+  width: 40px;
+  height: 40px;
+  font-size: 30px;
+  text-align: center;
+  right: -10px;
+  top: -10px;
+}
+.dropzone .preview .success-mark,
+.dropzone-previews .preview .success-mark {
+  color: #8cc657;
+}
+.dropzone .preview .error-mark,
+.dropzone-previews .preview .error-mark {
+  color: #ee162d;
+}
+.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-previews .preview .progress .upload {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: 0%;
+  background-color: #8cc657;
+}
+.dropzone .preview.processing .progress,
+.dropzone-previews .preview.processing .progress {
+  display: block;
+}
+.dropzone .preview .error-message,
+.dropzone-previews .preview .error-message {
+  display: none;
+  position: absolute;
+  top: -5px;
+  left: -20px;
+  background: rgba(245,245,245,0.8);
+  padding: 8px 10px;
+  color: #800;
+  min-width: 140px;
+  max-width: 500px;
+  z-index: 500;
+}
+.dropzone .preview:hover.error .error-message,
+.dropzone-previews .preview:hover.error .error-message {
+  display: block;
+}

data/vendor/assets/stylesheets/dropzone/dropzone.css.scss

@@ -0,0 +1,395 @@
+/* The MIT License */
+.dropzone,
+.dropzone *,
+.dropzone-previews,
+.dropzone-previews * {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+.dropzone {
+  position: relative;
+  border: 1px solid rgba(0,0,0,0.08);
+  background: rgba(0,0,0,0.02);
+  padding: 1em;
+}
+.dropzone.clickable {
+  cursor: pointer;
+}
+.dropzone.clickable .message,
+.dropzone.clickable .message span {
+  cursor: pointer;
+}
+.dropzone.clickable * {
+  cursor: default;
+}
+.dropzone .message {
+  opacity: 1;
+  -ms-filter: none;
+  filter: none;
+}
+.dropzone.drag-hover {
+  border-color: rgba(0,0,0,0.15);
+  background: rgba(0,0,0,0.04);
+}
+.dropzone.started .message {
+  display: none;
+}
+.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 6px 6px;
+}
+.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-previews .preview .details .filename {
+  overflow: hidden;
+  height: 100%;
+}
+.dropzone .preview .details img,
+.dropzone-previews .preview .details img {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100px;
+  height: 100px;
+}
+.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-previews .preview.error .error-mark {
+  display: block;
+}
+.dropzone .preview.success .success-mark,
+.dropzone-previews .preview.success .success-mark {
+  display: block;
+}
+.dropzone .preview:hover .details img,
+.dropzone-previews .preview:hover .details img {
+  display: none;
+}
+.dropzone .preview:hover .success-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-previews .preview .success-mark,
+.dropzone .preview .error-mark,
+.dropzone-previews .preview .error-mark {
+  display: none;
+  position: absolute;
+  width: 40px;
+  height: 40px;
+  font-size: 30px;
+  text-align: center;
+  right: -10px;
+  top: -10px;
+}
+.dropzone .preview .success-mark,
+.dropzone-previews .preview .success-mark {
+  color: #8cc657;
+}
+.dropzone .preview .error-mark,
+.dropzone-previews .preview .error-mark {
+  color: #ee162d;
+}
+.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-previews .preview .progress .upload {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: 0%;
+  background-color: #8cc657;
+}
+.dropzone .preview.processing .progress,
+.dropzone-previews .preview.processing .progress {
+  display: block;
+}
+.dropzone .preview .error-message,
+.dropzone-previews .preview .error-message {
+  display: none;
+  position: absolute;
+  top: -5px;
+  left: -20px;
+  background: rgba(245,245,245,0.8);
+  padding: 8px 10px;
+  color: #800;
+  min-width: 140px;
+  max-width: 500px;
+  z-index: 500;
+}
+.dropzone .preview:hover.error .error-message,
+.dropzone-previews .preview:hover.error .error-message {
+  display: block;
+}
+.dropzone {
+  border: 1px solid rgba(0,0,0,0.03);
+  min-height: 360px;
+  -webkit-border-radius: 3px;
+  border-radius: 3px;
+  background: rgba(0,0,0,0.03);
+  padding: 23px;
+}
+.dropzone .default.message {
+  opacity: 1;
+  -ms-filter: none;
+  filter: none;
+  -webkit-transition: opacity 0.3s ease-in-out;
+  -moz-transition: opacity 0.3s ease-in-out;
+  -o-transition: opacity 0.3s ease-in-out;
+  -ms-transition: opacity 0.3s ease-in-out;
+  transition: opacity 0.3s ease-in-out;
+  background-image: image-path("dropzone/spritemap.png");
+  background-repeat: no-repeat;
+  background-position: 0 0;
+  position: absolute;
+  width: 428px;
+  height: 123px;
+  margin-left: -214px;
+  margin-top: -61.5px;
+  top: 50%;
+  left: 50%;
+}
+@media all and (-webkit-min-device-pixel-ratio: 1.5) {
+  .dropzone .default.message {
+    background-image: image-path("dropzone/spritemap@2x.png");
+    -webkit-background-size: 428px 406px;
+    -moz-background-size: 428px 406px;
+    background-size: 428px 406px;
+  }
+}
+.dropzone .default.message span {
+  display: none;
+}
+.dropzone.square .default.message {
+  background-position: 0 -123px;
+  width: 268px;
+  margin-left: -134px;
+  height: 174px;
+  margin-top: -87px;
+}
+.dropzone.drag-hover .message {
+  opacity: 0.15;
+  filter: alpha(opacity=15);
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)";
+}
+.dropzone.started .message {
+  display: block;
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+}
+.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-previews .preview .details img {
+  width: 100px;
+  height: 100px;
+}
+.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-previews .preview.success .success-mark {
+  opacity: 1;
+  -ms-filter: none;
+  filter: none;
+}
+.dropzone .preview.error .error-mark,
+.dropzone-previews .preview.error .error-mark {
+  opacity: 1;
+  -ms-filter: none;
+  filter: none;
+}
+.dropzone .preview.error .progress .upload,
+.dropzone-previews .preview.error .progress .upload {
+  background: #ee1e2d;
+}
+.dropzone .preview .error-mark,
+.dropzone-previews .preview .error-mark,
+.dropzone .preview .success-mark,
+.dropzone-previews .preview .success-mark {
+  display: block;
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+  -webkit-transition: opacity 0.4s ease-in-out;
+  -moz-transition: opacity 0.4s ease-in-out;
+  -o-transition: opacity 0.4s ease-in-out;
+  -ms-transition: opacity 0.4s ease-in-out;
+  transition: opacity 0.4s ease-in-out;
+  background-image: image-path("dropzone/spritemap.png");
+  background-repeat: no-repeat;
+}
+@media all and (-webkit-min-device-pixel-ratio: 1.5) {
+  .dropzone .preview .error-mark,
+  .dropzone-previews .preview .error-mark,
+  .dropzone .preview .success-mark,
+  .dropzone-previews .preview .success-mark {
+    background-image: image-path("dropzone/spritemap@2x.png");
+    -webkit-background-size: 428px 406px;
+    -moz-background-size: 428px 406px;
+    background-size: 428px 406px;
+  }
+}
+.dropzone .preview .error-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-previews .preview .error-mark {
+  background-position: -268px -123px;
+}
+.dropzone .preview .success-mark,
+.dropzone-previews .preview .success-mark {
+  background-position: -268px -163px;
+}
+.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;
+  -ms-animation: loading 0.4s linear infinite;
+  animation: loading 0.4s linear infinite;
+  -webkit-transition: width 0.3s ease-in-out;
+  -moz-transition: width 0.3s ease-in-out;
+  -o-transition: width 0.3s ease-in-out;
+  -ms-transition: width 0.3s ease-in-out;
+  transition: width 0.3s ease-in-out;
+  -webkit-border-radius: 2px;
+  border-radius: 2px;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 0%;
+  height: 100%;
+  background-image: image-path("dropzone/spritemap.png");
+  background-repeat: repeat-x;
+  background-position: 0px -400px;
+}
+@media all and (-webkit-min-device-pixel-ratio: 1.5) {
+  .dropzone .preview .progress .upload,
+  .dropzone-previews .preview .progress .upload {
+    background-image: image-path("dropzone/spritemap@2x.png");
+    -webkit-background-size: 428px 406px;
+    -moz-background-size: 428px 406px;
+    background-size: 428px 406px;
+  }
+}
+.dropzone .preview.success .progress,
+.dropzone-previews .preview.success .progress {
+  display: block;
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+  -webkit-transition: opacity 0.4s ease-in-out;
+  -moz-transition: opacity 0.4s ease-in-out;
+  -o-transition: opacity 0.4s ease-in-out;
+  -ms-transition: opacity 0.4s ease-in-out;
+  transition: opacity 0.4s ease-in-out;
+}
+.dropzone .preview .error-message,
+.dropzone-previews .preview .error-message {
+  display: block;
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+  -webkit-transition: opacity 0.3s ease-in-out;
+  -moz-transition: opacity 0.3s ease-in-out;
+  -o-transition: opacity 0.3s ease-in-out;
+  -ms-transition: opacity 0.3s ease-in-out;
+  transition: opacity 0.3s ease-in-out;
+}
+.dropzone .preview:hover.error .error-message,
+.dropzone-previews .preview:hover.error .error-message {
+  opacity: 1;
+  -ms-filter: none;
+  filter: none;
+}
+@-moz-keyframes loading {
+  0% {
+    background-position: 0 -400px;
+  }
+
+  100% {
+    background-position: -7px -400px;
+  }
+}
+@-webkit-keyframes loading {
+  0% {
+    background-position: 0 -400px;
+  }
+
+  100% {
+    background-position: -7px -400px;
+  }
+}
+@-o-keyframes loading {
+  0% {
+    background-position: 0 -400px;
+  }
+
+  100% {
+    background-position: -7px -400px;
+  }
+}
+@-ms-keyframes loading {
+  0% {
+    background-position: 0 -400px;
+  }
+
+  100% {
+    background-position: -7px -400px;
+  }
+}
+@keyframes loading {
+  0% {
+    background-position: 0 -400px;
+  }
+
+  100% {
+    background-position: -7px -400px;
+  }
+}

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: dropzonejs-rails
 version: !ruby/object:Gem::Version
-  version: 0.1.3
+  version: 0.1.4
 platform: ruby
 authors:
 - José Nahuel Cuesta Luengo
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-03-26 00:00:00.000000000 Z
+date: 2013-04-06 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -36,7 +36,11 @@ files:
 - lib/dropzonejs-rails/version.rb
 - lib/dropzonejs-rails.rb
 - lib/generators/dropzonejs-rails/install/install_generator.rb
+- vendor/assets/images/dropzone/spritemap.png
+- vendor/assets/images/dropzone/spritemap@2x.png
 - vendor/assets/javascripts/dropzone.js
+- vendor/assets/stylesheets/dropzone/basic.css.scss
+- vendor/assets/stylesheets/dropzone/dropzone.css.scss
 - LICENSE
 - Rakefile
 - README.md