97 history function is calling immediately on play (#98)

* added a check that only allows history to be saved if viewed continuously `DELAY_SAVE_VIEWING_PROGRESS/4`

* in the meantime still allow local save

* constaints `CONFIRMATION_TIME_IS_ACTUALLY_WATCHING`

src/components/BrtPlayer.vue

@@ -1002,7 +1002,7 @@ import {
   useQuasar,
 } from "quasar"
 import { useMemoControl } from "src/composibles/memo-control"
-import { DELAY_SAVE_VIEWING_PROGRESS, playbackRates } from "src/constants"
+import { CONFIRMATION_TIME_IS_ACTUALLY_WATCHING, DELAY_SAVE_VIEWING_PROGRESS, playbackRates } from "src/constants"
 import { checkContentEditable } from "src/helpers/checkContentEditable"
 import { scrollXIntoView, scrollYIntoView } from "src/helpers/scrollIntoView"
 import { fetchJava } from "src/logic/fetchJava"
@@ -1076,6 +1076,11 @@ const props = defineProps<{
   fetchSeason: (season: string) => Promise<void>
   progressWatchStore: ProgressWatchStore
 }>()
+const uidChap = computed(() => {
+  const uid = `${props.currentSeason}/${props.currentChap ?? ""}` // 255 byte
+
+  return uid
+})
 
 const playerWrapRef = ref<HTMLDivElement>()
 const documentVisibility = useDocumentVisibility()
@@ -1253,7 +1258,7 @@ watch(
         if ((err as Error)?.message !== "NOT_RESET") console.error(err)
       }
 
-      progressRestored = `${currentSeason}/${currentChap}`
+      progressRestored = uidChap.value
     }
   },
   { immediate: true }
@@ -1395,6 +1400,38 @@ const emit = defineEmits<{
     }
   ): void
 }>()
+
+const storeFirstSaving = new Set<string>()
+{
+  // eslint-disable-next-line functional/no-let, no-undef
+  let timeout: NodeJS.Timeout | number | null = null
+  // eslint-disable-next-line functional/no-let
+  let uidChapTimeout: string | null = null
+  onBeforeUnmount(() => {
+    if (timeout) clearTimeout(timeout)
+  })
+  const watcher = watch(artPlaying, (artPlaying) => {
+    if (artPlaying) {
+      if (timeout) {
+        if (uidChapTimeout === uidChap.value) return
+        console.log("stop timeout add first saving because change chap")
+        clearTimeout(timeout)
+      }
+      timeout = setTimeout(() => {
+        console.log("allow first saving")
+        storeFirstSaving.add(uidChap.value)
+      }, CONFIRMATION_TIME_IS_ACTUALLY_WATCHING)
+      uidChapTimeout = uidChap.value
+    } else {
+      if (timeout) {
+        console.log("stop timeout add first saving")
+        clearTimeout(timeout)
+        uidChapTimeout = null
+        watcher()
+      }
+    }
+  })
+}
 // eslint-disable-next-line functional/no-let
 let processingSaveCurTimeIn: string | null = null
 const saveCurTimeToPer = throttle(
@@ -1405,10 +1442,9 @@ const saveCurTimeToPer = throttle(
     dur: number,
     nameCurrentChap: string
   ) => {
+    const uid = uidChap.value // 255 byte
     if (!(await createSeason())) return
 
-    const uid = `${currentSeason}/${currentChap}` // 255 byte
-
     if (processingSaveCurTimeIn === uid) return // in progressing save this
     processingSaveCurTimeIn = uid
 
@@ -1432,6 +1468,14 @@ const saveCurTimeToPer = throttle(
   },
   DELAY_SAVE_VIEWING_PROGRESS
 )
+const throttleEmitCurUpdate = throttle(() => {
+  if (props.currentChap)
+    emit("cur-update", {
+      cur: artCurrentTime.value,
+      dur: artDuration.value,
+      id: props.currentChap,
+    })
+}, DELAY_SAVE_VIEWING_PROGRESS)
 function onVideoTimeUpdate() {
   if (
     artPlaying.value &&
@@ -1452,6 +1496,10 @@ function onVideoTimeUpdate() {
   if (!props.currentChap) return
   if (typeof props.nameCurrentChap !== "string") return
 
+  if (!storeFirstSaving.has(uidChap.value)) {
+    throttleEmitCurUpdate()
+    return console.log("bypass because not first saving")
+  }
   saveCurTimeToPer(
     props.currentSeason,
     props.currentChap,
@@ -1761,8 +1809,8 @@ function remount(resetCurrentTime?: boolean) {
               }
               hls.recoverMediaError()
               if (playing)
-               // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-               video.value!.play()
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                video.value!.play()
               break
             }
             default: {
@@ -1807,8 +1855,7 @@ function remount(resetCurrentTime?: boolean) {
 
   if (
     resetCurrentTime
-      ? props.currentChap &&
-        progressRestored === `${props.currentSeason}/${props.currentChap}`
+      ? props.currentChap && progressRestored === uidChap.value
       : true
   )
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion

src/constants.ts

@@ -30,6 +30,7 @@ export const playbackRates = [
 ]
 
 export const DELAY_SAVE_VIEWING_PROGRESS = 20_000 // x4 6s
+export const CONFIRMATION_TIME_IS_ACTUALLY_WATCHING = DELAY_SAVE_VIEWING_PROGRESS / 4
 
 export const REGEXP_OLD_HOST_CURL = /animevietsub\.(?:\w+)/i