feat: restore player, voiceover and episode saving for custom player

app/components/ReleasePlayer/EpisodeSelector.tsx

@@ -33,25 +33,25 @@ export const EpisodeSelector = (props: {
   episode: Episode;
   setEpisode: any;
   source: Source;
-  release: any;
+  release_id: any;
   voiceover: any;
   token: string | null;
 }) => {
   let anonEpisodesWatched = getAnonEpisodesWatched(
-    props.release,
+    props.release_id,
     props.source.id,
     props.voiceover.id
   );
   anonEpisodesWatched =
-    anonEpisodesWatched[props.release][props.source.id][props.voiceover.id];
+    anonEpisodesWatched[props.release_id][props.source.id][props.voiceover.id];
 
   async function saveEpisodeToHistory(episode: Episode) {
     if (episode && props.token) {
       fetch(
-        `${ENDPOINTS.statistic.addHistory}/${props.release}/${props.source.id}/${episode.position}?token=${props.token}`
+        `${ENDPOINTS.statistic.addHistory}/${props.release_id}/${props.source.id}/${episode.position}?token=${props.token}`
       );
       fetch(
-        `${ENDPOINTS.statistic.markWatched}/${props.release}/${props.source.id}/${episode.position}?token=${props.token}`
+        `${ENDPOINTS.statistic.markWatched}/${props.release_id}/${props.source.id}/${episode.position}?token=${props.token}`
       );
     }
   }
@@ -86,9 +86,14 @@ export const EpisodeSelector = (props: {
               }
               theme={{ base: "w-full disabled:opacity-100" }}
               onClick={() => {
-                props.availableEpisodes[episode.position - 1].is_watched = true;
+                if (["Sibnet"].includes(props.source.name)) {
+                  props.availableEpisodes[episode.position].is_watched = true;
+                } else {
+                  props.availableEpisodes[episode.position - 1].is_watched =
+                    true;
+                }
                 saveAnonEpisodeWatched(
-                  props.release,
+                  props.release_id,
                   props.source.id,
                   props.voiceover.id,
                   episode.position
@@ -102,7 +107,11 @@ export const EpisodeSelector = (props: {
               disabled={props.episode.position === episode.position}
             >
               <div className="flex items-center">
-                {episode.name}
+                {episode.name ?
+                  episode.name
+                : ["Sibnet"].includes(props.source.name) ?
+                  `${episode.position + 1} Серия`
+                : `${episode.position} Серия`}
                 {(
                   episode.is_watched ||
                   Object.keys(anonEpisodesWatched).includes(

app/components/ReleasePlayer/ReleasePlayerCustom.tsx

@@ -8,9 +8,11 @@ import { VoiceoverSelector } from "./VoiceoverSelector";
 import { SourceSelector } from "./SourceSelector";
 import { EpisodeSelector } from "./EpisodeSelector";
 import { Spinner } from "../Spinner/Spinner";
+import { useUserPlayerPreferencesStore } from "#/store/player";
 
 import HlsVideo from "hls-video-element/react";
 import MediaThemeSutro from "player.style/sutro/react";
+import { getAnonEpisodesWatched } from "./ReleasePlayer";
 
 export const ReleasePlayerCustom = (props: {
   id: number;
@@ -34,6 +36,10 @@ export const ReleasePlayerCustom = (props: {
     useCustom: false,
   });
 
+  const playerPreferenceStore = useUserPlayerPreferencesStore();
+  const preferredVO = playerPreferenceStore.getPreferredVoiceover(props.id);
+  const preferredSource = playerPreferenceStore.getPreferredPlayer(props.id);
+
   const _fetchVoiceover = async (release_id: number) => {
     let url = `${ENDPOINTS.release.episode}/${release_id}`;
     if (props.token) {
@@ -57,7 +63,7 @@ export const ReleasePlayerCustom = (props: {
     voiceover_id: number,
     source_id: number
   ) => {
-    let url = `${ENDPOINTS.release.episode}/${release_id}/${voiceover_id}/${source_id}`
+    let url = `${ENDPOINTS.release.episode}/${release_id}/${voiceover_id}/${source_id}`;
     if (props.token) {
       url += `?token=${props.token}`;
     }
@@ -85,13 +91,14 @@ export const ReleasePlayerCustom = (props: {
       .replace("';", "");
     const urlParams = JSON.parse(urlParamsStr);
 
-    const urlStr = url.replace("https://kodik.info/", "");
+    const domain = url.replace("https://", "").split("/")[0];
+    const urlStr = url.replace(`https://${domain}/`, "");
     const type = urlStr.split("/")[0];
     const id = urlStr.split("/")[1];
     const hash = urlStr.split("/")[2];
 
     const responseMan = await fetch(
-      `/api/proxy/${encodeURIComponent("https://kodik.info/ftor")}?isNotAnixart=true`,
+      `/api/proxy/${encodeURIComponent(`https://${domain}/ftor`)}?isNotAnixart=true`,
       {
         method: "POST",
         headers: {
@@ -142,8 +149,11 @@ export const ReleasePlayerCustom = (props: {
   useEffect(() => {
     const __getInfo = async () => {
       const vo = await _fetchVoiceover(props.id);
+      const selectedVO =
+        vo.types.find((voiceover: any) => voiceover.name === preferredVO) ||
+        vo.types[0];
       setVoiceover({
-        selected: vo.types[0],
+        selected: selectedVO,
         available: vo.types,
       });
     };
@@ -153,8 +163,21 @@ export const ReleasePlayerCustom = (props: {
   useEffect(() => {
     const __getInfo = async () => {
       const src = await _fetchSource(props.id, voiceover.selected.id);
+      const selectedSrc =
+        src.sources.find((source: any) => source.name === preferredSource) ||
+        src.sources[0];
+      if (selectedSrc.episodes_count == 0) {
+        const remSources = src.sources.filter(
+          (source: any) => source.id !== selectedSrc.id
+        );
+        setSource({
+          selected: remSources[0],
+          available: remSources,
+        });
+        return;
+      }
       setSource({
-        selected: src.sources[0],
+        selected: selectedSrc,
         available: src.sources,
       });
     };
@@ -170,8 +193,27 @@ export const ReleasePlayerCustom = (props: {
         voiceover.selected.id,
         source.selected.id
       );
+
+      let anonEpisodesWatched = getAnonEpisodesWatched(
+        props.id,
+        source.selected.id,
+        voiceover.selected.id
+      );
+      let lastEpisodeWatched = Math.max.apply(
+        0,
+        Object.keys(
+          anonEpisodesWatched[props.id][source.selected.id][
+            voiceover.selected.id
+          ]
+        )
+      );
+      let selectedEpisode =
+        episodes.episodes.find(
+          (episode: any) => episode.position == lastEpisodeWatched
+        ) || episodes.episodes[0];
+
       setEpisode({
-        selected: episodes.episodes[0],
+        selected: selectedEpisode,
         available: episodes.episodes,
       });
     };
@@ -232,11 +274,13 @@ export const ReleasePlayerCustom = (props: {
               availableVoiceover={voiceover.available}
               voiceover={voiceover.selected}
               setVoiceover={setVoiceover}
+              release_id={props.id}
             />
             <SourceSelector
               availableSource={source.available}
               source={source.selected}
               setSource={setSource}
+              release_id={props.id}
             />
           </div>
           {playerProps.useCustom ?
@@ -252,7 +296,7 @@ export const ReleasePlayerCustom = (props: {
             availableEpisodes={episode.available}
             episode={episode.selected}
             setEpisode={setEpisode}
-            release={props.id}
+            release_id={props.id}
             source={source.selected}
             voiceover={voiceover.selected}
             token={props.token}

app/components/ReleasePlayer/SourceSelector.tsx

@@ -2,6 +2,7 @@
 
 import { Dropdown } from "flowbite-react";
 import { numberDeclension } from "#/api/utils";
+import { useUserPlayerPreferencesStore } from "#/store/player";
 
 interface Source {
   id: number;
@@ -19,10 +20,7 @@ const DropdownTrigger = ({ name }: Source) => {
   );
 };
 
-const DropdownItem = ({
+const DropdownItem = ({ name, episodes_count }: Source) => {
-  name,
-  episodes_count,
-}: Source) => {
   return (
     <div className="flex flex-col gap-2 cursor-pointer">
       <div className="flex items-center gap-2">
@@ -42,7 +40,10 @@ export const SourceSelector = (props: {
   availableSource: Source[];
   source: Source;
   setSource: any;
+  release_id: any;
 }) => {
+  const playerPreferenceStore = useUserPlayerPreferencesStore();
+
   return (
     <Dropdown
       label=""
@@ -56,12 +57,16 @@ export const SourceSelector = (props: {
       {props.availableSource.map((source: Source) => (
         <Dropdown.Item
           key={`source_${source.id}`}
-          onClick={() =>
+          onClick={() => {
+            playerPreferenceStore.setPreferredPlayer(
+              props.release_id,
+              source.name
+            );
             props.setSource({
               selected: source,
               available: props.availableSource,
-            })
+            });
-          }
+          }}
         >
           <DropdownItem {...source} />
         </Dropdown.Item>

app/components/ReleasePlayer/VoiceoverSelector.tsx

@@ -2,6 +2,7 @@
 
 import { Dropdown } from "flowbite-react";
 import { numberDeclension } from "#/api/utils";
+import { useUserPlayerPreferencesStore } from "#/store/player";
 
 interface Voiceover {
   id: number;
@@ -59,7 +60,10 @@ export const VoiceoverSelector = (props: {
   availableVoiceover: Voiceover[];
   voiceover: Voiceover;
   setVoiceover: any;
+  release_id: number;
 }) => {
+  const playerPreferenceStore = useUserPlayerPreferencesStore();
+
   return (
     <Dropdown
       label=""
@@ -73,12 +77,13 @@ export const VoiceoverSelector = (props: {
       {props.availableVoiceover.map((voiceover: Voiceover) => (
         <Dropdown.Item
           key={`voiceover_${voiceover.id}`}
-          onClick={() =>
+          onClick={() => {
+            playerPreferenceStore.setPreferredVoiceover(props.release_id, voiceover.name);
             props.setVoiceover({
               selected: voiceover,
               available: props.availableVoiceover,
-            })
+            });
-          }
+          }}
         >
           <DropdownItem {...voiceover} />
         </Dropdown.Item>

middleware.ts

@@ -29,7 +29,7 @@ export default async function middleware(
     let data = null;
     path = decodeURIComponent(path);
 
-    if ((isHTML || isNotAnixart) && !path.startsWith("https://kodik.info")) {
+    if ((isHTML || isNotAnixart) && !(path.startsWith("https://kodik.info") || path.startsWith("https://aniqit.com"))) {
       return new Response(JSON.stringify({ message: "URL not allowed" }), {
         status: 403,
         headers: {
@@ -85,7 +85,7 @@ export default async function middleware(
     path = decodeURIComponent(path);
 
     if (isNotAnixart) {
-      if (!path.startsWith("https://kodik.info")) {
+      if (!(path.startsWith("https://kodik.info") || path.startsWith("https://aniqit.com"))) {
         return new Response(JSON.stringify({ message: "URL not allowed" }), {
           status: 403,
           headers: {