fix: search result click scrolls to first match + highlight; left sidebar unchanged

docs_v1.0/doc_wasm/index.html

@@ -125,7 +125,7 @@ function md2html(md) {
   return h;
 }
 
-async function loadDoc(name) {
+async function loadDoc(name, highlightQ) {
   el.innerHTML = '<p>Loading...</p>';
   try {
     const resp = await fetch('/doc-wasm/modules/' + name + '.md');
@@ -139,6 +139,35 @@ async function loadDoc(name) {
     var link = document.querySelector('.sidebar a[data-module="' + name + '"]');
     if (link) link.classList.add('active');
     history.pushState(null, '', '#' + name);
+
+    // Scroll to first highlighted match if highlightQ provided
+    if (highlightQ) {
+      var re = new RegExp(highlightQ.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'gi');
+      var walker = document.createTreeWalker(el, NodeFilter.SHOW_TEXT, null, false);
+      var node, match;
+      while (node = walker.nextNode()) {
+        if (re.test(node.textContent)) {
+          match = node;
+          break;
+        }
+      }
+      if (match) {
+        re.lastIndex = 0;
+        var idx = match.textContent.search(re);
+        if (idx >= 0) {
+          var range = document.createRange();
+          range.setStart(match, idx);
+          range.setEnd(match, idx + highlightQ.length);
+          var mark = document.createElement('mark');
+          mark.style.background = '#ffeb3b';
+          mark.style.color = '#000';
+          mark.style.padding = '0 2px';
+          mark.style.borderRadius = '2px';
+          range.surroundContents(mark);
+          mark.scrollIntoView({ behavior: 'smooth', block: 'center' });
+        }
+      }
+    }
   } catch(e) {
     el.innerHTML = '<p style="color:red">Error: ' + e.message + '</p><pre>'+e.stack+'</pre>';
   }
@@ -180,7 +209,8 @@ async function fulltextSearch(q) {
   }
   var html = '<p style="font-size:13px;font-weight:600;color:#333;margin-bottom:8px">' + results.length + ' result(s) for <strong>' + escapeHtml(q) + '</strong></p>';
   for (var r of results) {
-    html += '<div style="margin-bottom:8px;padding:6px;border-radius:4px;background:#f9f9f9;border:1px solid #eee;cursor:pointer" onclick="showSearchResult(\'' + r.module + '\');return false">'
+    var safeQ = q.replace(/'/g, "\\'");
+    html += '<div style="margin-bottom:8px;padding:6px;border-radius:4px;background:#f9f9f9;border:1px solid #eee;cursor:pointer" onclick="showSearchResult(\'' + r.module + '\',\'' + safeQ + '\');return false">'
          + '<span style="font-size:12px;font-weight:600;color:#0066cc">' + escapeHtml(r.module) + ' ' + escapeHtml(r.title) + '</span>'
          + ' <span style="color:#888;font-size:11px">line ' + r.line + '</span><br>'
          + '<span style="font-size:11px;color:#555;display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">'
@@ -190,11 +220,8 @@ async function fulltextSearch(q) {
   el.innerHTML = '<p style="color:#888">' + results.length + ' result(s) — click a result in the sidebar to open</p>';
 }
 
-function showSearchResult(module) {
+function showSearchResult(module, q) {
-  document.getElementById('search').value = '';
+  loadDoc(module, q);
-  document.getElementById('search-results').style.display = 'none';
-  document.getElementById('module-list').style.display = '';
-  loadDoc(module);
 }
 
 async function loginUser(user, pass) {