Jake Vanderwerf
2025-12-23 25be5747a6e462a3d09fc6607b3639b79e4d9374
src/feed/view.js
@@ -55,7 +55,7 @@
            favourites: '[data-filter="favourites"]',
            taxonomy: '[data-filter^="taxonomy"]'
         },
         selectedTax: '.selected-terms',
         selectedTax: '.selected-items',
         clearFilter: 'button.clear-filters',
         loadMore: 'button.load-more',
         filterContainer: '.filters',
@@ -89,24 +89,39 @@
      buttons.forEach((button) => {
         const taxonomy = button.dataset.taxonomy;
         this.currentTaxonomies.add(taxonomy);
         this.selector.registerFilterButton(button, {
            button: button,
            buttonSelector: '[data-filter="taxonomy"]',
            selected: this.ui.selectedTax
         });
         // Add preload listeners
         this.addTaxonomyPreloadListeners(button, taxonomy);
      });
      // Make this non-blocking
      setTimeout(() => {
         this.selector.batchFetchTaxonomies();
         this.selector.isInitializing = false;
      }, 0);
      this.selector.isInitializing = false;
      this.selector.subscribe((event, data) => {
         if (event === 'selected-terms') this.handleTaxonomyChange(data);
      });
   }
   addTaxonomyPreloadListeners(button, taxonomy) {
      const preload = () => {
         this.selector.preloadTaxonomy(taxonomy);
      };
      // Desktop hover
      button.addEventListener('mouseenter', preload, { once: true });
      // Touch/keyboard (fires before click)
      button.addEventListener('pointerdown', preload, { once: true });
      // Keyboard focus
      button.addEventListener('focus', preload, { once: true });
   }
   handleTaxonomyChange(data) {
      const { terms, taxonomy } = data;
@@ -177,10 +192,10 @@
   }
   initStore() {
      this.addPlaceholders();
      this.store = window.jvbStore.register(
      const store = window.jvbStore.register(
         'feed',
         {
            storeName: 'feed',
            endpoint: 'feed',
            keyPath: 'id',
            indexes: [
@@ -197,6 +212,7 @@
            delayFetch: true
         }
      );
      this.store = store.feed;
      this.store.subscribe((event, data) => {
         switch (event) {
@@ -317,7 +333,6 @@
      let items = this.store.getFiltered();
      if (this.store.filters['page'] === 1) {
         window.removeChildren(this.ui.grid);
         this.addPlaceholders();
      }
      if (items.length === 0) {
@@ -362,8 +377,8 @@
         this.a11y.announceItems(0, this.store.filters['page'] >1, false);
      }
      this.ui.filters.match.hidden = window.isEmptyObject(this.taxonomyFilters);
      this.ui.clearFilter.hidden = window.isEmptyObject(this.taxonomyFilters);
      this.ui.filters.match.hidden = Object.keys(this.taxonomyFilters).length === 0;
      this.ui.clearFilter.hidden = Object.keys(this.taxonomyFilters).length === 0;
   }
   /**
@@ -436,8 +451,17 @@
      return template;
   }
   removePlaceholders() {
      const placeholders = this.ui.grid.querySelectorAll('.placeholder');
      if (placeholders.length > 0) {
         placeholders.forEach(p => p.remove());
      }
   }
   addPlaceholders() {
      let total = this.contentTypes.length;
      const fragment = document.createDocumentFragment();
      for (let i = 0; i < 12; i++) {
         let template = window.getTemplate('placeholderTemplate');
@@ -448,15 +472,10 @@
         } else {
            icon = window.getIcon(this.container.dataset.icon);
         }
         template.appendChild(icon);
         this.ui.grid.appendChild(template);
         template.append(icon);
         fragment.append(template);
      }
   }
   removePlaceholders() {
      if (this.ui.grid.querySelector('.placeholder')) {
         window.removeChildren(this.ui.grid);
      }
      this.ui.grid.append(fragment);
   }
@@ -543,13 +562,21 @@
      }
      if ('ResizeObserver' in window) {
         this.resizeObserver = new ResizeObserver(window.debounce(() => {
            this.updateImageSizes();
         }, 250));
         this.resizeObserver = new ResizeObserver(() => {
            window.debouncer.schedule(
               'feed-update-images',
               () => this.updateImageSizes(),
               250
            );
         });
      } else {
         window.addEventListener('resize', window.debounce(()=> {
            this.updateImageSizes();
         }, 250));
         window.addEventListener('resize', () => {
            window.debouncer.schedule(
               'feed-update-images',
               () => this.updateImageSizes(),
               250
            );
         });
      }
      window.addEventListener('popstate', this.popStateHandler);
@@ -654,6 +681,11 @@
   }
}
document.addEventListener('DOMContentLoaded', function() {
   window.feedBlock = new FeedBlock();
document.addEventListener('DOMContentLoaded', async function() {
   window.auth.subscribe(event => {
      if (event === 'auth-loaded') {
         window.feedBlock = new FeedBlock();
      }
   });
});