LearnSpace: full-stack educational whiteboard platform

Node.js/Express backend + vanilla JS frontend. Features: real-time collaborative whiteboard (SSE), multi-page support, LaTeX formulas, shapes/connectors, coordinate systems, number lines, compass, zoom/pan, Catmull-Rom pencil smoothing, ruler/protractor with rotation & resize controls, minimap navigation overlay, auto-measurements, multi-page thumbnails sidebar, PNG export, page templates. Student/teacher workflows: classes, assignments, library, dashboard. Mobile responsive. SQLite (better-sqlite3). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-12 10:10:37 +03:00
commit be4d43105e
204 changed files with 118117 additions and 0 deletions
@@ -0,0 +1,89 @@
+/* ── Shared notification dropdown module ──────────────────────────── */
+(function() {
+  let _notifOpen = false;
+  let _sse = null;
+
+  function renderNotifDrop(data) {
+    const drop  = document.getElementById('notif-drop');
+    const badge = document.getElementById('notif-badge');
+    if (!drop || !badge) return;
+    if (data.unread > 0) { badge.textContent = data.unread > 9 ? '9+' : data.unread; badge.style.display = ''; }
+    else badge.style.display = 'none';
+    drop.innerHTML = `
+      <div class="notif-drop-header">
+        <span class="notif-drop-title">Уведомления</span>
+        ${data.unread > 0 ? `<button class="notif-read-all" onclick="LS.notif.markAllRead()">Отметить все прочитанными</button>` : ''}
+      </div>
+      ${data.notifications.length ? data.notifications.map(n => `
+        <a class="notif-item${n.is_read ? '' : ' unread'}" href="${LS.safeHref(n.link)}" onclick="LS.notif.click(event,${n.id},'${LS.safeHref(n.link)}')">
+          <div class="notif-dot${n.is_read ? ' read' : ''}"></div>
+          <div><div class="notif-msg">${LS.esc(n.message)}</div><div class="notif-time">${LS.fmtRelTime(n.created_at)}</div></div>
+        </a>`).join('') : '<div class="notif-empty">Уведомлений нет</div>'}`;
+  }
+
+  async function load() {
+    try { renderNotifDrop(await LS.getNotifications()); } catch {}
+  }
+
+  function toggle() {
+    const drop = document.getElementById('notif-drop');
+    if (!drop) return;
+    _notifOpen = !_notifOpen;
+    if (_notifOpen) {
+      const btn = document.getElementById('notif-btn');
+      if (btn) {
+        const r = btn.getBoundingClientRect();
+        const vh = window.innerHeight;
+        // Anchor bottom of dropdown to button bottom, but don't go above viewport
+        const bottom = vh - r.bottom;
+        drop.style.top  = 'auto';
+        drop.style.bottom = Math.max(8, bottom) + 'px';
+        drop.style.left = (r.right + 8) + 'px';
+      }
+      drop.style.display = 'block';
+      load();
+    } else {
+      drop.style.display = 'none';
+    }
+  }
+
+  async function clickNotif(e, id, link) {
+    e.preventDefault();
+    await LS.markNotifRead(id).catch(() => {});
+    await load();
+    if (link && link !== '#') window.location.href = link;
+  }
+
+  async function markAllRead() {
+    await LS.markAllNotifsRead().catch(() => {});
+    await load();
+  }
+
+  let _inited = false;
+  function init() {
+    if (_inited) return;
+    _inited = true;
+    // Note: button already has onclick="LS.notif.toggle()" in HTML
+    // Close on outside click
+    document.addEventListener('click', e => {
+      const drop = document.getElementById('notif-drop');
+      if (!drop || !_notifOpen) return;
+      if (!e.target.closest('#notif-drop') && !e.target.closest('#notif-btn')) {
+        _notifOpen = false;
+        drop.style.display = 'none';
+      }
+    });
+
+    // SSE real-time
+    _sse = LS.connectSSE(ev => {
+      if (ev.type) load();
+    });
+
+    // Initial load
+    load();
+  }
+
+  // Expose as LS.notif
+  window.LS = window.LS || {};
+  LS.notif = { init, toggle, load, click: clickNotif, markAllRead };
+})();