From 074bbc71499c7d13bfc1eabd37574d75afc6e4e5 Mon Sep 17 00:00:00 2001 From: wmwragg Date: Wed, 27 Jul 2016 12:25:44 +0100 Subject: [PATCH] Added the two additiona states that don't yet exist on the backend, as faded and disabled options --- .../NotificationStateContextMenu.js | 37 ++++++++++++------- .../NotificationStateContextMenu.css | 4 ++ .../vector/img/icon-context-mute-mentions.svg | 11 ++++++ .../vector/img/icon-context-mute-off-copy.svg | 10 +++++ 4 files changed, 49 insertions(+), 13 deletions(-) create mode 100644 src/skins/vector/img/icon-context-mute-mentions.svg create mode 100644 src/skins/vector/img/icon-context-mute-off-copy.svg diff --git a/src/components/views/context_menus/NotificationStateContextMenu.js b/src/components/views/context_menus/NotificationStateContextMenu.js index 1813e20145..bea226a170 100644 --- a/src/components/views/context_menus/NotificationStateContextMenu.js +++ b/src/components/views/context_menus/NotificationStateContextMenu.js @@ -65,19 +65,8 @@ module.exports = React.createClass({ } }, - _onToggle: function(ev) { - switch (ev.target.value) { - case "all": - this._save(false); - break; - case "mute": - this._save(true); - break; - } - - if (this.props.onFinished) { - this.props.onFinished(); - }; + _onClickAlertMe: function() { + // Placeholder }, _onClickAllNotifs: function() { @@ -87,6 +76,10 @@ module.exports = React.createClass({ }; }, + _onClickMentions: function() { + // Placeholder + }, + _onClickMute: function() { this._save(true); if (this.props.onFinished) { @@ -97,11 +90,21 @@ module.exports = React.createClass({ render: function() { var cli = MatrixClientPeg.get(); + var alertMeClasses = classNames({ + 'mx_NotificationStateContextMenu_field': true, + 'mx_NotificationStateContextMenu_fieldDisabled': true, + }); + var allNotifsClasses = classNames({ 'mx_NotificationStateContextMenu_field': true, 'mx_NotificationStateContextMenu_fieldSet': !this.state.areNotifsMuted, }); + var mentionsClasses = classNames({ + 'mx_NotificationStateContextMenu_field': true, + 'mx_NotificationStateContextMenu_fieldDisabled': true, + }); + var muteNotifsClasses = classNames({ 'mx_NotificationStateContextMenu_field': true, 'mx_NotificationStateContextMenu_fieldSet': this.state.areNotifsMuted, @@ -109,11 +112,19 @@ module.exports = React.createClass({ return (
+
+ + Alert me +
{ !this.state.areNotifsMuted ? "ON" : "OFF" } All notifications
+
+ + Mentions only +
{ this.state.areNotifsMuted ? "ON" : "OFF" } diff --git a/src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css b/src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css index 57994d4690..009374b7c6 100644 --- a/src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css +++ b/src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css @@ -22,3 +22,7 @@ limitations under the License. .mx_NotificationStateContextMenu_field.mx_NotificationStateContextMenu_fieldSet { font-weight: bold; } + +.mx_NotificationStateContextMenu_field.mx_NotificationStateContextMenu_fieldDisabled { + color: rgba(0, 0, 0, 0.2); +} diff --git a/src/skins/vector/img/icon-context-mute-mentions.svg b/src/skins/vector/img/icon-context-mute-mentions.svg new file mode 100644 index 0000000000..46d5022e69 --- /dev/null +++ b/src/skins/vector/img/icon-context-mute-mentions.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/skins/vector/img/icon-context-mute-off-copy.svg b/src/skins/vector/img/icon-context-mute-off-copy.svg new file mode 100644 index 0000000000..f62eaa97d9 --- /dev/null +++ b/src/skins/vector/img/icon-context-mute-off-copy.svg @@ -0,0 +1,10 @@ + + + + + + + + + +