Merge pull request #374 from nickago/MM-1299

MM-1299 Fixes problem of two notification sounds in firefox

3 files changed, 30 insertions, 9 deletions

diff --git a/web/react/components/setting_item_min.jsx b/web/react/components/setting_item_min.jsx
index 2209c74d1..3c87e416e 100644
--- a/web/react/components/setting_item_min.jsx
+++ b/web/react/components/setting_item_min.jsx
@@ -2,12 +2,23 @@
 // See License.txt for license information.
 
 module.exports = React.createClass({
+    displayName: 'SettingsItemMin',
+    propTypes: {
+        title: React.PropTypes.string,
+        disableOpen: React.PropTypes.bool,
+        updateSection: React.PropTypes.func,
+        describe: React.PropTypes.string
+    },
     render: function() {
+        var editButton = '';
+        if (!this.props.disableOpen) {
+            editButton = <li className='col-sm-2 section-edit'><a className='section-edit theme' href='#' onClick={this.props.updateSection}>Edit</a></li>;
+        }
         return (
-            <ul className="section-min">
-                <li className="col-sm-10 section-title">{this.props.title}</li>
-                <li className="col-sm-2 section-edit"><a className="section-edit theme" href="#" onClick={this.props.updateSection}>Edit</a></li>
-                <li className="col-sm-7 section-describe">{this.props.describe}</li>
+            <ul className='section-min'>
+                <li className='col-sm-10 section-title'>{this.props.title}</li>
+                {editButton}
+                <li className='col-sm-7 section-describe'>{this.props.describe}</li>
             </ul>
         );
     }
diff --git a/web/react/components/user_settings.jsx b/web/react/components/user_settings.jsx
index a5fa01dc9..8f29bbe57 100644
--- a/web/react/components/user_settings.jsx
+++ b/web/react/components/user_settings.jsx
@@ -13,6 +13,7 @@ var assign = require('object-assign');
 
 function getNotificationsStateFromStores() {
     var user = UserStore.getCurrentUser();
+    var soundNeeded = !utils.isBrowserFirefox();
     var sound = (!user.notify_props || user.notify_props.desktop_sound == undefined) ? "true" : user.notify_props.desktop_sound;
     var desktop = (!user.notify_props || user.notify_props.desktop == undefined) ? "all" : user.notify_props.desktop;
     var email = (!user.notify_props || user.notify_props.email == undefined) ? "true" : user.notify_props.email;
@@ -58,7 +59,7 @@ function getNotificationsStateFromStores() {
         }
     }
 
-    return { notify_level: desktop, enable_email: email, enable_sound: sound, username_key: username_key, mention_key: mention_key, custom_keys: custom_keys, custom_keys_checked: custom_keys.length > 0, first_name_key: first_name_key, all_key: all_key, channel_key: channel_key };
+    return { notify_level: desktop, enable_email: email, soundNeeded: soundNeeded, enable_sound: sound, username_key: username_key, mention_key: mention_key, custom_keys: custom_keys, custom_keys_checked: custom_keys.length > 0, first_name_key: first_name_key, all_key: all_key, channel_key: channel_key };
 }
 
 
@@ -235,7 +236,7 @@ var NotificationsTab = React.createClass({
         }
 
         var soundSection;
-        if (this.props.activeSection === 'sound') {
+        if (this.props.activeSection === 'sound' && this.state.soundNeeded) {
             var soundActive = ["",""];
             if (this.state.enable_sound === "false") {
                 soundActive[1] = "active";
@@ -265,7 +266,9 @@ var NotificationsTab = React.createClass({
             );
         } else {
             var describe = "";
-            if (this.state.enable_sound === "false") {
+            if (!this.state.soundNeeded) {
+                describe = "Please configure notification sounds in your browser settings"
+            } else if (this.state.enable_sound === "false") {
                 describe = "Off";
             } else {
                 describe = "On";
@@ -276,6 +279,7 @@ var NotificationsTab = React.createClass({
                     title="Desktop notification sounds"
                     describe={describe}
                     updateSection={function(){self.props.updateSection("sound");}}
+                    disableOpen = {!this.state.soundNeeded}
                 />
             );
         }
diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx
index 7591c138f..2312fe225 100644
--- a/web/react/utils/utils.jsx
+++ b/web/react/utils/utils.jsx
@@ -124,8 +124,10 @@ module.exports.notifyMe = function(title, body, channel) {
 }
 
 module.exports.ding = function() {
-  var audio = new Audio('/static/images/ding.mp3');
-  audio.play();
+    if (!module.exports.isBrowserFirefox()) {
+        var audio = new Audio('/static/images/ding.mp3');
+        audio.play();
+    }
 }
 
 module.exports.getUrlParameter = function(sParam) {
@@ -945,3 +947,7 @@ module.exports.generateId = function() {
 
     return id;
 };
+
+module.exports.isBrowserFirefox = function() {
+    return navigator && navigator.userAgent && navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
+}