Merge branch 'event-source' of https://github.com/DenizUgur/MV_LL-DASH …

…into event-source

development/app/pages/index.js

@@ -4,11 +4,7 @@ import { MediaPlayer } from "../../../dashjs";
 import styles from "../styles/Home.module.css";
 
 export default function Home() {
-  const [state, setState] = useState({
-    latency: [],
-    mv: 0,
-    frame: 0,
-  });
+  const [state, setState] = useState(0);
   const ref = useRef(null);
 
   useEffect(() => {
@@ -23,17 +19,13 @@ export default function Home() {
           mode: "liveCatchupModeLoLP",
           minDrift: 0.2,
           playbackRate: 0.3,
+          respectVideoEvents: true,
         },
       },
     });
 
-    player.on("motionVectorReceived", (e) => {
-      setState((prevState) => ({
-        ...prevState,
-        mv: e.mv_data.length > 0 ? e.mv_data.pop().mv : prevState.mv,
-        frame: e.mv_data.length > 0 ? e.mv_data.pop().frame : prevState.frame,
-        latency: [...prevState.latency, { t: player.getCurrentLiveLatency() }],
-      }));
+    player.on("playbackProgress", (e) => {
+      setState(player.getCurrentLiveLatency());
     });
 
     return () => {};
@@ -55,16 +47,7 @@ export default function Home() {
           muted
         ></video>
         <div className={styles.latency}>
-          <span className={styles.delayBig}>
-            {state.latency[state.latency.length - 1] &&
-              state.latency[state.latency.length - 1].t}
-          </span>
-          s
-          <br />
-          mv: {state.mv}
-          <br />
-          frame: {state.frame}
-          <br />
+          <span className={styles.delayBig}>{state}</span>s
         </div>
       </main>
     </div>