Merge branch 'develop' into luke/feature-read-marker

src/components/structures/LoggedInView.js

@@ -106,6 +106,17 @@ export default React.createClass({
         var handled = false;
 
         switch (ev.keyCode) {
+            case KeyCode.ESCAPE:
+
+                // Implemented this way so possible handling for other pages is neater
+                switch (this.props.page_type) {
+                    case PageTypes.UserSettings:
+                        this.props.onUserSettingsClose();
+                        handled = true;
+                        break;
+                }
+
+                break;
             case KeyCode.UP:
             case KeyCode.DOWN:
                 if (ev.altKey) {

src/components/structures/MatrixChat.js

@@ -763,9 +763,11 @@ module.exports = React.createClass({
         });
 
         if (teamToken) {
+            // A team member has logged in, not a guest
             this._teamToken = teamToken;
             dis.dispatch({action: 'view_home_page'});
         } else if (this._is_registered) {
+            // The user has just logged in after registering
             dis.dispatch({action: 'view_user_settings'});
         } else {
             this._showScreenAfterLogin();
@@ -788,6 +790,10 @@ module.exports = React.createClass({
                 action: 'view_room',
                 room_id: localStorage.getItem('mx_last_room_id'),
             });
+        } else if (this._teamToken) {
+            // Team token might be set if we're a guest.
+            // Guests do not call _onLoggedIn with a teamToken
+            dis.dispatch({action: 'view_home_page'});
         } else {
             dis.dispatch({action: 'view_room_directory'});
         }

src/components/structures/ScrollPanel.js

@@ -345,7 +345,7 @@ module.exports = React.createClass({
         //
         // If backwards is true, we unpaginate (remove) tiles from the back (top).
         for (let i = 0; i < tiles.length; i++) {
-            const tile = tiles[backwards ? tiles.length - 1 - i : i];
+            const tile = tiles[backwards ? i : tiles.length - 1 - i];
             // Subtract height of tile as if it were unpaginated
             excessHeight -= tile.clientHeight;
             // The tile may not have a scroll token, so guard it

src/components/structures/UserSettings.js

@@ -264,10 +264,10 @@ module.exports = React.createClass({
             title: "Sign out?",
             description:
                 <div>
-                    For security, logging out will delete any end-to-end encryption keys from this browser,
-                    making previous encrypted chat history unreadable if you log back in.
-                    In future this <a href="https://github.com/vector-im/riot-web/issues/2108">will be improved</a>,
-                    but for now be warned.
+                    For security, logging out will delete any end-to-end encryption keys from this browser.
+
+                    If you want to be able to decrypt your conversation history from future Riot sessions,
+                    please export your room keys for safe-keeping.
                 </div>,
             button: "Sign out",
             extraButtons: [
@@ -441,10 +441,11 @@ module.exports = React.createClass({
     },
 
     _onClearCacheClicked: function() {
+        if (!PlatformPeg.get()) return;
+
+        MatrixClientPeg.get().stopClient();
         MatrixClientPeg.get().store.deleteAllData().done(() => {
-            // forceReload=false since we don't really need new HTML/JS files
-            // we just need to restart the JS runtime.
-            window.location.reload(false);
+            PlatformPeg.get().reload();
         });
     },
 

src/components/structures/login/ForgotPassword.js

@@ -93,11 +93,17 @@ module.exports = React.createClass({
                 description:
                     <div>
                         Resetting password will currently reset any end-to-end encryption keys on all devices,
-                        making encrypted chat history unreadable.
-                        In future this <a href="https://github.com/vector-im/riot-web/issues/2671">may be improved</a>,
-                        but for now be warned.
+                        making encrypted chat history unreadable, unless you first export your room keys
+                        and re-import them afterwards.
+                        In future this <a href="https://github.com/vector-im/riot-web/issues/2671">will be improved</a>.
                     </div>,
                 button: "Continue",
+                extraButtons: [
+                    <button className="mx_Dialog_primary"
+                            onClick={this._onExportE2eKeysClicked}>
+                        Export E2E room keys
+                    </button>
+                ],
                 onFinished: (confirmed) => {
                     if (confirmed) {
                         this.submitPasswordReset(
@@ -110,6 +116,18 @@ module.exports = React.createClass({
         }
     },
 
+    _onExportE2eKeysClicked: function() {
+        Modal.createDialogAsync(
+            (cb) => {
+                require.ensure(['../../../async-components/views/dialogs/ExportE2eKeysDialog'], () => {
+                    cb(require('../../../async-components/views/dialogs/ExportE2eKeysDialog'));
+                }, "e2e-export");
+            }, {
+                matrixClient: MatrixClientPeg.get(),
+            }
+        );
+    },
+
     onInputChanged: function(stateKey, ev) {
         this.setState({
             [stateKey]: ev.target.value

src/components/views/elements/AccessibleButton.js

@@ -32,6 +32,8 @@ export default function AccessibleButton(props) {
     };
     restProps.tabIndex = restProps.tabIndex || "0";
     restProps.role = "button";
+    restProps.className = (restProps.className ? restProps.className + " " : "") + 
+                          "mx_AccessibleButton";
     return React.createElement(element, restProps, children);
 }
 

src/components/views/elements/PowerSelector.js

@@ -16,17 +16,12 @@ limitations under the License.
 
 'use strict';
 
-var React = require('react');
-
-var roles = {
-    0: 'User',
-    50: 'Moderator',
-    100: 'Admin',
-};
+import React from 'react';
+import * as Roles from '../../../Roles';
 
 var reverseRoles = {};
-Object.keys(roles).forEach(function(key) {
-    reverseRoles[roles[key]] = key;
+Object.keys(Roles.LEVEL_ROLE_MAP).forEach(function(key) {
+    reverseRoles[Roles.LEVEL_ROLE_MAP[key]] = key;
 });
 
 module.exports = React.createClass({
@@ -49,7 +44,7 @@ module.exports = React.createClass({
 
     getInitialState: function() {
         return {
-            custom: (roles[this.props.value] === undefined),
+            custom: (Roles.LEVEL_ROLE_MAP[this.props.value] === undefined),
         };
     },
 
@@ -99,22 +94,34 @@ module.exports = React.createClass({
             selectValue = "Custom";
         }
         else {
-            selectValue = roles[this.props.value] || "Custom";
+            selectValue = Roles.LEVEL_ROLE_MAP[this.props.value] || "Custom";
         }
         var select;
         if (this.props.disabled) {
             select = <span>{ selectValue }</span>;
         }
         else {
+            // Each level must have a definition in LEVEL_ROLE_MAP
+            const levels = [0, 50, 100];
+            let options = levels.map((level) => {
+                return {
+                    value: Roles.LEVEL_ROLE_MAP[level],
+                    // Give a userDefault (users_default in the power event) of 0 but
+                    // because level !== undefined, this should never be used.
+                    text: Roles.textualPowerLevel(level, 0),
+                }
+            });
+            options.push({ value: "Custom", text: "Custom level" });
+            options = options.map((op) => {
+                return <option value={op.value}>{op.text}</option>;
+            });
+
             select =
                 <select ref="select"
                         value={ this.props.controlled ? selectValue : undefined }
                         defaultValue={ !this.props.controlled ? selectValue : undefined }
                         onChange={ this.onSelectChange }>
-                    <option value="User">User (0)</option>
-                    <option value="Moderator">Moderator (50)</option>
-                    <option value="Admin">Admin (100)</option>
-                    <option value="Custom">Custom level</option>
+                    { options }
                 </select>;
         }
 

src/components/views/messages/TextualBody.js

@@ -16,17 +16,18 @@ limitations under the License.
 
 'use strict';
 
-var React = require('react');
-var ReactDOM = require('react-dom');
-var highlight = require('highlight.js');
-var HtmlUtils = require('../../../HtmlUtils');
-var linkify = require('linkifyjs');
-var linkifyElement = require('linkifyjs/element');
-var linkifyMatrix = require('../../../linkify-matrix');
-var sdk = require('../../../index');
-var ScalarAuthClient = require("../../../ScalarAuthClient");
-var Modal = require("../../../Modal");
-var SdkConfig = require('../../../SdkConfig');
+import React from 'react';
+import ReactDOM from 'react-dom';
+import highlight from 'highlight.js';
+import * as HtmlUtils from '../../../HtmlUtils';
+import * as linkify from 'linkifyjs';
+import linkifyElement from 'linkifyjs/element';
+import linkifyMatrix from '../../../linkify-matrix';
+import sdk from '../../../index';
+import ScalarAuthClient from '../../../ScalarAuthClient';
+import Modal from '../../../Modal';
+import SdkConfig from '../../../SdkConfig';
+import dis from '../../../dispatcher';
 
 linkifyMatrix(linkify);
 
@@ -131,7 +132,8 @@ module.exports = React.createClass({
                     links.push(node);
                 }
             }
-            else if (node.tagName === "PRE" || node.tagName === "CODE") {
+            else if (node.tagName === "PRE" || node.tagName === "CODE" ||
+                    node.tagName === "BLOCKQUOTE") {
                 continue;
             }
             else if (node.children && node.children.length) {
@@ -187,6 +189,15 @@ module.exports = React.createClass({
         this.forceUpdate();
     },
 
+    onEmoteSenderClick: function(event) {
+        const mxEvent = this.props.mxEvent;
+        const name = mxEvent.sender ? mxEvent.sender.name : mxEvent.getSender();
+        dis.dispatch({
+            action: 'insert_displayname',
+            displayname: name.replace(' (IRC)', ''),
+        });
+    },
+
     getEventTileOps: function() {
         var self = this;
         return {
@@ -273,7 +284,15 @@ module.exports = React.createClass({
                 const name = mxEvent.sender ? mxEvent.sender.name : mxEvent.getSender();
                 return (
                     <span ref="content" className="mx_MEmoteBody mx_EventTile_content">
-                        * <EmojiText>{name}</EmojiText> { body }
+                        *&nbsp;
+                        <EmojiText
+                            className="mx_MEmoteBody_sender"
+                            onClick={this.onEmoteSenderClick}
+                        >
+                            {name}
+                        </EmojiText>
+                        &nbsp;
+                        { body }
                         { widgets }
                     </span>
                 );

src/components/views/rooms/EventTile.js

@@ -40,6 +40,7 @@ var eventTileTypes = {
     'm.room.third_party_invite' : 'messages.TextualEvent',
     'm.room.history_visibility' : 'messages.TextualEvent',
     'm.room.encryption' : 'messages.TextualEvent',
+    'm.room.power_levels' : 'messages.TextualEvent',
 };
 
 var MAX_READ_AVATARS = 5;

src/components/views/settings/ChangePassword.js

@@ -73,11 +73,17 @@ module.exports = React.createClass({
             description:
                 <div>
                     Changing password will currently reset any end-to-end encryption keys on all devices,
-                    making encrypted chat history unreadable.
-                    This will be <a href="https://github.com/vector-im/riot-web/issues/2671">improved shortly</a>,
-                    but for now be warned.
+                    making encrypted chat history unreadable, unless you first export your room keys
+                    and re-import them afterwards.
+                    In future this <a href="https://github.com/vector-im/riot-web/issues/2671">will be improved</a>.
                 </div>,
             button: "Continue",
+            extraButtons: [
+                <button className="mx_Dialog_primary"
+                        onClick={this._onExportE2eKeysClicked}>
+                    Export E2E room keys
+                </button>
+            ],
             onFinished: (confirmed) => {
                 if (confirmed) {
                     var authDict = {
@@ -105,6 +111,18 @@ module.exports = React.createClass({
         });
     },
 
+    _onExportE2eKeysClicked: function() {
+        Modal.createDialogAsync(
+            (cb) => {
+                require.ensure(['../../../async-components/views/dialogs/ExportE2eKeysDialog'], () => {
+                    cb(require('../../../async-components/views/dialogs/ExportE2eKeysDialog'));
+                }, "e2e-export");
+            }, {
+                matrixClient: MatrixClientPeg.get(),
+            }
+        );
+    },    
+
     onClickChange: function() {
         var old_password = this.refs.old_input.value;
         var new_password = this.refs.new_input.value;