fix: delay shell reveal until video is ready

Author: kKaskak

src/ShellVideo/ShellVideo.js

@@ -95,6 +95,7 @@ function ShellVideo(options) {
     var stream = null;
 
     var avgDuration = 0;
+    var durationReady = false;
     var minClipDuration = 30;
 
     function setBackground(visible) {
@@ -110,6 +111,13 @@ function ShellVideo(options) {
             }
         }
     }
+    function updateLoaded() {
+        if (!props.loaded && durationReady && props['video-params'] && props['paused-for-cache'] === false) {
+            props.loaded = true;
+            setBackground(false);
+            onPropChanged('loaded');
+        }
+    }
     function logProp(args) {
         // eslint-disable-next-line no-console
         console.log(args.name+': '+args.data);
@@ -143,11 +151,8 @@ function ShellVideo(options) {
                 // for bitwise maths so the maximum supported video duration is 1073741823 (2 ^ 30 - 1)
                 // which is around 34 years of playback time.
                 avgDuration = avgDuration ? (avgDuration + intDuration) >> 1 : intDuration;
-                props.loaded = intDuration > 0;
-                if(props.loaded) {
-                    setBackground(false);
-                    onPropChanged('loaded');
-                }
+                durationReady = intDuration > 0;
+                updateLoaded();
                 break;
             }
             case 'time-pos': {
@@ -176,6 +181,10 @@ function ShellVideo(options) {
             case 'paused-for-cache':
             case 'seeking':
             {
+                if (args.name === 'paused-for-cache') {
+                    props[args.name] = args.data;
+                    updateLoaded();
+                }
                 if(props.buffering !== args.data) {
                     props.buffering = args.data;
                     onPropChanged('buffering');
@@ -196,6 +205,7 @@ function ShellVideo(options) {
             }
             case 'video-params': {
                 props[args.name] = args.data;
+                updateLoaded();
                 var params = args.data || {};
                 var gamma = typeof params.gamma === 'string' ? params.gamma : null;
                 if (gamma === 'pq' || gamma === 'hlg') {
@@ -496,6 +506,7 @@ function ShellVideo(options) {
                     sid: null,
                 };
                 avgDuration = 0;
+                durationReady = false;
                 ipc.send('mpv-command', ['stop']);
                 onPropChanged('loaded');
                 onPropChanged('stream');