asciify-engine 1.0.7 → 1.0.9

package/dist/index.d.cts

@@ -160,9 +160,19 @@ declare function asciifyGif(source: string | ArrayBuffer, canvas: HTMLCanvasElem
  */
 declare function asciifyVideo(source: HTMLVideoElement | string, canvas: HTMLCanvasElement, { fontSize, style, options }?: AsciifySimpleOptions): Promise<() => void>;
 /**
- * Generate a professional 3-line embed snippet.
- * The render runtime is loaded from jsDelivr CDN (free, served from npm).
- * Only the base64-encoded frame data is inlined.
+ * Generate a clean embed snippet.
+ *
+ * Structure:
+ *   <canvas id>            — the render target, short and clean
+ *   <script type=json id>  — frame data lives here, clearly separated
+ *   <script src=cdn>       — always the same line, cached by browsers
+ *
+ * Output (static):
+ *   <!-- Asciify Embed -->
+ *   <canvas id="ar-xxx" data-asciify-opts="{…}" width="…" height="…"></canvas>
+ *   <script type="application/json" id="ar-xxx-d">"BASE64"</script>
+ *   <script src="cdn/embed.js" async></script>
+ *   <!-- /Asciify Embed -->
  */
 declare function generateEmbedCode(frame: AsciiFrame, options: AsciiOptions, width: number, height: number): string;
 /**

package/dist/index.d.ts

@@ -160,9 +160,19 @@ declare function asciifyGif(source: string | ArrayBuffer, canvas: HTMLCanvasElem
  */
 declare function asciifyVideo(source: HTMLVideoElement | string, canvas: HTMLCanvasElement, { fontSize, style, options }?: AsciifySimpleOptions): Promise<() => void>;
 /**
- * Generate a professional 3-line embed snippet.
- * The render runtime is loaded from jsDelivr CDN (free, served from npm).
- * Only the base64-encoded frame data is inlined.
+ * Generate a clean embed snippet.
+ *
+ * Structure:
+ *   <canvas id>            — the render target, short and clean
+ *   <script type=json id>  — frame data lives here, clearly separated
+ *   <script src=cdn>       — always the same line, cached by browsers
+ *
+ * Output (static):
+ *   <!-- Asciify Embed -->
+ *   <canvas id="ar-xxx" data-asciify-opts="{…}" width="…" height="…"></canvas>
+ *   <script type="application/json" id="ar-xxx-d">"BASE64"</script>
+ *   <script src="cdn/embed.js" async></script>
+ *   <!-- /Asciify Embed -->
  */
 declare function generateEmbedCode(frame: AsciiFrame, options: AsciiOptions, width: number, height: number): string;
 /**

package/dist/index.js

@@ -832,7 +832,7 @@ async function asciifyVideo(source, canvas, { fontSize = 10, style = "classic",
     cancelAnimationFrame(animId);
   };
 }
-var EMBED_CDN_VERSION = "1.0.7";
+var EMBED_CDN_VERSION = "1.0.9";
 function buildEmbedOpts(options, rows, cols, width, height, fps, animated) {
   const o = {
     r: rows,
@@ -856,32 +856,33 @@ function buildEmbedOpts(options, rows, cols, width, height, fps, animated) {
   if (animated) o.anim = true;
   return JSON.stringify(o);
 }
+var CDN_SCRIPT = `<script src="https://cdn.jsdelivr.net/npm/asciify-engine@${EMBED_CDN_VERSION}/dist/embed.js" async></script>`;
 function generateEmbedCode(frame, options, width, height) {
   const rows = frame.length;
   if (rows === 0) return "";
   const cols = frame[0].length;
-  const isDots = options.renderMode === "dots";
-  const data = serializeFrame(frame, !isDots);
+  const isFullColor = options.colorMode === "fullcolor";
+  const data = serializeFrame(frame, isFullColor);
   const id = `ar-${Math.random().toString(36).slice(2, 9)}`;
   const opts = buildEmbedOpts(options, rows, cols, width, height);
   return `<!-- Asciify Embed -->
-<canvas id="${id}" width="${width}" height="${height}" style="display:block"></canvas>
-<script src="https://cdn.jsdelivr.net/npm/asciify-engine@${EMBED_CDN_VERSION}/dist/embed.js"></script>
-<script>Asciify('${id}','${data}',${opts})</script>
+<canvas id="${id}" data-asciify-opts='${opts}' width="${width}" height="${height}"></canvas>
+<script type="application/json" id="${id}-d">"${data}"</script>
+${CDN_SCRIPT}
 <!-- /Asciify Embed -->`;
 }
 function generateAnimatedEmbedCode(frames, options, fps, width, height) {
   if (frames.length === 0) return "";
   const rows = frames[0].length;
   const cols = frames[0][0].length;
-  const isDots = options.renderMode === "dots";
-  const allData = frames.map((f) => serializeFrame(f, !isDots));
+  const isFullColor = options.colorMode === "fullcolor";
+  const allData = frames.map((f) => serializeFrame(f, isFullColor));
   const id = `ar-${Math.random().toString(36).slice(2, 9)}`;
   const opts = buildEmbedOpts(options, rows, cols, width, height, fps, true);
   return `<!-- Asciify Animated Embed -->
-<canvas id="${id}" width="${width}" height="${height}" style="display:block"></canvas>
-<script src="https://cdn.jsdelivr.net/npm/asciify-engine@${EMBED_CDN_VERSION}/dist/embed.js"></script>
-<script>Asciify('${id}',${JSON.stringify(allData)},${opts})</script>
+<canvas id="${id}" data-asciify-opts='${opts}' width="${width}" height="${height}"></canvas>
+<script type="application/json" id="${id}-d">${JSON.stringify(allData)}</script>
+${CDN_SCRIPT}
 <!-- /Asciify Animated Embed -->`;
 }
 function _fade(t) {