update UI js

html/js/base_ts.js

@@ -8,7 +8,7 @@ var WS_AVAILABLE = false;
 var ACTIVE_MENU_ID = "";
 var LAST_FOCUSED_ELEMENT = null;
 var LAST_BULK_CHECKBOX = null;
-// Menü
+// Menu
 var menuItems = new Array();
 menuItems.push(new MainMenuItem("playlist", "{{.mainMenu.item.playlist}}", "m3u.png", "{{.mainMenu.headline.playlist}}"));
 //menuItems.push(new MainMenuItem("pmsID", "{{.mainMenu.item.pmsID}}", "number.png", "{{.mainMenu.headline.pmsID}}"))
@@ -184,7 +184,17 @@ function getAllSelectedChannels() {
     }
     return channels;
 }
-function selectChannelRange(checkbox, event) {
+function scheduleChannelRangeSelection(checkbox, event) {
+    var shiftPressed = false;
+    if (event != undefined && event.shiftKey == true) {
+        shiftPressed = true;
+    }
+    // Run after the native checkbox toggle so we copy the final checked state.
+    setTimeout(function () {
+        selectChannelRange(checkbox, shiftPressed);
+    }, 0);
+}
+function selectChannelRange(checkbox, shiftPressed) {
     if (BULK_EDIT == false || checkbox == undefined || checkbox == null) {
         return;
     }
@@ -207,7 +217,7 @@ function selectChannelRange(checkbox, event) {
     if (LAST_BULK_CHECKBOX != null) {
         previousIndex = visibleCheckboxes.indexOf(LAST_BULK_CHECKBOX);
     }
-    if (event != undefined && event.shiftKey == true && previousIndex > -1 && currentIndex > -1) {
+    if (shiftPressed == true && previousIndex > -1 && currentIndex > -1) {
         var start = Math.min(previousIndex, currentIndex);
         var end = Math.max(previousIndex, currentIndex);
         for (var i = start; i <= end; i++) {

html/js/menu_ts.js

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

ts/base_ts.ts

@@ -183,7 +183,20 @@ function getAllSelectedChannels():string[] {
   return channels
 }
 
-function selectChannelRange(checkbox:HTMLInputElement, event:MouseEvent) {
+function scheduleChannelRangeSelection(checkbox:HTMLInputElement, event:MouseEvent) {
+
+  var shiftPressed = false
+  if (event != undefined && event.shiftKey == true) {
+    shiftPressed = true
+  }
+
+  // Run after the native checkbox toggle so we copy the final checked state.
+  setTimeout(function() {
+    selectChannelRange(checkbox, shiftPressed)
+  }, 0)
+}
+
+function selectChannelRange(checkbox:HTMLInputElement, shiftPressed:boolean) {
 
   if (BULK_EDIT == false || checkbox == undefined || checkbox == null) {
     return
@@ -212,7 +225,7 @@ function selectChannelRange(checkbox:HTMLInputElement, event:MouseEvent) {
     previousIndex = visibleCheckboxes.indexOf(LAST_BULK_CHECKBOX)
   }
 
-  if (event != undefined && event.shiftKey == true && previousIndex > -1 && currentIndex > -1) {
+  if (shiftPressed == true && previousIndex > -1 && currentIndex > -1) {
     var start = Math.min(previousIndex, currentIndex)
     var end = Math.max(previousIndex, currentIndex)
     for (var i = start; i <= end; i++) {

ts/menu_ts.ts

@@ -562,7 +562,9 @@ class Cell {
           (element as HTMLInputElement).checked = this.value;
           (element as HTMLInputElement).type = "checkbox";
           (element as HTMLInputElement).className = "bulk hideBulk";
-          (element as HTMLInputElement).setAttribute("onclick", "javascript: selectChannelRange(this, event)")
+          (element as HTMLInputElement).addEventListener("click", function(event) {
+            scheduleChannelRangeSelection((element as HTMLInputElement), (event as MouseEvent))
+          })
           break
 
         case "BULK_HEAD":