fdsafdas

public/s/js/scroller.js

@@ -36,6 +36,8 @@
   const filterResetBtn   = document.getElementById('filter-reset-btn');
   const filterApplyBtn   = document.getElementById('filter-apply-btn');
   const filterSummary    = document.getElementById('filter-active-summary');
+  let filterSummaryText  = document.getElementById('filter-active-summary-text');
+  let filterClearBtn     = document.getElementById('filter-active-clear');
   const tagInput         = document.getElementById('filter-tag-input');
   const tagClear         = document.getElementById('filter-tag-clear');
   const tagSuggestEl     = document.getElementById('tag-suggestions');
@@ -3182,10 +3184,59 @@
 
   filterResetBtn.addEventListener('click', () => { pending = { mode: defaultMode, mime: scrollerSingleMime || '', order: 'random', tags: [] }; syncPanelUI(); tagInput.value = ''; tagClear.classList.remove('show'); tagSuggestEl.innerHTML = ''; lastSugg = []; renderActiveTags(); });
 
+  function clearActiveFilters() {
+    applied = { mode: defaultMode, mime: scrollerSingleMime || '', order: 'random', tags: [], externalUrl: null };
+    pending = { ...applied, tags: [] };
+    if (externalUrlInput) externalUrlInput.value = '';
+    if (galleryOpen) toggleGallery();
+    if (chanGalleryBtn) chanGalleryBtn.style.display = 'none';
+    if (tagInput) tagInput.value = '';
+    if (tagClear) tagClear.classList.remove('show');
+    if (tagSuggestEl) tagSuggestEl.innerHTML = '';
+    lastSugg = [];
+    renderActiveTags();
+    syncPanelUI();
+    renderPresets();
+    reloadFeed();
+  }
+
+  function setupFilterSummary() {
+    if (!filterSummary) return;
+    if (!filterSummaryText || !filterClearBtn) {
+      if (!filterSummary.querySelector('#filter-active-summary-text')) {
+        const txt = document.createElement('span');
+        txt.id = 'filter-active-summary-text';
+        const btn = document.createElement('button');
+        btn.id = 'filter-active-clear';
+        btn.type = 'button';
+        btn.title = (window.f0ckI18n && window.f0ckI18n.clear_filter) || 'Clear filter';
+        btn.setAttribute('aria-label', (window.f0ckI18n && window.f0ckI18n.clear_filter) || 'Clear filter');
+        btn.innerHTML = '<i class="fa-solid fa-xmark"></i>';
+        filterSummary.innerHTML = '';
+        filterSummary.appendChild(txt);
+        filterSummary.appendChild(btn);
+      }
+      filterSummaryText = document.getElementById('filter-active-summary-text');
+      filterClearBtn = document.getElementById('filter-active-clear');
+    }
+    if (filterClearBtn && !filterClearBtn._hasListener) {
+      filterClearBtn._hasListener = true;
+      filterClearBtn.addEventListener('click', (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        clearActiveFilters();
+      });
+    }
+  }
+  setupFilterSummary();
+
   function updateFilterSummary() {
+    if (!filterSummary) return;
+    setupFilterSummary();
     const is4chan = !!applied.externalUrl;
-    const isDef = applied.mode === defaultMode && applied.mime === '' && applied.order === 'random' && applied.tags.length === 0 && !is4chan;
-    filterOpenBtn.classList.toggle('has-filter', !isDef); filterSummary.classList.toggle('show', !isDef);
+    const isDef = applied.mode === defaultMode && applied.mime === (scrollerSingleMime || '') && applied.order === 'random' && applied.tags.length === 0 && !is4chan;
+    if (filterOpenBtn) filterOpenBtn.classList.toggle('has-filter', !isDef);
+    filterSummary.classList.toggle('show', !isDef);
     if (!isDef) {
       // Check if current filters exactly match a saved preset
       const tagsKey = t => [...t].map(s => s.toLowerCase()).sort().join(',');
@@ -3195,8 +3246,9 @@
         p.order === applied.order &&
         tagsKey(p.tags) === tagsKey(applied.tags)
       );
+      let summaryText = '';
       if (matchedPreset && !is4chan) {
-        filterSummary.textContent = matchedPreset.name;
+        summaryText = matchedPreset.name;
       } else {
         const parts = [];
         if (is4chan) parts.push('4chan');
@@ -3204,7 +3256,12 @@
         if (applied.mime) parts.push(applied.mime);
         if (applied.order !== 'random') parts.push(applied.order);
         parts.push(...applied.tags);
-        filterSummary.textContent = parts.join(' · ');
+        summaryText = parts.join(' · ');
+      }
+      if (filterSummaryText) {
+        filterSummaryText.textContent = summaryText;
+      } else {
+        filterSummary.textContent = summaryText;
       }
     }
   }