cnhkmcp 2.0.1__py3-none-any.whl

cnhkmcp/untracked/APP/static/usage_widget.js

@@ -0,0 +1,508 @@
+(function () {
+  'use strict';
+
+  const WIDGET_STYLE_ID = 'usageWidgetStyles';
+  const ROOT_ID = 'usageWidgetRoot';
+
+  function escapeHtml(text) {
+    return String(text)
+      .replace(/&/g, '&')
+      .replace(/</g, '&lt;')
+      .replace(/>/g, '&gt;')
+      .replace(/"/g, '&quot;')
+      .replace(/'/g, '&#39;');
+  }
+
+  function slugify(text) {
+    return String(text)
+      .trim()
+      .toLowerCase()
+      .replace(/[\u4e00-\u9fa5]/g, (m) => m) // keep CJK
+      .replace(/[^\w\u4e00-\u9fa5\-\s]/g, '')
+      .replace(/\s+/g, '-')
+      .replace(/-+/g, '-')
+      .replace(/^\-+|\-+$/g, '');
+  }
+
+  function ensureStyles() {
+    if (document.getElementById(WIDGET_STYLE_ID)) return;
+
+    const style = document.createElement('style');
+    style.id = WIDGET_STYLE_ID;
+    style.textContent = `
+#${ROOT_ID} { position: fixed; z-index: 9999; left: 16px; bottom: 16px; font-family: inherit; }
+#${ROOT_ID} .uw-fab { 
+  display: inline-flex; align-items: center; gap: 8px;
+  padding: 12px 18px; border-radius: 999px;
+  border: 1px solid rgba(0,0,0,0.10);
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: #ffffff;
+  font-weight: 800;
+  font-size: 14px;
+  box-shadow: 0 14px 34px rgba(0,0,0,0.26);
+  cursor: pointer;
+  user-select: none;
+}
+#${ROOT_ID} .uw-fab:hover { transform: translateY(-1px); }
+#${ROOT_ID} .uw-fab:active { transform: translateY(0px); }
+#${ROOT_ID} .uw-fab .uw-dot { width: 10px; height: 10px; border-radius: 999px; background: rgba(255,255,255,0.95); box-shadow: 0 0 0 3px rgba(255,255,255,0.18); }
+
+#${ROOT_ID} .uw-overlay {
+  position: fixed; inset: 0; background: rgba(0,0,0,0.45);
+  z-index: 10000;
+  opacity: 0; pointer-events: none; transition: opacity 180ms ease;
+}
+#${ROOT_ID}.open .uw-overlay { opacity: 1; pointer-events: auto; }
+
+#${ROOT_ID} .uw-drawer {
+  position: fixed; left: 50%; top: 50%;
+  z-index: 10001;
+  width: min(980px, calc(100vw - 48px));
+  height: min(86vh, 920px);
+  background: #ffffff;
+  border-radius: 14px;
+  border: 1px solid rgba(0,0,0,0.10);
+  box-shadow: 0 20px 60px rgba(0,0,0,0.25);
+  overflow: hidden;
+  transform: translate(-50%, -50%) translateY(12px) scale(0.98);
+  opacity: 0;
+  pointer-events: none;
+  transition: transform 220ms ease, opacity 220ms ease;
+}
+#${ROOT_ID}.open .uw-drawer { transform: translate(-50%, -50%) translateY(0px) scale(1); opacity: 1; pointer-events: auto; }
+
+#${ROOT_ID} .uw-header {
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 12px 14px;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: #fff;
+}
+#${ROOT_ID} .uw-header .uw-title { font-size: 14px; font-weight: 700; letter-spacing: .2px; }
+#${ROOT_ID} .uw-header .uw-actions { display: flex; gap: 8px; align-items: center; }
+#${ROOT_ID} .uw-header button {
+  border: 1px solid rgba(255,255,255,0.35);
+  background: rgba(255,255,255,0.12);
+  color: #fff;
+  border-radius: 8px;
+  padding: 6px 10px;
+  cursor: pointer;
+}
+#${ROOT_ID} .uw-header button:hover { background: rgba(255,255,255,0.18); }
+
+#${ROOT_ID} .uw-body { display: grid; grid-template-columns: 240px 1fr; height: calc(100% - 48px); }
+#${ROOT_ID} .uw-sidebar {
+  border-right: 1px solid rgba(0,0,0,0.08);
+  background: #f5f7fa;
+  padding: 10px;
+  overflow: auto;
+}
+#${ROOT_ID} .uw-content {
+  padding: 12px 14px;
+  overflow: auto;
+  background: #fff;
+}
+
+#${ROOT_ID} .uw-search {
+  width: 100%;
+  padding: 8px 10px;
+  border-radius: 10px;
+  border: 1px solid rgba(0,0,0,0.14);
+  outline: none;
+  margin-bottom: 10px;
+}
+#${ROOT_ID} .uw-search:focus { border-color: rgba(102,126,234,0.6); box-shadow: 0 0 0 3px rgba(102,126,234,0.18); }
+
+#${ROOT_ID} .uw-toc { display: flex; flex-direction: column; gap: 6px; }
+#${ROOT_ID} .uw-toc a {
+  display: block;
+  text-decoration: none;
+  color: #2c3e50;
+  padding: 6px 8px;
+  border-radius: 10px;
+  border: 1px solid transparent;
+  font-size: 13px;
+  line-height: 1.2;
+}
+#${ROOT_ID} .uw-toc a:hover { background: #ffffff; border-color: rgba(0,0,0,0.08); }
+#${ROOT_ID} .uw-toc .uw-toc-section { display: block; }
+#${ROOT_ID} .uw-toc .uw-toc-h1 {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-weight: 800;
+}
+#${ROOT_ID} .uw-toc .uw-toc-h1::after { content: '▸'; color: rgba(102,126,234,0.95); font-size: 12px; margin-left: 8px; }
+#${ROOT_ID} .uw-toc .uw-toc-section.expanded .uw-toc-h1::after { content: '▾'; }
+#${ROOT_ID} .uw-toc .uw-toc-children { display: none; margin-top: 4px; }
+#${ROOT_ID} .uw-toc .uw-toc-section.expanded .uw-toc-children { display: block; }
+#${ROOT_ID} .uw-toc a.level-2 { padding-left: 16px; font-size: 12.5px; opacity: 0.95; }
+#${ROOT_ID} .uw-toc a.level-3 { padding-left: 24px; font-size: 12px; opacity: 0.9; }
+
+#${ROOT_ID} .uw-md h1 { font-size: 18px; margin: 14px 0 10px; color: #2c3e50; }
+#${ROOT_ID} .uw-md h2 { font-size: 16px; margin: 14px 0 10px; color: #2c3e50; }
+#${ROOT_ID} .uw-md h3 { font-size: 14px; margin: 12px 0 8px; color: #2c3e50; }
+#${ROOT_ID} .uw-md p { margin: 8px 0; color: #333; }
+#${ROOT_ID} .uw-md ul { margin: 8px 0 8px 20px; }
+#${ROOT_ID} .uw-md li { margin: 4px 0; }
+#${ROOT_ID} .uw-md code { background: #f0f0f0; padding: 2px 6px; border-radius: 6px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
+#${ROOT_ID} .uw-md pre { background: #1e1e1e; color: #f8f8f2; padding: 12px; border-radius: 12px; overflow: auto; margin: 10px 0; }
+#${ROOT_ID} .uw-md pre code { background: transparent; padding: 0; color: inherit; }
+#${ROOT_ID} .uw-muted { color: #6c757d; font-size: 13px; }
+`;
+
+    document.head.appendChild(style);
+  }
+
+  function buildMarkdownHtml(markdown) {
+    // Minimal markdown rendering: headings (#..###), fenced code blocks, inline code, unordered lists, paragraphs.
+    // This is intentionally lightweight (no external deps).
+    const lines = String(markdown || '').replace(/\r\n/g, '\n').split('\n');
+
+    const toc = [];
+    const usedIds = new Map();
+
+    function uniqueId(base) {
+      const raw = base || 'section';
+      let id = raw;
+      let i = 2;
+      while (usedIds.has(id)) {
+        id = `${raw}-${i++}`;
+      }
+      usedIds.set(id, true);
+      return id;
+    }
+
+    let html = '';
+    let inCode = false;
+    let codeLang = '';
+    let codeBuf = [];
+    let inUl = false;
+
+    function closeUl() {
+      if (inUl) {
+        html += '</ul>';
+        inUl = false;
+      }
+    }
+
+    function flushParagraph(text) {
+      closeUl();
+      if (!text) return;
+      const withInline = escapeHtml(text).replace(/`([^`]+)`/g, '<code>$1</code>');
+      html += `<p>${withInline}</p>`;
+    }
+
+    for (const line of lines) {
+      const fence = line.match(/^```\s*(.*)\s*$/);
+      if (fence) {
+        if (!inCode) {
+          closeUl();
+          inCode = true;
+          codeLang = fence[1] || '';
+          codeBuf = [];
+        } else {
+          const code = codeBuf.join('\n');
+          html += `<pre><code${codeLang ? ` data-lang="${escapeHtml(codeLang)}"` : ''}>${escapeHtml(code)}</code></pre>`;
+          inCode = false;
+          codeLang = '';
+          codeBuf = [];
+        }
+        continue;
+      }
+
+      if (inCode) {
+        codeBuf.push(line);
+        continue;
+      }
+
+      const h = line.match(/^(#{1,3})\s+(.*)$/);
+      if (h) {
+        closeUl();
+        const level = h[1].length;
+        const text = h[2].trim();
+        const id = uniqueId(slugify(text) || `h${level}`);
+        toc.push({ level, text, id });
+        html += `<h${level} id="${escapeHtml(id)}">${escapeHtml(text)}</h${level}>`;
+        continue;
+      }
+
+      const ul = line.match(/^\s*[-*]\s+(.*)$/);
+      if (ul) {
+        if (!inUl) {
+          closeUl();
+          html += '<ul>';
+          inUl = true;
+        }
+        const item = escapeHtml(ul[1]).replace(/`([^`]+)`/g, '<code>$1</code>');
+        html += `<li>${item}</li>`;
+        continue;
+      }
+
+      if (!line.trim()) {
+        closeUl();
+        continue;
+      }
+
+      flushParagraph(line);
+    }
+
+    closeUl();
+
+    return { html, toc };
+  }
+
+  function ensureRoot() {
+    let root = document.getElementById(ROOT_ID);
+    if (root) return root;
+
+    root = document.createElement('div');
+    root.id = ROOT_ID;
+    root.innerHTML = `
+      <div class="uw-overlay" aria-hidden="true"></div>
+      <button type="button" class="uw-fab" aria-label="打开使用说明">
+        <span class="uw-dot" aria-hidden="true"></span>
+        <span>使用说明</span>
+      </button>
+      <div class="uw-drawer" role="dialog" aria-modal="true" aria-label="使用说明">
+        <div class="uw-header">
+          <div class="uw-title">使用说明</div>
+          <div class="uw-actions">
+            <button type="button" class="uw-reload" title="重新加载">刷新</button>
+            <button type="button" class="uw-close" title="关闭">关闭</button>
+          </div>
+        </div>
+        <div class="uw-body">
+          <div class="uw-sidebar">
+            <input class="uw-search" type="search" placeholder="搜索标题..." />
+            <div class="uw-toc" aria-label="目录"></div>
+          </div>
+          <div class="uw-content">
+            <div class="uw-muted" data-uw-status>正在加载 usage.md...</div>
+            <div class="uw-md" data-uw-md style="display:none;"></div>
+          </div>
+        </div>
+      </div>
+    `;
+
+    document.body.appendChild(root);
+    return root;
+  }
+
+  async function fetchUsageMarkdown() {
+    const resp = await fetch('/api/usage-doc', { method: 'GET' });
+    const data = await resp.json();
+    if (!resp.ok || !data || !data.success) {
+      const msg = (data && data.error) ? data.error : `HTTP ${resp.status}`;
+      throw new Error(msg);
+    }
+    return data.markdown || '';
+  }
+
+  function open(root) {
+    root.classList.add('open');
+  }
+
+  function close(root) {
+    root.classList.remove('open');
+  }
+
+  function wire(root) {
+    const overlay = root.querySelector('.uw-overlay');
+    const fab = root.querySelector('.uw-fab');
+    const btnClose = root.querySelector('.uw-close');
+    const btnReload = root.querySelector('.uw-reload');
+    const tocEl = root.querySelector('.uw-toc');
+    const searchEl = root.querySelector('.uw-search');
+    const statusEl = root.querySelector('[data-uw-status]');
+    const mdEl = root.querySelector('[data-uw-md]');
+
+    let cache = { markdown: null, built: null };
+    const expandedSections = new Set();
+
+    function groupToc(toc) {
+      const items = (toc || []).filter(x => x.level <= 3);
+      const level1Count = items.filter(x => x.level === 1).length;
+      const level2Count = items.filter(x => x.level === 2).length;
+
+      // Common doc layout: a single H1 is just the document title.
+      // In that case, use H2 as the TOC top-level (expand to show H3).
+      const useH2AsTop = level1Count <= 1 && level2Count > 0;
+
+      const sections = [];
+      let current = null;
+
+      for (const h of items) {
+        if (useH2AsTop) {
+          if (h.level === 1) continue;
+          if (h.level === 2) {
+            current = { top: h, children: [] };
+            sections.push(current);
+            continue;
+          }
+          // level === 3
+          if (!current) {
+            current = { top: { ...h, level: 2 }, children: [] };
+            sections.push(current);
+            continue;
+          }
+          current.children.push(h);
+          continue;
+        }
+
+        // Default: H1 is top-level, H2/H3 are children.
+        if (h.level === 1) {
+          current = { top: h, children: [] };
+          sections.push(current);
+          continue;
+        }
+        if (!current) {
+          current = { top: { ...h, level: 1 }, children: [] };
+          sections.push(current);
+          continue;
+        }
+        current.children.push(h);
+      }
+
+      return { sections, useH2AsTop };
+    }
+
+    function renderToc(query) {
+      const built = cache.built;
+      if (!built) {
+        tocEl.innerHTML = '';
+        return;
+      }
+
+      const q = String(query || '').trim().toLowerCase();
+      const searchMode = q.length > 0;
+
+      const grouped = groupToc(built.toc);
+      const sections = grouped.sections;
+      const useH2AsTop = grouped.useH2AsTop;
+      const parts = [];
+
+      for (const section of sections) {
+        const top = section.top;
+        const sectionId = top.id;
+        const topText = top.text || '';
+
+        const sectionMatch = !q || topText.toLowerCase().includes(q);
+        const matchedChildren = searchMode
+          ? section.children.filter(c => (c.text || '').toLowerCase().includes(q))
+          : section.children;
+
+        const visible = !searchMode || sectionMatch || matchedChildren.length > 0;
+        if (!visible) continue;
+
+        const expanded = searchMode ? (matchedChildren.length > 0) : expandedSections.has(sectionId);
+        const childLinks = expanded
+          ? matchedChildren.map(c => {
+              const cls = useH2AsTop ? 'level-3' : (c.level === 2 ? 'level-2' : 'level-3');
+              return `<a class="${cls}" href="#${escapeHtml(c.id)}" data-uw-target="${escapeHtml(c.id)}">${escapeHtml(c.text)}</a>`;
+            }).join('')
+          : '';
+
+        parts.push(
+          `<div class="uw-toc-section ${expanded ? 'expanded' : ''}" data-uw-section="${escapeHtml(sectionId)}">` +
+          `<a class="uw-toc-h1" href="#${escapeHtml(sectionId)}" data-uw-target="${escapeHtml(sectionId)}">${escapeHtml(topText)}</a>` +
+          `<div class="uw-toc-children">${childLinks}</div>` +
+          `</div>`
+        );
+      }
+
+      tocEl.innerHTML = parts.join('');
+    }
+
+    function renderFromMarkdown(markdown) {
+      const built = buildMarkdownHtml(markdown);
+      mdEl.innerHTML = built.html;
+      mdEl.style.display = '';
+      statusEl.style.display = 'none';
+      cache.built = built;
+
+      renderToc(searchEl.value);
+
+      // Scroll to top when re-render
+      mdEl.parentElement.scrollTop = 0;
+    }
+
+    async function ensureLoaded(force) {
+      if (!force && cache.markdown) return;
+      statusEl.textContent = '正在加载 usage.md...';
+      statusEl.style.display = '';
+      mdEl.style.display = 'none';
+
+      try {
+        const markdown = await fetchUsageMarkdown();
+        cache.markdown = markdown;
+        renderFromMarkdown(markdown);
+      } catch (e) {
+        statusEl.textContent = `加载失败：${e && e.message ? e.message : String(e)}`;
+        statusEl.style.display = '';
+        mdEl.style.display = 'none';
+      }
+    }
+
+    function applySearch() {
+      renderToc(searchEl.value);
+    }
+
+    fab.addEventListener('click', async () => {
+      open(root);
+      await ensureLoaded(false);
+    });
+
+    overlay.addEventListener('click', () => close(root));
+    btnClose.addEventListener('click', () => close(root));
+
+    btnReload.addEventListener('click', async () => {
+      cache.markdown = null;
+      cache.built = null;
+      await ensureLoaded(true);
+    });
+
+    document.addEventListener('keydown', (e) => {
+      if (e.key === 'Escape') close(root);
+    });
+
+    tocEl.addEventListener('click', (e) => {
+      const a = e.target.closest('a[data-uw-target]');
+      if (!a) return;
+      e.preventDefault();
+
+      const q = (searchEl.value || '').trim();
+      const id = a.getAttribute('data-uw-target');
+
+      // Toggle sub-headings only when clicking a top-level entry, and not in search mode.
+      if (!q && a.classList.contains('uw-toc-h1')) {
+        if (expandedSections.has(id)) expandedSections.delete(id);
+        else expandedSections.add(id);
+        renderToc(searchEl.value);
+      }
+
+      const target = mdEl.querySelector(`#${CSS.escape(id)}`);
+      if (target) {
+        target.scrollIntoView({ behavior: 'smooth', block: 'start' });
+      }
+    });
+
+    searchEl.addEventListener('input', applySearch);
+
+    // Preload lazily after page settles
+    window.setTimeout(() => {
+      ensureLoaded(false).catch(() => {});
+    }, 800);
+  }
+
+  function init() {
+    ensureStyles();
+    const root = ensureRoot();
+    wire(root);
+  }
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', init);
+  } else {
+    init();
+  }
+})();