fix(my-materials): рендер KaTeX в заметках (формулы $$…$$)

frontend/my-materials.html

@@ -7,6 +7,7 @@
   <link rel="icon" href="/favicon.svg" type="image/svg+xml"/>
   <link href="https://fonts.googleapis.com/css2?family=Unbounded:wght@400;700;800&family=Manrope:wght@400;500;600;700&display=swap" rel="stylesheet"/>
   <link rel="stylesheet" href="/css/ls.css"/>
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css" />
   <script src="https://unpkg.com/lucide@0.469.0/dist/umd/lucide.min.js"></script>
   <style>
     .mm-main { padding: 28px 24px; max-width: 1100px; margin: 0 auto; width: 100%; }
@@ -92,12 +93,32 @@
 <script src="/js/mobile.js"></script>
 <script src="/js/svg-sanitize.js"></script>
 <script src="/js/svg-draw.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js"></script>
 <script>
 (function () {
   const _ip = LS.initPage() || {};
   const _canShare = !!(_ip.isTeacher || _ip.isAdmin);
 
   function esc(s) { return LS.escapeHtml(String(s || '')); }
+
+  /* Рендер текста заметки с формулами KaTeX ($$…$$, $…$, \(…\), \[…\]).
+     textContent гарантирует экранирование не-математического текста (без XSS). */
+  const _MM_DELIMS = [
+    { left: '$$', right: '$$', display: true  },
+    { left: '\\[', right: '\\]', display: true  },
+    { left: '\\(', right: '\\)', display: false },
+    { left: '$',   right: '$',   display: false },
+  ];
+  function mathHtml(text) {
+    if (!text) return '';
+    const tmp = document.createElement('span');
+    tmp.textContent = String(text);
+    if (window.renderMathInElement) {
+      try { renderMathInElement(tmp, { delimiters: _MM_DELIMS, throwOnError: false }); } catch (e) {}
+    }
+    return tmp.innerHTML;
+  }
   function fmtDate(s) {
     if (!s) return '';
     try { const d = new Date(s.replace(' ', 'T') + (s.includes('Z') ? '' : 'Z'));
@@ -185,7 +206,7 @@
 
     // note
     return `<div class="mm-card">
-      <div class="mm-card-note">${esc(m.body || '')}</div>
+      <div class="mm-card-note">${mathHtml(m.body || '')}</div>
       <div class="mm-card-body">
         ${chip}
         <div class="mm-card-title">${esc(m.title || kind)}</div>
@@ -322,7 +343,7 @@
     if (mt.kind === 'image' || mt.kind === 'board') {
       body = `<div class="mm-viewer"><img src="${esc(mt.url)}" alt="${esc(mt.title || '')}" /></div>`;
     } else if (mt.kind === 'note') {
-      body = `<div class="mm-viewer-note">${esc(mt.body || '')}</div>`;
+      body = `<div class="mm-viewer-note">${mathHtml(mt.body || '')}</div>`;
     } else {
       body = `<div class="mm-viewer-note"><a href="${esc(mt.url)}" target="_blank" rel="noopener" style="color:var(--violet)">${esc(mt.url)}</a></div>`;
     }