From da9084ccb6911cd6fb5175d2f04a48d60f9f59fc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?B=C3=A4r=20Halberkamp?= <fledaway@gmail.com>
Date: Wed, 5 Oct 2016 05:49:50 +0200
Subject: [PATCH] Implement notification sounds (#777)

---
 js/battledata.js    |  6 ++++++
 js/client-chat.js   |  6 ++++++
 js/client-topbar.js | 16 ++++++++++++++++
 style/client.css    |  9 ++++++---
 4 files changed, 34 insertions(+), 3 deletions(-)

diff --git a/js/battledata.js b/js/battledata.js
index 574e21d07..8675f45c1 100644
--- a/js/battledata.js
+++ b/js/battledata.js
@@ -10,6 +10,12 @@ if (!window.exports) window.exports = window;
 if (window.soundManager) {
 	soundManager.setup({url:'https://play.pokemonshowdown.com/swf/'});
 	if (window.Replays) soundManager.onready(window.Replays.soundReady);
+	soundManager.onready(function () {
+		soundManager.createSound({
+			id: 'notif',
+			url: 'https://play.pokemonshowdown.com/audio/notification.wav'
+		});
+	});
 }
 
 window.nodewebkit = false;
diff --git a/js/client-chat.js b/js/client-chat.js
index 759a0a4fe..a7942c697 100644
--- a/js/client-chat.js
+++ b/js/client-chat.js
@@ -1118,6 +1118,9 @@
 			if (autoscroll) {
 				this.$chatFrame.scrollTop(this.$chat.height());
 			}
+			if (!app.focused && !Tools.prefs('muted') && Tools.prefs('notifvolume')) {
+				soundManager.getSoundById('notif').setVolume(Tools.prefs('notifvolume')).play();
+			}
 		},
 		addRow: function (line) {
 			var name, name2, room, action, silent, oldid;
@@ -1447,6 +1450,9 @@
 			}
 
 			if (mayNotify && isHighlighted) {
+				if (!Tools.prefs('muted') && Tools.prefs('notifvolume')) {
+					soundManager.getSoundById('notif').setVolume(Tools.prefs('notifvolume')).play();
+				}
 				var $lastMessage = this.$chat.children().last();
 				var notifyTitle = "Mentioned by " + name + (this.id === 'lobby' ? '' : " in " + this.title);
 				var notifyText = $lastMessage.html().indexOf('<span class="spoiler">') >= 0 ? '(spoiler)' : $lastMessage.children().last().text();
diff --git a/js/client-topbar.js b/js/client-topbar.js
index 8e8012953..a71d5a086 100644
--- a/js/client-topbar.js
+++ b/js/client-topbar.js
@@ -356,6 +356,7 @@
 			var muted = !!Tools.prefs('mute');
 			buf += '<p class="effect-volume"><label class="optlabel">Effect volume:</label>' + (muted ? '<em>(muted)</em>' : '<input type="slider" name="effectvolume" value="' + (Tools.prefs('effectvolume') || 50) + '" />') + '</p>';
 			buf += '<p class="music-volume"><label class="optlabel">Music volume:</label>' + (muted ? '<em>(muted)</em>' : '<input type="slider" name="musicvolume" value="' + (Tools.prefs('musicvolume') || 50) + '" />') + '</p>';
+			buf += '<p class="notif-volume"><label class="optlabel">Notification volume:</label>' + (muted ? '<em>(muted)</em>' : '<input type="slider" name="notifvolume" value="' + (Tools.prefs('notifvolume') || 50) + '" />') + '</p>';
 			buf += '<p><label class="optlabel"><input type="checkbox" name="muted"' + (muted ? ' checked' : '') + ' /> Mute sounds</label></p>';
 			this.$el.html(buf).css('min-width', 160);
 		},
@@ -384,6 +385,16 @@
 					self.setMusicVolume(val);
 				}
 			});
+			this.$('.notif-volume input').slider({
+				from: 0,
+				to: 100,
+				step: 1,
+				dimension: '%',
+				skin: 'round_plastic',
+				onstatechange: function (val) {
+					self.setNotifVolume(val);
+				}
+			});
 		},
 		setMute: function (e) {
 			var muted = !!e.currentTarget.checked;
@@ -393,10 +404,12 @@
 			if (!muted) {
 				this.$('.effect-volume').html('<label class="optlabel">Effect volume:</label><input type="slider" name="effectvolume" value="' + (Tools.prefs('effectvolume') || 50) + '" />');
 				this.$('.music-volume').html('<label class="optlabel">Music volume:</label><input type="slider" name="musicvolume" value="' + (Tools.prefs('musicvolume') || 50) + '" />');
+				this.$('.notif-volume').html('<label class="optlabel">Notification volume:</label><input type="slider" name="notifvolume" value="' + (Tools.prefs('notifvolume') || 50) + '" />');
 				this.domInitialize();
 			} else {
 				this.$('.effect-volume').html('<label class="optlabel">Effect volume:</label><em>(muted)</em>');
 				this.$('.music-volume').html('<label class="optlabel">Music volume:</label><em>(muted)</em>');
+				this.$('.notif-volume').html('<label class="optlabel">Notification volume:</label><em>(muted)</em>');
 			}
 
 			app.topbar.$('button[name=openSounds]').html('<i class="' + (muted ? 'fa fa-volume-off' : 'fa fa-volume-up') + '"></i>');
@@ -408,6 +421,9 @@
 		setMusicVolume: function (volume) {
 			BattleSound.setBgmVolume(volume);
 			Tools.prefs('musicvolume', volume);
+		},
+		setNotifVolume: function (volume) {
+			Tools.prefs('notifvolume', volume);
 		}
 	});
 
diff --git a/style/client.css b/style/client.css
index 8aff49810..3431b3e42 100644
--- a/style/client.css
+++ b/style/client.css
@@ -3024,16 +3024,19 @@ a.ilink.yours {
 }
 
 .effect-volume,
-.music-volume {
+.music-volume,
+.notif-volume {
 	height: 39px;
 }
 .effect-volume label,
-.music-volume label {
+.music-volume label,
+.notif-volume label {
 	padding-bottom: 12px;
 	font-size: 8pt;
 }
 .effect-volume em,
-.music-volume em {
+.music-volume em,
+.notif-volume em {
 	display: block;
 	margin-top: -6px;
 	font-size: 9pt;