@editframe/elements 0.18.7-beta.0 → 0.18.8-beta.0

package/dist/elements/EFAudio.d.ts

@@ -2,8 +2,7 @@ import { Task } from '@lit/task';
 import { EFMedia } from './EFMedia.js';
 declare const EFAudio_base: typeof EFMedia;
 export declare class EFAudio extends EFAudio_base {
-    static get observedAttributes(): string[];
-    attributeChangedCallback(name: string, old: string | null, value: string | null): void;
+    private _propertyHack;
     audioElementRef: import('lit-html/directives/ref.js').Ref<HTMLAudioElement>;
     render(): import('lit-html').TemplateResult<1>;
     frameTask: Task<readonly [import('@lit/task').TaskStatus, import('@lit/task').TaskStatus, import('@lit/task').TaskStatus, import('@lit/task').TaskStatus], void>;

package/dist/elements/EFAudio.js

@@ -2,12 +2,13 @@ import { EFMedia } from "./EFMedia.js";
 import { TWMixin } from "../gui/TWMixin2.js";
 import { Task } from "@lit/task";
 import { html } from "lit";
-import { customElement } from "lit/decorators.js";
+import { customElement, property } from "lit/decorators.js";
 import _decorate from "@oxc-project/runtime/helpers/decorate";
 import { createRef, ref } from "lit/directives/ref.js";
 let EFAudio = class EFAudio$1 extends TWMixin(EFMedia) {
 	constructor(..._args) {
 		super(..._args);
+		this._propertyHack = false;
 		this.audioElementRef = createRef();
 		this.frameTask = new Task(this, {
 			args: () => [
@@ -25,14 +26,6 @@ let EFAudio = class EFAudio$1 extends TWMixin(EFMedia) {
 			}
 		});
 	}
-	static get observedAttributes() {
-		const parentAttributes = super.observedAttributes || [];
-		return [...parentAttributes];
-	}
-	attributeChangedCallback(name, old, value) {
-		super.attributeChangedCallback(name, old, value);
-		if (name === "asset-id") this.assetId = value;
-	}
 	render() {
 		return html`<audio ${ref(this.audioElementRef)}></audio>`;
 	}
@@ -61,5 +54,9 @@ let EFAudio = class EFAudio$1 extends TWMixin(EFMedia) {
 		return this.audioBufferTask;
 	}
 };
+_decorate([property({
+	type: Boolean,
+	attribute: "dummy-property"
+})], EFAudio.prototype, "_propertyHack", void 0);
 EFAudio = _decorate([customElement("ef-audio")], EFAudio);
 export { EFAudio };

package/dist/elements/EFMedia/AssetMediaEngine.js

@@ -82,9 +82,15 @@ var AssetMediaEngine = class AssetMediaEngine extends BaseMediaEngine {
 	* Calculate audio segments for variable-duration segments using track fragment index
 	*/
 	calculateAudioSegmentRange(fromMs, toMs, rendition, _durationMs) {
-		if (fromMs >= toMs || !rendition.trackId) return [];
+		if (fromMs >= toMs || !rendition.trackId) {
+			console.warn(`calculateAudioSegmentRange: invalid fromMs ${fromMs} toMs ${toMs} rendition ${JSON.stringify(rendition)}`);
+			return [];
+		}
 		const track = this.data[rendition.trackId];
-		if (!track) return [];
+		if (!track) {
+			console.warn(`calculateAudioSegmentRange: track not found for rendition ${JSON.stringify(rendition)}`);
+			return [];
+		}
 		const { timescale, segments } = track;
 		const segmentRanges = [];
 		for (let i = 0; i < segments.length; i++) {
@@ -99,6 +105,10 @@ var AssetMediaEngine = class AssetMediaEngine extends BaseMediaEngine {
 				endMs: segmentEndMs
 			});
 		}
+		if (segmentRanges.length === 0) console.warn(`calculateAudioSegmentRange: no segments found for fromMs ${fromMs} toMs ${toMs} rendition ${JSON.stringify({
+			rendition,
+			track
+		})}`);
 		return segmentRanges;
 	}
 	computeSegmentId(desiredSeekTimeMs, rendition) {

package/dist/elements/EFMedia/audioTasks/makeAudioSeekTask.js

@@ -4,8 +4,13 @@ const makeAudioSeekTask = (host) => {
 	return new Task(host, {
 		args: () => [host.desiredSeekTimeMs, host.audioInputTask.value],
 		onError: (error) => {
-			if (error instanceof IgnorableError) console.info("audioSeekTask aborted");
-			console.error("audioSeekTask error", error);
+			if (error instanceof IgnorableError) {
+				console.info("audioSeekTask aborted");
+				return;
+			}
+			if (error instanceof DOMException) console.error(`audioSeekTask error: ${error.message} ${error.name} ${error.code}`);
+			else if (error instanceof Error) console.error(`audioSeekTask error ${error.name}: ${error.message}`);
+			else console.error("audioSeekTask unknown error", error);
 		},
 		onComplete: (_value) => {},
 		task: async ([targetSeekTimeMs], { signal }) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@editframe/elements",
-  "version": "0.18.7-beta.0",
+  "version": "0.18.8-beta.0",
   "description": "",
   "exports": {
     ".": {
@@ -27,7 +27,7 @@
   "license": "UNLICENSED",
   "dependencies": {
     "@bramus/style-observer": "^1.3.0",
-    "@editframe/assets": "0.18.7-beta.0",
+    "@editframe/assets": "0.18.8-beta.0",
     "@lit/context": "^1.1.2",
     "@lit/task": "^1.0.1",
     "d3": "^7.9.0",

package/src/elements/EFAudio.ts

@@ -1,31 +1,18 @@
 import { Task } from "@lit/task";
 import { html } from "lit";
-import { customElement } from "lit/decorators.js";
+import { customElement, property } from "lit/decorators.js";
 import { createRef, ref } from "lit/directives/ref.js";
 import { TWMixin } from "../gui/TWMixin.js";
 import { EFMedia } from "./EFMedia.js";
 
 @customElement("ef-audio")
 export class EFAudio extends TWMixin(EFMedia) {
-  static get observedAttributes() {
-    // biome-ignore lint/complexity/noThisInStatic: We need to access super
-    const parentAttributes = super.observedAttributes || [];
-    return [...parentAttributes];
-  }
-
-  attributeChangedCallback(
-    name: string,
-    old: string | null,
-    value: string | null,
-  ) {
-    super.attributeChangedCallback(name, old, value);
-
-    // Explicitly handle asset-id attribute to property conversion
-    // EFVideo works without this fix, but EFAudio requires it due to some fundamental difference
-    if (name === "asset-id") {
-      this.assetId = value;
-    }
-  }
+  // HACK: This dummy property is needed to activate Lit's property processing system
+  // Without it, inherited properties from EFMedia don't work correctly
+  // TODO: Remove this as soon as we have an audio-specific property that needs @property
+  @property({ type: Boolean, attribute: "dummy-property" })
+  // @ts-expect-error - This is a hack to activate Lit's property processing system
+  private _propertyHack = false;
 
   audioElementRef = createRef<HTMLAudioElement>();
 

package/src/elements/EFMedia/AssetMediaEngine.ts

@@ -156,11 +156,21 @@ export class AssetMediaEngine extends BaseMediaEngine implements MediaEngine {
     _durationMs: number,
   ): SegmentTimeRange[] {
     if (fromMs >= toMs || !rendition.trackId) {
+      console.warn(
+        `calculateAudioSegmentRange: invalid fromMs ${fromMs} toMs ${toMs} rendition ${JSON.stringify(
+          rendition,
+        )}`,
+      );
       return [];
     }
 
     const track = this.data[rendition.trackId];
     if (!track) {
+      console.warn(
+        `calculateAudioSegmentRange: track not found for rendition ${JSON.stringify(
+          rendition,
+        )}`,
+      );
       return [];
     }
 
@@ -186,6 +196,16 @@ export class AssetMediaEngine extends BaseMediaEngine implements MediaEngine {
         });
       }
     }
+    if (segmentRanges.length === 0) {
+      console.warn(
+        `calculateAudioSegmentRange: no segments found for fromMs ${fromMs} toMs ${toMs} rendition ${JSON.stringify(
+          {
+            rendition,
+            track,
+          },
+        )}`,
+      );
+    }
 
     return segmentRanges;
   }

package/src/elements/EFMedia/audioTasks/makeAudioSeekTask.ts

@@ -13,8 +13,17 @@ export const makeAudioSeekTask = (host: EFMedia): AudioSeekTask => {
     onError: (error) => {
       if (error instanceof IgnorableError) {
         console.info("audioSeekTask aborted");
+        return;
+      }
+      if (error instanceof DOMException) {
+        console.error(
+          `audioSeekTask error: ${error.message} ${error.name} ${error.code}`,
+        );
+      } else if (error instanceof Error) {
+        console.error(`audioSeekTask error ${error.name}: ${error.message}`);
+      } else {
+        console.error("audioSeekTask unknown error", error);
       }
-      console.error("audioSeekTask error", error);
     },
     onComplete: (_value) => {},
     task: async (