vicious rewrite of the CSS to support the notifications toolbar, removing all height: 100%'s and letting the flexbox stuff calculate auto-height instead. may have slowed down the rendering, especially when the toolbar is visible

This commit is contained in:
Matthew Hodgson 2015-07-21 15:01:05 -07:00
parent e03809b224
commit aaa96f1ac1
9 changed files with 102 additions and 31 deletions

View file

@ -31,8 +31,6 @@ var RoomHeader = ComponentBroker.get('molecules/RoomHeader');
var MessageComposer = ComponentBroker.get('molecules/MessageComposer');
var CallView = ComponentBroker.get("molecules/voip/CallView");
var RoomSettings = ComponentBroker.get("molecules/RoomSettings");
var Notifier = ComponentBroker.get('organisms/Notifier');
var MatrixToolbar = ComponentBroker.get('molecules/MatrixToolbar');
var RoomViewController = require("../../../../src/controllers/organisms/RoomView");
var Loader = require("react-loader");
@ -143,14 +141,8 @@ module.exports = React.createClass({
roomEdit = <Loader/>;
}
var top_bar;
if (!Notifier.isEnabled()) {
top_bar = <MatrixToolbar />;
}
return (
<div className="mx_RoomView">
{top_bar}
<RoomHeader ref="header" room={this.state.room} editing={this.state.editingRoomSettings}
onSettingsClick={this.onSettingsClick} onSaveClick={this.onSaveClick}/>
<div className="mx_RoomView_auxPanel">

View file

@ -27,11 +27,14 @@ var UserSettings = ComponentBroker.get('organisms/UserSettings');
var Register = ComponentBroker.get('templates/Register');
var CreateRoom = ComponentBroker.get('organisms/CreateRoom');
var RoomDirectory = ComponentBroker.get('organisms/RoomDirectory');
var MatrixToolbar = ComponentBroker.get('molecules/MatrixToolbar');
var Notifier = ComponentBroker.get('organisms/Notifier');
var MatrixChatController = require("../../../../src/controllers/pages/MatrixChat");
// should be atomised
var Loader = require("react-loader");
var classNames = require("classnames");
var dis = require("../../../../src/dispatcher");
@ -72,15 +75,31 @@ module.exports = React.createClass({
break;
}
return (
<div className="mx_MatrixChat">
<LeftPanel selectedRoom={this.state.currentRoom} />
<div className="mx_MatrixChat_middlePanel">
{page_element}
</div>
{right_panel}
</div>
);
if (!Notifier.isEnabled()) {
return (
<div className="mx_MatrixChat_wrapper">
<MatrixToolbar />
<div className="mx_MatrixChat mx_MatrixChat_toolbarShowing">
<LeftPanel selectedRoom={this.state.currentRoom} />
<div className="mx_MatrixChat_middlePanel">
{page_element}
</div>
{right_panel}
</div>
</div>
);
}
else {
return (
<div className="mx_MatrixChat">
<LeftPanel selectedRoom={this.state.currentRoom} />
<div className="mx_MatrixChat_middlePanel">
{page_element}
</div>
{right_panel}
</div>
);
}
} else if (this.state.logged_in) {
return (
<Loader />