Merge remote-tracking branch 'vector-im/develop' into travis/presence

This commit is contained in:
Travis Ralston 2017-10-25 11:27:22 -06:00
commit 45ca890f68
57 changed files with 10231 additions and 841 deletions

View file

@ -19,6 +19,7 @@ limitations under the License.
import React from 'react';
import { DragDropContext } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';
import classNames from 'classnames';
import KeyCode from 'matrix-react-sdk/lib/KeyCode';
import sdk from 'matrix-react-sdk';
import dis from 'matrix-react-sdk/lib/dispatcher';
@ -55,7 +56,7 @@ var LeftPanel = React.createClass({
// We just need to update if any of these things change.
if (
this.props.collapsed !== nextProps.collapsed ||
this.props.opacity !== nextProps.opacity
this.props.disabled !== nextProps.disabled
) {
return true;
}
@ -176,14 +177,16 @@ var LeftPanel = React.createClass({
topBox = <SearchBox collapsed={ this.props.collapsed } onSearch={ this.onSearch } />;
}
let classes = "mx_LeftPanel mx_fadable";
if (this.props.collapsed) {
classes += " collapsed";
}
let classes = classNames(
"mx_LeftPanel", "mx_fadable",
{
"collapsed": this.props.collapsed,
"mx_fadable_faded": this.props.disabled,
}
);
return (
<aside className={classes} style={{ opacity: this.props.opacity }}
onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }>
<aside className={classes} onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }>
{ topBox }
<CallPreview ConferenceHandler={VectorConferenceHandler} />
<RoomList

View file

@ -18,14 +18,16 @@ limitations under the License.
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { _t } from 'matrix-react-sdk/lib/languageHandler';
import sdk from 'matrix-react-sdk';
import dis from 'matrix-react-sdk/lib/dispatcher';
import MatrixClientPeg from 'matrix-react-sdk/lib/MatrixClientPeg';
import MatrixClient from 'matrix-js-sdk';
import Analytics from 'matrix-react-sdk/lib/Analytics';
import rate_limited_func from 'matrix-react-sdk/lib/ratelimitedfunc';
import AccessibleButton from 'matrix-react-sdk/lib/components/views/elements/AccessibleButton';
import { showGroupInviteDialog, showGroupAddRoomDialog } from 'matrix-react-sdk/lib/GroupAddressPicker';
import GroupStoreCache from 'matrix-react-sdk/lib/stores/GroupStoreCache';
class HeaderButton extends React.Component {
constructor() {
@ -80,6 +82,10 @@ module.exports = React.createClass({
collapsed: React.PropTypes.bool, // currently unused property to request for a minimized view of the panel
},
contextTypes: {
matrixClient: PropTypes.instanceOf(MatrixClient),
},
Phase: {
RoomMemberList: 'RoomMemberList',
GroupMemberList: 'GroupMemberList',
@ -92,14 +98,14 @@ module.exports = React.createClass({
componentWillMount: function() {
this.dispatcherRef = dis.register(this.onAction);
const cli = MatrixClientPeg.get();
const cli = this.context.matrixClient;
cli.on("RoomState.members", this.onRoomStateMember);
},
componentWillUnmount: function() {
dis.unregister(this.dispatcherRef);
if (MatrixClientPeg.get()) {
MatrixClientPeg.get().removeListener("RoomState.members", this.onRoomStateMember);
if (this.context.matrixClient) {
this.context.matrixClient.removeListener("RoomState.members", this.onRoomStateMember);
}
},
@ -122,7 +128,7 @@ module.exports = React.createClass({
},
onInviteButtonClick: function() {
if (MatrixClientPeg.get().isGuest()) {
if (this.context.matrixClient.isGuest()) {
dis.dispatch({action: 'view_set_mxid'});
return;
}
@ -222,13 +228,13 @@ module.exports = React.createClass({
if ((this.state.phase == this.Phase.RoomMemberList || this.state.phase === this.Phase.RoomMemberInfo)
&& this.props.roomId
) {
const cli = MatrixClientPeg.get();
const cli = this.context.matrixClient;
const room = cli.getRoom(this.props.roomId);
let userIsInRoom;
if (room) {
membersBadge = room.getJoinedMembers().length;
userIsInRoom = room.hasMembershipState(
MatrixClientPeg.get().credentials.userId, 'join',
this.context.matrixClient.credentials.userId, 'join',
);
}
@ -243,6 +249,11 @@ module.exports = React.createClass({
}
}
const isPhaseGroup = [
this.Phase.GroupMemberInfo,
this.Phase.GroupMemberList
].includes(this.state.phase);
let headerButtons = [];
if (this.props.roomId) {
headerButtons = [
@ -266,7 +277,7 @@ module.exports = React.createClass({
} else if (this.props.groupId) {
headerButtons = [
<HeaderButton key="_groupMembersButton" title={_t('Members')} iconSrc="img/icons-people.svg"
isHighlighted={this.state.phase === this.Phase.GroupMemberList}
isHighlighted={isPhaseGroup}
clickPhase={this.Phase.GroupMemberList}
analytics={['Right Panel', 'Group Member List Button', 'click']}
/>,
@ -317,31 +328,36 @@ module.exports = React.createClass({
panel = <div className="mx_RightPanel_blank"></div>;
}
if (this.props.groupId) {
inviteGroup = this.state.phase === this.Phase.GroupMemberList ? (
if (this.props.groupId &&
GroupStoreCache.getGroupStore(this.context.matrixClient, this.props.groupId).isUserPrivileged()
) {
inviteGroup = isPhaseGroup ? (
<AccessibleButton className="mx_RightPanel_invite" onClick={ this.onInviteButtonClick } >
<div className="mx_RightPanel_icon" >
<TintableSvg src="img/icon-invite-people.svg" width="35" height="35" />
</div>
<div className="mx_RightPanel_message">{ _t('Invite to this group') }</div>
<div className="mx_RightPanel_message">{ _t('Invite to this community') }</div>
</AccessibleButton>
) : (
<AccessibleButton className="mx_RightPanel_invite" onClick={ this.onInviteButtonClick } >
<div className="mx_RightPanel_icon" >
<TintableSvg src="img/icons-room-add.svg" width="35" height="35" />
</div>
<div className="mx_RightPanel_message">{ _t('Add room to this group') }</div>
<div className="mx_RightPanel_message">{ _t('Add rooms to this community') }</div>
</AccessibleButton>
);
}
let classes = "mx_RightPanel mx_fadable";
if (this.props.collapsed) {
classes += " collapsed";
}
let classes = classNames(
"mx_RightPanel", "mx_fadable",
{
"collapsed": this.props.collapsed,
"mx_fadable_faded": this.props.disabled,
}
);
return (
<aside className={classes} style={{ opacity: this.props.opacity }}>
<aside className={classes}>
<div className="mx_RightPanel_header">
<div className="mx_RightPanel_headerButtonGroup">
{headerButtons}

View file

@ -89,17 +89,17 @@ module.exports = React.createClass({
});
// dis.dispatch({
// action: 'ui_opacity',
// sideOpacity: 0.3,
// middleOpacity: 0.3,
// action: 'panel_disable',
// sideDisabled: true,
// middleDisabled: true,
// });
},
componentWillUnmount: function() {
// dis.dispatch({
// action: 'ui_opacity',
// sideOpacity: 1.0,
// middleOpacity: 1.0,
// action: 'panel_disable',
// sideDisabled: false,
// middleDisabled: false,
// });
if (this.filterTimeout) {
clearTimeout(this.filterTimeout);

View file

@ -57,7 +57,7 @@ class SendCustomEvent extends React.Component {
_buttons() {
return <div className="mx_Dialog_buttons">
<button onClick={this.onBack}>{ _t('Back') }</button>
{!this.state.message && <button onClick={this._send}>{ _t('Send') }</button>}
{ !this.state.message && <button onClick={this._send}>{ _t('Send') }</button> }
</div>;
}
@ -83,7 +83,7 @@ class SendCustomEvent extends React.Component {
}
_additionalFields() {
return <div/>;
return <div />;
}
_onChange(e) {
@ -94,15 +94,15 @@ class SendCustomEvent extends React.Component {
if (this.state.message) {
return <div>
<div className="mx_Dialog_content">
{this.state.message}
{ this.state.message }
</div>
{this._buttons()}
{ this._buttons() }
</div>;
}
return <div>
<div className="mx_Dialog_content">
{this._additionalFields()}
{ this._additionalFields() }
<div className="mx_TextInputDialog_label">
<label htmlFor="eventType"> { _t('Event Type') } </label>
</div>
@ -117,7 +117,7 @@ class SendCustomEvent extends React.Component {
<textarea id="evContent" onChange={this._onChange} value={this.state.input_evContent} className="mx_TextInputDialog_input" cols="63" rows="5" />
</div>
</div>
{this._buttons()}
{ this._buttons() }
</div>;
}
}
@ -223,7 +223,7 @@ class RoomStateExplorer extends React.Component {
if (this.state.event) {
return <div className="mx_ViewSource">
<div className="mx_Dialog_content">
<pre>{JSON.stringify(this.state.event.event, null, 2)}</pre>
<pre>{ JSON.stringify(this.state.event.event, null, 2) }</pre>
</div>
<div className="mx_Dialog_buttons">
<button onClick={this.onBack}>{ _t('Back') }</button>
@ -237,7 +237,7 @@ class RoomStateExplorer extends React.Component {
if (this.state.eventType === null) {
Object.keys(this.roomStateEvents).forEach((evType) => {
// Skip this entry if does not contain search query
if (this.state.query && !evType.includes(this.state.query)) return;
if (this.state.query && !evType.toLowerCase().includes(this.state.query.toLowerCase())) return;
const stateGroup = this.roomStateEvents[evType];
const stateKeys = Object.keys(stateGroup);
@ -258,7 +258,7 @@ class RoomStateExplorer extends React.Component {
const stateGroup = this.roomStateEvents[evType];
Object.keys(stateGroup).forEach((stateKey) => {
// Skip this entry if does not contain search query
if (this.state.query && !stateKey.includes(this.state.query)) return;
if (this.state.query && !stateKey.toLowerCase().includes(this.state.query.toLowerCase())) return;
const ev = stateGroup[stateKey];
rows.push(<button className="mx_DevTools_RoomStateExplorer_button" key={stateKey}
@ -271,7 +271,7 @@ class RoomStateExplorer extends React.Component {
return <div>
<div className="mx_Dialog_content">
<input onChange={this.onQuery} placeholder={_t('Filter results')} size="64" className="mx_TextInputDialog_input mx_DevTools_RoomStateExplorer_query" value={this.state.query} />
{rows}
{ rows }
</div>
<div className="mx_Dialog_buttons">
<button onClick={this.onBack}>{ _t('Back') }</button>

View file

@ -1,5 +1,6 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2017 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -31,7 +32,13 @@ module.exports = React.createClass({
{ _t('Custom Server Options') }
</div>
<div className="mx_Dialog_content">
<span dangerouslySetInnerHTML={{__html: sanitizeHtml(_t('customServer_text'))}} />
<span dangerouslySetInnerHTML={{__html: sanitizeHtml(_t(
"You can use the custom server options to sign into other Matrix "+
"servers by specifying a different Home server URL.<br/>This allows "+
"you to use Riot with an existing Matrix account on a different home "+
"server.<br/><br/>You can also set a custom identity server but you won't "+
"be able to invite users by email address, or be invited by email address yourself.",
))}} />
</div>
<div className="mx_Dialog_buttons">
<button onClick={this.props.onFinished} autoFocus={true}>