Added an acceptParameter

Closes dropzone#63

downloads/dropzone-amd-module.js

@@ -223,6 +223,7 @@ Emitter.prototype.hasListeners = function(event){
       thumbnailHeight: 100,
       params: {},
       clickable: true,
+      acceptParameter: null,
       enqueueForUpload: true,
       previewsContainer: null,
       dictDefaultMessage: "Drop files here to upload",
@@ -413,6 +414,9 @@ Emitter.prototype.hasListeners = function(event){
           _this.hiddenFileInput = document.createElement("input");
           _this.hiddenFileInput.setAttribute("type", "file");
           _this.hiddenFileInput.setAttribute("multiple", "multiple");
+          if (_this.options.acceptParameter != null) {
+            _this.hiddenFileInput.setAttribute("accept", _this.options.acceptParameter);
+          }
           _this.hiddenFileInput.style.display = "none";
           document.body.appendChild(_this.hiddenFileInput);
           return _this.hiddenFileInput.addEventListener("change", function() {

downloads/dropzone.js

@@ -432,6 +432,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
       thumbnailHeight: 100,
       params: {},
       clickable: true,
+      acceptParameter: null,
       enqueueForUpload: true,
       previewsContainer: null,
       dictDefaultMessage: "Drop files here to upload",
@@ -622,6 +623,9 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
           _this.hiddenFileInput = document.createElement("input");
           _this.hiddenFileInput.setAttribute("type", "file");
           _this.hiddenFileInput.setAttribute("multiple", "multiple");
+          if (_this.options.acceptParameter != null) {
+            _this.hiddenFileInput.setAttribute("accept", _this.options.acceptParameter);
+          }
           _this.hiddenFileInput.style.display = "none";
           document.body.appendChild(_this.hiddenFileInput);
           return _this.hiddenFileInput.addEventListener("change", function() {

lib/dropzone.js

@@ -62,6 +62,7 @@
       thumbnailHeight: 100,
       params: {},
       clickable: true,
+      acceptParameter: null,
       enqueueForUpload: true,
       previewsContainer: null,
       dictDefaultMessage: "Drop files here to upload",
@@ -252,6 +253,9 @@
           _this.hiddenFileInput = document.createElement("input");
           _this.hiddenFileInput.setAttribute("type", "file");
           _this.hiddenFileInput.setAttribute("multiple", "multiple");
+          if (_this.options.acceptParameter != null) {
+            _this.hiddenFileInput.setAttribute("accept", _this.options.acceptParameter);
+          }
           _this.hiddenFileInput.style.display = "none";
           document.body.appendChild(_this.hiddenFileInput);
           return _this.hiddenFileInput.addEventListener("change", function() {

src/dropzone.coffee

@@ -80,6 +80,12 @@ class Dropzone extends Em
     # If true, the dropzone will present a file selector when clicked.
     clickable: yes
 
+    # If the dropzone is clickable, this will be added as `accept` parameter
+    # on the hidden file input element that serves as file selector when
+    # clicking the dropzone.
+    # This should be used in addition to the accept function.
+    acceptParameter: null # eg: "audio/*|video/*|image/*"
+
     # If false, files will not be added to the process queue automatically.
     # This can be useful if you need some additional user input before sending
     # files.
@@ -316,6 +322,7 @@ class Dropzone extends Em
         @hiddenFileInput = document.createElement "input"
         @hiddenFileInput.setAttribute "type", "file"
         @hiddenFileInput.setAttribute "multiple", "multiple"
+        @hiddenFileInput.setAttribute "accept", @options.acceptParameter if @options.acceptParameter?
         @hiddenFileInput.style.display = "none"
         document.body.appendChild @hiddenFileInput
         @hiddenFileInput.addEventListener "change", =>

test/test.coffee

@@ -186,10 +186,15 @@ describe "Dropzone", ->
   describe "init()", ->
     describe "clickable", ->
       element = Dropzone.createElement """<form action="/"></form>"""
-      dropzone = new Dropzone element, clickable: yes
+      dropzone = new Dropzone element, clickable: yes, acceptParameter: "audio/*|video/*"
       it "should create a hidden file input if clickable", ->
         dropzone.hiddenFileInput.should.be.ok
         dropzone.hiddenFileInput.tagName.should.equal "INPUT"
+      it "should use the acceptParameter", ->
+        dropzone.hiddenFileInput.getAttribute("accept").should.equal "audio/*|video/*"
+      it "should not add an accept attribute if no acceptParameter", ->
+        dropzone2 = new Dropzone (Dropzone.createElement """<form action="/"></form>"""), clickable: yes, acceptParameter: null
+        dropzone2.hiddenFileInput.hasAttribute("accept").should.be.false
       it "should create a new input element when something is selected to reset the input field", ->
         for i in [0..3]
           hiddenFileInput = dropzone.hiddenFileInput

test/test.js

@@ -276,12 +276,25 @@
 
         element = Dropzone.createElement("<form action=\"/\"></form>");
         dropzone = new Dropzone(element, {
-          clickable: true
+          clickable: true,
+          acceptParameter: "audio/*|video/*"
         });
         it("should create a hidden file input if clickable", function() {
           dropzone.hiddenFileInput.should.be.ok;
           return dropzone.hiddenFileInput.tagName.should.equal("INPUT");
         });
+        it("should use the acceptParameter", function() {
+          return dropzone.hiddenFileInput.getAttribute("accept").should.equal("audio/*|video/*");
+        });
+        it("should not add an accept attribute if no acceptParameter", function() {
+          var dropzone2;
+
+          dropzone2 = new Dropzone(Dropzone.createElement("<form action=\"/\"></form>"), {
+            clickable: true,
+            acceptParameter: null
+          });
+          return dropzone2.hiddenFileInput.hasAttribute("accept").should.be["false"];
+        });
         return it("should create a new input element when something is selected to reset the input field", function() {
           var event, hiddenFileInput, i, _i, _results;