mirror of https://github.com/vector-im/riot-web
Merge remote-tracking branch 'origin/develop' into dbkr/email_notifs
commit
fab7111fd7
|
@ -25,9 +25,14 @@ You can use matrix-react-sdk directly, but to do this you would have to provide
|
|||
How to customise the SDK
|
||||
========================
|
||||
|
||||
The SDK uses the 'atomic' design pattern as seen at http://patternlab.io to
|
||||
The SDK formerly used the 'atomic' design pattern as seen at http://patternlab.io to
|
||||
encourage a very modular and reusable architecture, making it easy to
|
||||
customise and use UI widgets independently of the rest of the SDK and your app.
|
||||
|
||||
So unfortunately at the moment this document does not describe how to customize your UI!
|
||||
|
||||
###This is the old description for the atomic design pattern:
|
||||
|
||||
In practice this means:
|
||||
|
||||
* The UI of the app is strictly split up into a hierarchy of components.
|
||||
|
|
|
@ -1181,7 +1181,7 @@ module.exports = React.createClass({
|
|||
defaultIsUrl={this.props.config.default_is_url}
|
||||
customHsUrl={this.getCurrentHsUrl()}
|
||||
customIsUrl={this.getCurrentIsUrl()}
|
||||
onForgotPasswordClick={this.onForgotPasswordClick}
|
||||
onForgotPasswordClick={this.onForgotPasswordClick}
|
||||
onLoginAsGuestClick={this.props.enableGuest && this.props.config && this.props.config.default_hs_url ? this._registerAsGuest.bind(this, true) : undefined}
|
||||
onCancelClick={ this.state.guestCreds ? this.onReturnToGuestClick : null }
|
||||
/>
|
||||
|
|
|
@ -85,6 +85,12 @@ module.exports = React.createClass({
|
|||
// opaque readreceipt info for each userId; used by ReadReceiptMarker
|
||||
// to manage its animations
|
||||
this._readReceiptMap = {};
|
||||
|
||||
this._isMounted = true;
|
||||
},
|
||||
|
||||
componentWillUnmount: function() {
|
||||
this._isMounted = false;
|
||||
},
|
||||
|
||||
/* get the DOM node representing the given event */
|
||||
|
@ -201,6 +207,10 @@ module.exports = React.createClass({
|
|||
}
|
||||
},
|
||||
|
||||
_isUnmounting: function() {
|
||||
return !this._isMounted;
|
||||
},
|
||||
|
||||
_getEventTiles: function() {
|
||||
var EventTile = sdk.getComponent('rooms.EventTile');
|
||||
|
||||
|
@ -351,6 +361,7 @@ module.exports = React.createClass({
|
|||
onWidgetLoad={this._onWidgetLoad}
|
||||
readReceipts={readReceipts}
|
||||
readReceiptMap={this._readReceiptMap}
|
||||
checkUnmounting={this._isUnmounting}
|
||||
eventSendStatus={mxEv.status}
|
||||
last={last} isSelectedEvent={highlight}/>
|
||||
</li>
|
||||
|
|
|
@ -210,7 +210,7 @@ module.exports = React.createClass({
|
|||
MatrixClientPeg.get().removeListener("RoomState.members", this.onRoomStateMember);
|
||||
}
|
||||
|
||||
window.removeEventListener('resize', this.onResize);
|
||||
window.removeEventListener('resize', this.onResize);
|
||||
|
||||
// no need to do this as Dir & Settings are now overlays. It just burnt CPU.
|
||||
// console.log("Tinter.tint from RoomView.unmount");
|
||||
|
@ -878,7 +878,7 @@ module.exports = React.createClass({
|
|||
this.setState({
|
||||
uploadingRoomSettings: true,
|
||||
});
|
||||
|
||||
|
||||
var newName = this.refs.header.getEditedName();
|
||||
if (newName !== undefined) {
|
||||
this.refs.room_settings.setName(newName);
|
||||
|
@ -887,7 +887,7 @@ module.exports = React.createClass({
|
|||
if (newTopic !== undefined) {
|
||||
this.refs.room_settings.setTopic(newTopic);
|
||||
}
|
||||
|
||||
|
||||
this.refs.room_settings.save().then((results) => {
|
||||
var fails = results.filter(function(result) { return result.state !== "fulfilled" });
|
||||
console.log("Settings saved with %s errors", fails.length);
|
||||
|
@ -1229,7 +1229,7 @@ module.exports = React.createClass({
|
|||
rightPanelCollapsed={ this.props.rightPanelCollapsed }
|
||||
/>
|
||||
<div className="mx_RoomView_auxPanel">
|
||||
<RoomPreviewBar onJoinClick={ this.onJoinButtonClicked }
|
||||
<RoomPreviewBar onJoinClick={ this.onJoinButtonClicked }
|
||||
onRejectClick={ this.onRejectThreepidInviteButtonClicked }
|
||||
canJoin={ true } canPreview={ false }
|
||||
spinner={this.state.joining}
|
||||
|
@ -1266,7 +1266,7 @@ module.exports = React.createClass({
|
|||
<div className="mx_RoomView">
|
||||
<RoomHeader ref="header" room={this.state.room}/>
|
||||
<div className="mx_RoomView_auxPanel">
|
||||
<RoomPreviewBar onJoinClick={ this.onJoinButtonClicked }
|
||||
<RoomPreviewBar onJoinClick={ this.onJoinButtonClicked }
|
||||
onRejectClick={ this.onRejectButtonClicked }
|
||||
inviterName={ inviterName }
|
||||
canJoin={ true } canPreview={ false }
|
||||
|
@ -1402,8 +1402,8 @@ module.exports = React.createClass({
|
|||
}
|
||||
voiceMuteButton =
|
||||
<div className="mx_RoomView_voipButton" onClick={this.onMuteAudioClick}>
|
||||
<img src={call.isMicrophoneMuted() ? "img/voice-unmute.svg" : "img/voice-mute.svg"}
|
||||
alt={call.isMicrophoneMuted() ? "Click to unmute audio" : "Click to mute audio"}
|
||||
<img src={call.isMicrophoneMuted() ? "img/voice-unmute.svg" : "img/voice-mute.svg"}
|
||||
alt={call.isMicrophoneMuted() ? "Click to unmute audio" : "Click to mute audio"}
|
||||
width="21" height="26"/>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -116,6 +116,12 @@ module.exports = React.createClass({
|
|||
*/
|
||||
readReceiptMap: React.PropTypes.object,
|
||||
|
||||
/* A function which is used to check if the parent panel is being
|
||||
* unmounted, to avoid unnecessary work. Should return true if we
|
||||
* are being unmounted.
|
||||
*/
|
||||
checkUnmounting: React.PropTypes.func,
|
||||
|
||||
/* the status of this event - ie, mxEvent.status. Denormalised to here so
|
||||
* that we can tell when it changes. */
|
||||
eventSendStatus: React.PropTypes.string,
|
||||
|
@ -261,6 +267,7 @@ module.exports = React.createClass({
|
|||
<ReadReceiptMarker key={userId} member={member}
|
||||
leftOffset={left} hidden={hidden}
|
||||
readReceiptInfo={readReceiptInfo}
|
||||
checkUnmounting={this.props.checkUnmounting}
|
||||
suppressAnimation={this._suppressReadReceiptAnimation}
|
||||
onClick={this.toggleAllReadAvatars}
|
||||
/>
|
||||
|
|
|
@ -53,6 +53,11 @@ module.exports = React.createClass({
|
|||
// this room
|
||||
readReceiptInfo: React.PropTypes.object,
|
||||
|
||||
// A function which is used to check if the parent panel is being
|
||||
// unmounted, to avoid unnecessary work. Should return true if we
|
||||
// are being unmounted.
|
||||
checkUnmounting: React.PropTypes.func,
|
||||
|
||||
// callback for clicks on this RR
|
||||
onClick: React.PropTypes.func,
|
||||
},
|
||||
|
@ -81,6 +86,13 @@ module.exports = React.createClass({
|
|||
return;
|
||||
}
|
||||
|
||||
// checking the DOM properties can force a re-layout, which can be
|
||||
// quite expensive; so if the parent messagepanel is being unmounted,
|
||||
// then don't bother with this.
|
||||
if (this.props.checkUnmounting && this.props.checkUnmounting()) {
|
||||
return;
|
||||
}
|
||||
|
||||
var avatarNode = ReactDOM.findDOMNode(this);
|
||||
rrInfo.top = avatarNode.offsetTop;
|
||||
rrInfo.left = avatarNode.offsetLeft;
|
||||
|
|
|
@ -97,7 +97,7 @@ module.exports = React.createClass({
|
|||
</div>
|
||||
<div className="mx_RoomPreviewBar_warningText">
|
||||
This invitation was sent to <b><span className="email">{this.props.invitedEmail}</span></b>, which is not associated with this account.<br/>
|
||||
You may wish to login with a different account, or add this email to your this account.
|
||||
You may wish to login with a different account, or add this email to this account.
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue