Load image data into data attribute. Optionally embed data attribute when saving.

Author: chrisbaume

src/processors/obfProcessor.ts

@@ -70,6 +70,24 @@ interface ObfGrid {
   order?: Array<Array<string | number | null>>;
 }
 
+interface ObfImage {
+  id: string;
+  data?: string;
+  path?: string;
+  url?: string;
+  width?: number;
+  height?: number;
+  content_type?: string;
+  license?: {
+    type?: string;
+    copyright_notice_url?: string;
+    source_url?: string;
+    author_name?: string;
+    author_url?: string;
+    author_email?: string;
+  };
+}
+
 interface ObfBoard {
   format?: string;
   id: string;
@@ -79,7 +97,7 @@ interface ObfBoard {
   description_html?: string;
   buttons: ObfButton[];
   grid?: ObfGrid;
-  images?: any[];
+  images?: ObfImage[];
   sounds?: any[];
 }
 
@@ -132,7 +150,7 @@ class ObfProcessor extends BaseProcessor {
   /**
    * Extract an image from the ZIP file and convert to data URL
    */
-  private async extractImageAsDataUrl(imageId: string, images: any[]): Promise<string | null> {
+  private async extractImageAsDataUrl(imageId: string, images: ObfImage[]): Promise<string | null> {
     // Check cache first
     if (this.imageCache.has(imageId)) {
       return this.imageCache.get(imageId) ?? null;
@@ -147,8 +165,8 @@ class ObfProcessor extends BaseProcessor {
     }
 
     // If image has data property, use that
-    if ((imageData as { data?: string }).data) {
-      const dataUrl = (imageData as { data: string }).data;
+    if (imageData.data) {
+      const dataUrl = imageData.data;
       this.imageCache.set(imageId, dataUrl);
       return dataUrl;
     }
@@ -158,7 +176,7 @@ class ObfProcessor extends BaseProcessor {
       // Images are typically stored in an 'images' folder or root
       const possiblePaths = [
         imageData.path, // Explicit path if provided
-        `images/${imageData.filename || imageId}`, // Standard images folder
+        `images/${imageData.path || imageId}`, // Standard images folder
         imageData.id, // Just the ID
       ].filter(Boolean);
 
@@ -181,8 +199,8 @@ class ObfProcessor extends BaseProcessor {
     }
 
     // If image has a URL, use that as fallback
-    if ((imageData as { url?: string }).url) {
-      const url = (imageData as { url: string }).url;
+    if (imageData.url) {
+      const url = imageData.url;
       this.imageCache.set(imageId, url);
       return url;
     }
@@ -654,13 +672,21 @@ class ObfProcessor extends BaseProcessor {
   private createObfBoardFromPage(
     page: AACPage,
     fallbackName: string,
-    metadata?: AACTreeMetadata
+    metadata?: AACTreeMetadata,
+    embedData = false
   ): ObfBoard {
     const { rows, columns, order, buttonPositions } = this.buildGridMetadata(page);
     const boardName =
       metadata?.name && page.id === metadata?.defaultHomePageId
         ? metadata.name
         : page.name || fallbackName;
+    let images: ObfImage[] = Array.isArray(page.images) ? page.images : [];
+    if (!embedData) {
+      images = images.map((image) => {
+        delete image.data;
+        return image;
+      });
+    }
 
     return {
       format: OBF_FORMAT_VERSION,
@@ -702,7 +728,7 @@ class ObfProcessor extends BaseProcessor {
           hidden: button.visibility === 'Hidden' || false,
         };
       }),
-      images: Array.isArray(page.images) ? page.images : [],
+      images,
       sounds: Array.isArray(page.sounds) ? page.sounds : [],
     };
   }
@@ -748,7 +774,7 @@ class ObfProcessor extends BaseProcessor {
     return await readBinaryFromInput(outputPath);
   }
 
-  async saveFromTree(tree: AACTree, outputPath: string): Promise<void> {
+  async saveFromTree(tree: AACTree, outputPath: string, embedData = false): Promise<void> {
     const { writeTextToPath, writeBinaryToPath, pathExists, mkDir, join } =
       this.options.fileAdapter;
     if (outputPath.endsWith('.obf')) {
@@ -758,12 +784,17 @@ class ObfProcessor extends BaseProcessor {
         throw new Error('No pages to save');
       }
 
-      const obfBoard = this.createObfBoardFromPage(rootPage, 'Exported Board', tree.metadata);
+      const obfBoard = this.createObfBoardFromPage(
+        rootPage,
+        'Exported Board',
+        tree.metadata,
+        embedData
+      );
       await writeTextToPath(outputPath, JSON.stringify(obfBoard, null, 2));
     } else {
       const getPageFilename = (id: string): string => (id.endsWith('.obf') ? id : `${id}.obf`);
       const files = Object.values(tree.pages).map((page) => {
-        const obfBoard = this.createObfBoardFromPage(page, 'Board', tree.metadata);
+        const obfBoard = this.createObfBoardFromPage(page, 'Board', tree.metadata, embedData);
         const obfContent = JSON.stringify(obfBoard, null, 2);
         const name = getPageFilename(page.id);
         return {