Merge branch 'release/2.38.10'

src/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 2,
   "name": "Ambient light for YouTube™",
   "description": "Immerse yourself in YouTube™ videos with ambient light!",
-  "version": "2.38.9",
+  "version": "2.38.10",
   "homepage_url": "https://github.com/WesselKroos/youtube-ambilight",
   "author": "Wessel Kroos",
   "icons": {

src/scripts/libs/ambientlight.js

@@ -659,6 +659,25 @@ Video ready state: ${readyStateToString(videoElem?.readyState)}`)
     }
   }
 
+  // Removes "yt:crop=16:9" & "yt-stretch=16:9" from the videoData.keywords array
+  // to prevent the video element from being scaled by YouTube in theater view
+  ytScalingBaseKeywords = ['yt:crop=', 'yt:stretch=']
+  updateKeywordsToPreventTheaterScaling = () => {
+    try {
+      let keywords = document.head.querySelector('meta[name="keywords"]')?.content ?? '';
+      if(!this.ytScalingBaseKeywords.some(baseKeyword => keywords.includes(baseKeyword))) return
+
+      keywords = keywords.split(', ')
+      if(this.settings.enabled) {
+        keywords = keywords.filter(keyword => !this.ytScalingBaseKeywords.some(baseKeyword => keyword.startsWith(baseKeyword)))
+      }
+      keywords = keywords.join(',')
+      this.videoPlayerElem.updateVideoData({ keywords })
+    } catch(ex) {
+      SentryReporter.captureException(ex)
+    }
+  }
+
   updateVideoPlayerSize = () => {
     try {
       this.videoPlayerElem.setSize()
@@ -959,7 +978,7 @@ Video ready state: ${readyStateToString(videoElem?.readyState)}`)
       if (
         inputs.indexOf(tag) !== -1 || 
         (
-          el.getAttribute('contenteditable') !== null && 
+          el.getAttribute('contenteditable') != null && 
           el.getAttribute('contenteditable') !== 'false'
         )
       ) {
@@ -1382,7 +1401,7 @@ Video ready state: ${readyStateToString(videoElem?.readyState)}`)
       return VIEW_POPUP
 
     if(this.ytdWatchElemFromVideo
-      ? this.ytdWatchElemFromVideo.getAttribute('theater') !== null
+      ? this.ytdWatchElemFromVideo.getAttribute('theater') != null
       : this.playerTheaterContainerElemFromVideo
     ) {
       return VIEW_THEATER
@@ -2882,14 +2901,16 @@ Video ready state: ${readyStateToString(videoElem?.readyState)}`)
     if(this.pendingStart) return
     this.settings.set('enabled', false, true)
 
+    this.updateKeywordsToPreventTheaterScaling()
+
     await this.hide()
   }
 
   start = async (initial = false) => {
     if (!this.isOnVideoPage || !this.settings.enabled || this.pendingStart) return
 
     try {
-      const isHdr = this.videoPlayerElem.getVideoData().isHdr
+      const isHdr = this.videoPlayerElem.getVideoData()?.isHdr
       if(this.settings.webGL && this.isHdr !== isHdr) {
         this.isHdr = isHdr
         if(isHdr) {
@@ -2901,7 +2922,7 @@ Video ready state: ${readyStateToString(videoElem?.readyState)}`)
         this.sizesChanged = true
       }
     } catch(ex) {
-      console.warn('Failed to execute HDR video check')
+      SentryReporter.captureException(ex)
     }
 
     this.showedCompareWarning = false
@@ -2912,6 +2933,7 @@ Video ready state: ${readyStateToString(videoElem?.readyState)}`)
 
     this.checkGetImageDataAllowed()
     this.resetSettingsIfNeeded()
+    this.updateKeywordsToPreventTheaterScaling()
     this.updateView()
 
     this.pendingStart = true

src/scripts/libs/bar-detection.js

@@ -121,7 +121,7 @@ const workerCode = function () {
         const brightnessDeviation = Math.abs(data[i] + data[i+1] + data[i+2] - (color[0] + color[1] + color[2]))
         if(
           // Above the top limit
-          i < middleIndex &&
+          i < middleIndex - channels &&
           // Within the color and brightness deviation
           (colorDeviation <= maxColorDeviation || brightnessDeviation <= maxBrightnessDeviation) && 
           colorDeviation + brightnessDeviation <= maxColorAndBrightnessDeviationSum
@@ -144,9 +144,9 @@ const workerCode = function () {
 
       step = largeStep
       // From the bottom up
-      for (let i = (data.length - 1 - (channels * ignoreEdge)); i >= 0; i -= (channels * step)) {
-        const colorDeviation = Math.abs(data[i-3] - color[0]) + Math.abs(data[i-2] - color[1]) + Math.abs(data[i-1] - color[2])
-        const brightnessDeviation = Math.abs(data[i-3] + data[i-2] + data[i-1] - (color[0] + color[1] + color[2]))
+      for (let i = (data.length - channels * (1 + ignoreEdge)); i >= 0; i -= (channels * step)) {
+        const colorDeviation = Math.abs(data[i] - color[0]) + Math.abs(data[i+1] - color[1]) + Math.abs(data[i+2] - color[2])
+        const brightnessDeviation = Math.abs(data[i] + data[i+1] + data[i+2] - (color[0] + color[1] + color[2]))
         // (Math.abs(data[i-3] - color[0]) + Math.abs(data[i-2] - color[1]) + Math.abs(data[i-1] - color[2])) <= maxColorDeviation
         if(
           // Below the bottom limit
@@ -158,16 +158,16 @@ const workerCode = function () {
         ) continue;
 
         // Change the step from large to 1 pixel
-        if(i !== data.length - 1 && step === largeStep) {
-          i = Math.min((data.length - 1 + channels) , i + (channels * step))
+        if(i !== data.length - channels && step === largeStep) {
+          i = Math.min((data.length - channels), i + (channels * step))
           step = Math.ceil(1, Math.floor(step / 2))
           continue
         }
 
         // Found the first video pixel, add to bottomEdges
         bottomEdges.push({
           xIndex,
-          yIndex: ((data.length - 1) - i) / channels
+          yIndex: (data.length - i) / channels
         })
         break;
       }
@@ -505,6 +505,7 @@ export default class BarDetection {
     }
 
     this.run = null
+    this.continueAfterRun = false
     this.history = {
       horizontal: [],
       vertical: []
@@ -521,6 +522,7 @@ export default class BarDetection {
     }
 
     this.run = null
+    this.continueAfterRun = false
     this.history = {
       horizontal: [],
       vertical: []

src/scripts/libs/generic.js

@@ -305,7 +305,7 @@ export const supportsColorMix = () => {
 }
 
 export const isWatchPageUrl = () => (
-  location.pathname === '/watch' || 
+  ['/watch','/live/'].some(path => location.pathname.startsWith(path)) || 
   isEmbedPageUrl()
 )
 

src/scripts/libs/settings-config.js

@@ -352,16 +352,15 @@ const SettingsConfig = [
     label: 'Video artifacts workaround',
     description: 'This workaround must be disabled for \nNVidia RTX Virtual Super Resolution (VSR)',
     questionMark: {
-      title: `This workaround is enabled by default, 
-because videos in hardware accelerated overlays (MPO)
-can introduce several artifacts/bugs for some users.
+      title: `This workaround can fix several artifacts/bugs,
+when videos are in hardware accelerated overlays (MPO).
 Examples are: random black/white squares, flickering or a squeezed video.
 
 Click on the questionmark for more and updated information about these artifacts/bugs.`,
       href: 'https://github.com/WesselKroos/youtube-ambilight/blob/master/TROUBLESHOOT.md#3-nvidia-rtx-video-super-resolution-vsr--nvidia-rtx-video-hdr-does-not-work'
     },
     type: 'checkbox',
-    default: true,
+    default: false,
     advanced: true
   },
   {