Feat: impl source plugin

src/plugins/source.ts

@@ -5,28 +5,23 @@ interface artplayPluginSource {
   html: string;
 }
 
-function artplayPluginSource(option: [artplayPluginSource]) {
+export function artplayPluginSource(option: artplayPluginSource[]) {
   return (art: Artplayer) => {
-    const storageSource = art.storage.get("source");
     art.controls.add({
       position: "right",
-      html: storageSource || "源",
+      html: "源",
       selector: option,
       onSelect: function (item: artplayPluginSource) {
-        art.switchQuality(item.url);
-        art.storage.set("source", item.html);
-        return item.html;
+        const status = art.plugins["syncPlugin"].currentStatus();
+        art.once("video:canplay", () => {
+          art.plugins["syncPlugin"].setAndNoPublishStatus(status);
+        });
+        art.url = item.url;
+        return "源";
       }
     });
-    if (storageSource) {
-      const source = option.find((item) => item.html === storageSource);
-      if (source) {
-        art.url = source.url;
-      } else {
-        art.url = option[0].url;
-      }
-    } else {
-      art.url = option[0].url;
-    }
+    return {
+      name: "source"
+    };
   };
 }

src/plugins/sync.ts

@@ -37,6 +37,8 @@ interface syncPlugin {
   setAndNoPublishPlay: () => void;
   setAndNoPublishPause: () => void;
   setAndNoPublishRate: (rate: number) => void;
+  setAndNoPublishStatus: (status: MovieStatus) => void;
+  currentStatus: () => MovieStatus;
 }
 
 const debounceTime = 500;
@@ -202,6 +204,22 @@ export const newSyncPlugin = (
         );
     };
 
+    const setAndNoPublishStatus = async (status: MovieStatus) => {
+      if (!art.option.isLive) {
+        setAndNoPublishRate(status.rate);
+        setAndNoPublishSeek(status.seek);
+      }
+      status.playing ? await setAndNoPublishPlay() : setAndNoPublishPause();
+    };
+
+    const currentStatus = (): MovieStatus => {
+      return {
+        playing: art.playing,
+        seek: art.currentTime,
+        rate: art.playbackRate
+      };
+    };
+
     if (!art.option.isLive) {
       art.once("ready", async () => {
         console.log("同步进度中...");
@@ -265,7 +283,9 @@ export const newSyncPlugin = (
       setAndNoPublishSeek,
       setAndNoPublishPlay,
       setAndNoPublishPause,
-      setAndNoPublishRate
+      setAndNoPublishRate,
+      setAndNoPublishStatus,
+      currentStatus
     };
   };
 };

src/views/Cinema.vue

@@ -28,6 +28,7 @@ import type { Subtitles } from "@/types/Movie";
 import { RoomMemberPermission } from "@/types/Room";
 import artplayerPluginAss from "@/plugins/artplayer-plugin-ass";
 import { newSyncPlugin } from "@/plugins/sync";
+import { artplayPluginSource } from "@/plugins/source";
 
 const Player = defineAsyncComponent(() => import("@/components/Player.vue"));
 

vite.config.mts

@@ -1,6 +1,6 @@
 import { fileURLToPath, URL } from "node:url";
 
-import { defineConfig, loadEnv } from "vite";
+import { defineConfig, loadEnv, type UserConfigFnObject, UserConfig } from "vite";
 import vue from "@vitejs/plugin-vue";
 import AutoImport from "unplugin-auto-import/vite";
 import Components from "unplugin-vue-components/vite";
@@ -9,52 +9,59 @@ import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
 const env = loadEnv("", process.cwd());
 
 // https://vitejs.dev/config/
-export default defineConfig({
-  server: {
-    host: true,
-    proxy: {
-      "/api": {
-        target: env.VITE_SERVER_TARGET || "http://127.0.0.1:8088",
-        changeOrigin: true,
-        ws: true
-      },
-      "/oauth2": {
-        target: env.VITE_SERVER_TARGET || "http://127.0.0.1:8088",
-        changeOrigin: true,
-        ws: false
+const config: UserConfigFnObject = ({ command, mode, ssrBuild }): UserConfig => {
+  let c: UserConfig = {
+    server: {
+      host: true,
+      proxy: {
+        "/api": {
+          target: env.VITE_SERVER_TARGET || "http://127.0.0.1:8088",
+          changeOrigin: true,
+          ws: true
+        },
+        "/oauth2": {
+          target: env.VITE_SERVER_TARGET || "http://127.0.0.1:8088",
+          changeOrigin: true,
+          ws: false
+        }
       }
-    }
-  },
-  plugins: [
-    AutoImport({
-      resolvers: [ElementPlusResolver()]
-    }),
-    Components({
-      resolvers: [ElementPlusResolver()]
-    }),
-    vue()
-  ],
-  resolve: {
-    alias: {
-      "@": fileURLToPath(new URL("./src", import.meta.url))
-    }
-  },
-  build: {
-    cssCodeSplit: true,
-    minify: "esbuild",
-    cssMinify: "lightningcss",
-    reportCompressedSize: false,
-    assetsInlineLimit: 0 // 禁止内敛为base64
-  },
-  esbuild: {
-    drop: ["console", "debugger"]
-  },
-  base: env.VITE_BASEURL,
-  css: {
-    lightningcss: {}
-  },
-  json: {
-    stringify: true
-  },
-  envPrefix: "VITE_"
-});
+    },
+    plugins: [
+      AutoImport({
+        resolvers: [ElementPlusResolver()]
+      }),
+      Components({
+        resolvers: [ElementPlusResolver()]
+      }),
+      vue()
+    ],
+    resolve: {
+      alias: {
+        "@": fileURLToPath(new URL("./src", import.meta.url))
+      }
+    },
+    build: {
+      cssCodeSplit: true,
+      minify: "esbuild",
+      cssMinify: "lightningcss",
+      reportCompressedSize: false,
+      assetsInlineLimit: 0 // 禁止内敛为base64
+    },
+    base: env.VITE_BASEURL,
+    css: {
+      lightningcss: {}
+    },
+    json: {
+      stringify: true
+    },
+    envPrefix: "VITE_"
+  };
+  if (mode !== "development") {
+    c.esbuild = {
+      drop: ["console", "debugger"]
+    };
+  }
+  return c;
+};
+
+export default defineConfig(config);