js: remove outdated local storage data

Remove the invalid keys from local storage when the page loads.
Creating and deleting elements from the sidebar accumulates
dead entries in the local storage.

2 files changed, 25 insertions, 2 deletions

diff --git a/ogcp/static/js/ogcp.js b/ogcp/static/js/ogcp.js
index 96bf3d9..d445094 100644
--- a/ogcp/static/js/ogcp.js
+++ b/ogcp/static/js/ogcp.js
@@ -89,9 +89,28 @@ function setParentStatus(checkboxes) {
     });
 }
 
+function deleteInvalidStorageItems(items, context) {
+    const existingIds = items.map(function() {
+        return context + this.id;
+    }).get();
+
+    for (let i = 0; i < localStorage.length; i++) {
+        const key = localStorage.key(i);
+
+        if (!key.startsWith(context)) {
+            continue;
+        }
+        if (!existingIds.includes(key)) {
+            localStorage.removeItem(key);
+        }
+    }
+}
+
 function configureCommandCheckboxes(context) {
     const checkboxes = $('input:checkbox[form="scopesForm"]');
 
+    deleteInvalidStorageItems(checkboxes, context);
+
     // Ensure the form fields are sent
     $('#scopesForm').on('submit', function() {
         checkboxes.each(function() {
@@ -141,9 +160,11 @@ function keepSelectedClients(context) {
     const checkboxes = $('#sidebar input:checkbox')
 
     checkboxes.on('change', function (event) {
-            storeCheckboxStatus(this, context);
+        storeCheckboxStatus(this, context);
     });
 
+    deleteInvalidStorageItems(checkboxes, context);
+
     checkboxes.each(function () {
         if (localStorage.getItem(context + this.id) == 'check') {
             this.checked = true;
@@ -310,6 +331,8 @@ function checkFolderParent(context) {
 function limitCheckboxes(context) {
     const checkboxes = $('#sidebar input:checkbox');
 
+    deleteInvalidStorageItems(checkboxes, context);
+
     checkboxes.on('change', function () {
         const currentCheckbox = $(this);
         const currentParentRoom = currentCheckbox.attr('data-parent-room');
diff --git a/ogcp/templates/base.html b/ogcp/templates/base.html
index f245c8d..80a5f7a 100644
--- a/ogcp/templates/base.html
+++ b/ogcp/templates/base.html
@@ -111,7 +111,7 @@
     <!-- ChartJS -->
     <script src="{{ url_for('static', filename='AdminLTE/plugins/chart.js/Chart.min.js') }}"></script>
 
-    <script src="{{ url_for('static', filename='js/ogcp.js') }}?v=21"></script>
+    <script src="{{ url_for('static', filename='js/ogcp.js') }}?v=22"></script>
 
     <script>
         // error messages