From e5f4fa8c467830745a77d281ab90347230a3b6c3 Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Wed, 27 Jan 2016 17:58:47 +0000
Subject: [PATCH 1/3] Add warning bar for guest users. Fixes
 https://github.com/vector-im/vector-web/issues/770

---
 src/components/structures/RoomView.js | 40 +++++++++++++++++++++------
 1 file changed, 32 insertions(+), 8 deletions(-)

diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js
index a2a308ed5c..12acdc21fd 100644
--- a/src/components/structures/RoomView.js
+++ b/src/components/structures/RoomView.js
@@ -1474,6 +1474,16 @@ module.exports = React.createClass({
         }
     },
 
+    onRegisterClicked: function() {
+        dis.dispatch({'action': 'logout'});
+        dis.dispatch({'action': 'start_registration'});
+    },
+
+    onLoginClicked: function() {
+        dis.dispatch({'action': 'logout'});
+        dis.dispatch({'action': 'start_login'});
+    },
+
     render: function() {
         var RoomHeader = sdk.getComponent('rooms.RoomHeader');
         var MessageComposer = sdk.getComponent('rooms.MessageComposer');
@@ -1581,13 +1591,13 @@ module.exports = React.createClass({
                 // a connection!
                 if (this.state.syncState === "ERROR") {
                     statusBar = (
-                        <div className="mx_RoomView_connectionLostBar">
+                        <div className="mx_RoomView_warningBar">
                             <img src="img/warning.svg" width="24" height="23" title="/!\ " alt="/!\ "/>
-                            <div className="mx_RoomView_connectionLostBar_textArea">
-                                <div className="mx_RoomView_connectionLostBar_title">
+                            <div className="mx_RoomView_warningBar_textArea">
+                                <div className="mx_RoomView_warningBar_title">
                                     Connectivity to the server has been lost.
                                 </div>
-                                <div className="mx_RoomView_connectionLostBar_desc">
+                                <div className="mx_RoomView_warningBar_desc">
                                     Sent messages will be stored until your connection has returned.
                                 </div>
                             </div>
@@ -1611,13 +1621,13 @@ module.exports = React.createClass({
                 }
                 else if (this.state.hasUnsentMessages) {
                     statusBar = (
-                        <div className="mx_RoomView_connectionLostBar">
+                        <div className="mx_RoomView_warningBar">
                             <img src="img/warning.svg" width="24" height="23" title="/!\ " alt="/!\ "/>
-                            <div className="mx_RoomView_connectionLostBar_textArea">
-                                <div className="mx_RoomView_connectionLostBar_title">
+                            <div className="mx_RoomView_warningBar_textArea">
+                                <div className="mx_RoomView_warningBar_title">
                                     Some of your messages have not been sent.
                                 </div>
-                                <div className="mx_RoomView_connectionLostBar_desc">
+                                <div className="mx_RoomView_warningBar_desc">
                                     <a className="mx_RoomView_resend_link"
                                         onClick={ this.onResendAllClick }>
                                     Resend all now
@@ -1651,6 +1661,20 @@ module.exports = React.createClass({
                             <img src="img/scrolldown.svg" width="24" height="24" alt="Scroll to bottom of page" title="Scroll to bottom of page"/>
                         </div>                        
                     );
+                } else if (MatrixClientPeg.get().isGuest()) {
+                    statusBar = (
+                        <div className="mx_RoomView_warningBar">
+                            <img src="img/warning.svg" width="24" height="23" title="/!\ " alt="/!\ "/>
+                            <div className="mx_RoomView_warningBar_textArea">
+                                <div className="mx_RoomView_warningBar_title">
+                                    You are using Vector as a guest.
+                                </div>
+                                <div className="mx_RoomView_warningBar_desc">
+                                    <a onClick={this.onRegisterClicked}>Register</a> or <a onClick={this.onLoginClicked}>log in</a> to access more rooms and features.
+                                </div>
+                            </div>
+                        </div>
+                    );
                 }
             }
 

From 796a2e5e3a18ebbaa60d01dd8b3478cbfeeac99a Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Thu, 28 Jan 2016 11:15:43 +0000
Subject: [PATCH 2/3] Revert e5f4fa8c467830745a77d281ab90347230a3b6c3 as it's
 no longer what's desired.

---
 src/components/structures/RoomView.js | 40 ++++++---------------------
 1 file changed, 8 insertions(+), 32 deletions(-)

diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js
index 12acdc21fd..a2a308ed5c 100644
--- a/src/components/structures/RoomView.js
+++ b/src/components/structures/RoomView.js
@@ -1474,16 +1474,6 @@ module.exports = React.createClass({
         }
     },
 
-    onRegisterClicked: function() {
-        dis.dispatch({'action': 'logout'});
-        dis.dispatch({'action': 'start_registration'});
-    },
-
-    onLoginClicked: function() {
-        dis.dispatch({'action': 'logout'});
-        dis.dispatch({'action': 'start_login'});
-    },
-
     render: function() {
         var RoomHeader = sdk.getComponent('rooms.RoomHeader');
         var MessageComposer = sdk.getComponent('rooms.MessageComposer');
@@ -1591,13 +1581,13 @@ module.exports = React.createClass({
                 // a connection!
                 if (this.state.syncState === "ERROR") {
                     statusBar = (
-                        <div className="mx_RoomView_warningBar">
+                        <div className="mx_RoomView_connectionLostBar">
                             <img src="img/warning.svg" width="24" height="23" title="/!\ " alt="/!\ "/>
-                            <div className="mx_RoomView_warningBar_textArea">
-                                <div className="mx_RoomView_warningBar_title">
+                            <div className="mx_RoomView_connectionLostBar_textArea">
+                                <div className="mx_RoomView_connectionLostBar_title">
                                     Connectivity to the server has been lost.
                                 </div>
-                                <div className="mx_RoomView_warningBar_desc">
+                                <div className="mx_RoomView_connectionLostBar_desc">
                                     Sent messages will be stored until your connection has returned.
                                 </div>
                             </div>
@@ -1621,13 +1611,13 @@ module.exports = React.createClass({
                 }
                 else if (this.state.hasUnsentMessages) {
                     statusBar = (
-                        <div className="mx_RoomView_warningBar">
+                        <div className="mx_RoomView_connectionLostBar">
                             <img src="img/warning.svg" width="24" height="23" title="/!\ " alt="/!\ "/>
-                            <div className="mx_RoomView_warningBar_textArea">
-                                <div className="mx_RoomView_warningBar_title">
+                            <div className="mx_RoomView_connectionLostBar_textArea">
+                                <div className="mx_RoomView_connectionLostBar_title">
                                     Some of your messages have not been sent.
                                 </div>
-                                <div className="mx_RoomView_warningBar_desc">
+                                <div className="mx_RoomView_connectionLostBar_desc">
                                     <a className="mx_RoomView_resend_link"
                                         onClick={ this.onResendAllClick }>
                                     Resend all now
@@ -1661,20 +1651,6 @@ module.exports = React.createClass({
                             <img src="img/scrolldown.svg" width="24" height="24" alt="Scroll to bottom of page" title="Scroll to bottom of page"/>
                         </div>                        
                     );
-                } else if (MatrixClientPeg.get().isGuest()) {
-                    statusBar = (
-                        <div className="mx_RoomView_warningBar">
-                            <img src="img/warning.svg" width="24" height="23" title="/!\ " alt="/!\ "/>
-                            <div className="mx_RoomView_warningBar_textArea">
-                                <div className="mx_RoomView_warningBar_title">
-                                    You are using Vector as a guest.
-                                </div>
-                                <div className="mx_RoomView_warningBar_desc">
-                                    <a onClick={this.onRegisterClicked}>Register</a> or <a onClick={this.onLoginClicked}>log in</a> to access more rooms and features.
-                                </div>
-                            </div>
-                        </div>
-                    );
                 }
             }
 

From 83119d21d604319130ebdba7801bd7459bb08b52 Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Thu, 28 Jan 2016 12:59:51 +0000
Subject: [PATCH 3/3] New style guest warning bar

---
 src/components/structures/MatrixChat.js | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js
index 3184380005..0ac6e7f490 100644
--- a/src/components/structures/MatrixChat.js
+++ b/src/components/structures/MatrixChat.js
@@ -808,6 +808,7 @@ module.exports = React.createClass({
         var CreateRoom = sdk.getComponent('structures.CreateRoom');
         var RoomDirectory = sdk.getComponent('structures.RoomDirectory');
         var MatrixToolbar = sdk.getComponent('globals.MatrixToolbar');
+        var GuestWarningBar = sdk.getComponent('globals.GuestWarningBar');
         var ForgotPassword = sdk.getComponent('structures.login.ForgotPassword');
 
         // needs to be before normal PageTypes as you are logged in technically
@@ -848,7 +849,20 @@ module.exports = React.createClass({
             }
 
             // TODO: Fix duplication here and do conditionals like we do above
-            if (Notifier.supportsDesktopNotifications() && !Notifier.isEnabled() && !Notifier.isToolbarHidden()) {
+            if (MatrixClientPeg.get().isGuest()) {
+                return (
+                        <div className="mx_MatrixChat_wrapper">
+                            <GuestWarningBar />
+                            <div className="mx_MatrixChat mx_MatrixChat_toolbarShowing">
+                                <LeftPanel selectedRoom={this.state.currentRoom} collapsed={this.state.collapse_lhs} />
+                                <main className="mx_MatrixChat_middlePanel">
+                                    {page_element}
+                                </main>
+                                {right_panel}
+                            </div>
+                        </div>
+                );
+            } else if (Notifier.supportsDesktopNotifications() && !Notifier.isEnabled() && !Notifier.isToolbarHidden()) {
                 return (
                         <div className="mx_MatrixChat_wrapper">
                             <MatrixToolbar />