🎨 [epgs] 追っかけ再生時には終了時間を再生開始時間とする (#8)

Author: ci7lus

src/miraktest-epgs/EpgsRenderer.tsx

@@ -46,6 +46,58 @@ export const EpgsRenderer: InitPlugin["renderer"] = ({
       return
     },
     components: [
+      /*{
+        id: `${EPGS_PREFIX}.okkake`,
+        position: "onPlayer",
+        component: () => {
+          const playingContent = useRecoilValue(
+            atoms.contentPlayerPlayingContentAtom
+          )
+          const position = useRecoilValue(
+            atoms.contentPlayerPlayingPositionSelector
+          )
+          const positionRef = useRefFromState(position)
+          const setPosition = useSetRecoilState(
+            atoms.contentPlayerPositionUpdateTriggerAtom
+          )
+          useEffect(() => {
+            if (
+              !playingContent ||
+              playingContent.contentType !== "EPGStation" ||
+              !playingContent.program ||
+              dayjs().isAfter(
+                playingContent.program.startAt + playingContent.program.duration
+              )
+            ) {
+              return
+            }
+            const endAt =
+              playingContent.program.startAt + playingContent.program.duration
+            console.info("[epgs] 追っかけ再生モードを開始します")
+            let isSeeked = false
+            const timer = setInterval(() => {
+              const position = positionRef.current
+              console.log("position", position)
+              if (dayjs().isAfter(endAt)) {
+                console.info(
+                  "[epgs] 放送が終了しました、追っかけ再生モードを終了します"
+                )
+                clearInterval(timer)
+                return
+              }
+              if (!isSeeked && 0.99 < position) {
+                console.info("[epgs] 範囲を再取得します:")
+                setPosition(0.8)
+                isSeeked = true
+              }
+            }, 5000)
+            return () => {
+              clearInterval(timer)
+            }
+          }, [playingContent])
+          return <></>
+        },
+      },*/
       {
         id: `${EPGS_PREFIX}.settings`,
         position: "onSetting",

src/miraktest-epgs/components/RecordDetail.tsx

@@ -57,7 +57,12 @@ export const RecordDetail: React.VFC<{
   const play = useCallback(
     (videoId: number, isNewWindow: boolean) => {
       const url = api.getVideoUrl({ videoId })
-      const program = convertProgramRecordToProgram(record, service)
+      const now = dayjs()
+      const endAt = now.isAfter(record.endAt) ? record.endAt : now.unix() * 1000
+      const program = convertProgramRecordToProgram(
+        { ...record, endAt },
+        service
+      )
       const payload = {
         contentType: "EPGStation",
         url,

src/miraktest-epgs/constants.ts

@@ -401,7 +401,7 @@ export const EPGS_META = {
   id: EPGS_ID,
   name: "EPGStation",
   author: "ci7lus",
-  version: "0.1.4",
+  version: "0.1.5",
   description: "EPGStationの録画を再生するためのプラグインです。",
   authorUrl: "https://github.com/ci7lus",
   url: "https://github.com/ci7lus/miraktest-plugins/tree/master/src/miraktest-epgs",