npm - mulmocast - Versions diffs - 2.1.25 → 2.1.27 - Mend

mulmocast 2.1.25 → 2.1.27

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 (12) hide show

package/README.md +63 -3
package/assets/html/chart.html +20 -8
package/lib/cli/bin.js +0 -0
package/lib/cli/commands/tool/complete/builder.d.ts +2 -0
package/lib/cli/commands/tool/complete/builder.js +7 -1
package/lib/cli/commands/tool/complete/handler.d.ts +1 -0
package/lib/cli/commands/tool/complete/handler.js +11 -5
package/lib/mcp/server.js +0 -0
package/lib/tools/complete_script.d.ts +35 -4
package/lib/tools/complete_script.js +86 -15
package/lib/utils/markdown.js +106 -28
package/package.json +1 -1

package/README.md CHANGED Viewed

@@ -285,9 +285,38 @@ mulmo tool scripting -i
 ```
 Note:
 - When -i is specified, --input-file value will be ignored
 - When --input-file is specified, -u value will be ignored
+### Complete MulmoScript from minimal beats
+You can create a minimal JSON with just beats and complete it with `mulmo tool complete`:
+```json
+{
+  "beats": [
+    { "text": "Hello, welcome to MulmoCast!" },
+    { "text": "This is a simple example." }
+  ]
+}
+```
+Save this as `my_beats.json`, then complete it with a style:
+```bash
+# Complete with built-in style
+mulmo tool complete my_beats.json -s ani
+# Complete with custom style file
+mulmo tool complete my_beats.json -s ./my_style.json
+# Output to specific file
+mulmo tool complete my_beats.json -s ani -o my_script.json
+```
+This generates a complete MulmoScript with all required fields (canvasSize, speechParams, imageParams, etc.) from the style.
 ## Generate content from MulmoScript
@@ -536,9 +565,10 @@ mulmo tool <command>
 Generate Mulmo script and other tools
 Commands:
-  mulmo tool scripting  Generate mulmocast script
-  mulmo tool prompt     Dump prompt from template
-  mulmo tool schema     Dump mulmocast schema
+  mulmo tool scripting       Generate mulmocast script
+  mulmo tool complete <file> Complete partial MulmoScript with defaults
+  mulmo tool prompt          Dump prompt from template
+  mulmo tool schema          Dump mulmocast schema
 Options:
       --version  Show version number                                   [boolean]
@@ -626,6 +656,36 @@ Options:
   -h, --help     Show help                                             [boolean]
 ```
+```
+mulmo tool complete <file>
+Complete partial MulmoScript with schema defaults and optional style/template
+Positionals:
+  file  Input beats file path (JSON)                             [string] [required]
+Options:
+      --version   Show version number                                    [boolean]
+  -v, --verbose   verbose log                [boolean] [required] [default: false]
+  -h, --help      Show help                                              [boolean]
+  -o, --output    Output file path (default: <file>_completed.json)       [string]
+  -t, --template  Template name to apply                                  [string]
+  -s, --style     Style name or file path (.json)                         [string]
+Examples:
+  # Complete minimal script with schema defaults
+  mulmo tool complete input.json
+  # Apply built-in style
+  mulmo tool complete input.json -s ani
+  # Apply custom style file
+  mulmo tool complete input.json -s ./my_style.json
+  # Apply template
+  mulmo tool complete input.json -t children_book
+```
 ## Contributing

package/assets/html/chart.html CHANGED Viewed

@@ -17,21 +17,33 @@
 <body>
     <h1>${title}</h1>
     <div class="chart-container">
-        <canvas id="myChart"></canvas>
+        <canvas id="myChart" data-chart-ready="false"></canvas>
     </div>
     <!-- Plain JavaScript instead of TypeScript -->
     <script>
-        // Wait for DOM to be fully loaded
-        document.addEventListener('DOMContentLoaded', function() {
-            // Get the canvas element
+        // Wait for DOM and Chart.js to be ready, then render.
+        function initChart() {
+            if (!window.Chart) return false;
             const ctx = document.getElementById('myChart');
-            // Create the data object (no TypeScript interfaces)
+            if (!ctx) return false;
             const chartData = ${chart_data};
-            // Initialize the chart
             new Chart(ctx, chartData);
+            requestAnimationFrame(() => {
+                requestAnimationFrame(() => {
+                    ctx.dataset.chartReady = "true";
+                });
+            });
+            return true;
+        }
+        function waitForChart() {
+            if (initChart()) return;
+            setTimeout(waitForChart, 50);
+        }
+        document.addEventListener('DOMContentLoaded', function() {
+            waitForChart();
         });
     </script>
 </body>

package/lib/cli/bin.js CHANGED Viewed

File without changes

package/lib/cli/commands/tool/complete/builder.d.ts CHANGED Viewed

@@ -3,6 +3,8 @@ export declare const builder: (yargs: Argv) => Argv<{
     o: string | undefined;
 } & {
     t: string | undefined;
+} & {
+    s: string | undefined;
 } & {
     file: string;
 }>;

package/lib/cli/commands/tool/complete/builder.js CHANGED Viewed

@@ -10,10 +10,16 @@ export const builder = (yargs) => {
     })
         .option("t", {
         alias: "template",
-        description: "Template/style name to apply",
+        description: "Template name to apply",
         demandOption: false,
         choices: availableTemplateNames,
         type: "string",
+    })
+        .option("s", {
+        alias: "style",
+        description: "Style name or file path (.json)",
+        demandOption: false,
+        type: "string",
     })
         .positional("file", {
         description: "Input beats file path (JSON)",

package/lib/cli/commands/tool/complete/handler.d.ts CHANGED Viewed

@@ -2,6 +2,7 @@ type CompleteHandlerArgs = {
     file: string;
     o?: string;
     t?: string;
+    s?: string;
     v?: boolean;
 };
 export declare const handler: (argv: CompleteHandlerArgs) => Promise<void>;

package/lib/cli/commands/tool/complete/handler.js CHANGED Viewed

@@ -1,9 +1,9 @@
 import { readFileSync, writeFileSync } from "fs";
 import path from "path";
 import { GraphAILogger } from "graphai";
-import { completeScript, templateExists } from "../../../../tools/complete_script.js";
+import { completeScript, templateExists, styleExists } from "../../../../tools/complete_script.js";
 export const handler = async (argv) => {
-    const { file, o: outputPath, t: templateName, v: verbose } = argv;
+    const { file, o: outputPath, t: templateName, s: styleName, v: verbose } = argv;
     if (!file) {
         GraphAILogger.error("Error: Input file is required");
         process.exit(1);
@@ -23,7 +23,10 @@ export const handler = async (argv) => {
     if (templateName && !templateExists(templateName)) {
         GraphAILogger.warn(`Warning: Template '${templateName}' not found`);
     }
-    const result = completeScript(inputData, templateName);
+    if (styleName && !styleExists(styleName)) {
+        GraphAILogger.warn(`Warning: Style '${styleName}' not found`);
+    }
+    const result = completeScript(inputData, { templateName, styleName });
     if (!result.success) {
         GraphAILogger.error("Validation errors:");
         result.error.issues.forEach((issue) => {
@@ -31,8 +34,11 @@ export const handler = async (argv) => {
         });
         process.exit(1);
     }
-    if (verbose && templateName) {
-        GraphAILogger.info(`Applied template: ${templateName}`);
+    if (verbose) {
+        if (styleName)
+            GraphAILogger.info(`Applied style: ${styleName}`);
+        if (templateName)
+            GraphAILogger.info(`Applied template: ${templateName}`);
     }
     const outputFilePath = outputPath ? path.resolve(outputPath) : inputPath.replace(/\.json$/, "_completed.json");
     writeFileSync(outputFilePath, JSON.stringify(result.data, null, 2));

package/lib/mcp/server.js CHANGED Viewed

File without changes

package/lib/tools/complete_script.d.ts CHANGED Viewed

@@ -6,16 +6,47 @@ type PartialMulmoScript = Record<string, unknown>;
  */
 export declare const addMulmocastVersion: (data: PartialMulmoScript) => PartialMulmoScript;
 /**
- * Merge input data with template (input takes precedence)
+ * Merge base with override (override takes precedence)
  */
-export declare const mergeWithTemplate: (data: PartialMulmoScript, template: MulmoScript) => PartialMulmoScript;
+export declare const mergeScripts: (base: PartialMulmoScript, override: PartialMulmoScript) => PartialMulmoScript;
+/**
+ * Get style by name or file path
+ */
+export declare const getStyle: (style: string) => PartialMulmoScript | undefined;
 export type CompleteScriptResult = ZodSafeParseResult<MulmoScript>;
+type CompleteScriptOptions = {
+    templateName?: string;
+    styleName?: string;
+};
 /**
- * Complete a partial MulmoScript with schema defaults and optional template
+ * Complete a partial MulmoScript with schema defaults, optional style or template
+ *
+ * @param data - Partial MulmoScript to complete (highest precedence)
+ * @param options - Optional template or style to use as base
+ * @param options.templateName - Template name (e.g., "children_book"). Mutually exclusive with styleName.
+ * @param options.styleName - Style name or file path. Mutually exclusive with templateName.
+ * @returns Zod safe parse result with completed MulmoScript or validation errors
+ * @throws Error if both templateName and styleName are specified
+ *
+ * @example
+ * // With template
+ * completeScript(data, { templateName: "children_book" })
+ *
+ * @example
+ * // With style
+ * completeScript(data, { styleName: "ghibli_comic" })
+ *
+ * @example
+ * // With style from file
+ * completeScript(data, { styleName: "./my-style.json" })
  */
-export declare const completeScript: (data: PartialMulmoScript, templateName?: string) => CompleteScriptResult;
+export declare const completeScript: (data: PartialMulmoScript, options?: CompleteScriptOptions) => CompleteScriptResult;
 /**
  * Check if template exists
  */
 export declare const templateExists: (templateName: string) => boolean;
+/**
+ * Check if style exists (by name or file path)
+ */
+export declare const styleExists: (style: string) => boolean;
 export {};

package/lib/tools/complete_script.js CHANGED Viewed

@@ -1,6 +1,9 @@
+import { readFileSync, existsSync } from "fs";
+import path from "path";
 import { mulmoScriptSchema } from "../types/schema.js";
 import { getScriptFromPromptTemplate } from "../utils/file.js";
 import { currentMulmoScriptVersion } from "../types/const.js";
+import { promptTemplates } from "../data/index.js";
 /**
  * Add $mulmocast version if not present
  */
@@ -15,29 +18,91 @@ export const addMulmocastVersion = (data) => {
 };
 const deepMergeKeys = ["speechParams", "imageParams", "movieParams", "audioParams"];
 /**
- * Merge input data with template (input takes precedence)
+ * Merge base with override (override takes precedence)
  */
-export const mergeWithTemplate = (data, template) => {
-    const merged = { ...template, ...data };
+export const mergeScripts = (base, override) => {
+    const merged = { ...base, ...override };
     deepMergeKeys.forEach((key) => {
-        if (template[key] && data[key]) {
-            merged[key] = { ...template[key], ...data[key] };
+        if (base[key] && override[key]) {
+            merged[key] = { ...base[key], ...override[key] };
         }
     });
     return merged;
 };
 /**
- * Complete a partial MulmoScript with schema defaults and optional template
+ * Check if style specifier is a file path
  */
-export const completeScript = (data, templateName) => {
-    const withVersion = addMulmocastVersion(data);
-    const withTemplate = templateName
-        ? (() => {
-            const template = getScriptFromPromptTemplate(templateName);
-            return template ? mergeWithTemplate(withVersion, template) : withVersion;
-        })()
-        : withVersion;
-    return mulmoScriptSchema.safeParse(withTemplate);
+const isFilePath = (style) => {
+    return style.endsWith(".json") || style.includes("/") || style.includes("\\");
+};
+/**
+ * Get style by name from promptTemplates
+ */
+const getStyleByName = (styleName) => {
+    const template = promptTemplates.find((t) => t.filename === styleName);
+    return template?.presentationStyle;
+};
+/**
+ * Get style from file path
+ */
+const getStyleFromFile = (filePath) => {
+    const resolvedPath = path.resolve(filePath);
+    if (!existsSync(resolvedPath)) {
+        return undefined;
+    }
+    const content = readFileSync(resolvedPath, "utf-8");
+    return JSON.parse(content);
+};
+/**
+ * Get style by name or file path
+ */
+export const getStyle = (style) => {
+    return isFilePath(style) ? getStyleFromFile(style) : getStyleByName(style);
+};
+/**
+ * Complete a partial MulmoScript with schema defaults, optional style or template
+ *
+ * @param data - Partial MulmoScript to complete (highest precedence)
+ * @param options - Optional template or style to use as base
+ * @param options.templateName - Template name (e.g., "children_book"). Mutually exclusive with styleName.
+ * @param options.styleName - Style name or file path. Mutually exclusive with templateName.
+ * @returns Zod safe parse result with completed MulmoScript or validation errors
+ * @throws Error if both templateName and styleName are specified
+ *
+ * @example
+ * // With template
+ * completeScript(data, { templateName: "children_book" })
+ *
+ * @example
+ * // With style
+ * completeScript(data, { styleName: "ghibli_comic" })
+ *
+ * @example
+ * // With style from file
+ * completeScript(data, { styleName: "./my-style.json" })
+ */
+export const completeScript = (data, options = {}) => {
+    const { templateName, styleName } = options;
+    // template and style are mutually exclusive
+    if (templateName && styleName) {
+        throw new Error("Cannot specify both templateName and styleName. They are mutually exclusive.");
+    }
+    // Get base config from template or style
+    const getBase = () => {
+        if (templateName) {
+            return getScriptFromPromptTemplate(templateName);
+        }
+        if (styleName) {
+            return getStyle(styleName);
+        }
+        return undefined;
+    };
+    const base = getBase();
+    // Merge base with input data (input data has highest precedence)
+    const merged = base ? mergeScripts(base, data) : data;
+    // Add version if not present
+    const withVersion = addMulmocastVersion(merged);
+    return mulmoScriptSchema.safeParse(withVersion);
 };
 /**
  * Check if template exists
@@ -45,3 +110,9 @@ export const completeScript = (data, templateName) => {
 export const templateExists = (templateName) => {
     return getScriptFromPromptTemplate(templateName) !== undefined;
 };
+/**
+ * Check if style exists (by name or file path)
+ */
+export const styleExists = (style) => {
+    return getStyle(style) !== undefined;
+};

package/lib/utils/markdown.js CHANGED Viewed

@@ -1,35 +1,113 @@
 import { marked } from "marked";
 import puppeteer from "puppeteer";
 const isCI = process.env.CI === "true";
+const reuseBrowser = process.env.MULMO_PUPPETEER_REUSE !== "0";
+const browserLaunchArgs = isCI ? ["--no-sandbox"] : [];
+// Shared browser to avoid spawning a new Chromium per render.
+let sharedBrowserPromise = null;
+let sharedBrowserRefs = 0;
+let sharedBrowserCloseTimer = null;
+// Acquire a browser instance; reuse a shared one when enabled.
+const acquireBrowser = async () => {
+    if (!reuseBrowser) {
+        return await puppeteer.launch({ args: browserLaunchArgs });
+    }
+    sharedBrowserRefs += 1;
+    if (sharedBrowserCloseTimer) {
+        clearTimeout(sharedBrowserCloseTimer);
+        sharedBrowserCloseTimer = null;
+    }
+    if (!sharedBrowserPromise) {
+        sharedBrowserPromise = puppeteer.launch({ args: browserLaunchArgs });
+    }
+    const currentPromise = sharedBrowserPromise;
+    try {
+        return await currentPromise;
+    }
+    catch (error) {
+        if (sharedBrowserPromise === currentPromise) {
+            sharedBrowserPromise = null;
+        }
+        sharedBrowserRefs = Math.max(0, sharedBrowserRefs - 1);
+        throw error;
+    }
+};
+// Release the browser; close only after a short idle window.
+const releaseBrowser = async (browser) => {
+    if (!reuseBrowser) {
+        await browser.close().catch(() => { });
+        return;
+    }
+    sharedBrowserRefs = Math.max(0, sharedBrowserRefs - 1);
+    if (sharedBrowserRefs > 0 || !sharedBrowserPromise) {
+        return;
+    }
+    // Delay close to allow back-to-back renders to reuse the browser.
+    sharedBrowserCloseTimer = setTimeout(async () => {
+        const current = sharedBrowserPromise;
+        sharedBrowserPromise = null;
+        sharedBrowserCloseTimer = null;
+        if (current) {
+            await (await current).close().catch(() => { });
+        }
+    }, 300);
+};
+// Wait for a single animation frame to let canvas paints settle.
+const waitForNextFrame = async (page) => {
+    await page.evaluate(() => new Promise((resolve) => {
+        requestAnimationFrame(() => resolve());
+    }));
+};
 export const renderHTMLToImage = async (html, outputPath, width, height, isMermaid = false, omitBackground = false) => {
-    // Use Puppeteer to render HTML to an image
-    const browser = await puppeteer.launch({
-        args: isCI ? ["--no-sandbox"] : [],
-    });
-    const page = await browser.newPage();
-    // Set the page content to the HTML generated from the Markdown
-    await page.setContent(html);
-    // Adjust page settings if needed (like width, height, etc.)
-    await page.setViewport({ width, height });
-    await page.addStyleTag({ content: "html,body{margin:0;padding:0;overflow:hidden}" });
-    if (isMermaid) {
-        await page.waitForFunction(() => {
-            const el = document.querySelector(".mermaid");
-            return el && el.dataset.ready === "true";
-        }, { timeout: 20000 });
-    }
-    // Measure the size of the page and scale the page to the width and height
-    await page.evaluate(({ vw, vh }) => {
-        const de = document.documentElement;
-        const sw = Math.max(de.scrollWidth, document.body.scrollWidth || 0);
-        const sh = Math.max(de.scrollHeight, document.body.scrollHeight || 0);
-        const scale = Math.min(vw / (sw || vw), vh / (sh || vh), 1); // <=1 で縮小のみ
-        de.style.overflow = "hidden";
-        document.body.style.zoom = String(scale);
-    }, { vw: width, vh: height });
-    // Step 3: Capture screenshot of the page (which contains the Markdown-rendered HTML)
-    await page.screenshot({ path: outputPath, omitBackground });
-    await browser.close();
+    // Charts are rendered in a dedicated browser to avoid shared-page timing issues.
+    const useSharedBrowser = reuseBrowser && !html.includes("data-chart-ready");
+    const browser = useSharedBrowser ? await acquireBrowser() : await puppeteer.launch({ args: browserLaunchArgs });
+    let page = null;
+    try {
+        page = await browser.newPage();
+        // Adjust page settings if needed (like width, height, etc.)
+        await page.setViewport({ width, height });
+        // Set the page content to the HTML generated from the Markdown
+        await page.setContent(html, { waitUntil: "domcontentloaded" });
+        await page.addStyleTag({ content: "html,body{margin:0;padding:0;overflow:hidden}" });
+        if (isMermaid) {
+            await page.waitForFunction(() => {
+                const element = document.querySelector(".mermaid");
+                return element && element.dataset.ready === "true";
+            }, { timeout: 20000 });
+        }
+        if (html.includes("data-chart-ready")) {
+            await page.waitForFunction(() => {
+                const canvas = document.querySelector("canvas[data-chart-ready='true']");
+                return !!canvas;
+            }, { timeout: 20000 });
+            // Give the browser a couple of frames to paint the canvas.
+            await waitForNextFrame(page);
+            await waitForNextFrame(page);
+        }
+        // Measure the size of the page and scale the page to the width and height
+        await page.evaluate(({ vw, vh }) => {
+            const documentElement = document.documentElement;
+            const scrollWidth = Math.max(documentElement.scrollWidth, document.body.scrollWidth || 0);
+            const scrollHeight = Math.max(documentElement.scrollHeight, document.body.scrollHeight || 0);
+            const scale = Math.min(vw / (scrollWidth || vw), vh / (scrollHeight || vh), 1); // <=1 で縮小のみ
+            documentElement.style.overflow = "hidden";
+            document.body.style.zoom = String(scale);
+        }, { vw: width, vh: height });
+        // Step 3: Capture screenshot of the page (which contains the Markdown-rendered HTML)
+        await page.screenshot({ path: outputPath, omitBackground });
+    }
+    finally {
+        if (page) {
+            await page.close().catch(() => { });
+        }
+        if (useSharedBrowser) {
+            await releaseBrowser(browser);
+        }
+        else {
+            await browser.close().catch(() => { });
+        }
+    }
 };
 export const renderMarkdownToImage = async (markdown, style, outputPath, width, height) => {
     const header = `<head><style>${style}</style></head>`;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "mulmocast",
-  "version": "2.1.25",
+  "version": "2.1.27",
   "description": "",
   "type": "module",
   "main": "lib/index.node.js",