From 4a341ed1ff154e9f1208384a544288d207394202 Mon Sep 17 00:00:00 2001
From: Claus Strasburger <claus@strasburger.de>
Date: Sun, 18 May 2014 12:48:19 +0200
Subject: [PATCH] Notifications: added possibility to modify volume.

---
 app/css/app.css                  | 31 +++++++++++++++++++++++++++++++
 app/js/controllers.js            | 14 +++++---------
 app/js/services.js               | 14 +++++++++-----
 app/partials/settings_modal.html |  6 +++---
 4 files changed, 48 insertions(+), 17 deletions(-)

diff --git a/app/css/app.css b/app/css/app.css
index 97d0e528..bac92f97 100644
--- a/app/css/app.css
+++ b/app/css/app.css
@@ -613,7 +613,38 @@ a.tg_radio_on:hover i.icon-radio {
   border-color: #5785aa;
 }
 
+a.tg_range {
+  padding-left: 45px;
+  color: #000;
+  display: block;
+  line-height: 18px;
+  margin: 8px 0;
+}
+
+a.tg_range:hover {
+  text-decoration: none;
+}
+
+a.tg_range input {
+  float: right;
+  display: inline-block;
+  background: #c7c7c7;
+  width: 150px;
+  height: 18px;
+  line-height: 18px;
+  vertical-align: middle;
+  padding: 4px;
+  border-radius: 10px;
+  overflow: hidden;
+  margin: 0 9px 0 0;
 
+}
+
+.tg_range_label {
+  display: inline-block;
+  line-height: 18px;
+  vertical-align: middle;
+}
 
 
 .tg_form_group {
diff --git a/app/js/controllers.js b/app/js/controllers.js
index 0d0eddcc..5ea865e1 100644
--- a/app/js/controllers.js
+++ b/app/js/controllers.js
@@ -1475,21 +1475,17 @@ angular.module('myApp.controllers', [])
       });
     };
 
-    AppConfigManager.get('notify_nodesktop', 'notify_nosound', 'send_ctrlenter').then(function (settings) {
+    AppConfigManager.get('notify_nodesktop', 'notify_volume', 'send_ctrlenter').then(function (settings) {
       $scope.notify.desktop = !settings[0];
-      $scope.notify.sound = !settings[1];
+      $scope.notify.volume = (settings[1] * 10).toFixed() || 0;
       $scope.send.enter = settings[2] ? '' : '1';
 
-      $scope.$watch('notify.sound', function(newValue, oldValue) {
+      $scope.$watch('notify.volume', function(newValue, oldValue) {
         if (newValue === oldValue) {
           return false;
         }
-        if (newValue) {
-          AppConfigManager.remove('notify_nosound');
-        } else {
-          AppConfigManager.set({notify_nosound: true});
-          NotificationsManager.clear();
-        }
+        AppConfigManager.set({notify_volume: newValue / 10});
+        NotificationsManager.clear();
       });
 
       $scope.$watch('notify.desktop', function(newValue, oldValue) {
diff --git a/app/js/services.js b/app/js/services.js
index fcb5927e..622d8cb0 100644
--- a/app/js/services.js
+++ b/app/js/services.js
@@ -3196,9 +3196,9 @@ angular.module('myApp.services', [])
       return false;
     }
 
-    AppConfigManager.get('notify_nosound').then(function (noSound) {
-      if (!noSound) {
-        playSound();
+    AppConfigManager.get('notify_volume').then(function (volume) {
+      if (volume != 0) {
+        playSound(volume);
       }
     })
 
@@ -3237,9 +3237,13 @@ angular.module('myApp.services', [])
     });
   };
 
-  function playSound () {
+  function playSound (volume) {
     var filename = 'img/sound_a.wav';
-    $('#notify_sound').html('<audio autoplay="autoplay"><source src="' + filename + '" type="audio/mpeg" /><embed hidden="true" autostart="true" loop="false" src="' + filename +'" /></audio>');
+    var obj = $('#notify_sound').html('<audio autoplay="autoplay">' +
+        '<source src="' + filename + '" type="audio/mpeg" />' +
+        '<embed hidden="true" autostart="true" loop="false" volume="' + (volume*100) +'" src="' + filename +'" />' +
+        '</audio>');
+    obj.find('audio')[0].volume = volume;
   }
 
   function notificationCancel (key) {
diff --git a/app/partials/settings_modal.html b/app/partials/settings_modal.html
index 5264b733..b01ab2d7 100644
--- a/app/partials/settings_modal.html
+++ b/app/partials/settings_modal.html
@@ -64,9 +64,9 @@
             <span class="tg_checkbox_label">Desktop notifications</span>
           </a>
 
-          <a class="tg_checkbox" ng-click="notify.sound = !notify.sound" ng-class="notify.sound ? 'tg_checkbox_on' : ''">
-            <span class="icon icon-checkbox-outer"><i class="icon-checkbox-inner"></i></span>
-            <span class="tg_checkbox_label">Sound</span>
+          <a class="tg_range">
+            <input class="tg_range" type="range" ng-model="notify.volume" min="0" max="10">
+            <span class="tg_range_label">Notification Volume</span>
           </a>
         </div>