From 55a10ee2755c4628645ebaf9e6fa1c3465c47c13 Mon Sep 17 00:00:00 2001
From: wmwragg <wm.wragg@gmail.com>
Date: Thu, 28 Jul 2016 17:25:28 +0100
Subject: [PATCH] Mute state handled corrcectly

---
 .../context_menus/NotificationStateContextMenu.js   | 11 +++++++++++
 .../css/matrix-react-sdk/views/rooms/RoomTile.css   | 13 ++++++++++++-
 2 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/src/components/views/context_menus/NotificationStateContextMenu.js b/src/components/views/context_menus/NotificationStateContextMenu.js
index 879234fa..cadc8287 100644
--- a/src/components/views/context_menus/NotificationStateContextMenu.js
+++ b/src/components/views/context_menus/NotificationStateContextMenu.js
@@ -20,6 +20,7 @@ var q = require("q");
 var React = require('react');
 var classNames = require('classnames');
 var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg');
+var dis = require('matrix-react-sdk/lib/dispatcher');
 
 module.exports = React.createClass({
     displayName: 'NotificationStateContextMenu',
@@ -59,7 +60,17 @@ module.exports = React.createClass({
                 self.setState({areNotifsMuted: isMuted});
 
                 // delay slightly so that the user can see their state change
+                // before closing the menu
                 q.delay(500).then(function() {
+                    // tell everyone that wants to know of the change in
+                    // notification state
+                    dis.dispatch({
+                        action: 'notification_change',
+                        roomId: self.props.room.roomId,
+                        isMuted: isMuted,
+                    });
+
+                    // Close the context menu
                     if (self.props.onFinished) {
                         self.props.onFinished();
                     };
diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css
index 8a32993f..2490321e 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css
+++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css
@@ -22,6 +22,10 @@ limitations under the License.
     display: block;
 }
 
+.mx_RoomTile .mx_RoomTile_mute {
+    opacity: 0.4;
+}
+
 .mx_RoomTile_avatar {
     display: inline-block;
     padding-top: 6px;
@@ -121,11 +125,18 @@ limitations under the License.
     padding-right: 4px;
 }
 
-.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton, .mx_RoomTile.mx_RoomTile_menu .mx_RoomTile_badge  {
+.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton, .mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton.mx_RoomTile_badgeMute, .mx_RoomTile.mx_RoomTile_menu .mx_RoomTile_badge, .mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeButton.mx_RoomTile_badgeMute {
+    background-color: rgb(214, 214, 214);
     letter-spacing: 0.1em;
     opacity: 1;
 }
 
+.mx_RoomTile .mx_RoomTile_badge.mx_RoomTile_badgeMute {
+    background-color: rgba(0,0,0,0);
+    opacity: 1;
+    top: 4px;
+}
+
 .mx_RoomTile_unreadNotify .mx_RoomTile_badge {
     background-color: #76cfa6;
 }