unified-video-framework 1.4.244 → 1.4.245

package/packages/web/src/WebPlayer.ts

@@ -1176,14 +1176,15 @@ export class WebPlayer extends BasePlayer {
       height: '100%',
       playerVars: {
         controls: 0,        // Hide YouTube controls
-        disablekb: 1,      // Disable keyboard controls
+        disablekb: 0,      // Allow keyboard controls
         fs: 0,             // Hide fullscreen button
         iv_load_policy: 3, // Hide annotations
         modestbranding: 1, // Minimal YouTube branding
         rel: 0,            // Don't show related videos
         showinfo: 0,       // Hide video info
         autoplay: this.config.autoPlay ? 1 : 0,
-        mute: this.config.muted ? 1 : 0
+        mute: this.config.muted ? 1 : 0,
+        widget_referrer: window.location.href // Hide YouTube recommendations
       },
       events: {
         onReady: () => this.onYouTubePlayerReady(),
@@ -6222,6 +6223,28 @@ export class WebPlayer extends BasePlayer {
         }
       }
       
+      /* Hide YouTube UI elements */
+      iframe[src*="youtube.com"] {
+        pointer-events: auto !important;
+      }
+      
+      /* Hide YouTube title, logo, and controls overlay */
+      .ytp-chrome-top, 
+      .ytp-chrome-bottom,
+      .ytp-watermark,
+      .ytp-gradient-top,
+      .ytp-gradient-bottom,
+      .ytp-show-cards-title,
+      .ytp-cards-teaser,
+      .ytp-endscreen-element,
+      .ytp-ce-element,
+      .ytp-suggested-action,
+      .ytp-pause-overlay {
+        display: none !important;
+        visibility: hidden !important;
+        opacity: 0 !important;
+      }
+      
       /* Ultra-wide screens */
       @media screen and (min-width: 1440px) {
         .uvf-video-title {
@@ -7345,45 +7368,61 @@ export class WebPlayer extends BasePlayer {
         case 'ArrowLeft':
           e.preventDefault();
           e.stopImmediatePropagation(); // Prevent duplicate handler triggers
-          if (this.video && !isNaN(this.video.duration)) {
-            this.seek(Math.max(0, this.video.currentTime - 10));
+          const currentTime = this.getCurrentTime();
+          const duration = this.getDuration();
+          if (!isNaN(duration) && duration > 0) {
+            this.seek(Math.max(0, currentTime - 10));
             shortcutText = '-10s';
           }
           break;
         case 'ArrowRight':
           e.preventDefault();
           e.stopImmediatePropagation(); // Prevent duplicate handler triggers
-          if (this.video && !isNaN(this.video.duration)) {
-            this.seek(Math.min(this.video.duration, this.video.currentTime + 10));
+          const currentTimeRight = this.getCurrentTime();
+          const durationRight = this.getDuration();
+          if (!isNaN(durationRight) && durationRight > 0) {
+            this.seek(Math.min(durationRight, currentTimeRight + 10));
             shortcutText = '+10s';
           }
           break;
         case 'ArrowUp':
           e.preventDefault();
           this.changeVolume(0.1);
-          if (this.isCasting && this.remotePlayer) {
-            shortcutText = `Volume ${Math.round(((this.remotePlayer.volumeLevel || 0) * 100))}%`;
+          let volumeUp = 0;
+          if (this.youtubePlayer && this.youtubePlayerReady) {
+            volumeUp = this.youtubePlayer.getVolume();
+          } else if (this.isCasting && this.remotePlayer) {
+            volumeUp = (this.remotePlayer.volumeLevel || 0) * 100;
           } else {
-            shortcutText = `Volume ${Math.round((this.video?.volume || 0) * 100)}%`;
+            volumeUp = (this.video?.volume || 0) * 100;
           }
+          shortcutText = `Volume ${Math.round(volumeUp)}%`;
           break;
         case 'ArrowDown':
           e.preventDefault();
           this.changeVolume(-0.1);
-          if (this.isCasting && this.remotePlayer) {
-            shortcutText = `Volume ${Math.round(((this.remotePlayer.volumeLevel || 0) * 100))}%`;
+          let volumeDown = 0;
+          if (this.youtubePlayer && this.youtubePlayerReady) {
+            volumeDown = this.youtubePlayer.getVolume();
+          } else if (this.isCasting && this.remotePlayer) {
+            volumeDown = (this.remotePlayer.volumeLevel || 0) * 100;
           } else {
-            shortcutText = `Volume ${Math.round((this.video?.volume || 0) * 100)}%`;
+            volumeDown = (this.video?.volume || 0) * 100;
           }
+          shortcutText = `Volume ${Math.round(volumeDown)}%`;
           break;
         case 'm':
           e.preventDefault();
           this.toggleMuteAction();
-          if (this.isCasting && this.remotePlayer) {
-            shortcutText = this.remotePlayer.isMuted ? 'Muted' : 'Unmuted';
+          let isMuted = false;
+          if (this.youtubePlayer && this.youtubePlayerReady) {
+            isMuted = this.youtubePlayer.isMuted();
+          } else if (this.isCasting && this.remotePlayer) {
+            isMuted = this.remotePlayer.isMuted;
           } else {
-            shortcutText = this.video?.muted ? 'Muted' : 'Unmuted';
+            isMuted = this.video?.muted || false;
           }
+          shortcutText = isMuted ? 'Muted' : 'Unmuted';
           break;
         case 'f':
           e.preventDefault();
@@ -7422,9 +7461,11 @@ export class WebPlayer extends BasePlayer {
         case '9':
           e.preventDefault();
           // Only jump to position if video is loaded and duration is valid
-          if (this.video && !isNaN(this.video.duration) && this.video.duration > 0) {
+          const durationForSeek = this.getDuration();
+          if (!isNaN(durationForSeek) && durationForSeek > 0) {
             const percent = parseInt(e.key) * 10;
-            this.video.currentTime = (this.video.duration * percent) / 100;
+            const seekTime = (durationForSeek * percent) / 100;
+            this.seek(seekTime);
             shortcutText = `${percent}%`;
           }
           break;