add soft init to reassign events

ereuse_devicehub/static/js/main_inventory.build.js

@@ -95,10 +95,27 @@ var _tableRowsPage = {
   writable: true,
   value: () => table.pages[table.rows().dt.currentPage - 1]
 };
-window.addEventListener("DOMContentLoaded", () => {
+
+const selectorController = action => {
   const btnSelectAll = document.getElementById("SelectAllBTN");
   const alertInfoDevices = document.getElementById("select-devices-info");
 
+  function softInit() {
+    TableController.getAllDevices().forEach(item => {
+      item.addEventListener("click", itemListCheckChanged);
+    }); // https://github.com/fiduswriter/Simple-DataTables/wiki/Events
+
+    table.on("datatable.page", () => itemListCheckChanged());
+    table.on("datatable.perpage", () => itemListCheckChanged());
+    table.on("datatable.update", () => itemListCheckChanged());
+  }
+
+  if (action == "softInit") {
+    softInit();
+    itemListCheckChanged();
+    return;
+  }
+
   function itemListCheckChanged() {
     alertInfoDevices.innerHTML = "Selected devices: ".concat(TableController.getSelectedDevices().length, "\n            ").concat(TableController.getAllDevices().length != TableController.getSelectedDevices().length ? "<a href=\"#\" class=\"ml-3\">Select all devices (".concat(TableController.getAllDevices().length, ")</a>") : "<a href=\"#\" class=\"ml-3\">Cancel selection</a>");
 
@@ -128,9 +145,6 @@ window.addEventListener("DOMContentLoaded", () => {
     get_device_list();
   }
 
-  TableController.getAllDevices().forEach(item => {
-    item.addEventListener("click", itemListCheckChanged);
-  });
   btnSelectAll.addEventListener("click", event => {
     const checkedState = event.target.checked;
     TableController.getAllDevicesInCurrentPage().forEach(ckeckbox => {
@@ -144,13 +158,12 @@ window.addEventListener("DOMContentLoaded", () => {
       ckeckbox.checked = !checkState;
     });
     itemListCheckChanged();
-  }); // https://github.com/fiduswriter/Simple-DataTables/wiki/Events
-
-  table.on("datatable.page", () => itemListCheckChanged());
-  table.on("datatable.perpage", () => itemListCheckChanged());
-  table.on("datatable.update", () => itemListCheckChanged());
-  itemListCheckChanged();
   });
+  softInit();
+  itemListCheckChanged();
+};
+
+window.addEventListener("DOMContentLoaded", () => selectorController());
 
 function deviceSelect() {
   const devices_count = TableController.getSelectedDevices().length;
@@ -467,20 +480,13 @@ async function processSelectedDevices() {
       oldTable.parentElement.replaceChild(newTable, oldTable);
       table = new simpleDatatables.DataTable(newTable, {
         perPage: 20
-      }); // https://github.com/fiduswriter/Simple-DataTables/wiki/rows()#removeselect-arraynumber
+      }); // // Restore state of checkbox
-      // const rowsToRemove = []
-      // for (let i = 0; i < table.activeRows.length; i++) {
-      //     const row = table.activeRows[i];
-      //     if (!newTable.includes(row.querySelector("input").attributes["data-device-dhid"].value)) {
-      //         rowsToRemove.push(i)
-      //     }
-      // }
-      // table.rows().remove(rowsToRemove);
-      // // Restore state of checkbox
 
       const selectAllBTN = document.getElementById("SelectAllBTN");
       selectAllBTN.checked = false;
-      selectAllBTN.indeterminate = false;
+      selectAllBTN.indeterminate = false; // Re-init SelectorController
+
+      selectorController("softInit");
     }
 
   }

ereuse_devicehub/static/js/main_inventory.js

@@ -78,10 +78,28 @@ class TableController {
 /**
  * Select all functionality
  */
-window.addEventListener("DOMContentLoaded", () => {
+
+const selectorController = (action) => {
     const btnSelectAll = document.getElementById("SelectAllBTN");
     const alertInfoDevices = document.getElementById("select-devices-info");
 
+    function softInit() {
+        TableController.getAllDevices().forEach(item => {
+            item.addEventListener("click", itemListCheckChanged);
+        })
+
+        // https://github.com/fiduswriter/Simple-DataTables/wiki/Events
+        table.on("datatable.page", () => itemListCheckChanged());
+        table.on("datatable.perpage", () => itemListCheckChanged());
+        table.on("datatable.update", () => itemListCheckChanged());
+    }
+    
+    if (action == "softInit") {
+        softInit();
+        itemListCheckChanged();
+        return;
+    }
+
     function itemListCheckChanged() {
         alertInfoDevices.innerHTML = `Selected devices: ${TableController.getSelectedDevices().length}
             ${TableController.getAllDevices().length != TableController.getSelectedDevices().length
@@ -115,10 +133,6 @@ window.addEventListener("DOMContentLoaded", () => {
         get_device_list();
     }
     
-    TableController.getAllDevices().forEach(item => {
-        item.addEventListener("click", itemListCheckChanged);
-    })
-
     btnSelectAll.addEventListener("click", event => {
         const checkedState = event.target.checked;
         TableController.getAllDevicesInCurrentPage().forEach(ckeckbox => { ckeckbox.checked = checkedState });
@@ -131,13 +145,12 @@ window.addEventListener("DOMContentLoaded", () => {
         itemListCheckChanged()
     })
 
-    // https://github.com/fiduswriter/Simple-DataTables/wiki/Events
+    softInit();
-    table.on("datatable.page", () => itemListCheckChanged());
-    table.on("datatable.perpage", () => itemListCheckChanged());
-    table.on("datatable.update", () => itemListCheckChanged());
 
     itemListCheckChanged();
-})
+}
+
+window.addEventListener("DOMContentLoaded", () => selectorController());
 
 function deviceSelect() {
     const devices_count = TableController.getSelectedDevices().length;
@@ -439,6 +452,9 @@ async function processSelectedDevices() {
             const selectAllBTN = document.getElementById("SelectAllBTN");
             selectAllBTN.checked = false;
             selectAllBTN.indeterminate = false;
+
+            // Re-init SelectorController
+            selectorController("softInit");
         }
     }