Add multiple file input boxes on upload form

Signed-off-by: Florian Pritz <bluewind@xinu.at>

2 files changed, 36 insertions, 6 deletions

diff --git a/application/views/file/upload_form.php b/application/views/file/upload_form.php
index c5b28536c..612a1bf82 100644
--- a/application/views/file/upload_form.php
+++ b/application/views/file/upload_form.php
@@ -26,7 +26,9 @@
 				<h3 class="panel-title">File upload</h3>
 			</div>
 			<div class="panel-body">
-				<input class="file-upload" type="file" name="file[]" multiple="multiple"><br>
+				<div>
+					<input class="file-upload" type="file" name="file[]" multiple="multiple"><br>
+				</div>
 				<button type="submit" id="upload_button" class="btn btn-primary">Upload it!</button>
 			</div>
 		</div>
@@ -57,6 +59,7 @@
 <script type="text/javascript">
     /* <![CDATA[ */
 	var max_upload_size = "<?php echo $max_upload_size; ?>";
+	var max_files_per_upload = "<?php echo ini_get("max_file_uploads"); ?>";
     /* ]]> */
 </script>
 
diff --git a/data/js/script.js b/data/js/script.js
index 9e535643c..2c4969685 100644
--- a/data/js/script.js
+++ b/data/js/script.js
@@ -118,15 +118,26 @@ function fixedEncodeURIComponent (str) {
 		if (window.File && window.FileList) {
 			function checkFileUpload(evt) {
 				var sum = 0;
-				var files = evt.target.files;
+				var filenum = 0;
+				var files = [];
+
+				$('.file-upload').each(function() {
+					for (var i = 0; i < this.files.length; i++) {
+						var file = this.files[i];
+						files.push(file);
+					}
+				});
 
-				// TODO: check all forms, not only the one we are called from
 				for (var i = 0; i < files.length; i++) {
-					var f = evt.target.files[i];
+					var f = files[i];
 					sum += f.size;
+					filenum++;
 				}
 
-				if (sum > max_upload_size) {
+				if (filenum > max_files_per_upload) {
+					document.getElementById('upload_button').innerHTML = "Too many files";
+					document.getElementById('upload_button').disabled = true;
+				} else if (sum > max_upload_size) {
 					document.getElementById('upload_button').innerHTML = "File(s) too big";
 					document.getElementById('upload_button').disabled = true;
 				} else {
@@ -135,9 +146,25 @@ function fixedEncodeURIComponent (str) {
 				}
 			}
 
-			$('.file-upload').bind('change', checkFileUpload);
+			$(document).on('change', '.file-upload', checkFileUpload);
 		}
 
+		$(document).on("change", '.file-upload', function() {
+			var need_new = true;
+
+			$('.file-upload').each(function() {
+				if ($(this).prop("files").length == 0) {
+					need_new = false;
+					return;
+				}
+			});
+
+			if (need_new) {
+				$(this).parent().append('<input class="file-upload" type="file" name="file[]" multiple="multiple"><br>');
+			}
+
+		});
+
 		if (typeof $.tablesorter !== 'undefined') {
 			// source: https://projects.archlinux.org/archweb.git/tree/sitestatic/archweb.js
 			$.tablesorter.addParser({