refactoring van de cmap structuren bijna compleet

2026-09-03 16:21:21 +02:00
parent 1abc84489f
commit bd1ef6bed0
75 changed files with 2547 additions and 1967 deletions
@@ -0,0 +1,58 @@
+"use strict";
+
+/** Render stored CMap snapshots as linked images inside wiki pages. */
+export class CmapEmbedView {
+  constructor({ repository, conceptMaps, resolveReference, route, translate }) {
+    this.repository = repository;
+    this.conceptMaps = conceptMaps;
+    this.resolveReference = resolveReference;
+    this.route = route;
+    this.translate = translate;
+  }
+
+  async render(root) {
+    const embeds = Array.from(root.querySelectorAll(
+      ".rw-cmap-embed:not([data-cmap-hydrated])"));
+    for (const embed of embeds) await this.renderOne(embed);
+  }
+
+  async renderOne(embed) {
+    embed.dataset.cmapHydrated = "loading";
+    const conceptMap = this.resolveReference(
+      embed.dataset.cmapReference || "", this.conceptMaps());
+    if (!conceptMap) {
+      this.showError(embed, this.translate("concept-map-not-found", "CMap not found"));
+      return;
+    }
+    try {
+      const stored = await this.repository.load(conceptMap.slug);
+      if (!stored.renderedSvg) {
+        throw new Error("This embedded CMap has no rendered image yet.");
+      }
+      embed.replaceChildren();
+      embed.dataset.cmapSlug = conceptMap.slug;
+      const link = document.createElement("a");
+      link.href = this.route(conceptMap.slug);
+      link.className = "rw-cmap-embed-link";
+      link.title = this.translate("embedded-concept-map-help", "Open this CMap.");
+      const image = document.createElement("img");
+      image.className = "rw-cmap-embed-image";
+      image.alt = conceptMap.title;
+      image.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(stored.renderedSvg)}`;
+      link.append(image);
+      embed.append(link);
+      embed.dataset.cmapHydrated = "ready";
+    } catch (error) {
+      this.showError(embed, error.message);
+    }
+  }
+
+  showError(embed, message) {
+    embed.dataset.cmapHydrated = "error";
+    embed.replaceChildren();
+    const node = document.createElement("p");
+    node.className = "error";
+    node.textContent = message;
+    embed.append(node);
+  }
+}