|
|
@@ -1,210 +1,216 @@
|
|
|
-import { useAudio } from '@/hooks/useAudio';
|
|
|
-import { unref } from 'vue';
|
|
|
+import { useAudio } from "@/hooks/useAudio";
|
|
|
+import { unref } from "vue";
|
|
|
|
|
|
-const resourceURL = process.env.VUE_APP_RESOURCE_URL
|
|
|
+const resourceURL = process.env.VUE_APP_RESOURCE_URL;
|
|
|
|
|
|
export default {
|
|
|
- namespaced: true,
|
|
|
- state() {
|
|
|
- return {
|
|
|
- normalBGM: {
|
|
|
- url: "",
|
|
|
- isAuto: false,
|
|
|
- type: 0,
|
|
|
- order: 0,
|
|
|
- repeat: true,
|
|
|
- }, // 一般背景音乐
|
|
|
- // appBGM: {
|
|
|
- // url: "",
|
|
|
- // isAuto: false,
|
|
|
- // order: 0
|
|
|
- // }, // 一般背景音乐
|
|
|
- v3BGM: {
|
|
|
- url: "",
|
|
|
- isAuto: false,
|
|
|
- type: 1,
|
|
|
- order: 9,
|
|
|
- repeat: false,
|
|
|
- isExist: false,
|
|
|
- isPlayIng: false,
|
|
|
- }, // v3背景音乐
|
|
|
- v4BGM: {
|
|
|
- url: "",
|
|
|
- type: 2,
|
|
|
- isAuto: false,
|
|
|
- order: 10,
|
|
|
- repeat: false,
|
|
|
- }, // v4背景音乐
|
|
|
- explanationBGM: {
|
|
|
- url: "",
|
|
|
- type: 3,
|
|
|
- isAuto: false,
|
|
|
- order: 11,
|
|
|
- repeat: false,
|
|
|
- }, //解说音乐
|
|
|
- currentPlaying: false
|
|
|
- }
|
|
|
+ namespaced: true,
|
|
|
+ state() {
|
|
|
+ return {
|
|
|
+ normalBGM: {
|
|
|
+ url: "",
|
|
|
+ isAuto: false,
|
|
|
+ type: 0,
|
|
|
+ order: 0,
|
|
|
+ repeat: true,
|
|
|
+ }, // 一般背景音乐
|
|
|
+ // appBGM: {
|
|
|
+ // url: "",
|
|
|
+ // isAuto: false,
|
|
|
+ // order: 0
|
|
|
+ // }, // 一般背景音乐
|
|
|
+ v3BGM: {
|
|
|
+ url: "",
|
|
|
+ isAuto: false,
|
|
|
+ type: 1,
|
|
|
+ order: 9,
|
|
|
+ repeat: false,
|
|
|
+ isExist: false,
|
|
|
+ isPlayIng: false,
|
|
|
+ }, // v3背景音乐
|
|
|
+ v4BGM: {
|
|
|
+ url: "",
|
|
|
+ type: 2,
|
|
|
+ isAuto: false,
|
|
|
+ order: 10,
|
|
|
+ repeat: false,
|
|
|
+ }, // v4背景音乐
|
|
|
+ explanationBGM: {
|
|
|
+ url: "",
|
|
|
+ type: 3,
|
|
|
+ isAuto: false,
|
|
|
+ order: 11,
|
|
|
+ repeat: false,
|
|
|
+ }, //解说音乐
|
|
|
+ currentPlaying: false,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ getters: {
|
|
|
+ bgmList: (state) => [
|
|
|
+ state.normalBGM,
|
|
|
+ state.v3BGM,
|
|
|
+ state.v4BGM,
|
|
|
+ state.explanationBGM,
|
|
|
+ ],
|
|
|
+ currentAudio: (_, getters) => {
|
|
|
+ const arr = Array.from(getters.bgmList)
|
|
|
+ .filter((i) => i.url && i.type !== 1)
|
|
|
+ .sort((a, b) => b.order - a.order);
|
|
|
+ return arr.length > 0 ? arr[0] : false;
|
|
|
+ },
|
|
|
+ currentPlayer: () => {
|
|
|
+ const { currentPlayer } = useAudio();
|
|
|
+ return unref(currentPlayer);
|
|
|
},
|
|
|
- getters: {
|
|
|
- bgmList: (state) => [state.normalBGM, state.v3BGM, state.v4BGM, state.explanationBGM],
|
|
|
- currentAudio: (_, getters) => {
|
|
|
- const arr = Array.from(getters.bgmList).filter(i => i.url && i.type !== 1).sort((a, b) => b.order - a.order)
|
|
|
- return arr.length > 0 ? arr[0] : false;
|
|
|
- },
|
|
|
|
|
|
- isCurrentPlaying: (state) => state.currentPlaying,
|
|
|
- isHasNormalBGM: (state) => {
|
|
|
- return state.normalBGM.url.length > 0
|
|
|
- },
|
|
|
- isHasV3BGM: (state) => {
|
|
|
- return state.v3BGM.isExist
|
|
|
- },
|
|
|
- isHasV4BGM: (state) => {
|
|
|
- return state.v4BGM.url.length > 0
|
|
|
- },
|
|
|
- isHasExplanationBGM: (state) => {
|
|
|
- return state.explanationBGM.url.length > 0
|
|
|
- },
|
|
|
- isPlayNormalBGM: (_, getters) => {
|
|
|
- return getters.currentAudio.type === 0
|
|
|
- },
|
|
|
- isPlayV3BGM: (state) => {
|
|
|
- return state.v3BGM.isPlayIng
|
|
|
- },
|
|
|
- isPlayV4BGM: (_, getters) => {
|
|
|
- return getters.currentAudio.type === 2
|
|
|
- },
|
|
|
- isPlayExplanationBGM: (_, getters) => {
|
|
|
- return getters.currentAudio.type === 3
|
|
|
- }
|
|
|
+ isCurrentPlaying: (state) => state.currentPlaying,
|
|
|
+ isHasNormalBGM: (state) => {
|
|
|
+ return state.normalBGM.url.length > 0;
|
|
|
+ },
|
|
|
+ isHasV3BGM: (state) => {
|
|
|
+ return state.v3BGM.isExist;
|
|
|
+ },
|
|
|
+ isHasV4BGM: (state) => {
|
|
|
+ return state.v4BGM.url.length > 0;
|
|
|
+ },
|
|
|
+ isHasExplanationBGM: (state) => {
|
|
|
+ return state.explanationBGM.url.length > 0;
|
|
|
+ },
|
|
|
+ isPlayNormalBGM: (_, getters) => {
|
|
|
+ return getters.currentAudio.type === 0;
|
|
|
+ },
|
|
|
+ isPlayV3BGM: (state) => {
|
|
|
+ return state.v3BGM.isPlayIng;
|
|
|
+ },
|
|
|
+ isPlayV4BGM: (_, getters) => {
|
|
|
+ return getters.currentAudio.type === 2;
|
|
|
+ },
|
|
|
+ isPlayExplanationBGM: (_, getters) => {
|
|
|
+ return getters.currentAudio.type === 3;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mutations: {
|
|
|
+ setNormalBGM(state, payload) {
|
|
|
+ state.normalBGM.url = payload.url;
|
|
|
+ state.normalBGM.isAuto = payload.isAuto;
|
|
|
+ },
|
|
|
+ setExplanationBGM(state, payload) {
|
|
|
+ state.explanationBGM.url = payload.url;
|
|
|
+ state.explanationBGM.isAuto = payload.isAuto;
|
|
|
+ state.explanationBGM.repeat = payload.repeat;
|
|
|
+ },
|
|
|
+ setV3BGM(state, payload) {
|
|
|
+ state.v3BGM.isExist = payload;
|
|
|
+ },
|
|
|
+ setV3BGMPlaying(state, payload) {
|
|
|
+ state.v3BGM.isPlayIng = payload;
|
|
|
+ },
|
|
|
+ setV4BGM(state, payload) {
|
|
|
+ state.v4BGM.url = payload.url;
|
|
|
+ state.v4BGM.isAuto = payload.isAuto;
|
|
|
+ state.v4BGM.repeat = payload.repeat;
|
|
|
+ },
|
|
|
+ setPlayStatus(state, payload) {
|
|
|
+ state.currentPlaying = payload;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ actions: {
|
|
|
+ initNormalBGM({ commit }, url) {
|
|
|
+ // 一般背景音乐
|
|
|
+ commit("setNormalBGM", {
|
|
|
+ isAuto: true,
|
|
|
+ url: url,
|
|
|
+ });
|
|
|
+ },
|
|
|
+ initExplanationBGM({ commit }, { url, repeat, isAuto }) {
|
|
|
+ commit("setExplanationBGM", { url, repeat, isAuto });
|
|
|
},
|
|
|
- mutations: {
|
|
|
- setNormalBGM(state, payload) {
|
|
|
- state.normalBGM.url = payload.url
|
|
|
- state.normalBGM.isAuto = payload.isAuto
|
|
|
- },
|
|
|
- setExplanationBGM(state, payload) {
|
|
|
- state.explanationBGM.url = payload.url
|
|
|
- state.explanationBGM.isAuto = payload.isAuto
|
|
|
- state.explanationBGM.repeat = payload.repeat
|
|
|
- },
|
|
|
- setV3BGM(state, payload) {
|
|
|
- state.v3BGM.isExist = payload
|
|
|
|
|
|
- },
|
|
|
- setV3BGMPlaying(state, payload) {
|
|
|
- state.v3BGM.isPlayIng = payload
|
|
|
- },
|
|
|
- setV4BGM(state, payload) {
|
|
|
- state.v4BGM.url = payload.url
|
|
|
- state.v4BGM.isAuto = payload.isAuto
|
|
|
- state.v4BGM.repeat = payload.repeat
|
|
|
- },
|
|
|
- setPlayStatus(state, payload) {
|
|
|
- state.currentPlaying = payload
|
|
|
+ initV3BGM({ commit, dispatch }, status) {
|
|
|
+ // V3音乐
|
|
|
+ commit("setV3BGM", status);
|
|
|
+ if (status) {
|
|
|
+ dispatch("pauseBGM");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ initV4BGM({ commit }, url) {
|
|
|
+ // v4音乐
|
|
|
+ let newURL = "";
|
|
|
+ if (url) {
|
|
|
+ if (!/^https?:\/\//.test(url)) {
|
|
|
+ newURL = resourceURL + url;
|
|
|
+ } else {
|
|
|
+ newURL = url;
|
|
|
}
|
|
|
-
|
|
|
+ }
|
|
|
+ commit("setV4BGM", { url: newURL, repeat: true, isAuto: true });
|
|
|
},
|
|
|
- actions: {
|
|
|
- initNormalBGM({ commit }, url) {
|
|
|
- // 一般背景音乐
|
|
|
- commit('setNormalBGM', {
|
|
|
- isAuto: true,
|
|
|
- url: url
|
|
|
- })
|
|
|
- },
|
|
|
- initExplanationBGM({ commit }, { url, repeat, isAuto }) {
|
|
|
- commit('setExplanationBGM', { url, repeat, isAuto });
|
|
|
- },
|
|
|
-
|
|
|
- initV3BGM({ commit, dispatch }, status) {
|
|
|
- // V3音乐
|
|
|
- commit('setV3BGM', status);
|
|
|
- if (status) {
|
|
|
- dispatch('pauseBGM');
|
|
|
- }
|
|
|
- },
|
|
|
- initV4BGM({ commit }, url) {
|
|
|
- // v4音乐
|
|
|
- let newURL = ''
|
|
|
- if (url) {
|
|
|
- if (!/^https?:\/\//.test(url)) {
|
|
|
- newURL = resourceURL + url
|
|
|
- } else {
|
|
|
- newURL = url
|
|
|
- }
|
|
|
- }
|
|
|
- commit('setV4BGM', { url: newURL, repeat: true, isAuto: true });
|
|
|
- },
|
|
|
- playBGM({ commit, getters, state, dispatch }, type) {
|
|
|
- console.warn('~~playBGM~~', type);
|
|
|
- // debugger;
|
|
|
- const index = getters['currentAudio'].order;
|
|
|
- const order = index + 1;
|
|
|
- const target = getters['bgmList'].find(i => i.type === type);
|
|
|
- if (target.url.length > 0) {
|
|
|
- switch (type) {
|
|
|
- case 0:
|
|
|
- state.normalBGM.order = order;
|
|
|
- break;
|
|
|
- case 2:
|
|
|
- state.v4BGM.order = order;
|
|
|
- break;
|
|
|
- case 3:
|
|
|
- state.explanationBGM.order = order;
|
|
|
- break;
|
|
|
- default:
|
|
|
- state.normalBGM.order = order;
|
|
|
- break;
|
|
|
- }
|
|
|
- } else {
|
|
|
- console.error('当前BGM没有URL', target);
|
|
|
- if (type === 2) {
|
|
|
- //fallback
|
|
|
- dispatch('playBGM', 0);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- pauseBGM() {
|
|
|
- const { currentPlayer } = useAudio();
|
|
|
- if (unref(currentPlayer)) {
|
|
|
- currentPlayer.value.pause();
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- resumeBGM() {
|
|
|
- const { currentPlayer } = useAudio();
|
|
|
- if (unref(currentPlayer)) {
|
|
|
- currentPlayer.value.resume();
|
|
|
- }
|
|
|
- },
|
|
|
- updatePlayerStatus({ commit }, status) {
|
|
|
- commit('setPlayStatus', status)
|
|
|
- },
|
|
|
-
|
|
|
- updateV3BGMStatus({ commit }, status) {
|
|
|
- commit('setV3BGMPlaying', status)
|
|
|
- },
|
|
|
-
|
|
|
- destroy() {
|
|
|
- const { currentPlayer } = useAudio();
|
|
|
- if (unref(currentPlayer)) {
|
|
|
- currentPlayer.value.destroy();
|
|
|
- }
|
|
|
- },
|
|
|
- setLock({ commit }, status) {
|
|
|
- const { currentPlayer } = useAudio();
|
|
|
- if (unref(currentPlayer)) {
|
|
|
- status ? currentPlayer.value.lock() : currentPlayer.value.unlock();
|
|
|
- }
|
|
|
- },
|
|
|
- setMuteBGM({ commit }, status) {
|
|
|
- const { currentPlayer } = useAudio();
|
|
|
- if (unref(currentPlayer)) {
|
|
|
- status ? currentPlayer.value.mute() : currentPlayer.value.unmute();
|
|
|
- }
|
|
|
+ playBGM({ commit, getters, state, dispatch }, type) {
|
|
|
+ console.warn("~~playBGM~~", type);
|
|
|
+ // debugger;
|
|
|
+ const index = getters["currentAudio"].order;
|
|
|
+ const order = index + 1;
|
|
|
+ const target = getters["bgmList"].find((i) => i.type === type);
|
|
|
+ if (target.url.length > 0) {
|
|
|
+ switch (type) {
|
|
|
+ case 0:
|
|
|
+ state.normalBGM.order = order;
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ state.v4BGM.order = order;
|
|
|
+ break;
|
|
|
+ case 3:
|
|
|
+ state.explanationBGM.order = order;
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ state.normalBGM.order = order;
|
|
|
+ break;
|
|
|
}
|
|
|
- }
|
|
|
+ } else {
|
|
|
+ console.error("当前BGM没有URL", target);
|
|
|
+ if (type === 2) {
|
|
|
+ //fallback
|
|
|
+ dispatch("playBGM", 0);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ pauseBGM() {
|
|
|
+ const { currentPlayer } = useAudio();
|
|
|
+ if (unref(currentPlayer)) {
|
|
|
+ currentPlayer.value.pause();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ resumeBGM() {
|
|
|
+ const { currentPlayer } = useAudio();
|
|
|
+ if (unref(currentPlayer)) {
|
|
|
+ currentPlayer.value.resume();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ updatePlayerStatus({ commit }, status) {
|
|
|
+ commit("setPlayStatus", status);
|
|
|
+ },
|
|
|
+
|
|
|
+ updateV3BGMStatus({ commit }, status) {
|
|
|
+ commit("setV3BGMPlaying", status);
|
|
|
+ },
|
|
|
|
|
|
-}
|
|
|
+ destroy() {
|
|
|
+ const { currentPlayer } = useAudio();
|
|
|
+ if (unref(currentPlayer)) {
|
|
|
+ currentPlayer.value.destroy();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ setLock({ commit }, status) {
|
|
|
+ const { currentPlayer } = useAudio();
|
|
|
+ if (unref(currentPlayer)) {
|
|
|
+ status ? currentPlayer.value.lock() : currentPlayer.value.unlock();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ setMuteBGM({ commit }, status) {
|
|
|
+ const { currentPlayer } = useAudio();
|
|
|
+ if (unref(currentPlayer)) {
|
|
|
+ status ? currentPlayer.value.mute() : currentPlayer.value.unmute();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
gemercheung