yeet

modules/media_viewer/native/components/MediaModalWebVideoFile.tsx

@@ -0,0 +1,289 @@
+// Metro module 8141 (f8142).
+import { memo, useState, useEffect, useCallback, createRef, useLayoutEffect } from "react";
+import MediaModalWebView, { PlayerState } from "./MediaModalWebView";
+import usePrevious from "../../../../hooks/usePrevious";
+import { MediaViewerAnalytics } from "../../MediaViewerAnalyticsManager";
+import { useMediaPlayerMutedStore } from "../MediaPlayerMuteManager";
+const baseUrl = `https:${window.GLOBAL_ENV.WEBAPP_ENDPOINT}`;
+const r29 = memo(function({ visible, style, source, controls, ...props }) {
+  let mediaPlayerMutedStore;
+  mediaPlayerMutedStore = void 0;
+  const [state, setState] = useState(PlayerState.UNREADY);
+  const previous = usePrevious(state);
+  let c16285_4 = previous;
+  const previous2 = usePrevious(visible);
+  let c16285_5 = previous2;
+  const ref = controls == null ? void 0 : controls.props?.ref;
+  useEffect(() => {
+    MediaViewerAnalytics.trackMessageEmbedsActionCompleted({
+      platform: "file",
+      action: "attempted"
+    });
+  }, []);
+  const callback = useCallback((a0) => {
+    L38: {
+      const r8 = (function(a0) {
+        let r4;
+        try {
+          r4 = JSON.parse(a0);
+        } catch ($e) {
+          return {};
+        }
+        return r4;
+      })(a0);
+      const { type, value } = r8;
+      switch (type) {
+        case "loaded":
+          setState(PlayerState.READY);
+          break L38;
+        case "canplay":
+          if (controls != null) {
+            const props8 = controls.props;
+            if (props8 != null) {
+              props8.onPlayerStateChange(PlayerState.VIDEO_CUED);
+            }
+          }
+          setState(PlayerState.VIDEO_CUED);
+          break L38;
+        case "error":
+          setState(PlayerState.ERRORED);
+          MediaViewerAnalytics.trackMessageEmbedsActionCompleted({
+            platform: "file",
+            action: "errored",
+            error: "unknown"
+          });
+          break L38;
+        case "ended":
+          if (controls != null) {
+            const props7 = controls.props;
+            if (props7 != null) {
+              props7.onPlayerStateChange(PlayerState.ENDED);
+            }
+          }
+          setState(PlayerState.ENDED);
+          break L38;
+        case "play":
+          if (controls != null) {
+            const props6 = controls.props;
+            if (props6 != null) {
+              props6.onPlayerStateChange(PlayerState.PLAYING);
+            }
+          }
+          setState(PlayerState.PLAYING);
+          break L38;
+        case "pause":
+          if (controls != null) {
+            const props5 = controls.props;
+            if (props5 != null) {
+              props5.onPlayerStateChange(PlayerState.PAUSED);
+            }
+          }
+          setState(PlayerState.PAUSED);
+          break L38;
+        case "stalled":
+          if (controls != null) {
+            const props4 = controls.props;
+            if (props4 != null) {
+              props4.onPlayerStateChange(PlayerState.BUFFERING);
+            }
+          }
+          setState(PlayerState.BUFFERING);
+          break L38;
+        case "durationchange":
+          if (value == null) {
+            break L38;
+          }
+          if (controls == null) {
+            break L38;
+          }
+          const props3 = controls.props;
+          if (props3 == null) {
+            break L38;
+          }
+          const onDuration2 = props3.onDuration;
+          if (onDuration2 == null) {
+            break L38;
+          }
+          onDuration2.call(props3, value);
+          break L38;
+        case "progress":
+          if (value == null) {
+            break L38;
+          }
+          if (controls == null) {
+            break L38;
+          }
+          const props2 = controls.props;
+          if (props2 == null) {
+            break L38;
+          }
+          const onDownloadProgress2 = props2.onDownloadProgress;
+          if (onDownloadProgress2 == null) {
+            break L38;
+          }
+          onDownloadProgress2.call(props2, value);
+          break L38;
+        case "timeupdate":
+          if (value == null) {
+            break L38;
+          }
+          if (controls == null) {
+            break L38;
+          }
+          const props = controls.props;
+          if (props == null) {
+            break L38;
+          }
+          const onCurrentSecond2 = props.onCurrentSecond;
+          if (onCurrentSecond2 == null) {
+            break L38;
+          }
+          onCurrentSecond2.call(props, value);
+          break L38;
+        default:
+      }
+    }
+  }, [controls?.props]);
+  mediaPlayerMutedStore = useMediaPlayerMutedStore((a0) => a0.isMuted);
+  useEffect(() => {
+    if (ref?.current != null && state !== PlayerState.UNREADY) {
+      ref.current.injectJavaScript(`window.player.muted = ${JSON.stringify(mediaPlayerMutedStore)}; true;`);
+      if ((visible ? c16285_4 === PlayerState.UNREADY : visible) && state === PlayerState.READY) {
+        ref.current.injectJavaScript("window.player.play();  true;");
+      }
+      if (visible ? !c16285_5 : visible) {
+        ref.current.injectJavaScript("window.player.play();  true;");
+      }
+      if (visible ? !visible : c16285_5) {
+        ref.current.injectJavaScript("window.player.pause(); true;");
+      }
+    }
+  }, [ref, visible, previous2, previous, state, mediaPlayerMutedStore]);
+  return <MediaModalWebView key={source.uri} ref={ref} style={style} source={{
+    html: `
+<html>
+  <head>
+    <meta name="viewport" content="initial-scale=1">
+    <style>
+      * {
+        margin: 0;
+        padding: 0;
+        inset: 0;
+        width: 100%;
+        height: 100%;
+        background-color: #000;
+        object-fit: contain;
+      }
+    </style>
+    <script>${`
+function onReady() {
+  const player = window.player = document.createElement('video');
+  player.controls = false;
+  player.autoplay = false;
+  player.playsInline = true;
+  player.disablePictureInPicture = true;
+  const addEvent = (name, func) => {
+    player.addEventListener(name, (e) => {
+      window.ReactNativeWebView.postMessage(
+        JSON.stringify({type: name, value: func ? func() : undefined})
+      );
+    });
+  };
+  addEvent('error', () => player.error);
+  addEvent('canplay');
+  addEvent('ended');
+  addEvent('pause');
+  addEvent('play');
+  addEvent('stalled');
+  addEvent('durationchange', () => player.duration);
+  addEvent('timeupdate', () => player.currentTime);
+  addEvent('progress', () => {
+    const ranges = player.buffered;
+    let total = 0;
+    for (let i = 0; i < ranges.length; i++) {
+      total += (ranges.end(i) - ranges.start(i));
+    }
+    return total;
+  });
+  player.src = ${JSON.stringify(source.uri)};
+  document.body.appendChild(player);
+  player.load();
+  window.ReactNativeWebView.postMessage(JSON.stringify({type: 'loaded'}));
+}
+window.addEventListener('load', onReady);
+`}</script>
+  </head>
+  <body>
+  </body>
+</html>
+`,
+    baseUrl
+  }} baseURL={baseUrl} playerState={state} onDataReceived={callback} javaScriptEnabled javaScriptCanOpenWindowsAutomatically {...props} />;
+});
+export default r29;
+export function createWebFileVideoControls() {
+  let c16286_0, c16286_1, c16286_2;
+  const ref2 = createRef();
+  let c16286_4 = 0;
+  let c16286_5 = 0;
+  let c16286_6 = 0;
+  return {
+    seek: (a0) => {
+      const current = ref2.current;
+      if (current != null) {
+        current.injectJavaScript(`window.player.currentTime = ${JSON.stringify(a0)}; true;`);
+      }
+    },
+    pause: (a0) => {
+      const current = ref2.current;
+      if (current != null) {
+        current.injectJavaScript(`window.player.${a0 ? "pause" : "play"}(); true;`);
+      }
+    },
+    useSubscribe: (a0, a1, a2) => {
+      c16286_0 = a0;
+      c16286_1 = a1;
+      c16286_2 = a2;
+      useLayoutEffect(() => {
+        if (c16286_0 != null) {
+          c16286_0(c16286_4, c16286_5);
+        }
+      }, []);
+    },
+    props: {
+      ref: ref2,
+      onPlayerStateChange: (a0) => {
+        if (c16286_1 != null) {
+          c16286_1(a0 === PlayerState.PAUSED || a0 === PlayerState.ENDED);
+        }
+      },
+      onCurrentSecond: (a0) => {
+        c16286_4 = a0;
+        if (c16286_0 != null) {
+          c16286_0(c16286_4, c16286_5);
+        }
+      },
+      onDuration: (a0) => {
+        c16286_5 = a0;
+        if (c16286_0 != null) {
+          c16286_0(c16286_4, c16286_5);
+        }
+        if (c16286_5 > 0) {
+          const r12 = c16286_6 / c16286_5;
+          if (c16286_2 != null) {
+            c16286_2(r12);
+          }
+        }
+      },
+      onDownloadProgress: (a0) => {
+        c16286_6 = a0;
+        if (c16286_5 > 0) {
+          const r7 = c16286_6 / c16286_5;
+          if (c16286_2 != null) {
+            c16286_2(r7);
+          }
+        }
+      }
+    }
+  };
+}