From 67414e0181877730d598f76dcc54bc1d10b86bd3 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sat, 4 Nov 2023 10:09:21 +0900
Subject: [PATCH] =?UTF-8?q?perf(frontend):=20soundConfigStore=20=E3=82=92?=
=?UTF-8?q?=20defaultStore=20=E3=81=AB=E7=B5=B1=E5=90=88=E3=81=97API?=
=?UTF-8?q?=E3=83=AA=E3=82=AF=E3=82=A8=E3=82=B9=E3=83=88=E3=82=92=E5=89=8A?=
=?UTF-8?q?=E6=B8=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../frontend/src/components/MkMediaBanner.vue | 1 -
.../frontend/src/pages/settings/sounds.vue | 20 ++++----
packages/frontend/src/scripts/sound.ts | 46 ++-----------------
packages/frontend/src/store.ts | 25 ++++++++++
4 files changed, 38 insertions(+), 54 deletions(-)
diff --git a/packages/frontend/src/components/MkMediaBanner.vue b/packages/frontend/src/components/MkMediaBanner.vue
index 69da1a7466..122f8ad794 100644
--- a/packages/frontend/src/components/MkMediaBanner.vue
+++ b/packages/frontend/src/components/MkMediaBanner.vue
@@ -34,7 +34,6 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { onMounted, shallowRef, watch } from 'vue';
import * as Misskey from 'misskey-js';
-import { soundConfigStore } from '@/scripts/sound.js';
import { i18n } from '@/i18n.js';
const props = withDefaults(defineProps<{
diff --git a/packages/frontend/src/pages/settings/sounds.vue b/packages/frontend/src/pages/settings/sounds.vue
index 819e7ffe53..cd1707a594 100644
--- a/packages/frontend/src/pages/settings/sounds.vue
+++ b/packages/frontend/src/pages/settings/sounds.vue
@@ -32,20 +32,20 @@ import MkRange from '@/components/MkRange.vue';
import MkButton from '@/components/MkButton.vue';
import FormSection from '@/components/form/section.vue';
import MkFolder from '@/components/MkFolder.vue';
-import { soundConfigStore } from '@/scripts/sound.js';
import { i18n } from '@/i18n.js';
import { definePageMetadata } from '@/scripts/page-metadata.js';
+import { defaultStore } from '@/store.js';
-const masterVolume = computed(soundConfigStore.makeGetterSetter('sound_masterVolume'));
+const masterVolume = computed(defaultStore.makeGetterSetter('sound_masterVolume'));
const soundsKeys = ['note', 'noteMy', 'notification', 'antenna', 'channel'] as const;
const sounds = ref<Record<typeof soundsKeys[number], Ref<any>>>({
- note: soundConfigStore.reactiveState.sound_note,
- noteMy: soundConfigStore.reactiveState.sound_noteMy,
- notification: soundConfigStore.reactiveState.sound_notification,
- antenna: soundConfigStore.reactiveState.sound_antenna,
- channel: soundConfigStore.reactiveState.sound_channel,
+ note: defaultStore.reactiveState.sound_note,
+ noteMy: defaultStore.reactiveState.sound_noteMy,
+ notification: defaultStore.reactiveState.sound_notification,
+ antenna: defaultStore.reactiveState.sound_antenna,
+ channel: defaultStore.reactiveState.sound_channel,
});
async function updated(type: keyof typeof sounds.value, sound) {
@@ -54,14 +54,14 @@ async function updated(type: keyof typeof sounds.value, sound) {
volume: sound.volume,
};
- soundConfigStore.set(`sound_${type}`, v);
+ defaultStore.set(`sound_${type}`, v);
sounds.value[type] = v;
}
function reset() {
for (const sound of Object.keys(sounds.value) as Array<keyof typeof sounds.value>) {
- const v = soundConfigStore.def[`sound_${sound}`].default;
- soundConfigStore.set(`sound_${sound}`, v);
+ const v = defaultStore.def[`sound_${sound}`].default;
+ defaultStore.set(`sound_${sound}`, v);
sounds.value[sound] = v;
}
}
diff --git a/packages/frontend/src/scripts/sound.ts b/packages/frontend/src/scripts/sound.ts
index 1ef075818f..f995c122d1 100644
--- a/packages/frontend/src/scripts/sound.ts
+++ b/packages/frontend/src/scripts/sound.ts
@@ -3,47 +3,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
-import { markRaw } from 'vue';
-import { Storage } from '@/pizzax.js';
-
-export const soundConfigStore = markRaw(new Storage('sound', {
- sound_masterVolume: {
- where: 'device',
- default: 0.3,
- },
- sound_note: {
- where: 'account',
- default: { type: 'syuilo/n-aec', volume: 1 },
- },
- sound_noteMy: {
- where: 'account',
- default: { type: 'syuilo/n-cea-4va', volume: 1 },
- },
- sound_notification: {
- where: 'account',
- default: { type: 'syuilo/n-ea', volume: 1 },
- },
- sound_antenna: {
- where: 'account',
- default: { type: 'syuilo/triple', volume: 1 },
- },
- sound_channel: {
- where: 'account',
- default: { type: 'syuilo/square-pico', volume: 1 },
- },
-}));
-
-await soundConfigStore.ready;
-
-//#region サウンドのColdDeviceStorage => indexedDBのマイグレーション
-for (const target of Object.keys(soundConfigStore.state) as Array<keyof typeof soundConfigStore.state>) {
- const value = localStorage.getItem(`miux:${target}`);
- if (value) {
- soundConfigStore.set(target, JSON.parse(value) as typeof soundConfigStore.def[typeof target]['default']);
- localStorage.removeItem(`miux:${target}`);
- }
-}
-//#endregion
+import { defaultStore } from '@/store.js';
const cache = new Map<string, HTMLAudioElement>();
@@ -112,13 +72,13 @@ export function getAudio(file: string, useCache = true): HTMLAudioElement {
}
export function setVolume(audio: HTMLAudioElement, volume: number): HTMLAudioElement {
- const masterVolume = soundConfigStore.state.sound_masterVolume;
+ const masterVolume = defaultStore.state.sound_masterVolume;
audio.volume = masterVolume - ((1 - volume) * masterVolume);
return audio;
}
export function play(type: 'noteMy' | 'note' | 'antenna' | 'channel' | 'notification') {
- const sound = soundConfigStore.state[`sound_${type}`];
+ const sound = defaultStore.state[`sound_${type}`];
if (_DEV_) console.log('play', type, sound);
if (sound.type == null) return;
playFile(sound.type, sound.volume);
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 7f916656de..6d95ddba35 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -382,6 +382,31 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'device',
default: true,
},
+
+ sound_masterVolume: {
+ where: 'device',
+ default: 0.3,
+ },
+ sound_note: {
+ where: 'device',
+ default: { type: 'syuilo/n-aec', volume: 1 },
+ },
+ sound_noteMy: {
+ where: 'device',
+ default: { type: 'syuilo/n-cea-4va', volume: 1 },
+ },
+ sound_notification: {
+ where: 'device',
+ default: { type: 'syuilo/n-ea', volume: 1 },
+ },
+ sound_antenna: {
+ where: 'device',
+ default: { type: 'syuilo/triple', volume: 1 },
+ },
+ sound_channel: {
+ where: 'device',
+ default: { type: 'syuilo/square-pico', volume: 1 },
+ },
}));
// TODO: 他のタブと永続化されたstateを同期