76 lines
1.9 KiB
JavaScript
76 lines
1.9 KiB
JavaScript
import { defineStore } from "pinia";
|
|
import { ref, watch } from "vue";
|
|
|
|
export const useSettings = defineStore("settings", () => {
|
|
const initialSettings = localStorage.getItem("settings");
|
|
const settings = ref(
|
|
initialSettings
|
|
? JSON.parse(initialSettings)
|
|
: {
|
|
resolution: {
|
|
width: 1920,
|
|
height: 1080,
|
|
},
|
|
carousel: false,
|
|
carouselTime: 10, // s
|
|
fullscreen: false,
|
|
eqStatus: true,
|
|
}
|
|
);
|
|
|
|
const clearFullscreenFlag = (e) => {
|
|
if (!document.fullscreenElement) {
|
|
settings.value.fullscreen = false;
|
|
}
|
|
};
|
|
|
|
watch(
|
|
() => settings.value.fullscreen,
|
|
(val) => {
|
|
const mainContainer = document.getElementById("main-container");
|
|
if (val) {
|
|
mainContainer.requestFullscreen().then(() => {
|
|
document.removeEventListener("fullscreenchange", clearFullscreenFlag);
|
|
document.addEventListener("fullscreenchange", clearFullscreenFlag);
|
|
});
|
|
return;
|
|
}
|
|
if (document.fullscreenElement) document.exitFullscreen();
|
|
}
|
|
);
|
|
|
|
watch(
|
|
() => settings.value,
|
|
(val) => {
|
|
localStorage.setItem("settings", JSON.stringify(val));
|
|
},
|
|
{
|
|
immediate: true,
|
|
deep: true,
|
|
}
|
|
);
|
|
|
|
function rewriteSettings(payload) {
|
|
settings.value = payload;
|
|
}
|
|
|
|
function updateSettings({ type, value }) {
|
|
switch (type) {
|
|
case "carousel":
|
|
settings.value.carousel = !settings.value.carousel;
|
|
break;
|
|
case "fullscreen":
|
|
settings.value.fullscreen = !settings.value.fullscreen;
|
|
break;
|
|
case "eq":
|
|
settings.value.eqStatus = !settings.value.eqStatus;
|
|
break;
|
|
case "resolution":
|
|
settings.value.resolution.height = value.height;
|
|
settings.value.resolution.width = value.width;
|
|
break;
|
|
}
|
|
}
|
|
return { settings, updateSettings, rewriteSettings };
|
|
});
|