webbox: Selection via checkbox

3 files changed, 23 insertions, 6 deletions

diff --git a/plugins/webbox/TODO b/plugins/webbox/TODO
index 452a569..ffa32db 100644
--- a/plugins/webbox/TODO
+++ b/plugins/webbox/TODO
@@ -2,7 +2,6 @@ Prio 1 (for next version)
 ======
 
 generate download link for selected file
-selection button for files/dirs
 gallery
 Info if not selected: all
 Copy function
@@ -15,6 +14,4 @@ google pagespeed insights https://developers.google.com/speed/pagespeed/insights
 chromecast
 player
 i18n
-forward/back button
 list: more info if appropriate, number of files, limit(?)
-about page
diff --git a/plugins/webbox/html/webbox.css b/plugins/webbox/html/webbox.css
index 89f4885..859fade 100644
--- a/plugins/webbox/html/webbox.css
+++ b/plugins/webbox/html/webbox.css
@@ -199,6 +199,10 @@ table.list td {
 	border-color: #808080;
 }
 
+table.list td.selector {
+	width: 20px;
+}
+
 table.list td.type {
 	width: 30px;
 }
diff --git a/plugins/webbox/html/webbox.js b/plugins/webbox/html/webbox.js
index 602f76d..7ded25f 100644
--- a/plugins/webbox/html/webbox.js
+++ b/plugins/webbox/html/webbox.js
@@ -49,10 +49,13 @@ function loadContents(dir) {
 					type = "";
 				}
 
-				result += "<tr " +
+				mouseupdown =
 					"onmousedown=\"entryMouseDown('" + listElements[i].textContent + "')\" " +
-					"onmouseup=\"entryMouseUp('" + listElements[i].textContent + "')\"" +
-				"><td class=\"type\">" + type + "</td><td class=\"name\">" + listElements[i].textContent + "</td></tr>";
+					"onmouseup=\"entryMouseUp('" + listElements[i].textContent + "')\"";
+				result += "<tr>" +
+					"<td class=\"selector\" onclick=\"toggleSelection('" + listElements[i].textContent + "')\">&#9744;</td>" +
+					"<td class=\"type\" " + mouseupdown + ">" + type + "</td>" +
+					"<td class=\"name\" " + mouseupdown + ">" + listElements[i].textContent + "</td></tr>";
 			}
 		}
 
@@ -137,6 +140,9 @@ function clearSelection(filename) {
 		row.classList.remove("selectedrow");
 		numberOfSelectedRows--;
 	}
+	
+	var selectorElement = row.getElementsByClassName("selector")[0];
+	selectorElement.innerHTML = "&#9744;";
 }
 
 function setSelection(filename) {
@@ -150,6 +156,9 @@ function setSelection(filename) {
 		row.classList.add("selectedrow");
 		numberOfSelectedRows++;
 	}
+	
+	var selectorElement = row.getElementsByClassName("selector")[0];
+	selectorElement.innerHTML = "&#9745;";
 }
 
 function toggleSelection(filename) {
@@ -159,13 +168,20 @@ function toggleSelection(filename) {
 
 	var row = getRow(filename);
 
+	var selector_sign;
+
 	if (row.classList.contains("selectedrow")) {
 		row.classList.remove("selectedrow");
 		numberOfSelectedRows--;
+		selector_sign = "&#9744;"
 	} else {
 		row.classList.add("selectedrow");
 		numberOfSelectedRows++;
+		selector_sign = "&#9745;"
 	}
+
+	var selectorElement = row.getElementsByClassName("selector")[0];
+	selectorElement.innerHTML = selector_sign;
 }
 
 function mouseTimeoutFunction(filename) {