@file-viewer/pptx 2.2.3 → 2.2.4

package/dist/viewer.d.ts

@@ -20,6 +20,7 @@ export declare class PptxViewer {
     private slideWindowListeners;
     private slideWindowFrame;
     private charts;
+    private readonly mediaRecords;
     private disposed;
     private completed;
     private readonly handleSlideWindowChange;
@@ -59,6 +60,9 @@ export declare class PptxViewer {
     cloneForExport(): Promise<HTMLElement>;
     private complete;
     private fail;
+    private storeMedia;
+    private hydrateMedia;
+    private releaseMedia;
     private attachResizeObserver;
     private scheduleResize;
     private resize;

package/dist/viewer.js

@@ -100,6 +100,7 @@ export class PptxViewer {
         this.slideWindowListeners = [];
         this.slideWindowFrame = 0;
         this.charts = null;
+        this.mediaRecords = new Map();
         this.disposed = false;
         this.completed = false;
         this.handleSlideWindowChange = () => this.scheduleSlideWindowUpdate();
@@ -139,6 +140,7 @@ export class PptxViewer {
         var _a, _b, _c, _d;
         this.disposed = true;
         this.previewThumbnailDataUrl = null;
+        this.releaseMedia();
         (_a = this.worker) === null || _a === void 0 ? void 0 : _a.terminate();
         this.worker = null;
         (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
@@ -155,6 +157,7 @@ export class PptxViewer {
     startWorker() {
         var _a;
         (_a = this.worker) === null || _a === void 0 ? void 0 : _a.terminate();
+        this.releaseMedia();
         this.completed = false;
         this.charts = null;
         this.previewThumbnailDataUrl = null;
@@ -195,11 +198,15 @@ export class PptxViewer {
                 }
                 else {
                     const element = appendHtml(this.content, String(message.data || ''));
+                    this.hydrateMedia(element);
                     this.scheduleResize();
                     (_b = (_a = this.options).onSlideRendered) === null || _b === void 0 ? void 0 : _b.call(_a, Number(message.slide_num || 0), element);
                 }
                 break;
             }
+            case 'media':
+                this.storeMedia(message.data);
+                break;
             case 'slide-error': {
                 const slideNumber = Number(message.slide_num || 0);
                 const error = message.data;
@@ -333,6 +340,7 @@ export class PptxViewer {
         const designerCanvases = this.getDesignerCanvases(record);
         record.slot.replaceChildren();
         record.element = appendHtml(record.slot, record.html);
+        this.hydrateMedia(record.element);
         record.slot.append(...designerCanvases);
         record.rendered = true;
         record.postProcessed = false;
@@ -603,9 +611,76 @@ export class PptxViewer {
         this.completed = true;
         (_a = this.worker) === null || _a === void 0 ? void 0 : _a.terminate();
         this.worker = null;
+        this.releaseMedia();
         this.content.dataset.renderState = 'error';
         (_c = (_b = this.options).onError) === null || _c === void 0 ? void 0 : _c.call(_b, error);
     }
+    storeMedia(data) {
+        if (!data || typeof data !== 'object') {
+            return;
+        }
+        const media = data;
+        if (typeof media.id !== 'string' ||
+            !media.id ||
+            typeof media.mimeType !== 'string' ||
+            !(media.buffer instanceof ArrayBuffer)) {
+            return;
+        }
+        this.releaseMedia(media.id);
+        this.mediaRecords.set(media.id, {
+            buffer: media.buffer,
+            mimeType: media.mimeType,
+            objectUrl: null,
+            revokeObjectUrl: null,
+        });
+        this.hydrateMedia(this.content);
+    }
+    hydrateMedia(root) {
+        var _a;
+        if (!root) {
+            return;
+        }
+        const elements = Array.from(root.querySelectorAll('[data-pptx-media-id]'));
+        if (root.matches('[data-pptx-media-id]')) {
+            elements.unshift(root);
+        }
+        for (const element of elements) {
+            const mediaId = element.dataset.pptxMediaId;
+            const record = mediaId ? this.mediaRecords.get(mediaId) : undefined;
+            if (!record) {
+                continue;
+            }
+            if (!record.objectUrl) {
+                const view = this.target.ownerDocument.defaultView;
+                const BlobCtor = (view === null || view === void 0 ? void 0 : view.Blob) || globalThis.Blob;
+                const UrlApi = (view === null || view === void 0 ? void 0 : view.URL) || globalThis.URL;
+                if (typeof BlobCtor !== 'function' ||
+                    typeof (UrlApi === null || UrlApi === void 0 ? void 0 : UrlApi.createObjectURL) !== 'function') {
+                    continue;
+                }
+                const objectUrl = UrlApi.createObjectURL(new BlobCtor([record.buffer], { type: record.mimeType }));
+                record.objectUrl = objectUrl;
+                record.revokeObjectUrl = () => UrlApi.revokeObjectURL(objectUrl);
+            }
+            if (element.src !== record.objectUrl) {
+                element.src = record.objectUrl;
+                (_a = element.load) === null || _a === void 0 ? void 0 : _a.call(element);
+            }
+        }
+    }
+    releaseMedia(mediaId) {
+        var _a, _b;
+        if (mediaId) {
+            const record = this.mediaRecords.get(mediaId);
+            (_a = record === null || record === void 0 ? void 0 : record.revokeObjectUrl) === null || _a === void 0 ? void 0 : _a.call(record);
+            this.mediaRecords.delete(mediaId);
+            return;
+        }
+        for (const record of this.mediaRecords.values()) {
+            (_b = record.revokeObjectUrl) === null || _b === void 0 ? void 0 : _b.call(record);
+        }
+        this.mediaRecords.clear();
+    }
     attachResizeObserver() {
         if (typeof ResizeObserver === 'undefined') {
             return;