<?php // includes/footer.php ?>
</main><!-- .ec-main -->
</div><!-- .ec-layout -->

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>

<script>
(function () {
  /* ---- UI toggles ---- */
  const sbBtn = document.getElementById('ecSidebarToggle');
  const sb    = document.getElementById('ecSidebar');
  sbBtn?.addEventListener('click', () => sb?.classList.toggle('show'));

  const nBtn   = document.getElementById('ecNotifyBtn');
  const nClose = document.getElementById('ecNotifyClose');
  const nPanel = document.getElementById('ecNotifyPanel');
  [nBtn, nClose].forEach(el => el?.addEventListener('click', () => nPanel?.classList.toggle('show')));

  /* ---- Notifications ---- */
  const NOTI_URL = '/edenrms/ajax/notifications.php?days=7';
  const list = document.getElementById('ecNotifyList');
  const dot  = document.getElementById('ecNotifyDot');

  function esc(s){ return String(s ?? '').replace(/[&<>"']/g, m => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[m])); }
  function renderNo(){ if(list) list.innerHTML = '<div class="text-center text-muted small p-3">No notifications</div>'; dot?.classList.add('d-none'); }

  async function loadNotis() {
    if (!list || !dot) return;
    try {
      const r  = await fetch(NOTI_URL, { cache: 'no-store' });
      const tx = await r.text();
      let data; try { data = JSON.parse(tx); } catch(e){ console.error('non-JSON:', tx); return renderNo(); }

      const items = Array.isArray(data.items) ? data.items : [];
      if (!items.length) return renderNo();

      let unread = 0, html = '';
      items.forEach(n => {
        if (!n.read) unread++;
        html += `
          <div class="p-2 border-bottom ${n.read ? 'text-muted' : ''}">
            <div class="fw-semibold">${esc(n.title)}</div>
            <div class="small">${esc(n.body)}</div>
            <div class="small text-muted">${esc(n.time)}</div>
          </div>`;
      });
      list.innerHTML = html;
      dot.classList.toggle('d-none', unread === 0);
    } catch (e) {
      console.error('notify fetch failed:', e);
      renderNo();
    }
  }

  // “Mark all read” button
  document.getElementById('ecMarkAllRead')?.addEventListener('click', async () => {
    try {
      await fetch('/edenrms/ajax/notifications.php?action=read_all', { cache: 'no-store' });
    } finally {
      loadNotis(); // refresh list & hide red dot
    }
  });

  // initial + periodic refresh
  loadNotis();
  setInterval(loadNotis, 60 * 1000);
  nBtn?.addEventListener('click', loadNotis);
})();
</script>
<script>
document.addEventListener('click', function(e){
  const btn = e.target.closest('[data-bs-toggle="dropdown"]');
  if (!btn) return;

  // If Bootstrap is loaded, let it handle it
  if (window.bootstrap && bootstrap.Dropdown) return;

  // Fallback manual toggle
  e.preventDefault();
  const wrap = btn.closest('.dropdown');
  if (!wrap) return;
  const menu = wrap.querySelector('.dropdown-menu');
  if (!menu) return;

  // close other menus
  document.querySelectorAll('.dropdown-menu.show').forEach(m => {
    if (m !== menu) m.classList.remove('show');
  });

  menu.classList.toggle('show');

  // close on outside click
  const close = (ev) => {
    if (!wrap.contains(ev.target)) {
      menu.classList.remove('show');
      document.removeEventListener('click', close, true);
    }
  };
  document.addEventListener('click', close, true);
});
</script>

</body></html>
