Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-17 22:14:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
David Baker 2017-08-15 10:49:20 +01:00
commit be611f53e1
14 changed files with 174 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

109
src/components/structures/LeftPanel.js
View File

@ -16,17 +16,16 @@ limitations under the License.
'use strict';
var React = require('react');
var DragDropContext = require('react-dnd').DragDropContext;
var HTML5Backend = require('react-dnd-html5-backend');
var sdk = require('matrix-react-sdk')
var dis = require('matrix-react-sdk/lib/dispatcher');
import React from 'react';
import { DragDropContext } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';
import KeyCode from 'matrix-react-sdk/lib/KeyCode';
import sdk from 'matrix-react-sdk';
import dis from 'matrix-react-sdk/lib/dispatcher';
import MatrixClientPeg from 'matrix-react-sdk/lib/MatrixClientPeg';
var VectorConferenceHandler = require('../../VectorConferenceHandler');
var CallHandler = require("matrix-react-sdk/lib/CallHandler");
import CallHandler from 'matrix-react-sdk/lib/CallHandler';
import AccessibleButton from 'matrix-react-sdk/lib/components/views/elements/AccessibleButton';
import VectorConferenceHandler from '../../VectorConferenceHandler';
var LeftPanel = React.createClass({
displayName: 'LeftPanel',
@ -42,6 +41,10 @@ var LeftPanel = React.createClass({
};
},
componentWillMount: function() {
this.focusedElement = null;
},
componentDidMount: function() {
this.dispatcherRef = dis.register(this.onAction);
},
@ -64,6 +67,91 @@ var LeftPanel = React.createClass({
}
},
_onFocus: function(ev) {
this.focusedElement = ev.target;
},
_onBlur: function(ev) {
this.focusedElement = null;
},
_onKeyDown: function(ev) {
if (!this.focusedElement) return;
let handled = false;
switch (ev.keyCode) {
case KeyCode.UP:
this._onMoveFocus(true);
handled = true;
break;
case KeyCode.DOWN:
this._onMoveFocus(false);
handled = true;
break;
}
if (handled) {
ev.stopPropagation();
ev.preventDefault();
}
},
_onMoveFocus: function(up) {
var element = this.focusedElement;
// unclear why this isn't needed
// var descending = (up == this.focusDirection) ? this.focusDescending : !this.focusDescending;
// this.focusDirection = up;
var descending = false; // are we currently descending or ascending through the DOM tree?
var classes;
do {
var child = up ? element.lastElementChild : element.firstElementChild;
var sibling = up ? element.previousElementSibling : element.nextElementSibling;
if (descending) {
if (child) {
element = child;
}
else if (sibling) {
element = sibling;
}
else {
descending = false;
element = element.parentElement;
}
}
else {
if (sibling) {
element = sibling;
descending = true;
}
else {
element = element.parentElement;
}
}
if (element) {
classes = element.classList;
if (classes.contains("mx_LeftPanel")) { // we hit the top
element = up ? element.lastElementChild : element.firstElementChild;
descending = true;
}
}
} while(element && !(
classes.contains("mx_RoomTile") ||
classes.contains("mx_SearchBox_search") ||
classes.contains("mx_RoomSubList_ellipsis")));
if (element) {
element.focus();
this.focusedElement = element;
this.focusedDescending = descending;
}
},
_recheckCallElement: function(selectedRoomId) {
// if we aren't viewing a room with an ongoing call, but there is an
// active call, show the call element - we need to do this to make
@ -126,7 +214,8 @@ var LeftPanel = React.createClass({
}
return (
<aside className={classes} style={{ opacity: this.props.opacity }}>
<aside className={classes} style={{ opacity: this.props.opacity }}
onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }>
{ topBox }
{ callPreview }
<RoomList

35
src/components/structures/RightPanel.js
View File

@ -30,7 +30,8 @@ module.exports = React.createClass({
displayName: 'RightPanel',
propTypes: {
userId: React.PropTypes.string, // if showing an orphaned MemberInfo page, this is set
// TODO: We're trying to move away from these being props, but we need to know
// whether we should be displaying a room or group member list
roomId: React.PropTypes.string, // if showing panels for a given room, this is set
groupId: React.PropTypes.string, // if showing panels for a given group, this is set
collapsed: React.PropTypes.bool, // currently unused property to request for a minimized view of the panel
@ -58,24 +59,14 @@ module.exports = React.createClass({
}
},
componentWillReceiveProps: function(newprops) {
this.setState(this.getInitialState());
},
getInitialState: function() {
if (this.props.userId) {
const member = new Matrix.RoomMember(null, this.props.userId);
if (this.props.groupId) {
return {
phase: this.Phase.RoomMemberInfo,
member: member,
};
} else if (this.props.groupId) {
return {
phase: this.Phase.GroupMemberList
phase: this.Phase.GroupMemberList,
};
} else {
return {
phase: this.Phase.RoomMemberList
phase: this.Phase.RoomMemberList,
};
}
},
@ -153,6 +144,12 @@ module.exports = React.createClass({
});
}
}
} else if (payload.action === "view_group") {
this.setState({
phase: this.Phase.GroupMemberList,
groupId: payload.groupId,
member: null,
});
} else if (payload.action === "view_group_user") {
this.setState({
phase: this.Phase.GroupMemberInfo,
@ -160,11 +157,9 @@ module.exports = React.createClass({
member: payload.member,
});
} else if (payload.action === "view_room") {
if (this.state.phase === this.Phase.RoomMemberInfo) {
this.setState({
phase: this.Phase.RoomMemberList
});
}
this.setState({
phase: this.Phase.RoomMemberList
});
}
},
@ -253,7 +248,7 @@ module.exports = React.createClass({
panel = <GroupMemberList groupId={this.props.groupId} key={this.props.groupId} />
} else if (this.state.phase == this.Phase.RoomMemberInfo) {
const MemberInfo = sdk.getComponent('rooms.MemberInfo');
panel = <MemberInfo member={this.state.member} key={this.props.roomId || this.props.userId} />
panel = <MemberInfo member={this.state.member} key={this.props.roomId || this.state.member.userId} />
} else if (this.state.phase == this.Phase.GroupMemberInfo) {
const GroupMemberInfo = sdk.getComponent('groups.GroupMemberInfo');
panel = <GroupMemberInfo member={this.state.member} groupId={this.props.groupId} key={this.state.member.user_id} />

14
src/components/structures/RoomDirectory.js
View File

@ -82,7 +82,7 @@ module.exports = React.createClass({
return;
}
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to get protocol list from Home Server', '', ErrorDialog, {
title: _t('Failed to get protocol list from Home Server'),
description: _t('The Home Server may be too old to support third party networks'),
});
@ -178,7 +178,7 @@ module.exports = React.createClass({
this.setState({ loading: false });
console.error("Failed to get publicRooms: %s", JSON.stringify(err));
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to get public room list', '', ErrorDialog, {
title: _t('Failed to get public room list'),
description: ((err && err.message) ? err.message : _t('The server may be unavailable or overloaded'))
});
@ -206,7 +206,7 @@ module.exports = React.createClass({
desc = _t('Remove %(name)s from the directory?', {name: name});
}
Modal.createDialog(QuestionDialog, {
Modal.createTrackedDialog('Remove from Directory', '', QuestionDialog, {
title: _t('Remove from Directory'),
description: desc,
onFinished: (should_delete) => {
@ -227,7 +227,7 @@ module.exports = React.createClass({
modal.close();
this.refreshRoomList();
console.error("Failed to " + step + ": " + err);
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Remove from Directory Error', '', ErrorDialog, {
title: _t('Error'),
description: ((err && err.message) ? err.message : _t('The server may be unavailable or overloaded'))
});
@ -316,7 +316,7 @@ module.exports = React.createClass({
const fields = protocolName ? this._getFieldsForThirdPartyLocation(alias, this.protocols[protocolName], instance) : null;
if (!fields) {
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Unable to join network', '', ErrorDialog, {
title: _t('Unable to join network'),
description: _t('Riot does not know how to join a room on this network'),
});
@ -327,14 +327,14 @@ module.exports = React.createClass({
this.showRoomAlias(resp[0].alias);
} else {
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Room not found', '', ErrorDialog, {
title: _t('Room not found'),
description: _t('Couldn\'t find a matching Matrix room'),
});
}
}, (e) => {
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Fetching third party location failed', '', ErrorDialog, {
title: _t('Fetching third party location failed'),
description: _t('Unable to look up room ID from server'),
});

2
src/components/structures/RoomSubList.js
View File

@ -514,7 +514,7 @@ var RoomSubList = React.createClass({
}).catch(function(err) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
console.error("Failed to add tag " + self.props.tagName + " to room" + err);
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to add tag to room', '', ErrorDialog, {
title: _t('Failed to add tag %(tagName)s to room', {tagName: self.props.tagName}),
description: ((err && err.message) ? err.message : _t('Operation failed')),
});

24
src/components/views/context_menus/MessageContextMenu.js
View File

@ -72,7 +72,7 @@ module.exports = React.createClass({
onViewSourceClick: function() {
const ViewSource = sdk.getComponent('structures.ViewSource');
Modal.createDialog(ViewSource, {
Modal.createTrackedDialog('View Event Source', '', ViewSource, {
content: this.props.mxEvent.event,
}, 'mx_Dialog_viewsource');
this.closeMenu();
@ -80,7 +80,7 @@ module.exports = React.createClass({
onViewClearSourceClick: function() {
const ViewSource = sdk.getComponent('structures.ViewSource');
Modal.createDialog(ViewSource, {
Modal.createTrackedDialog('View Clear Event Source', '', ViewSource, {
// FIXME: _clearEvent is private
content: this.props.mxEvent._clearEvent,
}, 'mx_Dialog_viewsource');
@ -89,7 +89,7 @@ module.exports = React.createClass({
onRedactClick: function() {
const ConfirmRedactDialog = sdk.getComponent("dialogs.ConfirmRedactDialog");
Modal.createDialog(ConfirmRedactDialog, {
Modal.createTrackedDialog('Confirm Redact Dialog', '', ConfirmRedactDialog, {
onFinished: (proceed) => {
if (!proceed) return;
@ -99,7 +99,7 @@ module.exports = React.createClass({
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
// display error message stating you couldn't delete this.
const code = e.errcode || e.statusCode;
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('You cannot delete this message', '', ErrorDialog, {
title: _t('Error'),
description: _t('You cannot delete this message. (%(code)s)', {code: code})
});
@ -134,10 +134,9 @@ module.exports = React.createClass({
},
onQuoteClick: function() {
console.log(this.props.mxEvent);
dis.dispatch({
action: 'quote',
event: this.props.mxEvent,
text: this.props.eventTileOps.getInnerText(),
});
this.closeMenu();
},
@ -153,6 +152,7 @@ module.exports = React.createClass({
let unhidePreviewButton;
let permalinkButton;
let externalURLButton;
let quoteButton;
if (eventStatus === 'not_sent') {
resendButton = (
@ -221,11 +221,13 @@ module.exports = React.createClass({
</div>
);
const quoteButton = (
<div className="mx_MessageContextMenu_field" onClick={this.onQuoteClick}>
{ _t('Quote') }
</div>
);
if (this.props.eventTileOps && this.props.eventTileOps.getInnerText) {
quoteButton = (
<div className="mx_MessageContextMenu_field" onClick={this.onQuoteClick}>
{ _t('Quote') }
</div>
);
}
// Bridges can provide a 'external_url' to link back to the source.
if( typeof(this.props.mxEvent.event.content.external_url) === "string") {

8
src/components/views/context_menus/RoomTileContextMenu.js
View File

@ -70,7 +70,7 @@ module.exports = React.createClass({
};
}).catch(function(err) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to remove tag from room 1', '', ErrorDialog, {
title: _t('Failed to remove tag %(tagName)s from room', {tagName: tagNameOff}),
description: ((err && err.message) ? err.message : _t('Operation failed')),
});
@ -87,7 +87,7 @@ module.exports = React.createClass({
};
}).catch(function(err) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to remove tag from room 2', '', ErrorDialog, {
title: _t('Failed to remove tag %(tagName)s from room', {tagName: tagNameOn}),
description: ((err && err.message) ? err.message : _t('Operation failed')),
});
@ -148,7 +148,7 @@ module.exports = React.createClass({
};
}, (err) => {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to set Direct Message status of room', '', ErrorDialog, {
title: _t('Failed to set Direct Message status of room'),
description: ((err && err.message) ? err.message : _t('Operation failed')),
});
@ -187,7 +187,7 @@ module.exports = React.createClass({
}, function(err) {
var errCode = err.errcode || "unknown error code";
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to forget room', '', ErrorDialog, {
title: _t('Failed to forget room %(errCode)s', {errCode: errCode}),
description: ((err && err.message) ? err.message : _t('Operation failed')),
});

4
src/components/views/elements/ImageView.js
View File

@ -66,7 +66,7 @@ module.exports = React.createClass({
onRedactClick: function() {
const ConfirmRedactDialog = sdk.getComponent("dialogs.ConfirmRedactDialog");
Modal.createDialog(ConfirmRedactDialog, {
Modal.createTrackedDialog('Confirm Redact Dialog', 'Image View', ConfirmRedactDialog, {
onFinished: (proceed) => {
if (!proceed) return;
var self = this;
@ -76,7 +76,7 @@ module.exports = React.createClass({
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
// display error message stating you couldn't delete this.
var code = e.errcode || e.statusCode;
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('You cannot delete this image.', '', ErrorDialog, {
title: _t('Error'),
description: _t('You cannot delete this image. (%(code)s)', {code: code})
});

4
src/components/views/globals/NewVersionBar.js
View File

@ -40,7 +40,7 @@ export default React.createClass({
displayReleaseNotes: function(releaseNotes) {
const QuestionDialog = sdk.getComponent('dialogs.QuestionDialog');
Modal.createDialog(QuestionDialog, {
Modal.createTrackedDialog('Display release notes', '', QuestionDialog, {
title: _t("What's New"),
description: <pre className="changelog_text">{releaseNotes}</pre>,
button: _t("Update"),
@ -54,7 +54,7 @@ export default React.createClass({
displayChangelog: function() {
const ChangelogDialog = sdk.getComponent('dialogs.ChangelogDialog');
Modal.createDialog(ChangelogDialog, {
Modal.createTrackedDialog('Display Changelog', '', ChangelogDialog, {
version: this.props.version,
newVersion: this.props.newVersion,
onFinished: (update) => {

2
src/components/views/globals/PasswordNagBar.js
View File

@ -25,7 +25,7 @@ import { _t, _tJsx } from 'matrix-react-sdk/lib/languageHandler';
export default React.createClass({
onUpdateClicked: function() {
const SetPasswordDialog = sdk.getComponent('dialogs.SetPasswordDialog');
Modal.createDialog(SetPasswordDialog, {
Modal.createTrackedDialog('Set Password Dialog', 'Password Nag Bar', SetPasswordDialog, {
onFinished: (passwordChanged) => {
if (!passwordChanged) {
return;

6
src/components/views/rooms/DNDRoomTile.js
View File

@ -89,7 +89,7 @@ var roomTileSource = {
}, (err) => {
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
console.error("Failed to set direct chat tag " + err);
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to set direct chat tag', '', ErrorDialog, {
title: _t('Failed to set direct chat tag'),
description: ((err && err.message) ? err.message : _t('Operation failed')),
});
@ -114,7 +114,7 @@ var roomTileSource = {
}).catch(function(err) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
console.error("Failed to remove tag " + prevTag + " from room: " + err);
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to remove tag from room', '', ErrorDialog, {
title: _t('Failed to remove tag %(tagName)s from room', {tagName: prevTag}),
description: ((err && err.message) ? err.message : _t('Operation failed')),
});
@ -133,7 +133,7 @@ var roomTileSource = {
MatrixClientPeg.get().setRoomTag(item.room.roomId, newTag, newOrder).catch(function(err) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
console.error("Failed to add tag " + newTag + " to room: " + err);
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to add tag to room', '', ErrorDialog, {
title: _t('Failed to add tag %(tagName)s to room', {tagName: newTag}),
description: ((err && err.message) ? err.message : _t('Operation failed')),
});

10
src/components/views/settings/Notifications.js
View File

@ -131,7 +131,7 @@ module.exports = React.createClass({
this._refreshFromServer();
}, (error) => {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Error saving email notification preferences', '', ErrorDialog, {
title: _t('Error saving email notification preferences'),
description: _t('An error occurred whilst saving your email notification preferences.'),
});
@ -175,7 +175,7 @@ module.exports = React.createClass({
}
var TextInputDialog = sdk.getComponent("dialogs.TextInputDialog");
Modal.createDialog(TextInputDialog, {
Modal.createTrackedDialog('Keywords Dialog', '', TextInputDialog, {
title: _t('Keywords'),
description: _t('Enter keywords separated by a comma:'),
button: _t('OK'),
@ -241,7 +241,7 @@ module.exports = React.createClass({
}, function(error) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
console.error("Failed to change settings: " + error);
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to change settings', '', ErrorDialog, {
title: _t('Failed to change settings'),
description: ((error && error.message) ? error.message : _t('Operation failed')),
onFinished: self._refreshFromServer
@ -311,7 +311,7 @@ module.exports = React.createClass({
}, function(error) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
console.error("Can't update user notification settings: " + error);
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Can\'t update user notifcation settings', '', ErrorDialog, {
title: _t('Can\'t update user notification settings'),
description: ((error && error.message) ? error.message : _t('Operation failed')),
onFinished: self._refreshFromServer
@ -353,7 +353,7 @@ module.exports = React.createClass({
var onError = function(error) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
console.error("Failed to update keywords: " + error);
Modal.createDialog(ErrorDialog, {
Modal.createTrackedDialog('Failed to update keywords', '', ErrorDialog, {
title: _t('Failed to update keywords'),
description: ((error && error.message) ? error.message : _t('Operation failed')),
onFinished: self._refreshFromServer

13
src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss
View File

@ -265,3 +265,16 @@ limitations under the License.
margin: 3px;
vertical-align: top;
}
.mx_Login_language {
margin-left: auto;
margin-right: auto;
min-width: 60%;
}
.mx_Login_language_div {
display: flex;
margin-top: 12px;
margin-bottom: 12px;
}

16
src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss
View File

@ -18,6 +18,12 @@ limitations under the License.
padding: 10px 0px;
}
.mx_MemberDeviceInfo.mx_DeviceVerifyButtons {
padding: 6px 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.mx_MemberDeviceInfo_textButton {
color: $accent-fg-color;
@ -26,12 +32,11 @@ limitations under the License.
text-align: center;
padding-left: 1em;
padding-right: 1em;
width: 95px;
border: 0px;
font-size: 14px;
cursor: pointer;
display: inline;
margin: 2px;
flex: 1;
}
.mx_MemberDeviceInfo_deviceId {
@ -44,11 +49,6 @@ limitations under the License.
border-bottom: 1px solid rgba(0,0,0,0.1);
}
.mx_MemberDeviceInfo_blacklist,
.mx_MemberDeviceInfo_unblacklist {
float: right;
}
/* "Unblacklist" is too long for a regular button: make it wider and
reduce the padding. */
.mx_EncryptedEventDialog .mx_MemberDeviceInfo_blacklist,

1
src/skins/vector/css/matrix-react-sdk/views/rooms/_MessageComposer.scss
View File

@ -105,6 +105,7 @@ limitations under the License.
.mx_MessageComposer_input .public-DraftEditor-content {
max-height: 120px;
min-height: 21px;
overflow: auto;
}