feat(player): add T query param for starting time

src/hooks/useQueryParams.ts

@@ -0,0 +1,22 @@
+import { useMemo } from "react";
+import { useLocation } from "react-router-dom";
+
+export function useQueryParams() {
+  const loc = useLocation();
+
+  const queryParams = useMemo(() => {
+    // Basic absolutely-not-fool-proof URL query param parser
+    const obj: Record<string, string | number> = {};
+    for (const [key, value] of loc.search
+      .slice(1)
+      .split("&")
+      .map((e) => e.split("="))) {
+      const valueAsNum = Number(value);
+      obj[key] = Number.isNaN(valueAsNum) ? value : valueAsNum;
+    }
+
+    return obj;
+  }, [loc]);
+
+  return queryParams;
+}

src/video/components/controllers/ProgressListenerController.tsx

@@ -1,6 +1,7 @@
 import throttle from "lodash.throttle";
 import { useEffect, useMemo, useRef } from "react";
 
+import { useQueryParams } from "@/hooks/useQueryParams";
 import { useVideoPlayerDescriptor } from "@/video/state/hooks";
 import { useControls } from "@/video/state/logic/controls";
 import { useMediaPlaying } from "@/video/state/logic/mediaplaying";
@@ -20,6 +21,7 @@ export function ProgressListenerController(props: Props) {
   const misc = useMisc(descriptor);
   const didInitialize = useRef<true | null>(null);
   const lastTime = useRef<number>(props.startAt ?? 0);
+  const queryParams = useQueryParams();
 
   // time updates (throttled)
   const updateTime = useMemo(
@@ -56,9 +58,28 @@ export function ProgressListenerController(props: Props) {
   useEffect(() => {
     if (lastStateProviderId.current === stateProviderId) return;
     if (mediaPlaying.isFirstLoading) return;
+
     lastStateProviderId.current = stateProviderId;
+
+    if ((queryParams.t ?? null) !== null) {
+      // Convert `t` param to time. Supports only seconds, but also `3:30` or `1:30:02`
+      const timeArr = queryParams.t.toString().split(":").map(Number);
+
+      const hours = timeArr[timeArr.length - 3] ?? 0;
+      const minutes = Math.min(timeArr[timeArr.length - 2] ?? 0, 59);
+      const seconds = Math.min(
+        timeArr[timeArr.length - 1] ?? 0,
+        minutes > 0 ? 59 : Infinity
+      );
+      console.log(hours, minutes, seconds, 123);
+      const timeInSeconds = hours * 60 * 60 + minutes * 60 + seconds;
+
+      controls.setTime(timeInSeconds);
+      return;
+    }
+
     controls.setTime(lastTime.current);
-  }, [controls, mediaPlaying, stateProviderId]);
+  }, [controls, mediaPlaying, stateProviderId, queryParams]);
 
   useEffect(() => {
     // if it initialized, but media starts loading for the first time again.