https://www.foie.no/assets/js/accordion-hash.js

1(function () {
2  function openAccordionFromHash() {
3    const rawHash = decodeURIComponent(window.location.hash || '').replace('#', '');
4    if (!rawHash) return;
5
6    // Finn elementet hashen peker til
7    let target = document.getElementById(rawHash);
8    if (!target) return;
9
10    // Finn nærmeste .card (accordion-card)
11    const card = target.closest('.card') || target;
12    if (!card || !card.closest('.accordion')) return;
13
14    // Finn collapse-elementet som tilhører kortet
15    let trigger = card.querySelector('[data-toggle="collapse"],[data-bs-toggle="collapse"]');
16    let collapseEl = null;
17
18    if (trigger) {
19      const sel = trigger.getAttribute('data-target') || trigger.getAttribute('data-bs-target');
20      if (sel) {
21        collapseEl = card.querySelector(sel) || document.querySelector(sel);
22      }
23    }
24    if (!collapseEl) {
25      // Fallback: ta første .collapse inni kortet
26      collapseEl = card.querySelector('.collapse');
27    }
28    if (!collapseEl) return;
29
30    // Lukk andre åpne paneler i samme accordion (valgfritt – slå av hvis du ikke ønsker dette)
31    const accordion = card.closest('.accordion');
32    if (accordion) {
33      accordion.querySelectorAll('.collapse.show').forEach(el => {
34        if (el !== collapseEl) {
35          try {
36            if (window.bootstrap && window.bootstrap.Collapse) {
37              new window.bootstrap.Collapse(el, { toggle: false }).hide();
38            } else if (window.jQuery && jQuery(el).collapse) {
39              jQuery(el).collapse('hide');
40            } else {
41              el.classList.remove('show');
42              const t = accordion.querySelector('[aria-controls="' + el.id + '"]');
43              if (t) { t.classList.add('collapsed'); t.setAttribute('aria-expanded', 'false'); }
44            }
45          } catch (_) { el.classList.remove('show'); }
46        }
47      });
48    }
49
50    // Åpne ønsket panel – prøv API, ellers fallback
51    try {
52      if (window.bootstrap && window.bootstrap.Collapse) {
53        new window.bootstrap.Collapse(collapseEl, { toggle: true });
54      } else if (window.jQuery && typeof jQuery === 'function' && jQuery(collapseEl).collapse) {
55        jQuery(collapseEl).collapse('show');
56      } else if (trigger && trigger.classList.contains('collapsed')) {
57        trigger.click(); // lar eksisterende ikon-/klasse-logikk kjøre
58      } else {
59        collapseEl.classList.add('show');
60        const t = card.querySelector('[aria-controls="' + collapseEl.id + '"]');
61        if (t) { t.classList.remove('collapsed'); t.setAttribute('aria-expanded', 'true'); }
62      }
63    } catch (_) {
64      if (trigger) trigger.click();
65      else collapseEl.classList.add('show');
66    }
67
68    // Scroll til kortet og sett fokus for bedre tilgjengelighet
69    setTimeout(() => {
70      card.scrollIntoView({ behavior: 'smooth', block: 'start' });
71      const focusable = card.querySelector('[role="heading"], .card-header, h1,h2,h3,h4,h5,h6') || card;
72      focusable.setAttribute('tabindex', '-1');
73      try { focusable.focus({ preventScroll: true }); } catch (_) {}
74    }, 50);
75  }
76
77  // Kjør ved lasting og når hash endres
78  window.addEventListener('DOMContentLoaded', openAccordionFromHash);
79  window.addEventListener('hashchange', openAccordionFromHash);
80})();