Add delete support to thumbnail history

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

3 files changed, 54 insertions, 2 deletions

diff --git a/application/views/file/upload_history_thumbnails.php b/application/views/file/upload_history_thumbnails.php
index 55ee90191..f21ffcb23 100644
--- a/application/views/file/upload_history_thumbnails.php
+++ b/application/views/file/upload_history_thumbnails.php
@@ -1,10 +1,19 @@
+<div class="pull-right">
+	<?php echo form_open("file/do_delete/", array("id" => "delete_form", "style" => "display: inline")); ?>
+		<button class="btn btn-danger" id="delete_button" style="display: none">Delete selected</button>
+	</form>
+	<button class="btn" id="toggle_delete_mode" style="display: inline">Delete mode</button>
+</div>
+
 <?php include 'nav_history.php'; ?>
+
 <!-- Comment markers background: http://stackoverflow.com/a/14776780/953022 -->
 <div class="upload_history_thumbnails"><!--
 	<?php foreach($query as $key => $item): ?>
-		--><a href="<?php echo site_url("/".$item["id"]); ?>" title="<?php echo htmlentities($item["filename"]); ?>" data-content="<?php echo htmlentities($item["tooltip"]); ?>" ><img class="thumb" src="<?php echo site_url("file/thumbnail/".$item["id"]); ?>"></a><!--
+		--><a href="<?php echo site_url("/".$item["id"]); ?>" title="<?php echo htmlentities($item["filename"]); ?>" data-content="<?php echo htmlentities($item["tooltip"]); ?>" data-id="<?php echo $item["id"]; ?>"><img class="thumb" src="<?php echo site_url("file/thumbnail/".$item["id"]); ?>"></a><!--
 	<?php endforeach; ?>
---></div>
+	-->
+</div>
 
 <div class="row-fluid">
 	<div class="span12 alert alert-block alert-info">
diff --git a/data/css/style.css b/data/css/style.css
index ad956c57f..bcbcaafc5 100644
--- a/data/css/style.css
+++ b/data/css/style.css
@@ -238,6 +238,14 @@ body {
 	display: inline-block;
 }
 
+.upload_history_thumbnails .marked {
+	background: red;
+}
+
+.upload_history_thumbnails .marked img {
+	opacity: 0.4;
+}
+
 
 /* highlighting theme */
 .hll { background-color: #ffffcc }
diff --git a/data/js/script.js b/data/js/script.js
index f747941e5..ec5da9a2b 100644
--- a/data/js/script.js
+++ b/data/js/script.js
@@ -68,6 +68,41 @@ function fixedEncodeURIComponent (str) {
 			html: true,
 		});
 
+		$('#toggle_delete_mode').on("click", function() {
+			switch (window.page_mode) {
+				case "delete":
+					window.page_mode = "normal";
+					$('#delete_button').hide();
+					$("#delete_form input[id^='delete_']").remove();
+					$(".upload_history_thumbnails .marked").removeClass("marked");
+					break;
+				default:
+					window.page_mode = "delete";
+					$('#delete_button').show();
+					break;
+			}
+		});
+
+		$('.upload_history_thumbnails a').on("click", function(event) {
+			if (window.page_mode == "delete") {
+				event.preventDefault();
+				var data_id = $(event.target).parent().attr("data-id");
+
+				if ($('#delete_'+data_id).length == 0) {
+					$('<input>').attr({
+						type: "hidden",
+						name: "ids["+data_id+"]",
+						value: data_id,
+						id: "delete_"+data_id,
+					}).appendTo('#delete_form');
+					$(event.target).parent().addClass("marked");
+				} else {
+					$('#delete_'+data_id).remove();
+					$(event.target).parent().removeClass("marked");
+				}
+			}
+		});
+
 		function handle_resize() {
 			var div = $('.upload_history_thumbnails');
 			div.width(div.parent().width() - (div.parent().width() % div.find('a').outerWidth(true)));