@xiboplayer/renderer 0.3.5 → 0.3.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xiboplayer/renderer",
-  "version": "0.3.5",
+  "version": "0.3.7",
   "description": "RendererLite - Fast, efficient XLF layout rendering engine",
   "type": "module",
   "main": "./src/index.js",
@@ -12,7 +12,8 @@
   "dependencies": {
     "nanoevents": "^9.1.0",
     "pdfjs-dist": "^4.10.38",
-    "@xiboplayer/utils": "0.3.5"
+    "@xiboplayer/cache": "0.3.7",
+    "@xiboplayer/utils": "0.3.7"
   },
   "devDependencies": {
     "vitest": "^2.0.0",

package/src/layout.js

@@ -3,6 +3,8 @@
  * Based on arexibo layout.rs
  */
 
+import { cacheWidgetHtml } from '@xiboplayer/cache';
+
 export class LayoutTranslator {
   constructor(xmds) {
     this.xmds = xmds;
@@ -11,7 +13,7 @@ export class LayoutTranslator {
   /**
    * Translate XLF XML to playable HTML
    */
-  async translateXLF(layoutId, xlfXml, cacheManager) {
+  async translateXLF(layoutId, xlfXml) {
     const parser = new DOMParser();
     const doc = parser.parseFromString(xlfXml, 'text/xml');
 
@@ -26,7 +28,7 @@ export class LayoutTranslator {
 
     const regions = [];
     for (const regionEl of doc.querySelectorAll('region')) {
-      regions.push(await this.translateRegion(layoutId, regionEl, cacheManager));
+      regions.push(await this.translateRegion(layoutId, regionEl));
     }
 
     return this.generateHTML(width, height, bgcolor, regions);
@@ -35,7 +37,7 @@ export class LayoutTranslator {
   /**
    * Translate a single region
    */
-  async translateRegion(layoutId, regionEl, cacheManager) {
+  async translateRegion(layoutId, regionEl) {
     const id = regionEl.getAttribute('id');
     const width = parseInt(regionEl.getAttribute('width'));
     const height = parseInt(regionEl.getAttribute('height'));
@@ -45,7 +47,7 @@ export class LayoutTranslator {
 
     const media = [];
     for (const mediaEl of regionEl.querySelectorAll('media')) {
-      media.push(await this.translateMedia(layoutId, id, mediaEl, cacheManager));
+      media.push(await this.translateMedia(layoutId, id, mediaEl));
     }
 
     return {
@@ -62,7 +64,7 @@ export class LayoutTranslator {
   /**
    * Translate a single media item
    */
-  async translateMedia(layoutId, regionId, mediaEl, cacheManager) {
+  async translateMedia(layoutId, regionId, mediaEl) {
     const type = mediaEl.getAttribute('type');
     const duration = parseInt(mediaEl.getAttribute('duration') || '10');
     const id = mediaEl.getAttribute('id');
@@ -127,7 +129,7 @@ export class LayoutTranslator {
           console.log(`[Layout] Got resource HTML (${raw.length} chars)`);
 
           // Store widget HTML in cache and save cache key for iframe src generation
-          const widgetCacheKey = await cacheManager.cacheWidgetHtml(layoutId, regionId, id, raw);
+          const widgetCacheKey = await cacheWidgetHtml(layoutId, regionId, id, raw);
           options.widgetCacheKey = widgetCacheKey;
 
           // Success - break retry loop
@@ -150,10 +152,11 @@ export class LayoutTranslator {
       if (!raw && lastError) {
         console.warn(`[Layout] All retries failed, checking for cached widget HTML...`);
 
-        // Try to get cached widget HTML
+        // Try to get cached widget HTML directly from Cache API
         try {
           const cachedKey = `/cache/widget/${layoutId}/${regionId}/${id}.html`;
-          const cached = await cacheManager.cache.match(new Request(window.location.origin + '/player' + cachedKey));
+          const cache = await caches.open('xibo-media-v1');
+          const cached = await cache.match(new Request(window.location.origin + '/player' + cachedKey));
 
           if (cached) {
             raw = await cached.text();

package/src/renderer-lite.js

@@ -378,6 +378,7 @@ export class RendererLite {
       duration: layoutDurationAttr ? parseInt(layoutDurationAttr) : 0, // 0 = calculate from widgets
       bgcolor: layoutEl.getAttribute('bgcolor') || '#000000',
       background: layoutEl.getAttribute('background') || null, // Background image fileId
+      enableStat: layoutEl.getAttribute('enableStat') !== '0', // absent or "1" = enabled
       regions: []
     };
 
@@ -495,6 +496,7 @@ export class RendererLite {
       useDuration, // Whether to use specified duration (1) or media length (0)
       id,
       fileId, // Media library file ID for cache lookup
+      enableStat: mediaEl.getAttribute('enableStat') !== '0', // absent or "1" = enabled
       options,
       raw,
       transitions,
@@ -1318,7 +1320,8 @@ export class RendererLite {
         this.emit('widgetStart', {
           widgetId: widget.id, regionId, layoutId: this.currentLayoutId,
           mediaId: parseInt(widget.fileId || widget.id) || null,
-          type: widget.type, duration: widget.duration
+          type: widget.type, duration: widget.duration,
+          enableStat: widget.enableStat
         });
       }
     } catch (error) {
@@ -1342,7 +1345,8 @@ export class RendererLite {
       this.emit('widgetEnd', {
         widgetId: widget.id, regionId, layoutId: this.currentLayoutId,
         mediaId: parseInt(widget.fileId || widget.id) || null,
-        type: widget.type
+        type: widget.type,
+        enableStat: widget.enableStat
       });
     }
   }

package/src/renderer-lite.test.js

@@ -157,6 +157,86 @@ describe('RendererLite', () => {
     });
   });
 
+  describe('enableStat parsing', () => {
+    it('should parse enableStat="1" as true on layout', () => {
+      const xlf = `
+        <layout enableStat="1">
+          <region id="r1">
+            <media id="m1" type="image" duration="10"></media>
+          </region>
+        </layout>
+      `;
+      const layout = renderer.parseXlf(xlf);
+      expect(layout.enableStat).toBe(true);
+    });
+
+    it('should parse enableStat="0" as false on layout', () => {
+      const xlf = `
+        <layout enableStat="0">
+          <region id="r1">
+            <media id="m1" type="image" duration="10"></media>
+          </region>
+        </layout>
+      `;
+      const layout = renderer.parseXlf(xlf);
+      expect(layout.enableStat).toBe(false);
+    });
+
+    it('should default enableStat to true when absent on layout', () => {
+      const xlf = `
+        <layout>
+          <region id="r1">
+            <media id="m1" type="image" duration="10"></media>
+          </region>
+        </layout>
+      `;
+      const layout = renderer.parseXlf(xlf);
+      expect(layout.enableStat).toBe(true);
+    });
+
+    it('should parse enableStat="0" as false on widget', () => {
+      const xlf = `
+        <layout>
+          <region id="r1">
+            <media id="m1" type="image" duration="10" enableStat="0">
+              <options><uri>test.png</uri></options>
+            </media>
+          </region>
+        </layout>
+      `;
+      const layout = renderer.parseXlf(xlf);
+      expect(layout.regions[0].widgets[0].enableStat).toBe(false);
+    });
+
+    it('should parse enableStat="1" as true on widget', () => {
+      const xlf = `
+        <layout>
+          <region id="r1">
+            <media id="m1" type="image" duration="10" enableStat="1">
+              <options><uri>test.png</uri></options>
+            </media>
+          </region>
+        </layout>
+      `;
+      const layout = renderer.parseXlf(xlf);
+      expect(layout.regions[0].widgets[0].enableStat).toBe(true);
+    });
+
+    it('should default enableStat to true when absent on widget', () => {
+      const xlf = `
+        <layout>
+          <region id="r1">
+            <media id="m1" type="image" duration="10">
+              <options><uri>test.png</uri></options>
+            </media>
+          </region>
+        </layout>
+      `;
+      const layout = renderer.parseXlf(xlf);
+      expect(layout.regions[0].widgets[0].enableStat).toBe(true);
+    });
+  });
+
   describe('Region Creation', () => {
     it('should create region element with correct positioning', async () => {
       const regionConfig = {