enhance(frontend): リアクション選択時に音を流せるように (#12441)
* (add) リアクション選択時に音を鳴らせるように * Update Changelog * tweak sound * tweak sound --------- Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>
This commit is contained in:
parent
d32631d159
commit
5bdae9f6d0
|
@ -23,6 +23,7 @@
|
||||||
### Client
|
### Client
|
||||||
- Enhance: 絵文字のオートコンプリート機能強化 #12364
|
- Enhance: 絵文字のオートコンプリート機能強化 #12364
|
||||||
- Enhance: ユーザーのRawデータを表示するページが復活
|
- Enhance: ユーザーのRawデータを表示するページが復活
|
||||||
|
- Enhance: リアクション選択時に音を鳴らせるように
|
||||||
- fix: 「設定のバックアップ」で一部の項目がバックアップに含まれていなかった問題を修正
|
- fix: 「設定のバックアップ」で一部の項目がバックアップに含まれていなかった問題を修正
|
||||||
- Fix: ウィジェットのジョブキューにて音声の発音方法変更に追従できていなかったのを修正 #12367
|
- Fix: ウィジェットのジョブキューにて音声の発音方法変更に追従できていなかったのを修正 #12367
|
||||||
- Fix: コードエディタが正しく表示されない問題を修正
|
- Fix: コードエディタが正しく表示されない問題を修正
|
||||||
|
|
|
@ -1943,6 +1943,7 @@ export interface Locale {
|
||||||
"notification": string;
|
"notification": string;
|
||||||
"antenna": string;
|
"antenna": string;
|
||||||
"channel": string;
|
"channel": string;
|
||||||
|
"reaction": string;
|
||||||
};
|
};
|
||||||
"_ago": {
|
"_ago": {
|
||||||
"future": string;
|
"future": string;
|
||||||
|
|
|
@ -1848,6 +1848,7 @@ _sfx:
|
||||||
notification: "通知"
|
notification: "通知"
|
||||||
antenna: "アンテナ受信"
|
antenna: "アンテナ受信"
|
||||||
channel: "チャンネル通知"
|
channel: "チャンネル通知"
|
||||||
|
reaction: "リアクション選択時"
|
||||||
|
|
||||||
_ago:
|
_ago:
|
||||||
future: "未来"
|
future: "未来"
|
||||||
|
|
Binary file not shown.
Binary file not shown.
|
@ -163,6 +163,7 @@ import { focusPrev, focusNext } from '@/scripts/focus.js';
|
||||||
import { checkWordMute } from '@/scripts/check-word-mute.js';
|
import { checkWordMute } from '@/scripts/check-word-mute.js';
|
||||||
import { userPage } from '@/filters/user.js';
|
import { userPage } from '@/filters/user.js';
|
||||||
import * as os from '@/os.js';
|
import * as os from '@/os.js';
|
||||||
|
import * as sound from '@/scripts/sound.js';
|
||||||
import { defaultStore, noteViewInterruptors } from '@/store.js';
|
import { defaultStore, noteViewInterruptors } from '@/store.js';
|
||||||
import { reactionPicker } from '@/scripts/reaction-picker.js';
|
import { reactionPicker } from '@/scripts/reaction-picker.js';
|
||||||
import { extractUrlFromMfm } from '@/scripts/extract-url-from-mfm.js';
|
import { extractUrlFromMfm } from '@/scripts/extract-url-from-mfm.js';
|
||||||
|
@ -336,6 +337,8 @@ function react(viaKeyboard = false): void {
|
||||||
pleaseLogin();
|
pleaseLogin();
|
||||||
showMovedDialog();
|
showMovedDialog();
|
||||||
if (appearNote.reactionAcceptance === 'likeOnly') {
|
if (appearNote.reactionAcceptance === 'likeOnly') {
|
||||||
|
sound.play('reaction');
|
||||||
|
|
||||||
if (props.mock) {
|
if (props.mock) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -354,6 +357,8 @@ function react(viaKeyboard = false): void {
|
||||||
} else {
|
} else {
|
||||||
blur();
|
blur();
|
||||||
reactionPicker.show(reactButton.value, reaction => {
|
reactionPicker.show(reactButton.value, reaction => {
|
||||||
|
sound.play('reaction');
|
||||||
|
|
||||||
if (props.mock) {
|
if (props.mock) {
|
||||||
emit('reaction', reaction);
|
emit('reaction', reaction);
|
||||||
return;
|
return;
|
||||||
|
|
|
@ -210,6 +210,7 @@ import { checkWordMute } from '@/scripts/check-word-mute.js';
|
||||||
import { userPage } from '@/filters/user.js';
|
import { userPage } from '@/filters/user.js';
|
||||||
import { notePage } from '@/filters/note.js';
|
import { notePage } from '@/filters/note.js';
|
||||||
import * as os from '@/os.js';
|
import * as os from '@/os.js';
|
||||||
|
import * as sound from '@/scripts/sound.js';
|
||||||
import { defaultStore, noteViewInterruptors } from '@/store.js';
|
import { defaultStore, noteViewInterruptors } from '@/store.js';
|
||||||
import { reactionPicker } from '@/scripts/reaction-picker.js';
|
import { reactionPicker } from '@/scripts/reaction-picker.js';
|
||||||
import { extractUrlFromMfm } from '@/scripts/extract-url-from-mfm.js';
|
import { extractUrlFromMfm } from '@/scripts/extract-url-from-mfm.js';
|
||||||
|
@ -369,6 +370,8 @@ function react(viaKeyboard = false): void {
|
||||||
pleaseLogin();
|
pleaseLogin();
|
||||||
showMovedDialog();
|
showMovedDialog();
|
||||||
if (appearNote.reactionAcceptance === 'likeOnly') {
|
if (appearNote.reactionAcceptance === 'likeOnly') {
|
||||||
|
sound.play('reaction');
|
||||||
|
|
||||||
os.api('notes/reactions/create', {
|
os.api('notes/reactions/create', {
|
||||||
noteId: appearNote.id,
|
noteId: appearNote.id,
|
||||||
reaction: '❤️',
|
reaction: '❤️',
|
||||||
|
@ -383,6 +386,8 @@ function react(viaKeyboard = false): void {
|
||||||
} else {
|
} else {
|
||||||
blur();
|
blur();
|
||||||
reactionPicker.show(reactButton.value, reaction => {
|
reactionPicker.show(reactButton.value, reaction => {
|
||||||
|
sound.play('reaction');
|
||||||
|
|
||||||
os.api('notes/reactions/create', {
|
os.api('notes/reactions/create', {
|
||||||
noteId: appearNote.id,
|
noteId: appearNote.id,
|
||||||
reaction: reaction,
|
reaction: reaction,
|
||||||
|
|
|
@ -28,6 +28,7 @@ import MkReactionEffect from '@/components/MkReactionEffect.vue';
|
||||||
import { claimAchievement } from '@/scripts/achievements.js';
|
import { claimAchievement } from '@/scripts/achievements.js';
|
||||||
import { defaultStore } from '@/store.js';
|
import { defaultStore } from '@/store.js';
|
||||||
import { i18n } from '@/i18n.js';
|
import { i18n } from '@/i18n.js';
|
||||||
|
import * as sound from '@/scripts/sound.js';
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
reaction: string;
|
reaction: string;
|
||||||
|
@ -59,6 +60,10 @@ async function toggleReaction() {
|
||||||
});
|
});
|
||||||
if (confirm.canceled) return;
|
if (confirm.canceled) return;
|
||||||
|
|
||||||
|
if (oldReaction !== props.reaction) {
|
||||||
|
sound.play('reaction');
|
||||||
|
}
|
||||||
|
|
||||||
if (mock) {
|
if (mock) {
|
||||||
emit('reactionToggled', props.reaction, (props.count - 1));
|
emit('reactionToggled', props.reaction, (props.count - 1));
|
||||||
return;
|
return;
|
||||||
|
@ -75,6 +80,8 @@ async function toggleReaction() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
|
sound.play('reaction');
|
||||||
|
|
||||||
if (mock) {
|
if (mock) {
|
||||||
emit('reactionToggled', props.reaction, (props.count + 1));
|
emit('reactionToggled', props.reaction, (props.count + 1));
|
||||||
return;
|
return;
|
||||||
|
|
|
@ -38,7 +38,7 @@ import { defaultStore } from '@/store.js';
|
||||||
|
|
||||||
const masterVolume = computed(defaultStore.makeGetterSetter('sound_masterVolume'));
|
const masterVolume = computed(defaultStore.makeGetterSetter('sound_masterVolume'));
|
||||||
|
|
||||||
const soundsKeys = ['note', 'noteMy', 'notification', 'antenna', 'channel'] as const;
|
const soundsKeys = ['note', 'noteMy', 'notification', 'antenna', 'channel', 'reaction'] as const;
|
||||||
|
|
||||||
const sounds = ref<Record<typeof soundsKeys[number], Ref<any>>>({
|
const sounds = ref<Record<typeof soundsKeys[number], Ref<any>>>({
|
||||||
note: defaultStore.reactiveState.sound_note,
|
note: defaultStore.reactiveState.sound_note,
|
||||||
|
@ -46,6 +46,7 @@ const sounds = ref<Record<typeof soundsKeys[number], Ref<any>>>({
|
||||||
notification: defaultStore.reactiveState.sound_notification,
|
notification: defaultStore.reactiveState.sound_notification,
|
||||||
antenna: defaultStore.reactiveState.sound_antenna,
|
antenna: defaultStore.reactiveState.sound_antenna,
|
||||||
channel: defaultStore.reactiveState.sound_channel,
|
channel: defaultStore.reactiveState.sound_channel,
|
||||||
|
reaction: defaultStore.reactiveState.sound_reaction,
|
||||||
});
|
});
|
||||||
|
|
||||||
async function updated(type: keyof typeof sounds.value, sound) {
|
async function updated(type: keyof typeof sounds.value, sound) {
|
||||||
|
|
|
@ -38,6 +38,8 @@ export const soundsTypes = [
|
||||||
'syuilo/waon',
|
'syuilo/waon',
|
||||||
'syuilo/popo',
|
'syuilo/popo',
|
||||||
'syuilo/triple',
|
'syuilo/triple',
|
||||||
|
'syuilo/bubble1',
|
||||||
|
'syuilo/bubble2',
|
||||||
'syuilo/poi1',
|
'syuilo/poi1',
|
||||||
'syuilo/poi2',
|
'syuilo/poi2',
|
||||||
'syuilo/pirori',
|
'syuilo/pirori',
|
||||||
|
@ -77,7 +79,7 @@ export async function loadAudio(file: string, useCache = true) {
|
||||||
return audioBuffer;
|
return audioBuffer;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function play(type: 'noteMy' | 'note' | 'antenna' | 'channel' | 'notification') {
|
export function play(type: 'noteMy' | 'note' | 'antenna' | 'channel' | 'notification' | 'reaction') {
|
||||||
const sound = defaultStore.state[`sound_${type}`];
|
const sound = defaultStore.state[`sound_${type}`];
|
||||||
if (_DEV_) console.log('play', type, sound);
|
if (_DEV_) console.log('play', type, sound);
|
||||||
if (sound.type == null) return;
|
if (sound.type == null) return;
|
||||||
|
|
|
@ -411,6 +411,10 @@ export const defaultStore = markRaw(new Storage('base', {
|
||||||
where: 'device',
|
where: 'device',
|
||||||
default: { type: 'syuilo/square-pico', volume: 1 },
|
default: { type: 'syuilo/square-pico', volume: 1 },
|
||||||
},
|
},
|
||||||
|
sound_reaction: {
|
||||||
|
where: 'device',
|
||||||
|
default: { type: 'syuilo/bubble2', volume: 1 },
|
||||||
|
},
|
||||||
}));
|
}));
|
||||||
|
|
||||||
// TODO: 他のタブと永続化されたstateを同期
|
// TODO: 他のタブと永続化されたstateを同期
|
||||||
|
|
Loading…
Reference in New Issue