Split out render methods into 'views' leaving UI logic in 'controllers'. Hopefully should make it easier to skin / customise.
This commit is contained in:
parent
c8f0bac128
commit
2abea931ca
36 changed files with 303 additions and 184 deletions
35
src/views/organisms/RoomView.js
Normal file
35
src/views/organisms/RoomView.js
Normal file
|
@ -0,0 +1,35 @@
|
|||
var React = require('react');
|
||||
|
||||
var ComponentBroker = require('../../ComponentBroker');
|
||||
|
||||
var MessageTile = ComponentBroker.get('molecules/MessageTile');
|
||||
var RoomHeader = ComponentBroker.get('molecules/RoomHeader');
|
||||
var MessageComposer = ComponentBroker.get('molecules/MessageComposer');
|
||||
|
||||
var RoomViewController = require("../../controllers/organisms/RoomView");
|
||||
|
||||
|
||||
module.exports = React.createClass({
|
||||
mixins: [RoomViewController],
|
||||
|
||||
getMessageTiles: function() {
|
||||
return this.state.room.timeline.map(function(mxEv) {
|
||||
return (
|
||||
<li key={mxEv.getId()}><MessageTile mxEvent={mxEv} /></li>
|
||||
);
|
||||
});
|
||||
},
|
||||
|
||||
render: function() {
|
||||
return (
|
||||
<div className="mx_RoomView">
|
||||
<RoomHeader room={this.state.room} />
|
||||
<ul ref="messageList">
|
||||
{this.getMessageTiles()}
|
||||
</ul>
|
||||
<MessageComposer roomId={this.props.roomId} />
|
||||
</div>
|
||||
);
|
||||
},
|
||||
});
|
||||
|
Loading…
Add table
Add a link
Reference in a new issue