@effectnode/media 0.5.0 → 0.7.0

package/dist/backend/movie-backend/render-media.js

@@ -25,11 +25,9 @@ const PYTHON_DIR = join(APP_DATA_DIR, "python-src");
 const TEMP_DIR = join(APP_DATA_DIR, "temp");
 const PROJECTS_FILE = join(JSON_DIR, "projects.json");
 const CHARACTERS_FILE = join(JSON_DIR, "characters.json");
-const MLXGEN_MODEL = "AbstractFramework/qwen-image-edit-2511-8bit";
 const Z_IMAGE_MODEL = "AbstractFramework/z-image-turbo-8bit";
 const FLUX_KLEIN_MODEL = "AbstractFramework/flux.2-klein-4b-8bit";
-const MLX_VLM_MODEL = "mlx-community/gemma-4-e2b-it-4bit";
-const H3_MODEL = "appautomaton/minimax-h3-base-8bit-mlx";
+const MLX_VLM_MODEL = "mlx-community/gemma-4-e4b-it-8bit";
 const VIDEO_STAGE_FLAGS = {
     distilled: "--distilled",
     "one-stage": "--one-stage",
@@ -330,7 +328,7 @@ function huggingfaceCacheDir() {
     return join(homedir(), ".cache", "huggingface", "hub");
 }
 /** True when the given MLX-Gen model has already been downloaded to the HF cache. */
-function isModelDownloaded(model = MLXGEN_MODEL) {
+function isModelDownloaded(model) {
     const modelDirName = `models--${model.replace("/", "--")}`;
     const snapshotsDir = join(huggingfaceCacheDir(), modelDirName, "snapshots");
     if (!existsSync(snapshotsDir))
@@ -616,7 +614,7 @@ export async function generateSceneImage(projectId, scene, onLog) {
     const fluxArgs = [mlxgen, "generate", "--model", FLUX_KLEIN_MODEL];
     for (const p of refImages)
         fluxArgs.push("--image", p);
-    fluxArgs.push("--prompt", String(scene?.imagePrompt || ""), "--output", sceneImagePath, "--mlx-cache-limit-gb", "20", "--steps", "5", "--seed", "42", "--width", "448", "--height", "796");
+    fluxArgs.push("--prompt", String(scene?.imagePrompt || ""), "--output", sceneImagePath, "--mlx-cache-limit-gb", "20", "--steps", "5", "--seed", "42", "--width", "1024", "--height", "1024");
     const result = await runCommand(fluxArgs, { onLog });
     if (!result.success || !existsSync(sceneImagePath)) {
         return { error: result.output || `Failed to generate scene image ${s}` };
@@ -2141,7 +2139,6 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
     app.get("/api/mlxgen/status", (_req, res) => {
         res.json({
             installed: isMlxgenInstalled(),
-            modelDownloaded: isModelDownloaded(),
             zModelDownloaded: isModelDownloaded(Z_IMAGE_MODEL),
             fluxModelDownloaded: isModelDownloaded(FLUX_KLEIN_MODEL),
         });
@@ -2190,8 +2187,8 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.end();
         }
     });
-    // ========== MLX-Gen: Download Model ==========
-    app.post("/api/mlxgen/download-model", async (_req, res) => {
+    // ========== MLX-Gen: Download Z-Image Model ==========
+    app.post("/api/mlxgen/download-z-model", async (_req, res) => {
         res.writeHead(200, {
             "Content-Type": "text/event-stream",
             "Cache-Control": "no-cache",
@@ -2201,13 +2198,14 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
         const send = (event, data) => {
             res.write(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`);
         };
+        const model = Z_IMAGE_MODEL;
         try {
             const mlxgen = await getMlxgenBin();
             send("progress", {
                 status: "starting",
-                label: `Downloading model ${MLXGEN_MODEL}...`,
+                label: `Downloading model ${model}...`,
             });
-            const proc = spawn([mlxgen, "download", "--model", MLXGEN_MODEL], {
+            const proc = spawn([mlxgen, "download", "--model", model], {
                 stdout: "pipe",
                 stderr: "pipe",
             });
@@ -2234,8 +2232,8 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.end();
         }
     });
-    // ========== MLX-Gen: Download Z-Image Model ==========
-    app.post("/api/mlxgen/download-z-model", async (_req, res) => {
+    // ========== MLX-Gen: Download FLUX.2 Klein Model ==========
+    app.post("/api/mlxgen/download-flux-model", async (_req, res) => {
         res.writeHead(200, {
             "Content-Type": "text/event-stream",
             "Cache-Control": "no-cache",
@@ -2245,14 +2243,13 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
         const send = (event, data) => {
             res.write(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`);
         };
-        const model = Z_IMAGE_MODEL;
         try {
             const mlxgen = await getMlxgenBin();
             send("progress", {
                 status: "starting",
-                label: `Downloading model ${model}...`,
+                label: `Downloading model ${FLUX_KLEIN_MODEL}...`,
             });
-            const proc = spawn([mlxgen, "download", "--model", model], {
+            const proc = spawn([mlxgen, "download", "--model", FLUX_KLEIN_MODEL], {
                 stdout: "pipe",
                 stderr: "pipe",
             });
@@ -2279,8 +2276,20 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.end();
         }
     });
-    // ========== MLX-Gen: Download FLUX.2 Klein Model ==========
-    app.post("/api/mlxgen/download-flux-model", async (_req, res) => {
+    // ========== H3: Download Model ==========
+    app.get("/api/h3/status", (_req, res) => {
+        res.json({ downloaded: isH3ModelDownloaded() });
+    });
+    // ========== Hugging Face CLI + LTX Video Model ==========
+    app.get("/api/hf/status", (_req, res) => {
+        res.json({
+            installed: whichSync("hf") !== null,
+            ltxDownloaded: isModelDownloaded("dgrauet/ltx-2.3-mlx-q8"),
+            ttsDownloaded: isModelDownloaded("Qwen/Qwen3-TTS-12Hz-1.7B-Base"),
+            mlxVlmDownloaded: isModelDownloaded(MLX_VLM_MODEL),
+        });
+    });
+    app.post("/api/hf/install", async (_req, res) => {
         res.writeHead(200, {
             "Content-Type": "text/event-stream",
             "Cache-Control": "no-cache",
@@ -2291,18 +2300,14 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.write(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`);
         };
         try {
-            const mlxgen = await getMlxgenBin();
             send("progress", {
                 status: "starting",
-                label: `Downloading model ${FLUX_KLEIN_MODEL}...`,
-            });
-            const proc = spawn([mlxgen, "download", "--model", FLUX_KLEIN_MODEL], {
-                stdout: "pipe",
-                stderr: "pipe",
+                label: "Installing huggingface-cli...",
             });
+            const proc = spawn(["bash", "-c", "curl -LsSf https://hf.co/cli/install.sh | bash"], { stdout: "pipe", stderr: "pipe" });
             activeProc = proc;
-            const stdoutPromise = streamToSSE(proc.stdout, "Download", send);
-            const stderrText = await streamToSSE(proc.stderr, "Download", send);
+            const stdoutPromise = streamToSSE(proc.stdout, "HF Install", send);
+            const stderrText = await streamToSSE(proc.stderr, "HF Install", send);
             await stdoutPromise;
             const exitCode = await proc.exited;
             if (exitCode === 0) {
@@ -2323,11 +2328,7 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.end();
         }
     });
-    // ========== H3: Download Model ==========
-    app.get("/api/h3/status", (_req, res) => {
-        res.json({ downloaded: isH3ModelDownloaded() });
-    });
-    app.post("/api/h3/download-model", async (_req, res) => {
+    app.post("/api/hf/download-ltx", async (_req, res) => {
         res.writeHead(200, {
             "Content-Type": "text/event-stream",
             "Cache-Control": "no-cache",
@@ -2337,25 +2338,18 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
         const send = (event, data) => {
             res.write(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`);
         };
-        // The `hf download` command must run from inside the mlx-h3 checkout so
-        // its weights land in <mlx-h3>/weights.
-        const featureFolder = join(PYTHON_DIR, "mlx-h3");
-        if (!existsSync(featureFolder)) {
-            mkdirSync(featureFolder, { recursive: true });
-        }
         try {
             send("progress", {
                 status: "starting",
-                label: `Downloading model ${H3_MODEL}...`,
+                label: "Downloading dgrauet/ltx-2.3-mlx-q8...",
             });
-            const proc = spawn(["hf", "download", H3_MODEL, "--local-dir", "weights"], {
-                cwd: featureFolder,
+            const proc = spawn(["hf", "download", "dgrauet/ltx-2.3-mlx-q8"], {
                 stdout: "pipe",
                 stderr: "pipe",
             });
             activeProc = proc;
-            const stdoutPromise = streamToSSE(proc.stdout, "H3 Download", send);
-            const stderrText = await streamToSSE(proc.stderr, "H3 Download", send);
+            const stdoutPromise = streamToSSE(proc.stdout, "HF Download", send);
+            const stderrText = await streamToSSE(proc.stderr, "HF Download", send);
             await stdoutPromise;
             const exitCode = await proc.exited;
             if (exitCode === 0) {
@@ -2376,42 +2370,7 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.end();
         }
     });
-    // ========== H3: Generate (References-to-Video) ==========
-    app.post("/api/h3/generate", async (req, res) => {
-        const { prompt, refs, projectId, steps = 20, width = 640, height = 448, frames = 121, seed = 42, } = req.body || {};
-        if (!prompt || typeof prompt !== "string" || !prompt.trim()) {
-            res.status(400).json({ error: "Prompt is required" });
-            return;
-        }
-        if (!projectId || !isValidProjectId(String(projectId))) {
-            res.status(400).json({ error: "Invalid project ID" });
-            return;
-        }
-        // Resolve ordered reference media (images, videos, and audio) to safe paths.
-        const mediaRefs = Array.isArray(refs)
-            ? refs.filter((r) => !!r &&
-                (r.kind === "image" || r.kind === "video" || r.kind === "audio") &&
-                typeof r.filename === "string" &&
-                !!r.filename.trim())
-            : [];
-        if (mediaRefs.length === 0) {
-            res.status(400).json({
-                error: "At least one reference image, video, or audio is required. Upload or select one first.",
-            });
-            return;
-        }
-        const resolvedRefs = [];
-        for (const ref of mediaRefs) {
-            const resolved = resolveSafePath(ref.filename.trim(), String(projectId));
-            if (!resolved) {
-                res.status(400).json({
-                    error: `Reference ${ref.kind} not found in this project: ${ref.filename}`,
-                });
-                return;
-            }
-            resolvedRefs.push({ kind: ref.kind, path: resolved });
-        }
-        // SSE headers
+    app.post("/api/hf/download-mlx-vlm", async (_req, res) => {
         res.writeHead(200, {
             "Content-Type": "text/event-stream",
             "Cache-Control": "no-cache",
@@ -2422,66 +2381,21 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.write(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`);
         };
         try {
-            const featureFolder = join(PYTHON_DIR, "mlx-h3");
-            if (!existsSync(featureFolder)) {
-                send("error", { error: "mlx-h3 not found. Run setup first." });
-                res.end();
-                return;
-            }
-            const uvPath = await getUvPath();
-            const projectOutputDir = resolveOutputDir(null, String(projectId));
-            if (!projectOutputDir) {
-                send("error", { error: "Invalid output directory." });
-                res.end();
-                return;
-            }
-            const outputFile = `references-${Date.now()}.mp4`;
-            const outputPath = join(projectOutputDir, outputFile);
-            const stepCount = Number(steps) || 20;
-            const videoWidth = Number(width) || 640;
-            const videoHeight = Number(height) || 448;
-            const frameCount = Number(frames) || 121;
-            const seedValue = Number(seed) || 42;
             send("progress", {
                 status: "starting",
-                label: "Generating references-to-video...",
-                outputFile,
-                settings: {
-                    steps: stepCount,
-                    width: videoWidth,
-                    height: videoHeight,
-                    frames: frameCount,
-                    seed: seedValue,
-                },
+                label: `Downloading ${MLX_VLM_MODEL}...`,
             });
-            const args = [uvPath, "run", "mlx-h3"];
-            for (const ref of resolvedRefs) {
-                const flag = ref.kind === "image"
-                    ? "--ref-image"
-                    : ref.kind === "video"
-                        ? "--ref-video"
-                        : "--ref-audio";
-                args.push(flag, ref.path);
-            }
-            args.push("--steps", String(stepCount), "--width", String(videoWidth), "--height", String(videoHeight), "--frames", String(frameCount), "--seed", String(seedValue), "--output", outputPath, prompt);
-            const proc = spawn(args, {
-                env: process.env,
-                cwd: featureFolder,
+            const proc = spawn(["hf", "download", MLX_VLM_MODEL], {
                 stdout: "pipe",
                 stderr: "pipe",
             });
             activeProc = proc;
-            const stdoutPromise = streamToSSE(proc.stdout, "H3 Generate", send);
-            const stderrText = await streamToSSE(proc.stderr, "H3 Generate", send);
+            const stdoutPromise = streamToSSE(proc.stdout, "HF Download", send);
+            const stderrText = await streamToSSE(proc.stderr, "HF Download", send);
             await stdoutPromise;
             const exitCode = await proc.exited;
-            const success = exitCode === 0 && existsSync(outputPath);
-            if (success) {
-                send("complete", {
-                    success: true,
-                    path: outputPath,
-                    filename: outputFile,
-                });
+            if (exitCode === 0) {
+                send("complete", { success: true });
             }
             else {
                 send("error", {
@@ -2498,48 +2412,7 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.end();
         }
     });
-    // ========== MLX-Gen: Generate (Image Edit) ==========
-    app.post("/api/mlxgen/generate", async (req, res) => {
-        const { prompt, imagePath, image, projectId, width, height } = req.body || {};
-        if (!prompt) {
-            res.status(400).json({ error: "Prompt is required" });
-            return;
-        }
-        if (!projectId) {
-            res.status(400).json({ error: "Project ID is required" });
-            return;
-        }
-        // Project IDs are generated by makeId() (alphanumeric + hyphen). Reject
-        // anything else (including `.`, `..`, and path separators) so a malicious
-        // projectId cannot escape OUTPUT_DIR/TEMP_DIR via `../`.
-        if (!/^[a-zA-Z0-9_-]{1,64}$/.test(String(projectId))) {
-            res.status(400).json({ error: "Invalid project ID" });
-            return;
-        }
-        // Resolve the character image. Prefer a client-side preprocessed PNG
-        // (base64), which is written to the temp workspace; otherwise fall back to
-        // a bare filename previously uploaded to this project.
-        let resolvedImage = null;
-        let tempImagePath = null;
-        if (image) {
-            // Decode base64 (strip data URL prefix if present)
-            const base64 = String(image).replace(/^data:image\/\w+;base64,/, "");
-            const buffer = Buffer.from(base64, "base64");
-            const tempDir = join(TEMP_DIR, String(projectId));
-            ensureDir(tempDir);
-            tempImagePath = join(tempDir, `temp-${Date.now()}.png`);
-            writeFileSync(tempImagePath, buffer);
-            resolvedImage = tempImagePath;
-        }
-        else if (imagePath) {
-            resolvedImage = resolveSafePath(imagePath, projectId);
-        }
-        if (!resolvedImage) {
-            res.status(400).json({
-                error: "Image is required. Provide a preprocessed image or a filename previously uploaded to this project.",
-            });
-            return;
-        }
+    app.post("/api/hf/download-tts", async (_req, res) => {
         res.writeHead(200, {
             "Content-Type": "text/event-stream",
             "Cache-Control": "no-cache",
@@ -2550,55 +2423,21 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
             res.write(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`);
         };
         try {
-            const mlxgen = await getMlxgenBin();
-            const projectOutputDir = join(OUTPUT_DIR, projectId);
-            ensureDir(projectOutputDir);
-            const outputFile = `mlxgen-${Date.now()}.png`;
-            const outputPath = join(projectOutputDir, outputFile);
             send("progress", {
                 status: "starting",
-                label: "Generating image...",
-                outputFile,
+                label: "Downloading Qwen/Qwen3-TTS-12Hz-1.7B-Base...",
             });
-            const args = [
-                mlxgen,
-                "generate",
-                "--model",
-                MLXGEN_MODEL,
-                "--image",
-                resolvedImage,
-                "--prompt",
-                prompt,
-                "--output",
-                outputPath,
-                "--steps",
-                String(40),
-            ];
-            // Optional output size (kept in the same aspect ratio by the client).
-            const outWidth = Number(width);
-            const outHeight = Number(height);
-            if (Number.isInteger(outWidth) &&
-                outWidth > 0 &&
-                Number.isInteger(outHeight) &&
-                outHeight > 0) {
-                args.push("--width", String(outWidth), "--height", String(outHeight));
-            }
-            const proc = spawn(args, {
+            const proc = spawn(["hf", "download", "Qwen/Qwen3-TTS-12Hz-1.7B-Base"], {
                 stdout: "pipe",
                 stderr: "pipe",
             });
             activeProc = proc;
-            const stdoutPromise = streamToSSE(proc.stdout, "MLXGen", send);
-            const stderrText = await streamToSSE(proc.stderr, "MLXGen", send);
+            const stdoutPromise = streamToSSE(proc.stdout, "HF Download", send);
+            const stderrText = await streamToSSE(proc.stderr, "HF Download", send);
             await stdoutPromise;
             const exitCode = await proc.exited;
-            const success = exitCode === 0 && existsSync(outputPath);
-            if (success) {
-                send("complete", {
-                    success: true,
-                    path: outputPath,
-                    filename: outputFile,
-                });
+            if (exitCode === 0) {
+                send("complete", { success: true });
             }
             else {
                 send("error", {
@@ -2612,22 +2451,6 @@ export async function renderMediaRoutes({ app, getUvPath, }) {
         }
         finally {
             activeProc = null;
-            // Clean up the temporary workspace image now that generation is done.
-            if (tempImagePath) {
-                try {
-                    unlinkSync(tempImagePath);
-                }
-                catch {
-                    // already removed
-                }
-                try {
-                    // Remove the temp dir only when it is empty (no recursive delete).
-                    rmSync(join(TEMP_DIR, String(projectId)), { force: true });
-                }
-                catch {
-                    // ignore cleanup failures
-                }
-            }
             res.end();
         }
     });

package/frontend/index.html

@@ -7,11 +7,9 @@
   <meta name="theme-color" content="#eaf8f6" />
   <link rel="preconnect" href="https://fonts.googleapis.com" />
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-  <link
-    href="https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300..700;1,300..600&display=swap"
-    rel="stylesheet"
-  />
-  <title>Lambobo Studio</title>
+  <link href="https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300..700;1,300..600&display=swap"
+    rel="stylesheet" />
+  <title>EffectNode Media</title>
 </head>
 
 <body>

package/frontend/src/movie-app/SetupPage.tsx

@@ -232,7 +232,7 @@ function SetupPage({ port = 8765 }) {
         {/* Hero */}
         <header>
           <p className="text-[11px] font-semibold uppercase tracking-[0.24em] text-tiffany-600">
-            Lambobo Studio
+            EffectNode Media
           </p>
           <h1 className="mt-3 font-display text-4xl font-light leading-[1.06] text-ink-900">
             Setting up{" "}