1 files changed, 35 insertions, 0 deletions
diff --git a/app/src/main/java/org/terst/feedreader/ui/YouTubeLinks.kt b/app/src/main/java/org/terst/feedreader/ui/YouTubeLinks.kt
index 00624a1..a971615 100644
--- a/app/src/main/java/org/terst/feedreader/ui/YouTubeLinks.kt
+++ b/app/src/main/java/org/terst/feedreader/ui/YouTubeLinks.kt
@@ -97,6 +97,41 @@ fun youTubeEmbedUrl(videoId: String): String =
     "https://www.youtube-nocookie.com/embed/${scrub(videoId)}?autoplay=1&playsinline=1&rel=0"
 
 /**
+ * A script that gives YouTube's player a height, run once the embed has loaded.
+ *
+ * **Why a WebView needs this and a browser does not.** YouTube's embed lays itself out with
+ * `body { position: absolute; height: 100% }`, which resolves against the initial containing
+ * block -- and in this WebView that block has zero height. Measured in the running app:
+ * `window.innerHeight` correctly reports 214, while `100vh` and every percentage height resolve
+ * to 0. So the body collapsed, the player chain under it collapsed, and the video element was
+ * laid out 380x0.
+ *
+ * That is why the symptom was a *blank rectangle with working audio and working controls*: the
+ * page, the chrome and the stream were all fine, and the picture had nowhere to go. What showed
+ * through the zero-height player was YouTube's own white `<html>` background.
+ *
+ * The script pins the chain to the pixel height the page does know, and dispatches a resize so
+ * the player's own code re-measures. Confirmed on a device: the video element goes from 380x0 to
+ * 380x214 and the picture appears.
+ *
+ * This treats the symptom rather than whatever makes the viewport zero-height in the first
+ * place, which is below this app in the WebView itself. `!important` is deliberate -- YouTube's
+ * own styles would otherwise win it back on the next layout.
+ */
+const val YOUTUBE_FIT_PLAYER_JS: String =
+    """(function () {
+      var h = window.innerHeight;
+      if (!h) { return; }
+      var css = document.createElement('style');
+      css.textContent =
+        'html,body{height:' + h + 'px !important;min-height:' + h + 'px !important}' +
+        '#player,#movie_player,.html5-video-player,.html5-video-container{height:' + h + 'px !important}' +
+        'video{height:' + h + 'px !important}';
+      document.head.appendChild(css);
+      window.dispatchEvent(new Event('resize'));
+    })();"""
+
+/**
  * The id with anything outside YouTube's own alphabet removed.
  *
  * The ids reaching here are already matched against `[a-zA-Z0-9_-]{11}` upstream, so this