Merge remote-tracking branch 'origin/develop' into dbkr/show_invited_email

src/components/structures/RoomView.js

@@ -525,16 +525,22 @@ module.exports = React.createClass({
                     var SetDisplayNameDialog = sdk.getComponent('views.dialogs.SetDisplayNameDialog');
                     var dialog_defer = q.defer();
                     var dialog_ref;
-                    var modal;
-                    var dialog_instance = <SetDisplayNameDialog currentDisplayName={result.displayname} ref={(r) => {
+                    Modal.createDialog(SetDisplayNameDialog, {
+                        currentDisplayName: result.displayname,
+                        ref: (r) => {
                             dialog_ref = r;
-                    }} onFinished={() => {
-                        cli.setDisplayName(dialog_ref.getValue()).done(() => {
-                            dialog_defer.resolve();
-                        });
-                        modal.close();
-                    }} />
-                    modal = Modal.createDialogWithElement(dialog_instance);
+                        },
+                        onFinished: (submitted) => {
+                            if (submitted) {
+                                cli.setDisplayName(dialog_ref.getValue()).done(() => {
+                                    dialog_defer.resolve();
+                                });
+                            }
+                            else {
+                                dialog_defer.reject();
+                            }
+                        }
+                    });
                     return dialog_defer.promise;
                 }
             });
@@ -565,6 +571,8 @@ module.exports = React.createClass({
                 joining: false,
                 joinError: error
             });
+
+            if (!error) return;
             var msg = error.message ? error.message : JSON.stringify(error);
             var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
             Modal.createDialog(ErrorDialog, {
@@ -1118,6 +1126,7 @@ module.exports = React.createClass({
                                                 spinner={this.state.joining}
                                                 inviterName={inviterName}
                                                 invitedEmail={invitedEmail}
+                                                room={this.state.room}
                                 />
                             </div>
                             <div className="mx_RoomView_messagePanel"></div>
@@ -1159,6 +1168,7 @@ module.exports = React.createClass({
                                             inviterName={ inviterName }
                                             canJoin={ true } canPreview={ false }
                                             spinner={this.state.joining}
+                                            room={this.state.room}                                            
                             />
                         </div>
                         <div className="mx_RoomView_messagePanel"></div>
@@ -1238,6 +1248,7 @@ module.exports = React.createClass({
                                 inviterName={inviterName}
                                 invitedEmail={invitedEmail}
                                 canPreview={this.state.canPeek}
+                                room={this.state.room}                                
                 />
             );
         }

src/components/structures/ScrollPanel.js

@@ -19,7 +19,7 @@ var ReactDOM = require("react-dom");
 var GeminiScrollbar = require('react-gemini-scrollbar');
 var q = require("q");
 
-var DEBUG_SCROLL = false;
+var DEBUG_SCROLL = true;
 
 if (DEBUG_SCROLL) {
     // using bind means that we get to keep useful line numbers in the console

src/components/structures/UserSettings.js

@@ -126,9 +126,7 @@ module.exports = React.createClass({
 
     onLogoutClicked: function(ev) {
         var LogoutPrompt = sdk.getComponent('dialogs.LogoutPrompt');
-        this.logoutModal = Modal.createDialog(
-            LogoutPrompt, {onCancel: this.onLogoutPromptCancel}
-        );
+        this.logoutModal = Modal.createDialog(LogoutPrompt);
     },
 
     onPasswordChangeError: function(err) {
@@ -162,10 +160,6 @@ module.exports = React.createClass({
         });
     },
 
-    onLogoutPromptCancel: function() {
-        this.logoutModal.closeDialog();
-    },
-
     onEnableNotificationsChange: function(event) {
         UserSettingsStore.setEnableNotifications(event.target.checked);
     },

src/components/views/dialogs/ErrorDialog.js

@@ -31,6 +31,10 @@ module.exports = React.createClass({
     displayName: 'ErrorDialog',
     propTypes: {
         title: React.PropTypes.string,
+        description: React.PropTypes.oneOfType([
+            React.PropTypes.element,
+            React.PropTypes.string,
+        ]),
         button: React.PropTypes.string,
         focus: React.PropTypes.bool,
         onFinished: React.PropTypes.func.isRequired,

src/components/views/dialogs/QuestionDialog.js

@@ -20,7 +20,10 @@ module.exports = React.createClass({
     displayName: 'QuestionDialog',
     propTypes: {
         title: React.PropTypes.string,
-        description: React.PropTypes.string,
+        description: React.PropTypes.oneOfType([
+            React.PropTypes.element,
+            React.PropTypes.string,
+        ]),
         button: React.PropTypes.string,
         focus: React.PropTypes.bool,
         onFinished: React.PropTypes.func.isRequired,

src/components/views/dialogs/SetDisplayNameDialog.js

@@ -54,7 +54,7 @@ module.exports = React.createClass({
 
     onFormSubmit: function(ev) {
         ev.preventDefault();
-        this.props.onFinished();
+        this.props.onFinished(true);
         return false;
     },
 

src/components/views/dialogs/TextInputDialog.js

@@ -20,7 +20,10 @@ module.exports = React.createClass({
     displayName: 'TextInputDialog',
     propTypes: {
         title: React.PropTypes.string,
-        description: React.PropTypes.string,
+        description: React.PropTypes.oneOfType([
+            React.PropTypes.element,
+            React.PropTypes.string,
+        ]),
         value: React.PropTypes.string,
         button: React.PropTypes.string,
         focus: React.PropTypes.bool,

src/components/views/rooms/EventTile.js

@@ -268,10 +268,17 @@ module.exports = React.createClass({
         this.readAvatarNode = ReactDom.findDOMNode(node);
     },
 
-    onMemberAvatarClicked: function(sender) {
+    onMemberAvatarClick: function(event) {
         dispatcher.dispatch({
             action: 'view_user',
-            member: sender
+            member: this.props.mxEvent.sender,
+        });
+    },
+
+    onSenderProfileClick: function(event) {
+        dispatcher.dispatch({
+            action: 'insert_displayname',
+            displayname: this.props.mxEvent.sender.name,
         });
     },
 
@@ -318,12 +325,12 @@ module.exports = React.createClass({
                 avatar = (
                     <div className="mx_EventTile_avatar">
                         <MemberAvatar member={this.props.mxEvent.sender} width={24} height={24}
-                         onClick={ this.onMemberAvatarClicked.bind(this, this.props.mxEvent.sender) } />
+                         onClick={ this.onMemberAvatarClick } />
                     </div>
                 );
             }
             if (EventTileType.needsSenderProfile()) {
-                sender = <SenderProfile mxEvent={this.props.mxEvent} aux={aux} />;
+                sender = <SenderProfile onClick={ this.onSenderProfileClick } mxEvent={this.props.mxEvent} aux={aux} />;
             }
         }
         return (

src/components/views/rooms/MemberList.js

@@ -217,11 +217,8 @@ module.exports = React.createClass({
         console.log(
             "Invite %s to %s - isEmail=%s", inputText, this.props.roomId, isEmailAddress
         );
-        promise.done(function(res) {
+        promise.then(function(res) {
             console.log("Invited %s", inputText);
-            self.setState({
-                inviting: false
-            });
         }, function(err) {
             if (err !== null) {
                 console.error("Failed to invite: %s", JSON.stringify(err));
@@ -230,9 +227,17 @@ module.exports = React.createClass({
                     description: err.message
                 });
             }
+        }).finally(function() {
             self.setState({
                 inviting: false
             });
+            // XXX: hacky focus on the invite box
+            setTimeout(function() {
+                var inviteBox = document.getElementById("mx_SearchableEntityList_query");
+                if (inviteBox) {
+                    inviteBox.focus();
+                }
+            }, 0);
         });
     },
 

src/components/views/rooms/MessageComposer.js

@@ -192,9 +192,29 @@ module.exports = React.createClass({
     },
 
     onAction: function(payload) {
+        var textarea = this.refs.textarea;
         switch (payload.action) {
             case 'focus_composer':
-                this.refs.textarea.focus();
+                textarea.focus();
+                break;
+            case 'insert_displayname':
+                if (textarea.value.length) {
+                    var left = textarea.value.substring(0, textarea.selectionStart);
+                    var right = textarea.value.substring(textarea.selectionEnd);
+                    if (right.length) {
+                        left += payload.displayname;
+                    }
+                    else {
+                        left = left.replace(/( ?)$/, " " + payload.displayname);
+                    }
+                    textarea.value = left + right;
+                    textarea.focus();
+                    textarea.setSelectionRange(left.length, left.length);
+                }
+                else {
+                    textarea.value = payload.displayname + ": ";
+                    textarea.focus();
+                }
                 break;
         }
     },
@@ -497,7 +517,7 @@ module.exports = React.createClass({
                         <MemberAvatar member={me} width={24} height={24} />
                     </div>
                     <div className="mx_MessageComposer_input" onClick={ this.onInputClick }>
-                        <textarea ref="textarea" rows="1" onKeyDown={this.onKeyDown} onKeyUp={this.onKeyUp} placeholder="Type a message..." />
+                        <textarea autoFocus ref="textarea" rows="1" onKeyDown={this.onKeyDown} onKeyUp={this.onKeyUp} placeholder="Type a message..." />
                     </div>
                     <div className="mx_MessageComposer_upload" onClick={this.onUploadClick} title="Upload file">
                         <TintableSvg src="img/upload.svg" width="19" height="24"/>

src/components/views/rooms/RoomPreviewBar.js

@@ -36,6 +36,7 @@ module.exports = React.createClass({
         canJoin: React.PropTypes.bool,
         canPreview: React.PropTypes.bool,
         spinner: React.PropTypes.bool,
+        room: React.PropTypes.object,
     },
 
     getDefaultProps: function() {
@@ -110,10 +111,13 @@ module.exports = React.createClass({
 
         }
         else if (this.props.canJoin) {
+            var name = this.props.room ? this.props.room.name : "";
+            name = name ? <b>{ name }</b> : "a room";
             joinBlock = (
                 <div>
                     <div className="mx_RoomPreviewBar_join_text">
-                        Would you like to <a onClick={ this.props.onJoinClick }>join</a> this room?
+                        You are trying to access { name }.<br/>
+                        Would you like to <a onClick={ this.props.onJoinClick }>join</a> in order to participate in the discussion?
                     </div>
                 </div>
             );