vidply 1.0.5 → 1.0.6

package/dist/vidply.min.meta.json

@@ -1,22 +1,22 @@
 {
   "inputs": {
     "src/utils/EventEmitter.js": {
-      "bytes": 949,
+      "bytes": 1002,
       "imports": [],
       "format": "esm"
     },
     "src/utils/DOMUtils.js": {
-      "bytes": 3730,
+      "bytes": 3884,
       "imports": [],
       "format": "esm"
     },
     "src/i18n/translations.js": {
-      "bytes": 16450,
+      "bytes": 17011,
       "imports": [],
       "format": "esm"
     },
     "src/i18n/i18n.js": {
-      "bytes": 1573,
+      "bytes": 1639,
       "imports": [
         {
           "path": "src/i18n/translations.js",
@@ -27,7 +27,7 @@
       "format": "esm"
     },
     "src/utils/TimeUtils.js": {
-      "bytes": 2155,
+      "bytes": 2242,
       "imports": [
         {
           "path": "src/i18n/i18n.js",
@@ -38,7 +38,7 @@
       "format": "esm"
     },
     "src/icons/Icons.js": {
-      "bytes": 12356,
+      "bytes": 12539,
       "imports": [],
       "format": "esm"
     },
@@ -69,7 +69,7 @@
       "format": "esm"
     },
     "src/controls/CaptionManager.js": {
-      "bytes": 7219,
+      "bytes": 7467,
       "imports": [
         {
           "path": "src/utils/DOMUtils.js",
@@ -85,12 +85,12 @@
       "format": "esm"
     },
     "src/controls/KeyboardManager.js": {
-      "bytes": 6553,
+      "bytes": 6786,
       "imports": [],
       "format": "esm"
     },
     "src/controls/TranscriptManager.js": {
-      "bytes": 23405,
+      "bytes": 24133,
       "imports": [
         {
           "path": "src/utils/DOMUtils.js",
@@ -116,22 +116,22 @@
       "format": "esm"
     },
     "src/renderers/HTML5Renderer.js": {
-      "bytes": 8362,
+      "bytes": 8660,
       "imports": [],
       "format": "esm"
     },
     "src/renderers/YouTubeRenderer.js": {
-      "bytes": 6912,
+      "bytes": 7186,
       "imports": [],
       "format": "esm"
     },
     "src/renderers/VimeoRenderer.js": {
-      "bytes": 6442,
+      "bytes": 6699,
       "imports": [],
       "format": "esm"
     },
     "src/renderers/HLSRenderer.js": {
-      "bytes": 8455,
+      "bytes": 8757,
       "imports": [
         {
           "path": "src/renderers/HTML5Renderer.js",
@@ -142,7 +142,7 @@
       "format": "esm"
     },
     "src/core/Player.js": {
-      "bytes": 35845,
+      "bytes": 39618,
       "imports": [
         {
           "path": "src/utils/EventEmitter.js",
@@ -224,7 +224,7 @@
       "format": "esm"
     },
     "src/index.js": {
-      "bytes": 2706,
+      "bytes": 2801,
       "imports": [
         {
           "path": "src/core/Player.js",
@@ -283,7 +283,7 @@
           "bytesInOutput": 12461
         },
         "src/core/Player.js": {
-          "bytesInOutput": 16746
+          "bytesInOutput": 18100
         },
         "src/renderers/YouTubeRenderer.js": {
           "bytesInOutput": 4140
@@ -298,7 +298,7 @@
           "bytesInOutput": 8100
         }
       },
-      "bytes": 128795
+      "bytes": 130149
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vidply",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "Universal, accessible video & audio player with ES6 modules",
   "type": "module",
   "main": "dist/vidply.js",
@@ -50,7 +50,7 @@
     "access": "public"
   },
   "devDependencies": {
-    "esbuild": "^0.25.10",
+    "esbuild": "^0.25.11",
     "clean-css": "^5.3.3"
   },
   "dependencies": {}

package/src/controls/CaptionManager.js

@@ -1,248 +1,248 @@
-/**
- * Caption/Subtitle Manager
- */
-
-import {DOMUtils} from '../utils/DOMUtils.js';
-import {i18n} from '../i18n/i18n.js';
-
-export class CaptionManager {
-    constructor(player) {
-        this.player = player;
-        this.element = null;
-        this.tracks = [];
-        this.currentTrack = null;
-        this.currentCue = null;
-
-        this.init();
-    }
-
-    init() {
-        this.createElement();
-        this.loadTracks();
-        this.attachEvents();
-
-        if (this.player.options.captionsDefault && this.tracks.length > 0) {
-            this.enable();
-        }
-    }
-
-    createElement() {
-        this.element = DOMUtils.createElement('div', {
-            className: `${this.player.options.classPrefix}-captions`,
-            attributes: {
-                'aria-live': 'polite',
-                'aria-atomic': 'true',
-                'role': 'region',
-                'aria-label': i18n.t('player.captions')
-            }
-        });
-
-        // Apply caption styles
-        this.updateStyles();
-
-        // Append to videoWrapper if it exists, otherwise to container
-        const target = this.player.videoWrapper || this.player.container;
-        target.appendChild(this.element);
-    }
-
-    loadTracks() {
-        const textTracks = this.player.element.textTracks;
-
-        for (let i = 0; i < textTracks.length; i++) {
-            const track = textTracks[i];
-
-            if (track.kind === 'subtitles' || track.kind === 'captions') {
-                this.tracks.push({
-                    track: track,
-                    language: track.language,
-                    label: track.label,
-                    kind: track.kind,
-                    index: i
-                });
-
-                // Disable all tracks initially
-                track.mode = 'hidden';
-            }
-        }
-    }
-
-    attachEvents() {
-        this.player.on('timeupdate', () => {
-            this.updateCaptions();
-        });
-
-        this.player.on('captionschange', () => {
-            this.updateStyles();
-        });
-    }
-
-    enable(trackIndex = 0) {
-        if (this.tracks.length === 0) {
-            return;
-        }
-
-        // Disable current track
-        if (this.currentTrack) {
-            this.currentTrack.track.mode = 'hidden';
-        }
-
-        // Enable selected track
-        const selectedTrack = this.tracks[trackIndex];
-
-        if (selectedTrack) {
-            // Set to 'hidden' not 'showing' to prevent browser from displaying native captions
-            // We'll handle the display ourselves
-            selectedTrack.track.mode = 'hidden';
-            this.currentTrack = selectedTrack;
-            this.player.state.captionsEnabled = true;
-
-            // Remove any existing cuechange listener
-            if (this.cueChangeHandler) {
-                selectedTrack.track.removeEventListener('cuechange', this.cueChangeHandler);
-            }
-
-            // Add event listener for cue changes
-            this.cueChangeHandler = () => {
-                this.updateCaptions();
-            };
-            selectedTrack.track.addEventListener('cuechange', this.cueChangeHandler);
-
-            this.player.emit('captionsenabled', selectedTrack);
-        }
-    }
-
-    disable() {
-        if (this.currentTrack) {
-            this.currentTrack.track.mode = 'hidden';
-            this.currentTrack = null;
-        }
-
-        this.element.style.display = 'none';
-        this.element.innerHTML = '';
-        this.currentCue = null;
-        this.player.state.captionsEnabled = false;
-        this.player.emit('captionsdisabled');
-    }
-
-    updateCaptions() {
-        if (!this.currentTrack) {
-            return;
-        }
-
-        if (!this.currentTrack.track.activeCues) {
-            return;
-        }
-
-        const activeCues = this.currentTrack.track.activeCues;
-
-        if (activeCues.length > 0) {
-            const cue = activeCues[0];
-
-            // Only update if the cue has changed
-            if (this.currentCue !== cue) {
-                this.currentCue = cue;
-
-                // Parse and display cue text
-                let text = cue.text;
-
-                // Handle VTT formatting
-                text = this.parseVTTFormatting(text);
-
-                this.element.innerHTML = DOMUtils.sanitizeHTML(text);
-
-                // Make sure it's visible when there's content
-                this.element.style.display = 'block';
-
-                this.player.emit('captionchange', cue);
-            }
-        } else if (this.currentCue) {
-            // Clear caption
-            this.element.innerHTML = '';
-            this.element.style.display = 'none';
-            this.currentCue = null;
-        }
-    }
-
-    parseVTTFormatting(text) {
-        // Basic VTT tag support
-        text = text.replace(/<c[^>]*>(.*?)<\/c>/g, '<span class="caption-class">$1</span>');
-        text = text.replace(/<b>(.*?)<\/b>/g, '<strong>$1</strong>');
-        text = text.replace(/<i>(.*?)<\/i>/g, '<em>$1</em>');
-        text = text.replace(/<u>(.*?)<\/u>/g, '<u>$1</u>');
-
-        // Voice tags
-        text = text.replace(/<v\s+([^>]+)>(.*?)<\/v>/g, '<span class="caption-voice" data-voice="$1">$2</span>');
-
-        return text;
-    }
-
-    updateStyles() {
-        if (!this.element) return;
-
-        const options = this.player.options;
-
-        this.element.style.fontSize = options.captionsFontSize;
-        this.element.style.fontFamily = options.captionsFontFamily;
-        this.element.style.color = options.captionsColor;
-        this.element.style.backgroundColor = this.hexToRgba(
-            options.captionsBackgroundColor,
-            options.captionsOpacity
-        );
-    }
-
-    hexToRgba(hex, alpha) {
-        const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-        if (result) {
-            return `rgba(${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}, ${alpha})`;
-        }
-        return hex;
-    }
-
-    setCaptionStyle(property, value) {
-        switch (property) {
-            case 'fontSize':
-                this.player.options.captionsFontSize = value;
-                break;
-            case 'fontFamily':
-                this.player.options.captionsFontFamily = value;
-                break;
-            case 'color':
-                this.player.options.captionsColor = value;
-                break;
-            case 'backgroundColor':
-                this.player.options.captionsBackgroundColor = value;
-                break;
-            case 'opacity':
-                this.player.options.captionsOpacity = value;
-                break;
-        }
-
-        this.updateStyles();
-        this.player.emit('captionschange');
-    }
-
-    getAvailableTracks() {
-        return this.tracks.map((t, index) => ({
-            index,
-            language: t.language,
-            label: t.label || t.language,
-            kind: t.kind
-        }));
-    }
-
-    switchTrack(trackIndex) {
-        if (trackIndex >= 0 && trackIndex < this.tracks.length) {
-            this.disable();
-            this.enable(trackIndex);
-        }
-    }
-
-    destroy() {
-        this.disable();
-
-        if (this.element && this.element.parentNode) {
-            this.element.parentNode.removeChild(this.element);
-        }
-    }
-}
-
+/**
+ * Caption/Subtitle Manager
+ */
+
+import {DOMUtils} from '../utils/DOMUtils.js';
+import {i18n} from '../i18n/i18n.js';
+
+export class CaptionManager {
+    constructor(player) {
+        this.player = player;
+        this.element = null;
+        this.tracks = [];
+        this.currentTrack = null;
+        this.currentCue = null;
+
+        this.init();
+    }
+
+    init() {
+        this.createElement();
+        this.loadTracks();
+        this.attachEvents();
+
+        if (this.player.options.captionsDefault && this.tracks.length > 0) {
+            this.enable();
+        }
+    }
+
+    createElement() {
+        this.element = DOMUtils.createElement('div', {
+            className: `${this.player.options.classPrefix}-captions`,
+            attributes: {
+                'aria-live': 'polite',
+                'aria-atomic': 'true',
+                'role': 'region',
+                'aria-label': i18n.t('player.captions')
+            }
+        });
+
+        // Apply caption styles
+        this.updateStyles();
+
+        // Append to videoWrapper if it exists, otherwise to container
+        const target = this.player.videoWrapper || this.player.container;
+        target.appendChild(this.element);
+    }
+
+    loadTracks() {
+        const textTracks = this.player.element.textTracks;
+
+        for (let i = 0; i < textTracks.length; i++) {
+            const track = textTracks[i];
+
+            if (track.kind === 'subtitles' || track.kind === 'captions') {
+                this.tracks.push({
+                    track: track,
+                    language: track.language,
+                    label: track.label,
+                    kind: track.kind,
+                    index: i
+                });
+
+                // Disable all tracks initially
+                track.mode = 'hidden';
+            }
+        }
+    }
+
+    attachEvents() {
+        this.player.on('timeupdate', () => {
+            this.updateCaptions();
+        });
+
+        this.player.on('captionschange', () => {
+            this.updateStyles();
+        });
+    }
+
+    enable(trackIndex = 0) {
+        if (this.tracks.length === 0) {
+            return;
+        }
+
+        // Disable current track
+        if (this.currentTrack) {
+            this.currentTrack.track.mode = 'hidden';
+        }
+
+        // Enable selected track
+        const selectedTrack = this.tracks[trackIndex];
+
+        if (selectedTrack) {
+            // Set to 'hidden' not 'showing' to prevent browser from displaying native captions
+            // We'll handle the display ourselves
+            selectedTrack.track.mode = 'hidden';
+            this.currentTrack = selectedTrack;
+            this.player.state.captionsEnabled = true;
+
+            // Remove any existing cuechange listener
+            if (this.cueChangeHandler) {
+                selectedTrack.track.removeEventListener('cuechange', this.cueChangeHandler);
+            }
+
+            // Add event listener for cue changes
+            this.cueChangeHandler = () => {
+                this.updateCaptions();
+            };
+            selectedTrack.track.addEventListener('cuechange', this.cueChangeHandler);
+
+            this.player.emit('captionsenabled', selectedTrack);
+        }
+    }
+
+    disable() {
+        if (this.currentTrack) {
+            this.currentTrack.track.mode = 'hidden';
+            this.currentTrack = null;
+        }
+
+        this.element.style.display = 'none';
+        this.element.innerHTML = '';
+        this.currentCue = null;
+        this.player.state.captionsEnabled = false;
+        this.player.emit('captionsdisabled');
+    }
+
+    updateCaptions() {
+        if (!this.currentTrack) {
+            return;
+        }
+
+        if (!this.currentTrack.track.activeCues) {
+            return;
+        }
+
+        const activeCues = this.currentTrack.track.activeCues;
+
+        if (activeCues.length > 0) {
+            const cue = activeCues[0];
+
+            // Only update if the cue has changed
+            if (this.currentCue !== cue) {
+                this.currentCue = cue;
+
+                // Parse and display cue text
+                let text = cue.text;
+
+                // Handle VTT formatting
+                text = this.parseVTTFormatting(text);
+
+                this.element.innerHTML = DOMUtils.sanitizeHTML(text);
+
+                // Make sure it's visible when there's content
+                this.element.style.display = 'block';
+
+                this.player.emit('captionchange', cue);
+            }
+        } else if (this.currentCue) {
+            // Clear caption
+            this.element.innerHTML = '';
+            this.element.style.display = 'none';
+            this.currentCue = null;
+        }
+    }
+
+    parseVTTFormatting(text) {
+        // Basic VTT tag support
+        text = text.replace(/<c[^>]*>(.*?)<\/c>/g, '<span class="caption-class">$1</span>');
+        text = text.replace(/<b>(.*?)<\/b>/g, '<strong>$1</strong>');
+        text = text.replace(/<i>(.*?)<\/i>/g, '<em>$1</em>');
+        text = text.replace(/<u>(.*?)<\/u>/g, '<u>$1</u>');
+
+        // Voice tags
+        text = text.replace(/<v\s+([^>]+)>(.*?)<\/v>/g, '<span class="caption-voice" data-voice="$1">$2</span>');
+
+        return text;
+    }
+
+    updateStyles() {
+        if (!this.element) return;
+
+        const options = this.player.options;
+
+        this.element.style.fontSize = options.captionsFontSize;
+        this.element.style.fontFamily = options.captionsFontFamily;
+        this.element.style.color = options.captionsColor;
+        this.element.style.backgroundColor = this.hexToRgba(
+            options.captionsBackgroundColor,
+            options.captionsOpacity
+        );
+    }
+
+    hexToRgba(hex, alpha) {
+        const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+        if (result) {
+            return `rgba(${parseInt(result[1], 16)}, ${parseInt(result[2], 16)}, ${parseInt(result[3], 16)}, ${alpha})`;
+        }
+        return hex;
+    }
+
+    setCaptionStyle(property, value) {
+        switch (property) {
+            case 'fontSize':
+                this.player.options.captionsFontSize = value;
+                break;
+            case 'fontFamily':
+                this.player.options.captionsFontFamily = value;
+                break;
+            case 'color':
+                this.player.options.captionsColor = value;
+                break;
+            case 'backgroundColor':
+                this.player.options.captionsBackgroundColor = value;
+                break;
+            case 'opacity':
+                this.player.options.captionsOpacity = value;
+                break;
+        }
+
+        this.updateStyles();
+        this.player.emit('captionschange');
+    }
+
+    getAvailableTracks() {
+        return this.tracks.map((t, index) => ({
+            index,
+            language: t.language,
+            label: t.label || t.language,
+            kind: t.kind
+        }));
+    }
+
+    switchTrack(trackIndex) {
+        if (trackIndex >= 0 && trackIndex < this.tracks.length) {
+            this.disable();
+            this.enable(trackIndex);
+        }
+    }
+
+    destroy() {
+        this.disable();
+
+        if (this.element && this.element.parentNode) {
+            this.element.parentNode.removeChild(this.element);
+        }
+    }
+}
+