From 1937687d03af3307efce72f696367fa62490381f Mon Sep 17 00:00:00 2001
From: Brion Vibber <brion@pobox.com>
Date: Fri, 14 Apr 2023 14:34:48 -0700
Subject: [PATCH] wip

---
 fmp4-alt.html     | 72 ++++++++++++++++++-----------------------------
 fmp4-tracks.html  |  5 ++++
 meta-playlist.php |  2 ++
 3 files changed, 34 insertions(+), 45 deletions(-)

diff --git a/fmp4-alt.html b/fmp4-alt.html
index 1afe733..381c4a8 100644
--- a/fmp4-alt.html
+++ b/fmp4-alt.html
@@ -15,64 +15,29 @@
             <li><a href="fmp4-tracks.html">see component track list</a></li>
         </ul>
 
-        <h3>With fallbacks</h3>
+        <h3>Native HLS</h3>
 
-        <p>HLS with VP9 (.mp4)/MJPEG (.mov) video tracks and Opus/MP3 audio tracks. Video.js enabled to provide HLS-over-MSE for Chrome/Firefox/desktop Safari.</p>
+        <p>HLS with VP9 in mp4, JPEG in mp4, and Opus and AAC in mp4</p>
         <div>
             <video controls width=640 height=360>
-                <source type=application/vnd.apple.mpegurl src=fmp4.vp9-mjpeg.mov.m3u8>
+                <source type=application/vnd.apple.mpegurl src=fmp4.vp9-mjpeg.m3u8>
             </video>
         </div>
 
+        <h3>Overridden HLS</h3>
 
-        <p>Current behavior:</p>
-        <p>Browsers that play the VP9 track will get sharp video, those that play the MJPEG track will get blurry video. Audio should sound the same either way.</p>
-        <ul>
-            <li>MSE-based streaming with VHS
-                <ul>
-                    <li>Firefox seems to work with VP9 & Opus tracks via video.js</li>
-                    <li>Chrome works (needed to fix an output setting)</li>
-                    <li>Safari uses the MP3 audio tracks and VHS gets confused because it tries to parse them as MP4 (not Safari's fault)</li>
-                </ul>
-            </li>
-            <li>Apple HLS player
-                <ul>
-                    <li>macOS 13's Safari 16 plays MJPEG on most of my test machines, though macOS 12 ~2015 systems with Intel graphics require lying about the type.</li>
-                    <li>iOS 16 plays VP9 if supported, or MJPEG if no hardware codec</li>
-                    <li>Those last two will also play h.263 or MPEG-4 visual <a href="fmp4-lies.html">IF labeled as if h.264 in the playlist</a>; MJPEG can be properly labeled as "jpeg". I haven't found a supported labeling that is correct yet.</li>
-                    <li><i>no access to iOS 13-15</i></li>
-                    <li>iOS 13 doesn't seem to like mjpeg in .mp4, but .mov is fine</li>
-                    <li>iOS 12 doesn't seem to like any version on an old iPad Air, except with h264 video</li>
-                    <li><i>no access to iOS 11</i></li>
-                    <li>iOS 10 on iPhone 5C plays h.263, or mpeg-4 visual IF labeled as false avc1.blah. It will also play mjpeg if so mislabeled, but only in .mov not in .mp4 as above.</li>
-                    <li>iOS 9 doesn't understand the required version of HLS playlist format, and fails.</li>
-                </ul>
-            </li>
-        </ul>
+        <p>HLS with VP8 in mp4, JPEG in mp4, and Opus and AAC in mp4</p>
+        <div>
+            <video class=override controls width=640 height=360>
+                <source type=application/vnd.apple.mpegurl src=fmp4.vp9-mjpeg.m3u8>
+            </video>
+        </div>
 
-        <!--<script src="node_modules/video.js/dist/video.js"></script>-->
 
         <script src="video.js/dist/alt/video.core.js"></script>
         <script src="http-streaming/dist/videojs-http-streaming.js"></script>
 
         <script type="text/javascript">
-            let playerConfig = {
-                responsive: true,
-                controlBar: {
-                    volumePanel: {
-                        vertical: true,
-                        inline: false
-                    }
-                },
-                html5: {
-                    vhs: {
-                        // Currently the MP3 audio track fails in Safari
-                        // and it doesn't grok the Opus
-                        // Either fix MP3 handling in vhs or use AAC.
-                        overrideNative: true
-                    }
-                },
-            };
             videojs.log.level('debug');
             
             console.log(typeof MediaSource)
@@ -83,6 +48,23 @@
                 //if (vp9 && (opus || mp3)) {
 
                 for (let video of document.querySelectorAll('video')) {
+                    let playerConfig = {
+                        responsive: true,
+                        controlBar: {
+                            volumePanel: {
+                                vertical: true,
+                                inline: false
+                            }
+                        },
+                        html5: {
+                            vhs: {
+                                // Currently the MP3 audio track fails in Safari
+                                // and it doesn't grok the Opus
+                                // Either fix MP3 handling in vhs or use AAC.
+                                overrideNative: video.classList.contains('override')
+                            }
+                        },
+                    };
                     video.classList.add('video-js');
                     video.classList.add('vjs-default-skin');
                     videojs(video, playerConfig);
diff --git a/fmp4-tracks.html b/fmp4-tracks.html
index e33a945..d212baa 100644
--- a/fmp4-tracks.html
+++ b/fmp4-tracks.html
@@ -18,6 +18,11 @@
             <source type=application/vnd.apple.mpegurl src=fmp4.480p.vp9.mp4.m3u8>
         </video>
 
+        <p>VP8 .mp4:</p>
+        <video controls width=640 height=360>
+            <source type=application/vnd.apple.mpegurl src=fmp4.480p.vp8.mp4.m3u8>
+        </video>
+
         <p>MJPEG .mp4:</p>
         <video controls width=640 height=360>
             <source type=application/vnd.apple.mpegurl src=fmp4.120p.mjpeg.mp4.m3u8>
diff --git a/meta-playlist.php b/meta-playlist.php
index db3ed43..25f00c0 100644
--- a/meta-playlist.php
+++ b/meta-playlist.php
@@ -26,6 +26,7 @@ $audioCodecs = [
 // @fixme use correct settings based on the file
 $videoCodecs = [
     'vp9'  => 'vp09.00.41.08',
+    'vp8'  => 'vp08.0.0.08',
     'h264' => 'avc1.42e00a',
 
     // truths
@@ -41,6 +42,7 @@ if ( $lie ) {
     $videoCodecs['mjpeg'] = $lie;
     $videoCodecs['h263' ] = $lie;
     $videoCodecs['mpeg4'] = $lie;
+    $videoCodecs['vp8'] = $lie;
 }