#1195

3 files changed, 24 insertions, 3 deletions

diff --git a/src/web/app/common/views/components/messaging-room.vue b/src/web/app/common/views/components/messaging-room.vue
index e15e10ec7d..637fa9cd60 100644
--- a/src/web/app/common/views/components/messaging-room.vue
+++ b/src/web/app/common/views/components/messaging-room.vue
@@ -150,7 +150,9 @@ export default Vue.extend({
 		onMessage(message) {
 			// サウンドを再生する
 			if ((this as any).os.isEnableSounds) {
-				new Audio(`${url}/assets/message.mp3`).play();
+				const sound = new Audio(`${url}/assets/message.mp3`);
+				sound.volume = localStorage.getItem('soundVolume') ? parseInt(localStorage.getItem('soundVolume'), 10) / 100 : 1;
+				sound.play();
 			}
 
 			const isBottom = this.isBottom();
diff --git a/src/web/app/desktop/views/components/settings.vue b/src/web/app/desktop/views/components/settings.vue
index d09b325323..01c41194e1 100644
--- a/src/web/app/desktop/views/components/settings.vue
+++ b/src/web/app/desktop/views/components/settings.vue
@@ -42,6 +42,14 @@
 			<mk-switch v-model="enableSounds" text="サウンドを有効にする">
 				<span>投稿やメッセージを送受信したときなどにサウンドを再生します。この設定はブラウザに記憶されます。</span>
 			</mk-switch>
+			<label>ボリューム</label>
+			<el-slider
+				v-model="soundVolume"
+				:show-input="true"
+				:format-tooltip="v => `${v}%`"
+				:disabled="!enableSounds"
+			/>
+			<button class="ui button" @click="soundTest">%fa:volume-up% テスト</button>
 		</section>
 
 		<section class="web" v-show="page == 'web'">
@@ -175,7 +183,7 @@ import XApi from './settings.api.vue';
 import XApps from './settings.apps.vue';
 import XSignins from './settings.signins.vue';
 import XDrive from './settings.drive.vue';
-import { docsUrl, license, lang, version } from '../../../config';
+import { url, docsUrl, license, lang, version } from '../../../config';
 import checkForUpdate from '../../../common/scripts/check-for-update';
 
 export default Vue.extend({
@@ -198,6 +206,7 @@ export default Vue.extend({
 			latestVersion: undefined,
 			checkingForUpdate: false,
 			enableSounds: localStorage.getItem('enableSounds') == 'true',
+			soundVolume: localStorage.getItem('soundVolume') ? parseInt(localStorage.getItem('soundVolume'), 10) : 100,
 			lang: localStorage.getItem('lang') || '',
 			preventUpdate: localStorage.getItem('preventUpdate') == 'true',
 			debug: localStorage.getItem('debug') == 'true',
@@ -208,6 +217,9 @@ export default Vue.extend({
 		enableSounds() {
 			localStorage.setItem('enableSounds', this.enableSounds ? 'true' : 'false');
 		},
+		soundVolume() {
+			localStorage.setItem('soundVolume', this.soundVolume.toString());
+		},
 		lang() {
 			localStorage.setItem('lang', this.lang);
 		},
@@ -295,6 +307,11 @@ export default Vue.extend({
 				title: 'キャッシュを削除しました',
 				text: 'ページを再度読み込みしてください。'
 			});
+		},
+		soundTest() {
+			const sound = new Audio(`${url}/assets/message.mp3`);
+			sound.volume = localStorage.getItem('soundVolume') ? parseInt(localStorage.getItem('soundVolume'), 10) / 100 : 1;
+			sound.play();
 		}
 	}
 });
diff --git a/src/web/app/desktop/views/components/timeline.vue b/src/web/app/desktop/views/components/timeline.vue
index 99889c3cc2..b6b28c3529 100644
--- a/src/web/app/desktop/views/components/timeline.vue
+++ b/src/web/app/desktop/views/components/timeline.vue
@@ -96,7 +96,9 @@ export default Vue.extend({
 		onPost(post) {
 			// サウンドを再生する
 			if ((this as any).os.isEnableSounds) {
-				new Audio(`${url}/assets/post.mp3`).play();
+				const sound = new Audio(`${url}/assets/post.mp3`);
+				sound.volume = localStorage.getItem('soundVolume') ? parseInt(localStorage.getItem('soundVolume'), 10) / 100 : 1;
+				sound.play();
 			}
 
 			this.posts.unshift(post);