npm - @mevdragon/vidfarm-devcli - Versions diffs - 0.1.0 → 0.2.0 - Mend

@mevdragon/vidfarm-devcli 0.1.0 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (63) hide show

package/.env.example +11 -4
package/PLATFORM_SPEC.md +142 -2
package/README.md +165 -16
package/SKILL.developer.md +577 -0
package/dist/infra/cdk/bin/vidfarm-prod.js +59 -0
package/dist/infra/cdk/lib/vidfarm-prod-stack.js +212 -0
package/dist/src/account-pages.js +578 -0
package/dist/src/app.js +887 -66
package/dist/src/cli.js +284 -5
package/dist/src/config.js +24 -4
package/dist/src/db.js +427 -18
package/dist/src/dev-app.js +59 -12
package/dist/src/homepage.js +441 -0
package/dist/src/index.js +12 -7
package/dist/src/lib/crypto.js +14 -0
package/dist/src/lib/template-dna.js +542 -0
package/dist/src/lib/template-style-options.js +49 -0
package/dist/src/registry.js +54 -7
package/dist/src/runtime.js +3 -1
package/dist/src/services/auth.js +69 -5
package/dist/src/services/jobs.js +23 -4
package/dist/src/services/providers.js +74 -12
package/dist/src/services/storage.js +52 -18
package/dist/src/services/template-certification.js +160 -0
package/dist/src/services/template-loader.js +37 -0
package/dist/src/services/template-sources.js +135 -0
package/dist/src/worker.js +19 -7
package/dist/templates/template_0000/src/lib/images.js +242 -0
package/dist/templates/template_0000/src/remotion/Root.js +33 -0
package/dist/templates/template_0000/src/sdk.js +3 -0
package/dist/templates/template_0000/src/style-options.js +51 -0
package/dist/templates/template_0000/src/template-dna.js +9 -0
package/dist/templates/template_0000/src/template.js +1217 -0
package/package.json +9 -1
package/templates/template_0000/README.md +121 -0
package/templates/template_0000/SKILL.md +193 -0
package/templates/template_0000/assets/Abel-Regular.ttf +0 -0
package/templates/template_0000/assets/DMSerifDisplay-Regular.ttf +0 -0
package/templates/template_0000/assets/Montserrat[wght].ttf +0 -0
package/templates/template_0000/assets/SourceCodePro[wght].ttf +0 -0
package/templates/template_0000/assets/TikTokSans-SemiBold.ttf +0 -0
package/templates/template_0000/assets/Yesteryear-Regular.ttf +0 -0
package/templates/template_0000/composition.json +11 -0
package/templates/template_0000/package-lock.json +5137 -0
package/templates/template_0000/package.json +30 -0
package/templates/template_0000/research/preview/.gitkeep +1 -0
package/templates/template_0000/research/source_notes.md +7 -0
package/templates/template_0000/scripts/create-site.mjs +27 -0
package/templates/template_0000/scripts/render-cloud.mjs +72 -0
package/templates/template_0000/src/lib/images.ts +284 -0
package/templates/template_0000/src/remotion/Root.js +33 -0
package/templates/template_0000/src/remotion/Root.tsx +75 -0
package/templates/template_0000/src/remotion/index.tsx +4 -0
package/templates/template_0000/src/sdk.ts +122 -0
package/templates/template_0000/src/style-options.js +51 -0
package/templates/template_0000/src/style-options.ts +60 -0
package/templates/template_0000/src/template-dna.ts +15 -0
package/templates/template_0000/src/template.ts +1747 -0
package/templates/template_0000/template.config.json +26 -0
package/templates/template_0000/tsconfig.json +19 -0
package/dist/templates/template_0000/demo-template.js +0 -196
package/dist/templates/template_0000/remotion/Root.js +0 -66
/package/dist/templates/template_0000/{remotion → src/remotion}/index.js +0 -0

package/dist/src/dev-app.js CHANGED Viewed

@@ -7,7 +7,8 @@ function escapeJsonForHtml(value) {
 export function renderDevApp(input) {
     const boot = escapeJsonForHtml({
         templates: input.templates,
-        environment: input.environment
+        environment: input.environment,
+        apiBasePath: "/api/v1"
     });
     return `<!doctype html>
 <html lang="en">
@@ -516,14 +517,20 @@ export function renderDevApp(input) {
       const BOOT = ${boot};
       const state = {
         baseUrl: window.location.origin,
+        apiBasePath: BOOT.apiBasePath,
         session: loadSession(),
         templates: BOOT.templates,
         selectedTemplateId: BOOT.templates[0]?.id ?? null,
         selectedOperation: null,
         selectedJobId: null,
-        jobs: []
+        jobs: [],
+        jobPollTimer: null
       };
+      const STANDARD_JOB_POLL_MS = 60 * 1000;
+      const BATCH_JOB_POLL_MS = 5 * 60 * 1000;
+      const BATCH_JOB_THRESHOLD = 5;
       const els = {
         email: document.getElementById("email"),
         otp: document.getElementById("otp"),
@@ -589,7 +596,7 @@ export function renderDevApp(input) {
       }
       async function request(path, options = {}) {
-        const response = await fetch(state.baseUrl + path, options);
+        const response = await fetch(state.baseUrl + state.apiBasePath + path, options);
         const data = await response.json().catch(() => ({}));
         if (!response.ok) {
           throw new Error(data.error || JSON.stringify(data));
@@ -603,7 +610,9 @@ export function renderDevApp(input) {
           els.sessionSummary.textContent = "No active session.";
           return;
         }
-        els.sessionSummary.textContent = "Active: " + state.session.customer.email + " • " + state.session.customer.id;
+        const developerLabel = state.session.customer.isDeveloper ? "developer" : "standard";
+        els.sessionSummary.textContent =
+          "Active: " + state.session.customer.email + " • " + state.session.customer.id + " • " + developerLabel;
       }
       function getSelectedTemplate() {
@@ -611,12 +620,12 @@ export function renderDevApp(input) {
       }
       function getTemplateDefaults(templateId, operation) {
-        if (templateId === "demo-template") {
+        if (templateId === "template_0000" || templateId === "4c7a7e1a-7f35-4f30-9f86-9c8a63c7f2db") {
           const config = {
             defaultProvider: "openai",
             textModel: "gpt-4.1-mini",
             imageModel: "gpt-image-1",
-            renderCompositionId: "demo-template"
+            renderCompositionId: "template-0000"
           };
           const payloads = {
             generate: {
@@ -710,17 +719,54 @@ export function renderDevApp(input) {
       }
       async function refreshProviderKeys() {
-        const data = await request("/me/provider-keys", { headers: headers() });
+        const data = await request("/user/me/provider-keys", { headers: headers() });
         els.providerKeysView.textContent = JSON.stringify(data.provider_keys, null, 2);
       }
       async function refreshJobs() {
-        const data = await request("/me/jobs", { headers: headers() });
+        const data = await request("/user/me/jobs", { headers: headers() });
         state.jobs = data.jobs || [];
         renderJobs();
       }
+      function clearJobPollTimer() {
+        if (state.jobPollTimer) {
+          clearTimeout(state.jobPollTimer);
+          state.jobPollTimer = null;
+        }
+      }
+      function getSelectedJobRecord() {
+        return state.jobs.find((job) => (job.id || job.job_id) === state.selectedJobId) || null;
+      }
+      function getJobPollIntervalMs() {
+        const selectedJob = getSelectedJobRecord();
+        const selectedTracer = selectedJob?.tracer;
+        if (!selectedTracer) {
+          return STANDARD_JOB_POLL_MS;
+        }
+        const activeTracerJobs = state.jobs.filter((job) => {
+          const status = job.status;
+          return job.tracer === selectedTracer && (status === "queued" || status === "running");
+        }).length;
+        return activeTracerJobs >= BATCH_JOB_THRESHOLD ? BATCH_JOB_POLL_MS : STANDARD_JOB_POLL_MS;
+      }
+      function scheduleJobPoll() {
+        clearJobPollTimer();
+        state.jobPollTimer = setTimeout(async () => {
+          try {
+            await refreshJobs();
+            await refreshJobDetail();
+          } catch (error) {
+            els.inspector.textContent = JSON.stringify({ error: error.message }, null, 2);
+          }
+        }, getJobPollIntervalMs());
+      }
       async function refreshJobDetail() {
+        clearJobPollTimer();
         if (!state.selectedJobId || !state.selectedTemplateId) {
           return;
         }
@@ -731,7 +777,7 @@ export function renderDevApp(input) {
         renderTimeline(logs.logs || []);
         els.jobSummary.textContent = "Job " + job.job_id + " is " + job.status + " with progress " + job.progress;
         if (job.status === "queued" || job.status === "running") {
-          setTimeout(refreshJobDetail, 1500);
+          scheduleJobPoll();
         }
       }
@@ -759,7 +805,7 @@ export function renderDevApp(input) {
       els.requestOtp.addEventListener("click", async () => {
         const email = els.email.value.trim();
         if (!email) return;
-        await request("/auth/request-otp", {
+        await request("/user/request-otp", {
           method: "POST",
           headers: { "content-type": "application/json" },
           body: JSON.stringify({ email })
@@ -767,7 +813,7 @@ export function renderDevApp(input) {
       });
       els.verifyOtp.addEventListener("click", async () => {
-        const data = await request("/auth/verify-otp", {
+        const data = await request("/user/verify-otp", {
           method: "POST",
           headers: { "content-type": "application/json" },
           body: JSON.stringify({
@@ -782,6 +828,7 @@ export function renderDevApp(input) {
       });
       els.clearSession.addEventListener("click", () => {
+        clearJobPollTimer();
         saveSession(null);
         els.providerKeysView.textContent = "[]";
         els.jobs.innerHTML = "";
@@ -789,7 +836,7 @@ export function renderDevApp(input) {
       });
       els.saveProviderKey.addEventListener("click", async () => {
-        await request("/me/provider-keys", {
+        await request("/user/me/provider-keys", {
           method: "POST",
           headers: headers(),
           body: JSON.stringify({

package/dist/src/homepage.js ADDED Viewed

@@ -0,0 +1,441 @@
+function escapeHtml(value) {
+    return value
+        .replace(/&/g, "&amp;")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;");
+}
+function escapeJsonForHtml(value) {
+    return JSON.stringify(value)
+        .replace(/</g, "\\u003c")
+        .replace(/>/g, "\\u003e")
+        .replace(/&/g, "\\u0026");
+}
+function formatApprovedAt(value) {
+    if (!value) {
+        return "No release timestamp";
+    }
+    const date = new Date(value);
+    if (Number.isNaN(date.getTime())) {
+        return value;
+    }
+    return new Intl.DateTimeFormat("en-US", {
+        dateStyle: "medium",
+        timeStyle: "short"
+    }).format(date);
+}
+function isVideoPreview(url) {
+    return Boolean(url && /\.(mp4|webm|ogg|mov)(\?|#|$)/i.test(url));
+}
+export function renderHomepage(input) {
+    const boot = escapeJsonForHtml({
+        skills: Object.fromEntries(input.templates.map((template) => [template.templateId, template.skillContent]))
+    });
+    const rows = input.templates.map((template) => {
+        const search = `${template.templateId} ${template.title} ${template.slugId}`.toLowerCase();
+        const media = template.previewUrl
+            ? isVideoPreview(template.previewUrl)
+                ? `<video class="preview" src="${escapeHtml(template.previewUrl)}" preload="none" muted playsinline controls></video>`
+                : `<img class="preview" src="${escapeHtml(template.previewUrl)}" alt="${escapeHtml(template.title)} preview" loading="lazy" decoding="async" />`
+            : `<div class="preview preview-empty">No preview</div>`;
+        return `
+      <li class="row" data-search="${escapeHtml(search)}">
+        <div class="media">${media}</div>
+        <div class="details">
+          <div class="meta-line">
+            <h2>${escapeHtml(template.title)}</h2>
+            <button class="copy-button" type="button" data-copy-text="${escapeHtml(template.skillContent)}" data-default-label="SKILL.md">SKILL.md</button>
+          </div>
+          <dl class="meta-grid">
+            <div>
+              <dt>template_id</dt>
+              <dd><button class="copy-inline" type="button" data-copy-text="${escapeHtml(template.templateId)}" data-default-label="${escapeHtml(template.templateId)}"><code>${escapeHtml(template.templateId)}</code></button></dd>
+            </div>
+            <div>
+              <dt>slug_id</dt>
+              <dd><button class="copy-inline" type="button" data-copy-text="${escapeHtml(template.slugId)}" data-default-label="${escapeHtml(template.slugId)}"><code>${escapeHtml(template.slugId)}</code></button></dd>
+            </div>
+            <div>
+              <dt>approved</dt>
+              <dd>${escapeHtml(formatApprovedAt(template.approvedAt))}</dd>
+            </div>
+          </dl>
+          <div class="viral-block">
+            <span class="eyebrow">Viral DNA</span>
+            <p>${escapeHtml(template.viralDna)}</p>
+          </div>
+        </div>
+      </li>
+    `;
+    }).join("");
+    const accountLink = input.account.isLoggedIn
+        ? `<a class="account-link" href="/settings">Settings</a>`
+        : `<a class="account-link" href="/login">Login</a>`;
+    return `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>Approved Templates</title>
+    <style>
+      :root {
+        --bg: #f4f1e8;
+        --panel: rgba(255, 252, 246, 0.88);
+        --line: rgba(37, 32, 27, 0.12);
+        --ink: #171311;
+        --muted: #64584d;
+        --accent: #9f3d24;
+        --accent-soft: rgba(159, 61, 36, 0.12);
+        --shadow: 0 24px 70px rgba(36, 24, 15, 0.09);
+      }
+      * {
+        box-sizing: border-box;
+      }
+      body {
+        margin: 0;
+        min-height: 100vh;
+        color: var(--ink);
+        font-family: Georgia, "Times New Roman", serif;
+        background:
+          radial-gradient(circle at top left, rgba(159, 61, 36, 0.14), transparent 24%),
+          linear-gradient(180deg, #f8f5ed 0%, #f1ebde 100%);
+      }
+      body::before {
+        content: "";
+        position: fixed;
+        inset: 0;
+        pointer-events: none;
+        background-image:
+          linear-gradient(rgba(23, 19, 17, 0.035) 1px, transparent 1px),
+          linear-gradient(90deg, rgba(23, 19, 17, 0.035) 1px, transparent 1px);
+        background-size: 28px 28px;
+        mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), transparent 85%);
+      }
+      main {
+        width: min(1180px, calc(100vw - 32px));
+        margin: 0 auto;
+        padding: 32px 0 48px;
+      }
+      .shell {
+        background: var(--panel);
+        border: 1px solid var(--line);
+        box-shadow: var(--shadow);
+        backdrop-filter: blur(18px);
+      }
+      .topbar {
+        padding: 24px;
+        border-bottom: 1px solid var(--line);
+        display: grid;
+        gap: 16px;
+      }
+      .topline {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 16px;
+      }
+      .eyebrow {
+        display: inline-block;
+        letter-spacing: 0.18em;
+        text-transform: uppercase;
+        font-size: 11px;
+        color: var(--muted);
+      }
+      .account-link {
+        border: 1px solid var(--ink);
+        background: rgba(255, 255, 255, 0.64);
+        color: var(--ink);
+        text-decoration: none;
+        padding: 10px 14px;
+        font-size: 13px;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+      h1 {
+        margin: 0;
+        font-weight: 400;
+        font-size: clamp(2rem, 5vw, 4rem);
+        line-height: 0.95;
+      }
+      .subcopy {
+        margin: 0;
+        max-width: 58ch;
+        color: var(--muted);
+        font-size: 17px;
+        line-height: 1.6;
+      }
+      .search-row {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) auto;
+        gap: 12px;
+        align-items: center;
+      }
+      input {
+        width: 100%;
+        border: 1px solid var(--line);
+        background: rgba(255, 255, 255, 0.72);
+        color: var(--ink);
+        padding: 14px 16px;
+        font: inherit;
+        outline: none;
+      }
+      input:focus {
+        border-color: var(--accent);
+        box-shadow: 0 0 0 4px var(--accent-soft);
+      }
+      .count {
+        color: var(--muted);
+        font-size: 13px;
+        letter-spacing: 0.08em;
+        text-transform: uppercase;
+      }
+      .list {
+        list-style: none;
+        margin: 0;
+        padding: 0;
+      }
+      .row {
+        display: grid;
+        grid-template-columns: 240px minmax(0, 1fr);
+        gap: 20px;
+        padding: 24px;
+        border-bottom: 1px solid var(--line);
+      }
+      .row[hidden] {
+        display: none;
+      }
+      .media {
+        width: 100%;
+      }
+      .preview {
+        display: block;
+        width: 100%;
+        aspect-ratio: 9 / 16;
+        object-fit: cover;
+        border: 1px solid var(--line);
+        background: rgba(23, 19, 17, 0.06);
+      }
+      .preview-empty {
+        display: grid;
+        place-items: center;
+        color: var(--muted);
+      }
+      .details {
+        min-width: 0;
+        display: grid;
+        gap: 16px;
+      }
+      .meta-line {
+        display: flex;
+        align-items: start;
+        justify-content: space-between;
+        gap: 16px;
+      }
+      h2 {
+        margin: 0;
+        font-weight: 400;
+        font-size: clamp(1.35rem, 2vw, 2rem);
+      }
+      .copy-button {
+        border: 1px solid var(--ink);
+        background: var(--ink);
+        color: #f8f5ed;
+        padding: 10px 14px;
+        font: inherit;
+        cursor: pointer;
+        white-space: nowrap;
+      }
+      .copy-button:hover {
+        background: var(--accent);
+        border-color: var(--accent);
+      }
+      .copy-button[data-state="done"] {
+        background: transparent;
+        color: var(--ink);
+      }
+      .copy-inline {
+        border: 0;
+        background: transparent;
+        color: inherit;
+        padding: 0;
+        font: inherit;
+        text-align: left;
+        cursor: pointer;
+      }
+      .copy-inline:hover code,
+      .copy-inline:focus-visible code {
+        text-decoration: underline;
+        text-underline-offset: 0.14em;
+      }
+      .meta-grid {
+        display: grid;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 14px;
+        margin: 0;
+      }
+      .meta-grid div {
+        padding-top: 12px;
+        border-top: 1px solid var(--line);
+      }
+      dt {
+        margin-bottom: 8px;
+        color: var(--muted);
+        font-size: 11px;
+        letter-spacing: 0.18em;
+        text-transform: uppercase;
+      }
+      dd {
+        margin: 0;
+        line-height: 1.5;
+        overflow-wrap: anywhere;
+      }
+      code {
+        font-family: "SFMono-Regular", Menlo, Consolas, monospace;
+        font-size: 0.92em;
+      }
+      .viral-block p {
+        margin: 8px 0 0;
+        color: var(--ink);
+        line-height: 1.6;
+      }
+      .empty {
+        display: none;
+        padding: 28px 24px;
+        color: var(--muted);
+      }
+      .empty[data-visible="true"] {
+        display: block;
+      }
+      @media (max-width: 860px) {
+        main {
+          width: min(100vw - 20px, 1180px);
+          padding-top: 20px;
+        }
+        .search-row,
+        .row,
+        .meta-grid {
+          grid-template-columns: 1fr;
+        }
+        .row {
+          gap: 18px;
+          padding: 18px;
+        }
+        .meta-line {
+          flex-direction: column;
+        }
+      }
+    </style>
+  </head>
+  <body>
+    <main>
+      <section class="shell">
+        <header class="topbar">
+          <div class="topline">
+            <span class="eyebrow">Vidfarm</span>
+            ${accountLink}
+          </div>
+          <h1>Approved templates</h1>
+          <p class="subcopy">Simple index of approved templates with preview media, viral DNA, exact template IDs, and one-click SKILL copy.</p>
+          <div class="search-row">
+            <input id="search" type="search" placeholder="Quicksearch: template_id, title, slug_id" autocomplete="off" />
+            <div class="count" id="count">${input.templates.length} visible</div>
+          </div>
+        </header>
+        <ul class="list" id="template-list">${rows}</ul>
+        <div class="empty" id="empty-state">No approved templates match that search.</div>
+      </section>
+    </main>
+    <script type="application/json" id="homepage-boot">${boot}</script>
+    <script>
+      const boot = JSON.parse(document.getElementById("homepage-boot").textContent || "{}");
+      const searchInput = document.getElementById("search");
+      const rows = Array.from(document.querySelectorAll(".row"));
+      const count = document.getElementById("count");
+      const emptyState = document.getElementById("empty-state");
+      const updateFilter = () => {
+        const query = (searchInput.value || "").trim().toLowerCase();
+        let visibleCount = 0;
+        for (const row of rows) {
+          const searchText = row.getAttribute("data-search") || "";
+          const visible = !query || searchText.includes(query);
+          row.hidden = !visible;
+          if (visible) {
+            visibleCount += 1;
+          }
+        }
+        count.textContent = visibleCount + " visible";
+        emptyState.dataset.visible = visibleCount === 0 ? "true" : "false";
+      };
+      searchInput.addEventListener("input", updateFilter);
+      for (const button of document.querySelectorAll("[data-copy-text]")) {
+        button.addEventListener("click", async () => {
+          const text = button.getAttribute("data-copy-text") || "";
+          const defaultLabel = button.getAttribute("data-default-label") || "";
+          if (!text) {
+            button.textContent = "Missing";
+            button.dataset.state = "done";
+            return;
+          }
+          try {
+            await navigator.clipboard.writeText(text);
+            button.textContent = "Copied";
+          } catch {
+            button.textContent = "Clipboard blocked";
+          }
+          button.dataset.state = "done";
+          window.setTimeout(() => {
+            button.textContent = defaultLabel;
+            button.dataset.state = "";
+          }, 1600);
+        });
+      }
+    </script>
+  </body>
+</html>`;
+}

package/dist/src/index.js CHANGED Viewed

@@ -1,8 +1,13 @@
 import { startRuntime } from "./runtime.js";
-const runtime = startRuntime();
-for (const signal of ["SIGINT", "SIGTERM"]) {
-    process.on(signal, () => {
-        runtime.shutdown();
-        process.exit(0);
-    });
-}
+void (async () => {
+    const runtime = await startRuntime();
+    for (const signal of ["SIGINT", "SIGTERM"]) {
+        process.on(signal, () => {
+            runtime.shutdown();
+            process.exit(0);
+        });
+    }
+})().catch((error) => {
+    console.error(error instanceof Error ? error.stack ?? error.message : String(error));
+    process.exit(1);
+});

package/dist/src/lib/crypto.js CHANGED Viewed

@@ -28,3 +28,17 @@ export function decryptString(value, secret) {
     decipher.setAuthTag(tag);
     return Buffer.concat([decipher.update(encrypted), decipher.final()]).toString("utf8");
 }
+export function hashPassword(password) {
+    const salt = randomBytes(16).toString("hex");
+    const digest = scryptSync(password, salt, 32).toString("hex");
+    return `${salt}:${digest}`;
+}
+export function verifyPassword(password, storedHash) {
+    const [salt, digest] = storedHash.split(":");
+    if (!salt || !digest) {
+        return false;
+    }
+    const left = Buffer.from(scryptSync(password, salt, 32).toString("hex"), "hex");
+    const right = Buffer.from(digest, "hex");
+    return left.length === right.length && timingSafeEqual(left, right);
+}