Fixes #36 unselect items on filter changes

static/public/js/filters.js

@@ -1,6 +1,6 @@
 
 window.FilterManager = (() => {
-    class FilterManager {
+    class FilterManager extends EventTarget {
         #updateFilter() {
             for (let i of MediaStorage.Instance.medias) {
                 if (!i.ui)
@@ -10,7 +10,7 @@ window.FilterManager = (() => {
                 else
                     i.ui.root.classList.add("filtered");
             }
-            MediaStorage.Instance.onFilterUpdated();
+            this.dispatchEvent(new CustomEvent("filterUpdated"));
 
             if (this.isFiltering())
                 document.body.classList.add("filter-active");

static/public/js/medias.js

@@ -102,6 +102,8 @@ class MediaStorage extends EventTarget
     constructor() {
         super();
         this.#reset();
+        window.FilterManager.addEventListener('filterUpdated', () => this.dispatchEvent(new CustomEvent("rebuildMedia")));
+
     }
 
     #reset() {
@@ -253,10 +255,6 @@ class MediaStorage extends EventTarget
         }
     }
 
-    onFilterUpdated() {
-        this.dispatchEvent(new CustomEvent("rebuildMedia"));
-    }
-
     getMediaIndex(media) {
         return this.medias.indexOf(media);
     }

static/public/js/uiMedia.js

@@ -139,6 +139,14 @@ $(() => {
     const displayItemBatchCount = 15;
     let targetDisplayedItems = displayItemBatchCount;
 
+    function unselectAll() {
+        for (let i of selectedThumbnails) {
+            let media = MediaStorage.Instance.getMediaLocal(i);
+            setSelectionCheckboxValue(media, false);
+        }
+        lastSelection = null;
+    }
+
     function redraw(container, media) {
         buildThumbnail(media);
         if (!media.ui)
@@ -167,11 +175,7 @@ $(() => {
         lastItemDisplayed = null;
         displayedItemCount = 0;
         targetDisplayedItems = displayItemBatchCount;
-        for (let i of selectedThumbnails) {
-            let media = MediaStorage.Instance.getMediaLocal(i);
-            media?.ui?.setSelectionCheckboxValue(media, false);
-        }
-        lastSelection = null;
+        unselectAll();
         for (let i of MediaStorage.Instance.medias)
             if (window.FilterManager.match(i)) {
                 redraw(newContainer, i);
@@ -180,6 +184,8 @@ $(() => {
             }
     });
 
+    FilterManager.addEventListener('filterUpdated', unselectAll);
+
     MediaStorage.Instance.addEventListener("newMedia", (evt) => {
         if (displayedItemCount < targetDisplayedItems && window.FilterManager.match(evt.detail)) {
             let container = document.getElementById('pch-mediaList');

templates/_footer.js

@@ -10,9 +10,9 @@ module.exports = `
 
 <script src="/public/js/taskQueue.js"></script>
 <script src="/public/js/access.js"></script>
+<script src="/public/js/filters.js"></script>
 <script src="/public/js/medias.js"></script>
 <script src="/public/js/indexedCache.js"></script>
-<script src="/public/js/filters.js"></script>
 <script src="/public/js/uiCommon.js"></script>
 <script src="/public/js/uiMedia.js"></script>
 <script src="/public/js/uiMediaFullpage.js"></script>