datalog-theme 0.6.0

data/assets/js/search/engine.js

@@ -0,0 +1,260 @@
+import {
+  buildSnippet,
+  fuzzyIncludes,
+  isCodeQuery,
+  isMathQuery,
+  normalize,
+  normalizeCode,
+  tokenize
+} from "./utils.js";
+
+export function createSearchEngine(initialDocuments = []) {
+  let documents = Array.isArray(initialDocuments) ? [...initialDocuments] : [];
+
+  function setDocuments(nextDocuments) {
+    documents = Array.isArray(nextDocuments) ? [...nextDocuments] : [];
+  }
+
+  function search(rawQuery, filters = {}) {
+    const query = (rawQuery || "").trim();
+    if (!query) {
+      return [];
+    }
+
+    const normalizedQuery = normalize(query);
+    const queryTokens = tokenize(query);
+    const mathQuery = isMathQuery(query);
+    const codeQuery = isCodeQuery(query);
+    const {
+      type: typeFilter = "",
+      language: languageFilter = "",
+      difficulty: difficultyFilter = "",
+      tags: selectedTags = new Set()
+    } = filters;
+
+    return documents
+      .map((doc) =>
+        evaluateDocument(doc, {
+          rawQuery: query,
+          normalizedQuery,
+          queryTokens,
+          mathQuery,
+          codeQuery,
+          typeFilter,
+          languageFilter,
+          difficultyFilter,
+          selectedTags
+        })
+      )
+      .filter((match) => match && match.score > 0)
+      .sort((a, b) => b.score - a.score || a.title.localeCompare(b.title));
+  }
+
+  function suggestions(limit = 150) {
+    return buildSuggestionPool(documents, limit);
+  }
+
+  function getDocuments() {
+    return [...documents];
+  }
+
+  return { setDocuments, search, suggestions, getDocuments };
+}
+
+export function buildSuggestionPool(items = [], limit = 150) {
+  const suggestionSet = new Set();
+  items.forEach((item) => {
+    if (item.title) {
+      suggestionSet.add(item.title);
+    }
+    if (Array.isArray(item.languages)) {
+      item.languages.forEach((lang) => suggestionSet.add(lang));
+    }
+    if (Array.isArray(item.tags)) {
+      item.tags.forEach((tag) => suggestionSet.add(`#${tag}`));
+    }
+    if (Array.isArray(item.math)) {
+      item.math.slice(0, 3).forEach((expression) => suggestionSet.add(expression));
+    }
+  });
+  return Array.from(suggestionSet).slice(0, limit);
+}
+
+function evaluateDocument(doc, context) {
+  const {
+    rawQuery,
+    normalizedQuery,
+    queryTokens,
+    mathQuery,
+    codeQuery,
+    typeFilter,
+    languageFilter,
+    difficultyFilter,
+    selectedTags
+  } = context;
+
+  if (typeFilter && doc.type !== typeFilter) {
+    return null;
+  }
+
+  const docLanguages = Array.isArray(doc.languages) ? doc.languages : [];
+  if (languageFilter && !docLanguages.includes(languageFilter)) {
+    return null;
+  }
+
+  if (difficultyFilter) {
+    const difficulty = String(doc.difficulty || "").toLowerCase();
+    if (!difficulty || difficulty !== difficultyFilter) {
+      return null;
+    }
+  }
+
+  if (selectedTags && selectedTags.size > 0) {
+    const normalizedTags = normalizedArray(doc, "tags");
+    for (const tag of selectedTags) {
+      if (!normalizedTags.has(tag)) {
+        return null;
+      }
+    }
+  }
+
+  if (!rawQuery) {
+    return null;
+  }
+
+  const normalizedData = doc.normalized || {};
+  const normalizedContent = normalizedData.content || normalize(doc.content || "");
+  const normalizedSummary = normalizedData.summary || normalize(doc.summary || "");
+  const normalizedTitle = normalizedData.title || normalize(doc.title || "");
+  const normalizedTags = arrayFromNormalized(normalizedData.tags, doc.tags);
+  const normalizedLanguages = arrayFromNormalized(normalizedData.languages, doc.languages);
+  const normalizedDifficulty = normalizedData.difficulty || normalize(doc.difficulty || "");
+  const codeBlocks = Array.isArray(doc.code) ? doc.code : [];
+  const mathSegments = Array.isArray(doc.math) ? doc.math : [];
+
+  let score = 0;
+  let snippet = "";
+  let codeSnippet = null;
+  let mathSnippet = null;
+
+  if (normalizedTitle.includes(normalizedQuery)) {
+    score += 40;
+  }
+
+  queryTokens.forEach((token) => {
+    if (!token) {
+      return;
+    }
+    if (normalizedTitle.includes(token)) {
+      score += 12;
+    }
+    if (normalizedSummary.includes(token)) {
+      score += 8;
+    }
+    if (normalizedContent.includes(token)) {
+      score += 6;
+    }
+    normalizedTags.forEach((tag) => {
+      if (tag.includes(token)) {
+        score += 4;
+      }
+    });
+    normalizedLanguages.forEach((lang) => {
+      if (lang.includes(token)) {
+        score += 4;
+      }
+    });
+    if (normalizedDifficulty.includes(token)) {
+      score += 2;
+    }
+  });
+
+  if (codeBlocks.length > 0) {
+    const normalizedCodeQuery = normalizeCode(rawQuery);
+    for (const block of codeBlocks) {
+      const language = String(block.language || "").toLowerCase();
+      const codeText = block.code || "";
+      const normalizedCode = normalizeCode(codeText);
+      if (normalizedCode.includes(normalizedCodeQuery)) {
+        score += 30;
+        codeSnippet = { language, code: codeText };
+        break;
+      }
+      if (codeQuery && fuzzyIncludes(normalizedCode, normalizedCodeQuery)) {
+        score += 18;
+        codeSnippet = { language, code: codeText };
+        break;
+      }
+    }
+    if (!codeSnippet && codeBlocks[0]) {
+      codeSnippet = {
+        language: String(codeBlocks[0].language || "").toLowerCase(),
+        code: codeBlocks[0].code || ""
+      };
+    }
+  }
+
+  if (mathSegments.length > 0) {
+    const normalizedMathQuery = normalizedQuery.replace(/\\/g, "");
+    for (const expression of mathSegments) {
+      const normalizedExpression = normalize(String(expression));
+      if (normalizedExpression.includes(normalizedMathQuery)) {
+        score += 26;
+        mathSnippet = expression;
+        break;
+      }
+    }
+    if (mathQuery && !mathSnippet && mathSegments[0]) {
+      mathSnippet = mathSegments[0];
+      score += 10;
+    }
+  }
+
+  if (normalizedContent.includes(normalizedQuery)) {
+    const index = normalizedContent.indexOf(normalizedQuery);
+    snippet = buildSnippet(doc.content || "", index, rawQuery.length);
+    score += 10;
+  } else if (normalizedSummary.includes(normalizedQuery)) {
+    const index = normalizedSummary.indexOf(normalizedQuery);
+    snippet = buildSnippet(doc.summary || "", index, rawQuery.length);
+    score += 6;
+  }
+
+  if (score === 0) {
+    return null;
+  }
+
+  return {
+    id: `${doc.url}`,
+    title: doc.title,
+    url: doc.url,
+    summary: doc.summary,
+    snippet,
+    codeSnippet,
+    mathSnippet,
+    tags: doc.tags || [],
+    languages: doc.languages || [],
+    difficulty: doc.difficulty || "",
+    type: doc.type || "page",
+    date: doc.date,
+    readingTime: doc.reading_time,
+    score
+  };
+}
+
+function arrayFromNormalized(normalizedValues, fallback) {
+  if (Array.isArray(normalizedValues) && normalizedValues.length > 0) {
+    return normalizedValues;
+  }
+  return Array.isArray(fallback) ? fallback.map((value) => normalize(value)) : [];
+}
+
+function normalizedArray(doc, key) {
+  const normalized = doc.normalized || {};
+  const values = normalized[key];
+  if (Array.isArray(values) && values.length > 0) {
+    return new Set(values);
+  }
+  const fallback = Array.isArray(doc[key]) ? doc[key] : [];
+  return new Set(fallback.map((value) => normalize(value)));
+}

data/assets/js/search/filters.js

@@ -0,0 +1,38 @@
+export function renderTagFilters(container, documents, selectedTags) {
+  if (!container) {
+    return;
+  }
+
+  const tagSet = new Set();
+  documents.forEach((item) => {
+    const source = item.tags || item.topics || [];
+    source.forEach((tag) => {
+      if (tag) {
+        tagSet.add(String(tag).toLowerCase());
+      }
+    });
+  });
+
+  const tags = Array.from(tagSet).sort();
+  if (tags.length === 0) {
+    const p = document.createElement("p");
+    p.className = "search-filter__empty";
+    p.textContent = "No tags available yet.";
+    container.replaceChildren(p);
+    return;
+  }
+
+  const fragment = document.createDocumentFragment();
+  tags.forEach((tag) => {
+    const button = document.createElement("button");
+    button.type = "button";
+    button.className = "search-filter__tag";
+    button.textContent = tag;
+    button.dataset.filterTag = tag;
+    button.setAttribute("aria-pressed", selectedTags.has(tag) ? "true" : "false");
+    fragment.appendChild(button);
+  });
+
+  container.replaceChildren();
+  container.appendChild(fragment);
+}

data/assets/js/search/render.js

@@ -0,0 +1,217 @@
+import { formatType, highlightText, toTitleCase } from "./utils.js";
+
+export function renderResults(results, query, elements) {
+  const { resultsList, resultsMeta, emptyState, template } = elements;
+
+  if (!resultsList || !resultsMeta || !emptyState || !template) {
+    return;
+  }
+
+  resultsList.replaceChildren();
+
+  if (!query) {
+    resultsMeta.textContent = "Enter a query to begin.";
+    emptyState.hidden = true;
+    return;
+  }
+
+  if (results.length === 0) {
+    resultsMeta.textContent = `No matches for “${query}”.`;
+    emptyState.hidden = false;
+    return;
+  }
+
+  emptyState.hidden = true;
+  resultsMeta.textContent = `${results.length} result${results.length === 1 ? "" : "s"} for “${query}”.`;
+
+  const fragment = document.createDocumentFragment();
+
+  results.forEach((result) => {
+    const clone = template.content.cloneNode(true);
+    const typeEl = clone.querySelector("[data-result-type]");
+    const difficultyEl = clone.querySelector("[data-result-difficulty]");
+    const languageEl = clone.querySelector("[data-result-languages]");
+    const linkEl = clone.querySelector("[data-result-link]");
+    const summaryEl = clone.querySelector("[data-result-summary]");
+    const codeEl = clone.querySelector("[data-result-code]");
+    const codeCodeEl = codeEl ? codeEl.querySelector("code") : null;
+    const mathEl = clone.querySelector("[data-result-math]");
+    const mathPreviewEl = clone.querySelector("[data-result-math-preview]");
+    const mathCodeEl = clone.querySelector("[data-result-math-code]");
+    const mathCopyButton = clone.querySelector("[data-result-math-copy]");
+    const excerptEl = clone.querySelector("[data-result-excerpt]");
+    const tagsEl = clone.querySelector("[data-result-tags]");
+    const dateEl = clone.querySelector("[data-result-date]");
+
+    if (typeEl) {
+      typeEl.textContent = formatType(result.type);
+    }
+
+    if (difficultyEl) {
+      if (result.difficulty) {
+        difficultyEl.textContent = `Difficulty: ${toTitleCase(result.difficulty)}`;
+        difficultyEl.hidden = false;
+      } else {
+        difficultyEl.hidden = true;
+      }
+    }
+
+    if (languageEl) {
+      if (result.languages && result.languages.length > 0) {
+        languageEl.textContent = `Languages: ${result.languages.map((lang) => toTitleCase(lang)).join(", ")}`;
+        languageEl.hidden = false;
+      } else {
+        languageEl.hidden = true;
+      }
+    }
+
+    if (linkEl) {
+      linkEl.textContent = result.title || result.url;
+      linkEl.setAttribute("href", result.url);
+    }
+
+    if (summaryEl) {
+      summaryEl.replaceChildren();
+      summaryEl.insertAdjacentHTML("beforeend", highlightText(result.summary || "", query));
+    }
+
+    if (mathEl && mathCodeEl) {
+      if (result.mathSnippet) {
+        mathEl.hidden = false;
+        mathCodeEl.textContent = result.mathSnippet;
+        if (mathPreviewEl) {
+          if (window.DatalogMath && typeof window.DatalogMath.renderLatex === "function") {
+            window.DatalogMath.renderLatex(mathPreviewEl, result.mathSnippet, {
+              display: false,
+              enhance: false
+            });
+          } else if (window.MathJax && typeof window.MathJax.typesetPromise === "function") {
+            mathPreviewEl.innerHTML = `\\(${result.mathSnippet}\\)`;
+            window.MathJax.typesetPromise([mathPreviewEl]).catch(() => {
+              mathPreviewEl.textContent = result.mathSnippet;
+            });
+          } else {
+            mathPreviewEl.textContent = result.mathSnippet;
+          }
+        }
+        if (mathCopyButton) {
+          mathCopyButton.addEventListener("click", () => copyToClipboard(result.mathSnippet, mathEl));
+        }
+      } else {
+        mathEl.hidden = true;
+      }
+    }
+
+    if (excerptEl) {
+      if (result.snippet) {
+        excerptEl.replaceChildren();
+        excerptEl.insertAdjacentHTML("beforeend", highlightText(result.snippet, query));
+        excerptEl.hidden = false;
+      } else {
+        excerptEl.hidden = true;
+      }
+    }
+
+    if (codeEl && codeCodeEl) {
+      if (result.codeSnippet && result.codeSnippet.code) {
+        const language = result.codeSnippet.language || "text";
+        codeEl.classList.remove("language-none");
+        codeEl.classList.add(`language-${language}`);
+        codeCodeEl.className = `language-${language}`;
+        const code = result.codeSnippet.code;
+        if (window.Prism && window.Prism.languages) {
+          const grammar = window.Prism.languages[language] || window.Prism.languages.markup;
+          codeCodeEl.innerHTML = window.Prism.highlight(code, grammar, language);
+        } else {
+          codeCodeEl.textContent = code;
+        }
+        codeEl.hidden = false;
+      } else {
+        codeEl.hidden = true;
+      }
+    }
+
+    if (tagsEl) {
+      tagsEl.replaceChildren();
+      (result.tags || []).forEach((tag) => {
+        const li = document.createElement("li");
+        li.textContent = `#${tag}`;
+        tagsEl.appendChild(li);
+      });
+    }
+
+    if (dateEl) {
+      if (result.date) {
+        const date = new Date(result.date);
+        if (!Number.isNaN(date.getTime())) {
+          dateEl.textContent = date.toLocaleDateString(undefined, {
+            year: "numeric",
+            month: "short",
+            day: "numeric"
+          });
+          dateEl.hidden = false;
+        } else {
+          dateEl.hidden = true;
+        }
+      } else {
+        dateEl.hidden = true;
+      }
+    }
+
+    fragment.appendChild(clone);
+  });
+
+  resultsList.appendChild(fragment);
+}
+
+function copyToClipboard(value, container) {
+  if (!value) {
+    return;
+  }
+
+  const provideFeedback = () => {
+    if (!container) {
+      return;
+    }
+    const button = container.querySelector("[data-result-math-copy]");
+    const sr = button ? button.querySelector(".visually-hidden") : null;
+    if (button && sr) {
+      const original = button.getAttribute("data-sr-original") || sr.textContent;
+      if (!button.getAttribute("data-sr-original")) {
+        button.setAttribute("data-sr-original", original || "Copy LaTeX");
+      }
+      sr.textContent = "Copied LaTeX";
+      button.classList.add("is-copied");
+      window.setTimeout(() => {
+        sr.textContent = button.getAttribute("data-sr-original") || "Copy LaTeX";
+        button.classList.remove("is-copied");
+      }, 2000);
+    }
+  };
+
+  const fallback = () => {
+    const temp = document.createElement("textarea");
+    temp.value = value;
+    temp.setAttribute("aria-hidden", "true");
+    temp.style.position = "fixed";
+    temp.style.opacity = "0";
+    document.body.appendChild(temp);
+    temp.select();
+    try {
+      document.execCommand("copy");
+      provideFeedback();
+    } catch (error) {
+      console.warn("Unable to copy LaTeX snippet", error);
+    }
+    document.body.removeChild(temp);
+  };
+
+  if (navigator.clipboard && navigator.clipboard.writeText) {
+    navigator.clipboard
+      .writeText(value)
+      .then(() => provideFeedback())
+      .catch(() => fallback());
+  } else {
+    fallback();
+  }
+}

data/assets/js/search/utils.js

@@ -0,0 +1,99 @@
+export function normalize(value = "") {
+  const source = value == null ? "" : String(value);
+  try {
+    return source.toLowerCase().normalize("NFKD").replace(/\p{Diacritic}/gu, "");
+  } catch (error) {
+    return source.toLowerCase();
+  }
+}
+
+export function normalizeCode(value = "") {
+  return normalize(value).replace(/\s+/g, "");
+}
+
+export function tokenize(query = "") {
+  return normalize(query)
+    .split(/[^a-z0-9\\._]+/)
+    .filter(Boolean);
+}
+
+export function isMathQuery(query = "") {
+  return /\\|\^|_|\{|\}|\$/.test(query);
+}
+
+export function isCodeQuery(query = "") {
+  return /`|::|->|=>|\(|\)|\{|\}|\[|\]|=|\bdef\b|\bfunction\b|\bclass\b/.test(query);
+}
+
+export function fuzzyIncludes(source, query) {
+  if (!source || !query) {
+    return false;
+  }
+  let idx = 0;
+  for (let i = 0; i < source.length && idx < query.length; i += 1) {
+    if (source[i] === query[idx]) {
+      idx += 1;
+    }
+  }
+  return idx === query.length;
+}
+
+export function stripHtml(value) {
+  if (!value) {
+    return "";
+  }
+  const temp = document.createElement("div");
+  temp.innerHTML = value;
+  return temp.textContent || temp.innerText || "";
+}
+
+export function buildSnippet(content, index, length) {
+  if (!content) {
+    return "";
+  }
+  const cleanContent = stripHtml(content);
+  const start = Math.max(0, index - 80);
+  const end = Math.min(cleanContent.length, index + length + 80);
+  return `${cleanContent.slice(start, end)}${end < cleanContent.length ? "…" : ""}`;
+}
+
+export function escapeRegex(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+
+export function highlightText(text, query) {
+  if (!text || !query) {
+    return text;
+  }
+  const tokens = Array.from(new Set(tokenize(query))).sort((a, b) => b.length - a.length);
+  let highlighted = text;
+  tokens.forEach((token) => {
+    if (!token) return;
+    const regex = new RegExp(`(${escapeRegex(token)})`, "gi");
+    highlighted = highlighted.replace(regex, "<mark>$1</mark>");
+  });
+  return highlighted;
+}
+
+export function toTitleCase(value) {
+  return (value || "")
+    .toString()
+    .split(/[-_\s]+/)
+    .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
+    .join(" ");
+}
+
+export function formatType(type) {
+  switch (type) {
+    case "post":
+      return "Tutorial & Blog";
+    case "project":
+      return "Project";
+    case "research":
+      return "Research";
+    case "dataset":
+      return "Dataset";
+    default:
+      return toTitleCase(type || "Page");
+  }
+}