asciify-engine 1.0.8 → 1.0.9

package/dist/index.d.cts

@@ -160,15 +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 clean 2-line embed snippet.
+ * Generate a clean embed snippet.
  *
- * All data lives in data attributes on the <canvas>.
- * The <script> tag is always the same CDN line — identical across all embeds,
- * so browsers/CDNs cache it once and reuse it everywhere.
+ * 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:
- *   <canvas data-asciify-id="ar-xxx" data-asciify-src="…" data-asciify-opts="{…}" width="…" height="…"></canvas>
- *   <script src="https://cdn.jsdelivr.net/npm/asciify-engine@x.x.x/dist/embed.js" async></script>
+ * 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,15 +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 clean 2-line embed snippet.
+ * Generate a clean embed snippet.
  *
- * All data lives in data attributes on the <canvas>.
- * The <script> tag is always the same CDN line — identical across all embeds,
- * so browsers/CDNs cache it once and reuse it everywhere.
+ * 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:
- *   <canvas data-asciify-id="ar-xxx" data-asciify-src="…" data-asciify-opts="{…}" width="…" height="…"></canvas>
- *   <script src="https://cdn.jsdelivr.net/npm/asciify-engine@x.x.x/dist/embed.js" async></script>
+ * 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.8";
+var EMBED_CDN_VERSION = "1.0.9";
 function buildEmbedOpts(options, rows, cols, width, height, fps, animated) {
   const o = {
     r: rows,
@@ -866,7 +866,8 @@ function generateEmbedCode(frame, options, width, height) {
   const id = `ar-${Math.random().toString(36).slice(2, 9)}`;
   const opts = buildEmbedOpts(options, rows, cols, width, height);
   return `<!-- Asciify Embed -->
-<canvas data-asciify-id="${id}" data-asciify-src='"${data}"' data-asciify-opts='${opts}' width="${width}" height="${height}"></canvas>
+<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 -->`;
 }
@@ -879,7 +880,8 @@ function generateAnimatedEmbedCode(frames, options, fps, width, height) {
   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 data-asciify-id="${id}" data-asciify-src='${JSON.stringify(allData)}' data-asciify-opts='${opts}' width="${width}" height="${height}"></canvas>
+<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 -->`;
 }