@eox/pages-theme-eox 1.9.0 → 2.0.0-alpha.10

package/src/helpers.test.js

@@ -0,0 +1,181 @@
+import { describe, it, beforeEach } from "node:test";
+import assert from "node:assert/strict";
+import {
+  normalizeTrackingUrl,
+  trackPageView,
+  trackEvent,
+  trackSiteSearch,
+  formatPrice,
+  t,
+  isActive,
+} from "./helpers.js";
+
+describe("normalizeTrackingUrl", () => {
+  it("strips trailing slashes from path", () => {
+    assert.equal(normalizeTrackingUrl("/explore/"), "/explore");
+    assert.equal(normalizeTrackingUrl("/explore"), "/explore");
+    assert.equal(normalizeTrackingUrl("/story/"), "/story");
+    assert.equal(normalizeTrackingUrl("/news_updates/"), "/news_updates");
+  });
+
+  it("keeps single root slash as /", () => {
+    assert.equal(normalizeTrackingUrl("/"), "/");
+    assert.equal(normalizeTrackingUrl(""), "");
+  });
+
+  it("removes volatile map coordinate parameters (x, y, z) and keeps template/zoom/datetime", () => {
+    assert.equal(
+      normalizeTrackingUrl("/explore/?x=15.0000&y=48.0000&z=4.0000"),
+      "/explore",
+    );
+    assert.equal(
+      normalizeTrackingUrl(
+        "/explore/?x=15.0000&y=48.0000&z=4.0000&template=expert&indicator=N11&datetime=2024-08-16&zoom=5",
+      ),
+      "/explore?datetime=2024-08-16&indicator=N11&template=expert&zoom=5",
+    );
+  });
+
+  it("preserves semantic content query params and sorts them", () => {
+    assert.equal(
+      normalizeTrackingUrl("/story/?page=2&id=sea-ice-extent"),
+      "/story?id=sea-ice-extent&page=2",
+    );
+    assert.equal(
+      normalizeTrackingUrl("/story/?id=sea-ice-extent&page=2"),
+      "/story?id=sea-ice-extent&page=2",
+    );
+  });
+
+  it("normalizes full URLs", () => {
+    assert.equal(
+      normalizeTrackingUrl("https://eodash.eox.at/explore/"),
+      "https://eodash.eox.at/explore",
+    );
+    assert.equal(
+      normalizeTrackingUrl(
+        "https://eodash.eox.at/explore/?x=12&y=34&indicator=TEST",
+      ),
+      "https://eodash.eox.at/explore?indicator=TEST",
+    );
+  });
+});
+
+describe("trackEvent", () => {
+  beforeEach(() => {
+    globalThis._paq = [];
+    globalThis.window = globalThis;
+  });
+
+  it("pushes array payload to _paq and normalizes path arguments", () => {
+    trackEvent(["Interaction", "Scroll Depth", "/explore/", 50]);
+    assert.deepEqual(globalThis._paq, [
+      ["trackEvent", "Interaction", "Scroll Depth", "/explore", 50],
+    ]);
+  });
+
+  it("supports positional arguments", () => {
+    trackEvent("CTA", "/click-link/", "Button Text");
+    assert.deepEqual(globalThis._paq, [
+      ["trackEvent", "CTA", "/click-link", "Button Text"],
+    ]);
+  });
+});
+
+describe("trackPageView", () => {
+  beforeEach(() => {
+    globalThis._paq = [];
+    globalThis.window = globalThis;
+    globalThis.document = { title: "Default Title" };
+  });
+
+  it("normalizes URL and sets document title before tracking page view", () => {
+    trackPageView({
+      path: "/explore/?x=10&indicator=AIR",
+      title: "Explore Indicators",
+    });
+    assert.deepEqual(globalThis._paq, [
+      ["setCustomUrl", "/explore?indicator=AIR"],
+      ["setDocumentTitle", "Explore Indicators"],
+      ["trackPageView"],
+      ["enableLinkTracking"],
+    ]);
+  });
+
+  it("accepts router route object", () => {
+    trackPageView({
+      route: {
+        path: "/story/",
+        data: { title: "Climate Story" },
+      },
+    });
+    assert.deepEqual(globalThis._paq, [
+      ["setCustomUrl", "/story"],
+      ["setDocumentTitle", "Climate Story"],
+      ["trackPageView"],
+      ["enableLinkTracking"],
+    ]);
+  });
+});
+
+describe("trackSiteSearch", () => {
+  beforeEach(() => {
+    globalThis._paq = [];
+    globalThis.window = globalThis;
+  });
+
+  it("pushes trackSiteSearch event with keyword, category, and result count", () => {
+    trackSiteSearch("methane", "indicators", 5);
+    assert.deepEqual(globalThis._paq, [
+      ["trackSiteSearch", "methane", "indicators", 5],
+    ]);
+  });
+});
+
+describe("existing helpers", () => {
+  it("formats prices correctly", () => {
+    assert.equal(formatPrice(12000, "en"), "€ 12,000.-");
+    assert.equal(formatPrice(49.99, "de"), "€ 49,99");
+  });
+
+  it("translates i18n keys with fallback", () => {
+    assert.equal(t("nav.home", { nav: { home: "Home Page" } }), "Home Page");
+    assert.equal(
+      t("nav.unknown", { nav: { home: "Home Page" } }),
+      "nav.unknown",
+    );
+    assert.equal(t("Imprint", { Imprint: "Impressum" }), "Impressum");
+    assert.equal(t("Imprint", {}), "Imprint");
+  });
+
+  it("checks isActive links correctly", () => {
+    assert.equal(isActive({ link: "/explore/" }, "/explore"), true);
+    assert.equal(isActive({ link: "/explore" }, "/explore/"), true);
+    assert.equal(isActive({ link: "/explore" }, "/explore/subpage"), true);
+    assert.equal(isActive({ link: "/explore" }, "/explore-other"), false);
+    assert.equal(isActive({ link: "/explore" }, "/explore?tab=1#sec"), true);
+    assert.equal(isActive({ link: "/" }, "/"), true);
+    assert.equal(isActive({ link: "/" }, "/explore"), false);
+
+    // Parent dropdown with items
+    const parentDropdown = {
+      text: "Expertise",
+      items: [
+        { text: "Data Management", link: "/expertise/data-management" },
+        { text: "Data Visualization", link: "/expertise/data-visualization" },
+      ],
+    };
+    assert.equal(isActive(parentDropdown, "/expertise/data-management"), true);
+    assert.equal(isActive(parentDropdown, "/expertise/data-management/"), true);
+    assert.equal(isActive(parentDropdown, "/solutions"), false);
+
+    // Parent with both link and items
+    const parentWithLinkAndItems = {
+      text: "Products",
+      link: "/products",
+      items: [{ text: "Product A", link: "/products/a" }],
+    };
+    assert.equal(isActive(parentWithLinkAndItems, "/products/a"), true);
+    assert.equal(isActive(parentWithLinkAndItems, "/products"), true);
+  });
+});

package/src/index.js

@@ -17,6 +17,14 @@ import ImageElement from "./components/ImageElement.vue";
 import ImageGallery from "./components/ImageGallery.vue";
 import ImageCarousel from "./components/ImageCarousel.vue";
 import SingleTweet from "./components/SingleTweet.vue";
+import BlogPost from "./components/BlogPost.vue";
+import TagList from "./components/TagList.vue";
+import BlogList from "./components/BlogList.vue";
+import TeamPage from "./components/TeamPage.vue";
+import SectionHeader from "./components/SectionHeader.vue";
+import TestimonialsSection from "./components/TestimonialsSection.vue";
+import TextSection from "./components/TextSection.vue";
+import OpenPositions from "./components/OpenPositions.vue";
 import Layout from "./Layout.vue";
 import "./style.css";
 
@@ -43,6 +51,14 @@ export default {
     app.component("GalleryGrid", ImageGallery);
     app.component("ImageCarousel", ImageCarousel);
     app.component("SingleTweet", SingleTweet);
+    app.component("BlogPost", BlogPost);
+    app.component("TagList", TagList);
+    app.component("BlogList", BlogList);
+    app.component("TeamPage", TeamPage);
+    app.component("SectionHeader", SectionHeader);
+    app.component("TestimonialsSection", TestimonialsSection);
+    app.component("TextSection", TextSection);
+    app.component("OpenPositions", OpenPositions);
 
     router.onAfterRouteChanged = () => {
       if (!import.meta.env.SSR) {

package/src/pages/author/[author].md

@@ -0,0 +1,5 @@
+---
+layout: blog
+title: Author posts
+hero: true
+---

package/src/pages/author/[author].paths.js

@@ -0,0 +1,60 @@
+import fs from "node:fs";
+import path from "node:path";
+
+export default {
+  paths() {
+    const postsDir = path.resolve(process.cwd(), "_posts");
+    if (!fs.existsSync(postsDir)) return [];
+
+    const files = fs.readdirSync(postsDir).filter((f) => f.endsWith(".md"));
+    const allAuthors = new Set();
+
+    for (const file of files) {
+      const filePath = path.join(postsDir, file);
+      const content = fs.readFileSync(filePath, "utf8");
+
+      // Extract yaml frontmatter block
+      const frontmatterMatch = content.match(/^---\r?\n([\s\S]*?)\r?\n---/);
+      if (frontmatterMatch) {
+        const yaml = frontmatterMatch[1];
+
+        // 1. Match inline array or string style author
+        const authorMatch = yaml.match(/author:[ \t]+(.*?)\r?\n/);
+        if (authorMatch) {
+          const val = authorMatch[1].trim();
+          if (val.startsWith("[") && val.endsWith("]")) {
+            val
+              .slice(1, -1)
+              .split(",")
+              .forEach((a) => {
+                const clean = a.trim().replace(/['"]/g, "").toLowerCase();
+                if (clean) allAuthors.add(clean);
+              });
+          } else if (val && !val.startsWith("-")) {
+            const clean = val.replace(/['"]/g, "").toLowerCase();
+            if (clean) allAuthors.add(clean);
+          }
+        }
+
+        // 2. Match block list style authors
+        const authorBlockMatch = yaml.match(
+          /author:\r?\n((?:\s*-\s*.*\r?\n?)+)/,
+        );
+        if (authorBlockMatch) {
+          const lines = authorBlockMatch[1].split(/\r?\n/);
+          for (const line of lines) {
+            const m = line.match(/^\s*-\s*["']?(.*?)["']?\s*$/);
+            if (m && m[1]) {
+              const auth = m[1].trim().toLowerCase();
+              if (auth) allAuthors.add(auth);
+            }
+          }
+        }
+      }
+    }
+
+    return Array.from(allAuthors).map((author) => {
+      return { params: { author } };
+    });
+  },
+};

package/src/pages/blog.md

@@ -0,0 +1,5 @@
+---
+layout: blog
+title: Blog
+hero: true
+---

package/src/pages/tag/[tag].md

@@ -0,0 +1,5 @@
+---
+layout: blog
+title: Tag list
+hero: true
+---

package/src/pages/tag/[tag].paths.js

@@ -0,0 +1,49 @@
+import fs from "node:fs";
+import path from "node:path";
+
+export default {
+  paths() {
+    const postsDir = path.resolve(process.cwd(), "_posts");
+    if (!fs.existsSync(postsDir)) return [];
+
+    const files = fs.readdirSync(postsDir).filter((f) => f.endsWith(".md"));
+    const allTags = new Set();
+
+    for (const file of files) {
+      const filePath = path.join(postsDir, file);
+      const content = fs.readFileSync(filePath, "utf8");
+
+      // Robust YAML frontmatter parser
+      const frontmatterMatch = content.match(/^---\r?\n([\s\S]*?)\r?\n---/);
+      if (frontmatterMatch) {
+        const yaml = frontmatterMatch[1];
+
+        // 1. Match list-style tags
+        const tagsBlockMatch = yaml.match(/tags:\r?\n((?:\s*-\s*.*\r?\n?)+)/);
+        if (tagsBlockMatch) {
+          const lines = tagsBlockMatch[1].split(/\r?\n/);
+          for (const line of lines) {
+            const m = line.match(/^\s*-\s*["']?(.*?)["']?\s*$/);
+            if (m && m[1]) {
+              const tag = m[1].trim().toLowerCase();
+              if (tag) allTags.add(tag);
+            }
+          }
+        }
+
+        // 2. Match inline-array style tags
+        const inlineMatch = yaml.match(/tags:\s*\[([\s\S]*?)\]/);
+        if (inlineMatch) {
+          inlineMatch[1].split(",").forEach((t) => {
+            const tag = t.trim().replace(/['"]/g, "").toLowerCase();
+            if (tag) allTags.add(tag);
+          });
+        }
+      }
+    }
+
+    return Array.from(allTags).map((tag) => {
+      return { params: { tag } };
+    });
+  },
+};

package/src/pages/tag.md

@@ -0,0 +1,5 @@
+---
+layout: tags
+title: Tags
+hero: true
+---

package/src/pages/team.md

@@ -0,0 +1,5 @@
+---
+layout: team
+title: Our Team
+hero: true
+---

package/src/posts.data.js

@@ -0,0 +1,134 @@
+import { createContentLoader } from "vitepress";
+
+function cleanMarkdown(src) {
+  if (!src) return "";
+
+  // 1. If there's a <!-- more --> tag, truncate there
+  const moreIndex = src.indexOf("<!-- more -->");
+  let content = moreIndex !== -1 ? src.slice(0, moreIndex) : src;
+
+  // 2. Remove frontmatter (just in case)
+  if (content.startsWith("---")) {
+    const nextThree = content.indexOf("---", 3);
+    if (nextThree !== -1) {
+      content = content.slice(nextThree + 3);
+    }
+  }
+
+  // 3. Remove standard markdown and HTML elements
+  let text = content
+    // Remove custom containers like ::: info or ::: warning ... :::
+    .replace(/:::[^\n]*\n/g, "")
+    .replace(/:::/g, "")
+    // Remove HTML comments
+    .replace(/<!--[\s\S]*?-->/g, "")
+    // Remove images: ![alt](url)
+    .replace(/!\[.*?\]\(.*?\)/g, "")
+    // Remove links but keep text: [text](url)
+    .replace(/\[(.*?)\]\(.*?\)/g, "$1")
+    // Remove blockquotes: > quote
+    .replace(/^\s*>\s+/gm, "")
+    // Clean up lists: * list item, - list item, 1. list item
+    .replace(/^\s*[\*+-]\s+/gm, "")
+    .replace(/^\s*\d+\.\s+/gm, "")
+    // Remove tables/borders
+    .replace(/\|/g, "")
+    .replace(/[-]{3,}/g, "")
+    // Remove custom components / HTML tags but keep nested content
+    .replace(/<[^>]+>/g, "")
+    // Remove bold/italic formatting
+    .replace(/(\*\*|__)(.*?)\1/g, "$2")
+    .replace(/(\*|_)(.*?)\1/g, "$2")
+    // Remove inline code
+    .replace(/`(.*?)`/g, "$1")
+    // Replace multiple newlines or spaces with a single space
+    .replace(/\s+/g, " ")
+    .trim();
+
+  return text;
+}
+
+function getExcerpt(src, maxLength = 200) {
+  const text = cleanMarkdown(src);
+  if (text.length > maxLength) {
+    // Try to truncate at a word boundary within the last 30 characters
+    const truncated = text.slice(0, maxLength);
+    const lastSpace = truncated.lastIndexOf(" ");
+    if (lastSpace > maxLength - 30) {
+      return truncated.slice(0, lastSpace) + " ...";
+    }
+    return truncated + " ...";
+  }
+  return text;
+}
+
+function resolvePostUrl(page) {
+  if (!page.url) return "";
+  const cleanUrls = global.VITEPRESS_CONFIG?.cleanUrls ?? true;
+
+  const relFile = page.url.replace(/^\//, "").replace(/\.html$/, "") + ".md";
+
+  // 1. Check VitePress rewrites map first if available
+  const rewritten = global.VITEPRESS_CONFIG?.rewrites?.map?.[relFile];
+  if (rewritten) {
+    return (
+      "/" +
+      rewritten
+        .replace(/(^|\/)index\.md$/, "$1")
+        .replace(/\.md$/, cleanUrls ? "" : ".html")
+    );
+  }
+
+  // 2. If it is in _posts/, compute fallback rewrite based on frontmatter date and slug
+  if (page.url.startsWith("/_posts/")) {
+    const baseName = page.url.replace(/^\/_posts\//, "").replace(/\.html$/, "");
+    const slug = baseName
+      .toLowerCase()
+      .replace(/[^a-z0-9]+/g, "-")
+      .replace(/^-+|-+$/g, "");
+
+    const dateStr = String(page.frontmatter?.date || "");
+    const dateMatch = dateStr.match(/^(\d{4})-(\d{2})/);
+    if (dateMatch) {
+      const [, year, month] = dateMatch;
+      return `/${year}/${month}/${slug}${cleanUrls ? "" : ".html"}`;
+    } else {
+      return `/blog/${slug}${cleanUrls ? "" : ".html"}`;
+    }
+  }
+
+  return page.url;
+}
+
+export default createContentLoader("_posts/*.md", {
+  includeSrc: true,
+  transform(rawData) {
+    return rawData
+      .map((page) => {
+        // Normalize single author / authors array
+        const author = page.frontmatter.author || "";
+        const authors = Array.isArray(author) ? author : [author];
+
+        const excerpt =
+          page.frontmatter.description ||
+          page.frontmatter.summary ||
+          getExcerpt(page.src);
+
+        return {
+          title: page.frontmatter.title || "",
+          url: resolvePostUrl(page),
+          date: page.frontmatter.date || "",
+          authors,
+          tags: page.frontmatter.tags || [],
+          categories: page.frontmatter.categories || [],
+          coverImage:
+            page.frontmatter.coverImage || page.frontmatter.image || "",
+          excerpt,
+        };
+      })
+      .sort((a, b) => {
+        // Sort descending by date (newest first)
+        return b.date.localeCompare(a.date);
+      });
+  },
+});