Skip to content

Commit d7954e5

Browse files
enyoenyo
committed
Specifying multiple clickable elements is now possible.
Closes dropzone#145
1 parent 361b779 commit d7954e5

8 files changed

+393
-111
lines changed

‎downloads/dropzone-amd-module.js

Lines changed: 62 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -410,28 +410,18 @@ Emitter.prototype.hasListeners = function(event){
410410
fallback.parentNode.removeChild(fallback);
411411
}
412412
if (this.options.previewsContainer) {
413-
if (typeof this.options.previewsContainer === "string") {
414-
this.previewsContainer = document.querySelector(this.options.previewsContainer);
415-
} else if (this.options.previewsContainer.nodeType != null) {
416-
this.previewsContainer = this.options.previewsContainer;
417-
}
418-
if (this.previewsContainer == null) {
419-
throw new Error("Invalid `previewsContainer` option provided. Please provide a CSS selector or a plain HTML element.");
420-
}
413+
this.previewsContainer = Dropzone.getElement(this.options.previewsContainer, "previewsContainer");
421414
} else {
422415
this.previewsContainer = this.element;
423416
}
424417
if (this.options.clickable) {
425418
if (this.options.clickable === true) {
426-
this.clickableElement = this.element;
427-
} else if (typeof this.options.clickable === "string") {
428-
this.clickableElement = document.querySelector(this.options.clickable);
429-
} else if (this.options.clickable.nodeType != null) {
430-
this.clickableElement = this.options.clickable;
431-
}
432-
if (!this.clickableElement) {
433-
throw new Error("Invalid `clickable` element provided. Please set it to `true`, a plain HTML element or a valid CSS selector.");
419+
this.clickableElements = [this.element];
420+
} else {
421+
this.clickableElements = Dropzone.getElements(this.options.clickable, "clickable");
434422
}
423+
} else {
424+
this.clickableElements = [];
435425
}
436426
this.init();
437427
}
@@ -446,7 +436,7 @@ Emitter.prototype.hasListeners = function(event){
446436
if (this.element.classList.contains("dropzone") && !this.element.querySelector("[data-dz-message]")) {
447437
this.element.appendChild(Dropzone.createElement("<div class=\"dz-default dz-message\" data-dz-message><span>" + this.options.dictDefaultMessage + "</span></div>"));
448438
}
449-
if (this.clickableElement) {
439+
if (this.clickableElements.length) {
450440
setupHiddenFileInput = function() {
451441
if (_this.hiddenFileInput) {
452442
document.body.removeChild(_this.hiddenFileInput);
@@ -541,18 +531,18 @@ Emitter.prototype.hasListeners = function(event){
541531
}
542532
}
543533
];
544-
if (this.clickableElement) {
545-
this.listeners.push({
546-
element: this.clickableElement,
534+
this.clickableElements.forEach(function(clickableElement) {
535+
return _this.listeners.push({
536+
element: clickableElement,
547537
events: {
548538
"click": function(evt) {
549-
if ((_this.clickableElement !== _this.element) || (evt.target === _this.element || Dropzone.elementInside(evt.target, _this.element.querySelector(".dz-message")))) {
539+
if ((clickableElement !== _this.element) || (evt.target === _this.element || Dropzone.elementInside(evt.target, _this.element.querySelector(".dz-message")))) {
550540
return _this.hiddenFileInput.click();
551541
}
552542
}
553543
}
554544
});
555-
}
545+
});
556546
this.enable();
557547
return this.options.init.call(this);
558548
};
@@ -646,18 +636,18 @@ Emitter.prototype.hasListeners = function(event){
646636
};
647637

648638
Dropzone.prototype.disable = function() {
649-
if (this.clickableElement === this.element) {
650-
this.element.classList.remove("dz-clickable");
651-
}
639+
this.clickableElements.forEach(function(element) {
640+
return element.classList.remove("dz-clickable");
641+
});
652642
this.removeEventListeners();
653643
this.filesProcessing = [];
654644
return this.filesQueue = [];
655645
};
656646

657647
Dropzone.prototype.enable = function() {
658-
if (this.clickableElement === this.element) {
659-
this.element.classList.add("dz-clickable");
660-
}
648+
this.clickableElements.forEach(function(element) {
649+
return element.classList.add("dz-clickable");
650+
});
661651
return this.setupEventListeners();
662652
};
663653

@@ -1046,6 +1036,50 @@ Emitter.prototype.hasListeners = function(event){
10461036
return false;
10471037
};
10481038

1039+
Dropzone.getElement = function(el, name) {
1040+
var element;
1041+
1042+
if (typeof el === "string") {
1043+
element = document.querySelector(el);
1044+
} else if (el.nodeType != null) {
1045+
element = el;
1046+
}
1047+
if (element == null) {
1048+
throw new Error("Invalid `" + name + "` option provided. Please provide a CSS selector or a plain HTML element.");
1049+
}
1050+
return element;
1051+
};
1052+
1053+
Dropzone.getElements = function(els, name) {
1054+
var e, el, elements, _i, _j, _len, _len1, _ref;
1055+
1056+
if (els instanceof Array) {
1057+
elements = [];
1058+
try {
1059+
for (_i = 0, _len = els.length; _i < _len; _i++) {
1060+
el = els[_i];
1061+
elements.push(this.getElement(el, name));
1062+
}
1063+
} catch (_error) {
1064+
e = _error;
1065+
elements = null;
1066+
}
1067+
} else if (typeof els === "string") {
1068+
elements = [];
1069+
_ref = document.querySelectorAll(els);
1070+
for (_j = 0, _len1 = _ref.length; _j < _len1; _j++) {
1071+
el = _ref[_j];
1072+
elements.push(el);
1073+
}
1074+
} else if (els.nodeType != null) {
1075+
elements = [els];
1076+
}
1077+
if (!((elements != null) && elements.length)) {
1078+
throw new Error("Invalid `" + name + "` option provided. Please provide a CSS selector, a plain HTML element or a list of those.");
1079+
}
1080+
return elements;
1081+
};
1082+
10491083
Dropzone.isValidMimeType = function(mimeType, acceptedMimeTypes) {
10501084
var baseMimeType, validMimeType, _i, _len;
10511085

‎downloads/dropzone-amd-module.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎downloads/dropzone.js

Lines changed: 62 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -619,28 +619,18 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
619619
fallback.parentNode.removeChild(fallback);
620620
}
621621
if (this.options.previewsContainer) {
622-
if (typeof this.options.previewsContainer === "string") {
623-
this.previewsContainer = document.querySelector(this.options.previewsContainer);
624-
} else if (this.options.previewsContainer.nodeType != null) {
625-
this.previewsContainer = this.options.previewsContainer;
626-
}
627-
if (this.previewsContainer == null) {
628-
throw new Error("Invalid `previewsContainer` option provided. Please provide a CSS selector or a plain HTML element.");
629-
}
622+
this.previewsContainer = Dropzone.getElement(this.options.previewsContainer, "previewsContainer");
630623
} else {
631624
this.previewsContainer = this.element;
632625
}
633626
if (this.options.clickable) {
634627
if (this.options.clickable === true) {
635-
this.clickableElement = this.element;
636-
} else if (typeof this.options.clickable === "string") {
637-
this.clickableElement = document.querySelector(this.options.clickable);
638-
} else if (this.options.clickable.nodeType != null) {
639-
this.clickableElement = this.options.clickable;
640-
}
641-
if (!this.clickableElement) {
642-
throw new Error("Invalid `clickable` element provided. Please set it to `true`, a plain HTML element or a valid CSS selector.");
628+
this.clickableElements = [this.element];
629+
} else {
630+
this.clickableElements = Dropzone.getElements(this.options.clickable, "clickable");
643631
}
632+
} else {
633+
this.clickableElements = [];
644634
}
645635
this.init();
646636
}
@@ -655,7 +645,7 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
655645
if (this.element.classList.contains("dropzone") && !this.element.querySelector("[data-dz-message]")) {
656646
this.element.appendChild(Dropzone.createElement("<div class=\"dz-default dz-message\" data-dz-message><span>" + this.options.dictDefaultMessage + "</span></div>"));
657647
}
658-
if (this.clickableElement) {
648+
if (this.clickableElements.length) {
659649
setupHiddenFileInput = function() {
660650
if (_this.hiddenFileInput) {
661651
document.body.removeChild(_this.hiddenFileInput);
@@ -750,18 +740,18 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
750740
}
751741
}
752742
];
753-
if (this.clickableElement) {
754-
this.listeners.push({
755-
element: this.clickableElement,
743+
this.clickableElements.forEach(function(clickableElement) {
744+
return _this.listeners.push({
745+
element: clickableElement,
756746
events: {
757747
"click": function(evt) {
758-
if ((_this.clickableElement !== _this.element) || (evt.target === _this.element || Dropzone.elementInside(evt.target, _this.element.querySelector(".dz-message")))) {
748+
if ((clickableElement !== _this.element) || (evt.target === _this.element || Dropzone.elementInside(evt.target, _this.element.querySelector(".dz-message")))) {
759749
return _this.hiddenFileInput.click();
760750
}
761751
}
762752
}
763753
});
764-
}
754+
});
765755
this.enable();
766756
return this.options.init.call(this);
767757
};
@@ -855,18 +845,18 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
855845
};
856846

857847
Dropzone.prototype.disable = function() {
858-
if (this.clickableElement === this.element) {
859-
this.element.classList.remove("dz-clickable");
860-
}
848+
this.clickableElements.forEach(function(element) {
849+
return element.classList.remove("dz-clickable");
850+
});
861851
this.removeEventListeners();
862852
this.filesProcessing = [];
863853
return this.filesQueue = [];
864854
};
865855

866856
Dropzone.prototype.enable = function() {
867-
if (this.clickableElement === this.element) {
868-
this.element.classList.add("dz-clickable");
869-
}
857+
this.clickableElements.forEach(function(element) {
858+
return element.classList.add("dz-clickable");
859+
});
870860
return this.setupEventListeners();
871861
};
872862

@@ -1255,6 +1245,50 @@ require.register("dropzone/lib/dropzone.js", function(exports, require, module){
12551245
return false;
12561246
};
12571247

1248+
Dropzone.getElement = function(el, name) {
1249+
var element;
1250+
1251+
if (typeof el === "string") {
1252+
element = document.querySelector(el);
1253+
} else if (el.nodeType != null) {
1254+
element = el;
1255+
}
1256+
if (element == null) {
1257+
throw new Error("Invalid `" + name + "` option provided. Please provide a CSS selector or a plain HTML element.");
1258+
}
1259+
return element;
1260+
};
1261+
1262+
Dropzone.getElements = function(els, name) {
1263+
var e, el, elements, _i, _j, _len, _len1, _ref;
1264+
1265+
if (els instanceof Array) {
1266+
elements = [];
1267+
try {
1268+
for (_i = 0, _len = els.length; _i < _len; _i++) {
1269+
el = els[_i];
1270+
elements.push(this.getElement(el, name));
1271+
}
1272+
} catch (_error) {
1273+
e = _error;
1274+
elements = null;
1275+
}
1276+
} else if (typeof els === "string") {
1277+
elements = [];
1278+
_ref = document.querySelectorAll(els);
1279+
for (_j = 0, _len1 = _ref.length; _j < _len1; _j++) {
1280+
el = _ref[_j];
1281+
elements.push(el);
1282+
}
1283+
} else if (els.nodeType != null) {
1284+
elements = [els];
1285+
}
1286+
if (!((elements != null) && elements.length)) {
1287+
throw new Error("Invalid `" + name + "` option provided. Please provide a CSS selector, a plain HTML element or a list of those.");
1288+
}
1289+
return elements;
1290+
};
1291+
12581292
Dropzone.isValidMimeType = function(mimeType, acceptedMimeTypes) {
12591293
var baseMimeType, validMimeType, _i, _len;
12601294

‎downloads/dropzone.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)