element-web/src/pages/MatrixChat.js

91 lines
2.5 KiB
JavaScript
Raw Normal View History

var React = require('react');
2015-06-12 13:59:33 +00:00
var RoomList = require('../organisms/RoomList');
2015-06-12 14:01:36 +00:00
var RoomView = require('../organisms/RoomView');
var MatrixToolbar = require('../molecules/MatrixToolbar');
2015-06-12 13:59:33 +00:00
var Loader = require("react-loader");
var Login = require('../templates/Login');
var mxCliPeg = require("../MatrixClientPeg");
var dis = require("../dispatcher");
module.exports = React.createClass({
getInitialState: function() {
return {
2015-06-12 13:59:33 +00:00
logged_in: !!(mxCliPeg.get() && mxCliPeg.get().credentials),
ready: false
};
},
2015-06-12 13:59:33 +00:00
componentDidMount: function() {
this.dispatcherRef = dis.register(this.onAction);
2015-06-12 13:59:33 +00:00
if (this.state.logged_in) {
this.startMatrixClient();
}
},
componentWillUnmount: function() {
dis.unregister(this.dispatcherRef);
},
onAction: function(payload) {
switch (payload.action) {
case 'logout':
mxCliPeg.replace(null);
this.setState({
logged_in: false,
ready: false
});
break;
2015-06-12 17:01:38 +00:00
case 'view_room':
this.setState({
currentRoom: payload.room_id
});
break;
}
},
onLoggedIn: function() {
this.setState({logged_in: true});
2015-06-12 13:59:33 +00:00
this.startMatrixClient();
},
startMatrixClient: function() {
var cli = mxCliPeg.get();
var that = this;
cli.on('syncComplete', function() {
var firstRoom = null;
if (cli.getRooms() && cli.getRooms().length) {
firstRoom = cli.getRooms()[0].roomId;
}
that.setState({ready: true, currentRoom: firstRoom});
2015-06-12 13:59:33 +00:00
});
cli.startClient();
},
render: function() {
2015-06-12 13:59:33 +00:00
if (this.state.logged_in && this.state.ready) {
return (
2015-06-15 14:50:24 +00:00
<div className="mx_MatrixChat">
<div className="mx_MatrixChat_leftPanel">
<MatrixToolbar />
<RoomList selectedRoom={this.state.currentRoom} />
</div>
2015-06-16 10:08:27 +00:00
<RoomView roomId={this.state.currentRoom} />
</div>
);
2015-06-12 13:59:33 +00:00
} else if (this.state.logged_in) {
return (
<Loader />
);
} else {
return (
<Login onLoggedIn={this.onLoggedIn} />
);
}
}
});