@editframe/elements 0.16.8-beta.0 → 0.18.3-beta.0

package/dist/transcoding/types/index.d.ts

@@ -0,0 +1,242 @@
+/**
+ * Core types and interfaces for JIT Transcoding System
+ */
+export interface QualityPreset {
+    name: string;
+    width: number;
+    height: number;
+    videoBitrate: number;
+    audioBitrate: number;
+    audioChannels: number;
+    audioSampleRate: number;
+    audioCodec: "aac";
+}
+export type RenditionId = "high" | "medium" | "low" | "audio" | "scrub";
+export interface VideoMetadata {
+    url: string;
+    durationMs: number;
+    streams: Array<{
+        index: number;
+        type: "video" | "audio" | "subtitle" | "other";
+        codecName: string;
+        duration: number;
+        durationMs: number;
+        width?: number;
+        height?: number;
+        frameRate?: {
+            num: number;
+            den: number;
+        };
+        channels?: number;
+        sampleRate?: number;
+    }>;
+    presets: string[];
+    segmentDuration: number;
+    supportedFormats: string[];
+    extractedAt: string;
+}
+export interface JitTranscodingConfig {
+    baseUrl: string;
+    defaultQuality: keyof QualityPresets;
+    segmentCacheSize: number;
+    enableNetworkAdaptation: boolean;
+    enablePrefetch: boolean;
+    prefetchSegments: number;
+}
+export interface QualityPresets {
+    low: QualityPreset;
+    medium: QualityPreset;
+    high: QualityPreset;
+    scrub: QualityPreset;
+}
+export interface NetworkCondition {
+    bandwidth: number;
+    rtt: number;
+    connectionType: string;
+}
+export interface SegmentInfo {
+    url: string;
+    startTimeMs: number;
+    durationMs: number;
+    quality: string;
+    cached: boolean;
+}
+export interface ManifestVideoRendition {
+    /** Unique identifier for the video rendition */
+    id: string;
+    /** Duration of each segment in milliseconds */
+    segmentDuration: number;
+    /** Duration of each segment in milliseconds */
+    segmentDurationMs: number;
+    /** Video width in pixels */
+    width: number;
+    /** Video height in pixels */
+    height: number;
+    /** Target bitrate in bits per second */
+    bitrate: number;
+    /** Video codec string (e.g., "avc1.640029") */
+    codec: string;
+    /** Container format (e.g., "video/mp4") */
+    container: string;
+    /** Complete MIME type with codecs */
+    mimeType: string;
+    /** Optional frame rate */
+    frameRate?: number;
+    /** Optional profile indication */
+    profile?: string;
+    /** Optional level indication */
+    level?: string;
+}
+export interface ManifestAudioRendition {
+    /** Unique identifier for the audio rendition */
+    id: string;
+    /** Duration of each segment in milliseconds */
+    segmentDuration: number;
+    /** Duration of each segment in milliseconds */
+    segmentDurationMs: number;
+    /** Number of audio channels */
+    channels: number;
+    /** Sample rate in Hz */
+    sampleRate: number;
+    /** Target bitrate in bits per second */
+    bitrate: number;
+    /** Audio codec string (e.g., "mp4a.40.2") */
+    codec: string;
+    /** Container format (e.g., "audio/mp4") */
+    container: string;
+    /** Complete MIME type with codecs */
+    mimeType: string;
+    /** Optional language code */
+    language?: string;
+}
+/**
+ * CMAF Manifest Response Structure
+ * Matches the server response from /api/v1/transcode/manifest.json
+ */
+export interface ManifestResponse {
+    /** Manifest version for compatibility tracking */
+    version: string;
+    /** Type of manifest (e.g., "cmaf", "dash", "hls") */
+    type: string;
+    /** Original source URL for the media */
+    sourceUrl: string;
+    /** Total duration of the content in milliseconds */
+    duration: number;
+    /** Total duration of the content in milliseconds */
+    durationMs: number;
+    /** Duration of each segment in milliseconds */
+    segmentDuration: number;
+    /** Base URL for all relative URLs */
+    baseUrl: string;
+    /** Video renditions available for adaptive streaming */
+    videoRenditions: ManifestVideoRendition[];
+    /** Audio renditions available for adaptive streaming */
+    audioRenditions: ManifestAudioRendition[];
+    /** URL templates for segment access */
+    endpoints: {
+        /** Initialization segment URL template with {rendition} placeholder */
+        initSegment: string;
+        /** Media segment URL template with {rendition} and {segmentId} placeholders */
+        mediaSegment: string;
+    };
+    /** JIT transcoding specific information */
+    jitInfo: {
+        /** Whether parallel transcoding is supported */
+        parallelTranscodingSupported: boolean;
+        /** Expected transcoding latency in milliseconds */
+        expectedTranscodeLatency: number;
+        /** Total number of segments */
+        segmentCount: number;
+    };
+    /** Optional timescale for the media timeline */
+    timescale?: number;
+    /** Optional start number for segments */
+    startNumber?: number;
+    /** Optional minimum buffer time in milliseconds */
+    minBufferTime?: number;
+    /** Optional suggested presentation delay in milliseconds */
+    suggestedPresentationDelay?: number;
+}
+/**
+ * Cache statistics interface
+ */
+export interface CacheStats {
+    size: number;
+    maxSize: number;
+    hitRate: number;
+    efficiency: number;
+    totalRequests: number;
+    recentKeys: string[];
+}
+export interface AudioRendition {
+    id?: RenditionId;
+    trackId: number | undefined;
+    src: string;
+    segmentDurationMs?: number;
+}
+export interface VideoRendition {
+    id?: RenditionId;
+    trackId: number | undefined;
+    src: string;
+    segmentDurationMs?: number;
+    startTimeOffsetMs?: number;
+}
+export interface MediaEngine {
+    durationMs: number;
+    src: string;
+    audioRendition?: AudioRendition;
+    videoRendition?: VideoRendition;
+    templates: {
+        initSegment: string;
+        mediaSegment: string;
+    };
+    fetchInitSegment: (rendition: {
+        id?: RenditionId;
+        trackId: number | undefined;
+        src: string;
+    }, signal: AbortSignal) => Promise<ArrayBuffer>;
+    fetchMediaSegment: (segmentId: number, rendition: {
+        id?: RenditionId;
+        trackId: number | undefined;
+        src: string;
+    }, signal?: AbortSignal) => Promise<ArrayBuffer>;
+    computeSegmentId: (desiredSeekTimeMs: number, rendition: {
+        id?: RenditionId;
+        trackId: number | undefined;
+        src: string;
+        segmentDurationMs?: number;
+    }) => number | undefined;
+    /**
+     * Get the video rendition, or throws if no video rendition is available
+     */
+    getVideoRendition: () => VideoRendition;
+    /**
+     * Get the audio rendition, or throws if no audio rendition is available
+     */
+    getAudioRendition: () => AudioRendition;
+    /**
+     * Calculate audio segments needed for a time range
+     * Each media engine implements this based on their segment structure
+     */
+    calculateAudioSegmentRange: (fromMs: number, toMs: number, rendition: AudioRendition, durationMs: number) => SegmentTimeRange[];
+}
+interface InitSegmentPath {
+    path: string;
+    pos: number;
+    size: number;
+}
+export interface InitSegmentPaths {
+    audio?: InitSegmentPath;
+    video?: InitSegmentPath;
+}
+export interface AudioSpan {
+    startMs: number;
+    endMs: number;
+    blob: Blob;
+}
+export interface SegmentTimeRange {
+    segmentId: number;
+    startMs: number;
+    endMs: number;
+}
+export {};

package/dist/transcoding/utils/MediaUtils.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Media type detection utilities
+ */
+export declare function isAudioUrl(url: string): boolean;
+export declare function isVideoUrl(url: string): boolean;
+/**
+ * Check if URL is eligible for JIT transcoding
+ */
+export declare function isJitTranscodeEligible(url: string): boolean;

package/dist/transcoding/utils/UrlGenerator.d.ts

@@ -0,0 +1,26 @@
+import { RenditionId } from '../types/index.js';
+import { MediaEngine } from '../types/index.ts';
+export declare class UrlGenerator {
+    private baseUrl;
+    constructor(baseUrl: () => string);
+    /**
+     * Generate video segment URL
+     */
+    generateSegmentUrl(segmentId: "init" | number, renditionId: RenditionId, metadata: MediaEngine): string;
+    /**
+     * Generate init segment URL
+     */
+    generateInitSegmentUrl(mediaUrl: string, rendition: string): string;
+    /**
+     * Generate manifest URL
+     */
+    generateManifestUrl(mediaUrl: string): string;
+    /**
+     * Generate track fragment index URL
+     */
+    generateTrackFragmentIndexUrl(mediaUrl: string): string;
+    /**
+     * Generate quality presets URL
+     */
+    generatePresetsUrl(): string;
+}

package/dist/transcoding/utils/UrlGenerator.js

@@ -0,0 +1,45 @@
+var UrlGenerator = class {
+	constructor(baseUrl) {
+		this.baseUrl = baseUrl;
+	}
+	/**
+	* Generate video segment URL
+	*/
+	generateSegmentUrl(segmentId, renditionId, metadata) {
+		const audioRendition = metadata.audioRendition;
+		const videoRendition = metadata.videoRendition;
+		const rendition = audioRendition ?? videoRendition;
+		if (!rendition) {
+			console.error("Rendition not found", metadata);
+			throw new Error(`Rendition ${renditionId} not found`);
+		}
+		const template = segmentId === "init" ? metadata.templates.initSegment : metadata.templates.mediaSegment;
+		return template.replace("{rendition}", renditionId).replace("{segmentId}", segmentId.toString()).replace("{src}", metadata.src).replace("{trackId}", rendition.trackId?.toString() ?? "");
+	}
+	/**
+	* Generate init segment URL
+	*/
+	generateInitSegmentUrl(mediaUrl, rendition) {
+		return `${this.baseUrl()}/api/v1/transcode/${rendition}/init.m4s?url=${encodeURIComponent(mediaUrl)}`;
+	}
+	/**
+	* Generate manifest URL
+	*/
+	generateManifestUrl(mediaUrl) {
+		return `${this.baseUrl()}/api/v1/transcode/manifest.json?url=${encodeURIComponent(mediaUrl)}`;
+	}
+	/**
+	* Generate track fragment index URL
+	*/
+	generateTrackFragmentIndexUrl(mediaUrl) {
+		const normalizedSrc = mediaUrl.startsWith("/") ? mediaUrl.slice(1) : mediaUrl;
+		return `/@ef-track-fragment-index/${normalizedSrc}`;
+	}
+	/**
+	* Generate quality presets URL
+	*/
+	generatePresetsUrl() {
+		return `${this.baseUrl()}/api/v1/transcode/presets`;
+	}
+};
+export { UrlGenerator };

package/dist/transcoding/utils/constants.d.ts

@@ -0,0 +1,27 @@
+import { QualityPresets } from '../types/index.js';
+/**
+ * Segment duration constants (in milliseconds)
+ */
+export declare const SEGMENT_DURATION_VIDEO_MS = 2000;
+export declare const SEGMENT_DURATION_AUDIO_MS = 15000;
+export declare const SEGMENT_DURATION_SCRUB_MS = 30000;
+/**
+ * Default cache sizes for different media types
+ */
+export declare const DEFAULT_CACHE_SIZE_VIDEO = 50;
+export declare const DEFAULT_CACHE_SIZE_AUDIO = 20;
+/**
+ * Default prefetch settings
+ */
+export declare const DEFAULT_PREFETCH_SEGMENTS_VIDEO = 3;
+export declare const DEFAULT_PREFETCH_SEGMENTS_AUDIO = 2;
+/**
+ * Retry configuration
+ */
+export declare const RETRY_MAX_ATTEMPTS = 3;
+export declare const RETRY_BASE_DELAY_MS = 500;
+/**
+ * Default service configuration
+ */
+export declare const DEFAULT_BASE_URL = "http://localhost:3000";
+export declare const DEFAULT_QUALITY: keyof QualityPresets;

package/dist/utils/LRUCache.d.ts

@@ -0,0 +1,34 @@
+/**
+ * A simple LRU (Least Recently Used) cache implementation
+ */
+export declare class LRUCache<K, V> {
+    private cache;
+    private readonly maxSize;
+    constructor(maxSize: number);
+    get(key: K): V | undefined;
+    set(key: K, value: V): void;
+    has(key: K): boolean;
+    delete(key: K): boolean;
+    clear(): void;
+    get size(): number;
+}
+/**
+ * Size-aware LRU cache that tracks memory usage in bytes
+ * Evicts entries when total size exceeds the maximum
+ */
+export declare class SizeAwareLRUCache<K> {
+    private cache;
+    private sizes;
+    private currentSize;
+    private readonly maxSizeBytes;
+    constructor(maxSizeBytes: number);
+    get(key: K): Promise<ArrayBuffer> | undefined;
+    set(key: K, value: Promise<ArrayBuffer>): void;
+    private evictIfNecessary;
+    has(key: K): boolean;
+    delete(key: K): boolean;
+    clear(): void;
+    get size(): number;
+    get currentSizeBytes(): number;
+    get maxSize(): number;
+}

package/dist/utils/LRUCache.js

@@ -0,0 +1,115 @@
+/**
+* A simple LRU (Least Recently Used) cache implementation
+*/
+var LRUCache = class {
+	constructor(maxSize) {
+		this.cache = /* @__PURE__ */ new Map();
+		this.maxSize = maxSize;
+	}
+	get(key) {
+		const value = this.cache.get(key);
+		if (value) {
+			this.cache.delete(key);
+			this.cache.set(key, value);
+		}
+		return value;
+	}
+	set(key, value) {
+		if (this.cache.has(key)) this.cache.delete(key);
+		else if (this.cache.size >= this.maxSize) {
+			const firstKey = this.cache.keys().next().value;
+			if (firstKey) this.cache.delete(firstKey);
+		}
+		this.cache.set(key, value);
+	}
+	has(key) {
+		return this.cache.has(key);
+	}
+	delete(key) {
+		return this.cache.delete(key);
+	}
+	clear() {
+		this.cache.clear();
+	}
+	get size() {
+		return this.cache.size;
+	}
+};
+/**
+* Size-aware LRU cache that tracks memory usage in bytes
+* Evicts entries when total size exceeds the maximum
+*/
+var SizeAwareLRUCache = class {
+	constructor(maxSizeBytes) {
+		this.cache = /* @__PURE__ */ new Map();
+		this.sizes = /* @__PURE__ */ new Map();
+		this.currentSize = 0;
+		this.maxSizeBytes = maxSizeBytes;
+	}
+	get(key) {
+		const value = this.cache.get(key);
+		if (value) {
+			const size = this.sizes.get(key) || 0;
+			this.cache.delete(key);
+			this.cache.set(key, value);
+			this.sizes.delete(key);
+			this.sizes.set(key, size);
+		}
+		return value;
+	}
+	set(key, value) {
+		if (this.cache.has(key)) {
+			const oldSize = this.sizes.get(key) || 0;
+			this.currentSize -= oldSize;
+			this.cache.delete(key);
+			this.sizes.delete(key);
+		}
+		const sizeTrackingPromise = value.then((buffer) => {
+			const bufferSize = buffer.byteLength;
+			this.sizes.set(key, bufferSize);
+			this.currentSize += bufferSize;
+			this.evictIfNecessary();
+			return buffer;
+		}).catch((error) => {
+			this.cache.delete(key);
+			this.sizes.delete(key);
+			throw error;
+		});
+		this.cache.set(key, sizeTrackingPromise);
+	}
+	evictIfNecessary() {
+		while (this.currentSize > this.maxSizeBytes && this.cache.size > 0) {
+			const firstKey = this.cache.keys().next().value;
+			if (firstKey) {
+				const size = this.sizes.get(firstKey) || 0;
+				this.currentSize -= size;
+				this.cache.delete(firstKey);
+				this.sizes.delete(firstKey);
+			} else break;
+		}
+	}
+	has(key) {
+		return this.cache.has(key);
+	}
+	delete(key) {
+		const size = this.sizes.get(key) || 0;
+		this.currentSize -= size;
+		this.sizes.delete(key);
+		return this.cache.delete(key);
+	}
+	clear() {
+		this.cache.clear();
+		this.sizes.clear();
+		this.currentSize = 0;
+	}
+	get size() {
+		return this.cache.size;
+	}
+	get currentSizeBytes() {
+		return this.currentSize;
+	}
+	get maxSize() {
+		return this.maxSizeBytes;
+	}
+};
+export { LRUCache, SizeAwareLRUCache };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@editframe/elements",
-  "version": "0.16.8-beta.0",
+  "version": "0.18.3-beta.0",
   "description": "",
   "exports": {
     ".": {
@@ -27,12 +27,13 @@
   "license": "UNLICENSED",
   "dependencies": {
     "@bramus/style-observer": "^1.3.0",
-    "@editframe/assets": "0.16.8-beta.0",
+    "@editframe/assets": "0.18.3-beta.0",
     "@lit/context": "^1.1.2",
     "@lit/task": "^1.0.1",
     "d3": "^7.9.0",
     "debug": "^4.3.5",
     "lit": "^3.1.4",
+    "mediabunny": "^1.1.1",
     "mp4box": "^0.5.2",
     "zod": "^3.24.1"
   },
@@ -43,7 +44,7 @@
     "autoprefixer": "^10.4.19",
     "rollup-plugin-tsconfig-paths": "^1.5.2",
     "typescript": "^5.5.4",
-    "vite-plugin-dts": "^4.0.3",
+    "vite-plugin-dts": "^4.5.4",
     "vite-tsconfig-paths": "^4.3.2"
   }
 }