improve ui checkbox functionality

html/js/base_ts.js

@@ -7,6 +7,7 @@ var SERVER_CONNECTION = false;
 var WS_AVAILABLE = false;
 var ACTIVE_MENU_ID = "";
 var LAST_FOCUSED_ELEMENT = null;
+var LAST_BULK_CHECKBOX = null;
 // Menü
 var menuItems = new Array();
 menuItems.push(new MainMenuItem("playlist", "{{.mainMenu.item.playlist}}", "m3u.png", "{{.mainMenu.headline.playlist}}"));
@@ -183,6 +184,38 @@ function getAllSelectedChannels() {
     }
     return channels;
 }
+function selectChannelRange(checkbox, event) {
+    if (BULK_EDIT == false || checkbox == undefined || checkbox == null) {
+        return;
+    }
+    var table = document.getElementById("content_table");
+    if (table == null) {
+        return;
+    }
+    var trs = table.getElementsByTagName("TR");
+    var visibleCheckboxes = new Array();
+    for (var i = 1; i < trs.length; i++) {
+        if (trs[i].style.display != "none") {
+            var bulkCheckbox = trs[i].querySelector("input.bulk");
+            if (bulkCheckbox != null) {
+                visibleCheckboxes.push(bulkCheckbox);
+            }
+        }
+    }
+    var currentIndex = visibleCheckboxes.indexOf(checkbox);
+    var previousIndex = -1;
+    if (LAST_BULK_CHECKBOX != null) {
+        previousIndex = visibleCheckboxes.indexOf(LAST_BULK_CHECKBOX);
+    }
+    if (event != undefined && event.shiftKey == true && previousIndex > -1 && currentIndex > -1) {
+        var start = Math.min(previousIndex, currentIndex);
+        var end = Math.max(previousIndex, currentIndex);
+        for (var i = start; i <= end; i++) {
+            visibleCheckboxes[i].checked = checkbox.checked;
+        }
+    }
+    LAST_BULK_CHECKBOX = checkbox;
+}
 function selectAllChannels() {
     var bulk = false;
     var trs = document.getElementById("content_table").getElementsByTagName("TR");
@@ -201,6 +234,7 @@ function selectAllChannels() {
             }
         }
     }
+    LAST_BULK_CHECKBOX = null;
     return;
 }
 function bulkEdit() {
@@ -219,6 +253,7 @@ function bulkEdit() {
         rows[i].className = className;
         rows[i].checked = false;
     }
+    LAST_BULK_CHECKBOX = null;
     return;
 }
 function sortTable(column) {

html/js/menu_ts.js

@@ -467,6 +467,7 @@ var Cell = /** @class */ (function () {
                     element.checked = this.value;
                     element.type = "checkbox";
                     element.className = "bulk hideBulk";
+                    element.setAttribute("onclick", "javascript: selectChannelRange(this, event)");
                     break;
                 case "BULK_HEAD":
                     element = document.createElement("INPUT");