taleem-engine 1.0.0

package/src/compiler/templates/compileTextGrid.js

@@ -0,0 +1,57 @@
+// /src/compiler/templates/compileTextGrid.js
+
+import { addIdToItems } from "./helpers/addIdToItems.js";
+
+export function compileTextGrid(slide) {
+  const rawItems = slide.data ?? [];
+
+  const items =
+    addIdToItems(rawItems);
+
+  const texts =
+    items.filter(
+      d => d.name === "text"
+    );
+
+  if (!texts.length) {
+    throw new Error(
+      "textGrid: requires text items"
+    );
+  }
+
+  const ids =
+    items.map(i => i.id);
+
+  const html = `
+    <section class="slide textGrid">
+
+      <div class="text-grid">
+
+        ${texts.map(text => `
+          <div
+            id="${text.id}"
+
+            class="
+              text-grid-item
+              hidden
+              ${text.classes || ""}
+            "
+          >
+            ${text.content}
+          </div>
+        `).join("")}
+
+      </div>
+
+    </section>
+  `;
+
+  return {
+    html,
+
+    animation:
+      "progressiveReveal",
+
+    ids
+  };
+}

package/src/compiler/templates/compileTitleAndPara.js

@@ -0,0 +1,79 @@
+
+// /src/compiler/templates/compileTitleAndPara.js
+
+import { addIdToItems } from "./helpers/addIdToItems.js";
+
+export function compileTitleAndPara(slide) {
+  const rawItems = slide.data ?? [];
+
+  if (!rawItems.length) {
+    throw new Error(
+      "titleAndPara: requires data"
+    );
+  }
+
+  const items =
+    addIdToItems(rawItems);
+
+  const titleItem =
+    items.find(
+      d => d.name === "title"
+    );
+
+  const paraItem =
+    items.find(
+      d => d.name === "para"
+    );
+
+  if (!paraItem) {
+    throw new Error(
+      "titleAndPara: requires para"
+    );
+  }
+
+  const ids =
+    items.map(i => i.id);
+
+  const html = `
+    <section class="slide titleAndPara">
+
+      ${
+        titleItem
+          ? `
+            <h1
+              id="${titleItem.id}"
+
+              class="
+                hidden
+                taleem-heading-md
+              "
+            >
+              ${titleItem.content}
+            </h1>
+          `
+          : ""
+      }
+
+      <p
+        id="${paraItem.id}"
+
+        class="
+          hidden
+          taleem-para
+        "
+      >
+        ${paraItem.content}
+      </p>
+
+    </section>
+  `;
+
+  return {
+    html,
+
+    animation:
+      "progressiveReveal",
+
+    ids
+  };
+}

package/src/compiler/templates/compileTitleAndSubtitle.js

@@ -0,0 +1,84 @@
+
+// /src/compiler/templates/compileTitleAndSubtitle.js
+
+import { addIdToItems } from "./helpers/addIdToItems.js";
+
+export function compileTitleAndSubtitle(
+  slide
+) {
+  const rawItems =
+    slide.data ?? [];
+
+  if (!rawItems.length) {
+    throw new Error(
+      "titleAndSubtitle: requires title"
+    );
+  }
+
+  const items =
+    addIdToItems(rawItems);
+
+  const titleItem =
+    items.find(
+      d => d.name === "title"
+    );
+
+  const subtitleItem =
+    items.find(
+      d => d.name === "subtitle"
+    );
+
+  if (!titleItem) {
+    throw new Error(
+      "titleAndSubtitle: requires title"
+    );
+  }
+
+  const ids =
+    items.map(i => i.id);
+
+  const html = `
+    <section class="slide titleAndSubtitle">
+
+      <h1
+        id="${titleItem.id}"
+
+        class="
+          hidden
+          taleem-heading-lg
+          ${titleItem.classes || ""}
+        "
+      >
+        ${titleItem.content}
+      </h1>
+
+      ${
+        subtitleItem
+          ? `
+            <h2
+              id="${subtitleItem.id}"
+
+              class="
+                hidden
+                taleem-heading-md
+                ${subtitleItem.classes || ""}
+              "
+            >
+              ${subtitleItem.content}
+            </h2>
+          `
+          : ""
+      }
+
+    </section>
+  `;
+
+  return {
+    html,
+
+    animation:
+      "progressiveReveal",
+
+    ids
+  };
+}

package/src/compiler/templates/compileTwoColumnText.js

@@ -0,0 +1,116 @@
+// /src/compiler/templates/compileTwoColumnText.js
+
+import { addIdToItems } from "./helpers/addIdToItems.js";
+
+export function compileTwoColumnText(
+  slide
+) {
+  const rawItems =
+    slide.data ?? [];
+
+  const items =
+    addIdToItems(rawItems);
+
+  const leftItems =
+    items.filter(
+      d =>
+        d.name === "leftText"
+        ||
+        d.name === "leftImage"
+    );
+
+  const rightItems =
+    items.filter(
+      d =>
+        d.name === "rightText"
+        ||
+        d.name === "rightImage"
+    );
+
+  if (
+    !leftItems.length
+    ||
+    !rightItems.length
+  ) {
+    throw new Error(
+      "twoColumnText: requires left and right content"
+    );
+  }
+
+  const ids =
+    items.map(i => i.id);
+
+  function renderItem(item) {
+    const classes =
+      item.classes || "";
+
+    if (
+      item.name === "leftText"
+      ||
+      item.name === "rightText"
+    ) {
+      return `
+        <div
+          id="${item.id}"
+
+          class="
+            hidden
+            ${classes}
+          "
+        >
+          ${item.content}
+        </div>
+      `;
+    }
+
+    if (
+      item.name === "leftImage"
+      ||
+      item.name === "rightImage"
+    ) {
+      return `
+        <img
+          id="${item.id}"
+
+          class="
+            hidden
+            ${classes}
+          "
+
+          src="${item.content}"
+
+          alt=""
+        />
+      `;
+    }
+
+    return "";
+  }
+
+  const html = `
+    <section class="slide twoColumnText">
+
+      <div class="col left">
+        ${leftItems
+          .map(renderItem)
+          .join("")}
+      </div>
+
+      <div class="col right">
+        ${rightItems
+          .map(renderItem)
+          .join("")}
+      </div>
+
+    </section>
+  `;
+
+  return {
+    html,
+
+    animation:
+      "progressiveReveal",
+
+    ids
+  };
+}

package/src/compiler/templates/helpers/addIdToItems.js

@@ -0,0 +1,17 @@
+
+let __idCounter = 0;
+
+export function addIdToItems(items) {
+  if (!Array.isArray(items)) return [];
+
+  return items.map(item => {
+    __idCounter++;
+
+    const id = `i${Date.now().toString(36)}${__idCounter.toString(36)}`;
+
+    return {
+      ...item,
+      id
+    };
+  });
+}

package/src/compiler/templates/helpers/buildSequentialStates.js

@@ -0,0 +1,24 @@
+
+
+export function buildSequentialStates(timeline, allIds) {
+    const actions = [];
+    const visibleSet = new Set();
+  
+    for (const step of timeline) {
+      visibleSet.add(step.id);
+  
+      const visible = Array.from(visibleSet);
+  
+      const hidden = allIds.filter(id => !visibleSet.has(id));
+  
+      actions.push({
+        time: step.time,
+        state: {
+          visible,
+          hidden
+        }
+      });
+    }
+  
+    return actions;
+  }

package/src/compiler/templates/index.js

@@ -0,0 +1,108 @@
+// /src/compiler/templates/index.js
+
+import { compileBulletList } from "./compileBulletList.js";
+
+import { compileSkeletonSlide } from "./compileSkeletonSlide.js";
+
+import { compileFocusList } from "./compileFocusList.js";
+
+import { compileEq } from "./compileEq.js";
+
+import { compileTable } from "./compileTable.js";
+
+import { compileBarChart } from "./compileBarChart.js";
+
+import { compileProgressbar } from "./compileProgressbar.js";
+
+import { compileTitleAndSubtitle } from "./compileTitleAndSubtitle.js";
+
+import { compileTitleAndPara } from "./compileTitleAndPara.js";
+
+import { compileTwoColumnText } from "./compileTwoColumnText.js";
+
+import { compileImageSlide } from "./compileImageSlide.js";
+
+import { compileImageWithTitle } from "./compileImageWithTitle.js";
+
+import { compileImageWithCaption } from "./compileImageWithCaption.js";
+
+import { compileImageLeftBulletsRight } from "./compileImageLeftBulletsRight.js";
+
+import { compileImageRightBulletsLeft } from "./compileImageRightBulletsLeft.js";
+
+import { compileQuoteSlide } from "./compileQuoteSlide.js";
+
+import { compileKeyIdeasSlide } from "./compileKeyIdeasSlide.js";
+
+import { compileFillImage } from "./compileFillImage.js";
+
+import { compileImageStrip } from "./compileImageStrip.js";
+
+import { compileImageGrid } from "./compileImageGrid.js";
+
+import { compileTextGrid } from "./compileTextGrid.js";
+
+export const templates = {
+  titleAndSubtitle:
+    compileTitleAndSubtitle,
+
+  titleAndPara:
+    compileTitleAndPara,
+
+  bulletList:
+    compileBulletList,
+
+  twoColumnText:
+    compileTwoColumnText,
+
+  imageSlide:
+    compileImageSlide,
+
+  imageWithTitle:
+    compileImageWithTitle,
+
+  imageWithCaption:
+    compileImageWithCaption,
+
+  imageLeftBulletsRight:
+    compileImageLeftBulletsRight,
+
+  imageRightBulletsLeft:
+    compileImageRightBulletsLeft,
+
+  table:
+    compileTable,
+
+  barChart:
+    compileBarChart,
+
+  progressbar:
+    compileProgressbar,
+
+  quoteSlide:
+    compileQuoteSlide,
+
+  keyIdeasSlide:
+    compileKeyIdeasSlide,
+
+  focusList:
+    compileFocusList,
+
+  eq:
+    compileEq,
+
+  fillImage:
+    compileFillImage,
+
+  imageStrip:
+    compileImageStrip,
+
+  imageGrid:
+    compileImageGrid,
+
+  textGrid:
+    compileTextGrid,
+
+  skeleton:
+    compileSkeletonSlide
+};

package/src/compiler/utils/applyBackground.js

@@ -0,0 +1,9 @@
+export function applyBackground(el, background = {}) {
+    if (background.backgroundColor) {
+      el.style.backgroundColor = background.backgroundColor;
+    }
+  
+    if (background.backgroundImage) {
+      el.style.backgroundImage = `url("${background.backgroundImage}")`;
+    }
+  }

package/src/compiler/utils/assignMockTimings.js

@@ -0,0 +1,47 @@
+// src/utils/assignMockTimings.js
+
+/**
+ * Compile a golden / browser-ready deck into a player-ready deck
+ * by assigning mock absolute timings.
+ *
+ * @param {object} goldenDeck - deck object with a `deck` array
+ * @param {number} slideDuration - seconds per slide (default: 5)
+ * @returns {object} player-ready deck
+ */
+export function assignMockTimings(goldenDeck, slideDuration = 5) {
+  if (
+    !goldenDeck ||
+    !Array.isArray(goldenDeck.deck) ||
+    typeof slideDuration !== "number"
+  ) {
+    throw new Error("assignMockTimings: invalid deck or slideDuration");
+  }
+
+  let currentTime = 0;
+
+  const deckWithTimings = {
+    ...goldenDeck,
+    deck: goldenDeck.deck.map(slide => {
+      const start = currentTime;
+      const end = start + slideDuration;
+      currentTime = end;
+
+      const data = Array.isArray(slide.data)
+        ? slide.data.map(item => ({
+            ...item,
+            showAt:
+              start + (typeof item.showAt === "number" ? item.showAt : 0)
+          }))
+        : slide.data;
+
+      return {
+        ...slide,
+        start,
+        end,
+        data
+      };
+    })
+  };
+
+  return deckWithTimings;
+}

package/src/compiler/utils/compileTimings.js

@@ -0,0 +1,16 @@
+// /src/dsl/compileTimings.js
+
+export function compileTimings(deck, presentationEnd) {
+    for (let i = 0; i < deck.length; i++) {
+      const currentSlide = deck[i];
+      const nextSlide = deck[i + 1];
+  
+      if (nextSlide) {
+        currentSlide.end = nextSlide.start;
+      } else {
+        currentSlide.end = presentationEnd;
+      }
+    }
+  
+    return deck;
+  }

package/src/compiler/utils/getDeckImages.js

@@ -0,0 +1,40 @@
+// getDeckImages.js
+
+export function getDeckImages(deck) {
+    const images = new Set();
+  
+    // -----------------------------
+    // background image
+    // -----------------------------
+    if (
+      deck.background?.backgroundImage &&
+      typeof deck.background.backgroundImage === "string"
+    ) {
+      images.add(deck.background.backgroundImage.split("/").pop());
+    }
+  
+    // -----------------------------
+    // slide-level images
+    // -----------------------------
+    if (!Array.isArray(deck.deck)) return [];
+  
+    deck.deck.forEach(slide => {
+      slide.data?.forEach(item => {
+        // normal image
+        if (item.name === "image" && typeof item.content === "string") {
+          images.add(item.content.split("/").pop());
+        }
+  
+        // EQ side panel spImage
+        if (Array.isArray(item.spItems)) {
+          item.spItems.forEach(sp => {
+            if (sp.type === "spImage" && typeof sp.content === "string") {
+              images.add(sp.content.split("/").pop());
+            }
+          });
+        }
+      });
+    });
+  
+    return Array.from(images);
+  }

package/src/compiler/utils/resolveAssetPaths.js

@@ -0,0 +1,42 @@
+/**
+ * Resolve image paths in a deck.
+ * App-level utility. Mutates deck in place.
+ */
+export function resolveAssetPaths(deck, IMG_BASE) {
+  // -----------------------------
+  // background image
+  // -----------------------------
+  if (
+    deck.background?.backgroundImage &&
+    typeof deck.background.backgroundImage === "string"
+  ) {
+    deck.background.backgroundImage =
+      IMG_BASE + deck.background.backgroundImage.split("/").pop();
+  }
+
+  // -----------------------------
+  // slide-level images
+  // -----------------------------
+  deck.deck.forEach(slide => {
+    slide.data?.forEach(item => {
+      // normal image slides
+      if (item.name === "image" && typeof item.content === "string") {
+        item.content = IMG_BASE + item.content.split("/").pop();
+      }
+
+      // -----------------------------
+      // EQ side-panel images (spImage)
+      // -----------------------------
+      if (Array.isArray(item.spItems)) {
+        item.spItems.forEach(sp => {
+          // if (sp.type === "spImage" && typeof sp.content === "string") {
+          if (sp.name === "image" && typeof sp.content === "string") {
+            sp.content = IMG_BASE + sp.content.split("/").pop();
+          }
+        });
+      }
+    });
+  });
+
+  return deck;
+}

package/src/compiler/utils/resolveBackground.js

@@ -0,0 +1,29 @@
+
+/**
+ * Resolve background assets for a deck.
+ * App-level utility. Mutates deck in place.
+ *
+ * @param {object} deck - deck-v1 object
+ * @param {string} ASSET_BASE - base path for assets (e.g. "/images/")
+ */
+export function resolveBackground(deck, ASSET_BASE) {
+    if (!deck || !deck.background) return deck;
+  
+    const bg = deck.background;
+  
+    if (
+      typeof bg.backgroundImage === "string" &&
+      bg.backgroundImage.length > 0
+    ) {
+      bg.backgroundImage =
+        ASSET_BASE + bg.backgroundImage.split("/").pop();
+    }
+  
+    // defaults (defensive, not opinionated)
+    if (bg.backgroundImageOpacity === undefined) {
+      bg.backgroundImageOpacity = 1;
+    }
+  
+    return deck;
+  }
+