Add MatrixToolbar CSS. Make the toolbar part of RoomView and don't cover the UI (shift it instead)

This commit is contained in:
Kegan Dougal 2015-07-21 16:12:08 +01:00
parent c1de5e9e95
commit 2698405e2f
5 changed files with 36 additions and 13 deletions

View file

@ -0,0 +1,24 @@
/*
Copyright 2015 OpenMarket Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_MatrixToolbar {
text-align: center;
height: 25px;
background-color: #a9dbf4;
border-bottom: 1px solid #000;
padding: 6px;
z-index: 50;
}

View file

@ -31,7 +31,8 @@ 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");
@ -142,8 +143,14 @@ 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,8 +27,6 @@ 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 Notifier = ComponentBroker.get('organisms/Notifier');
var MatrixToolbar = ComponentBroker.get('molecules/MatrixToolbar');
var MatrixChatController = require("../../../../src/controllers/pages/MatrixChat");
@ -54,11 +52,6 @@ module.exports = React.createClass({
var page_element;
var right_panel = "";
var top_bar;
if (!Notifier.isEnabled()) {
top_bar = <MatrixToolbar />;
}
switch (this.state.page_type) {
case this.PageTypes.RoomView:
@ -81,7 +74,6 @@ module.exports = React.createClass({
return (
<div className="mx_MatrixChat">
{top_bar}
<LeftPanel selectedRoom={this.state.currentRoom} />
<div className="mx_MatrixChat_middlePanel">
{page_element}

View file

@ -32,6 +32,7 @@ var PAGINATE_SIZE = 20;
var INITIAL_SIZE = 100;
var ComponentBroker = require('../../ComponentBroker');
var Notifier = ComponentBroker.get('organisms/Notifier');
var tileTypes = {
'm.room.message': ComponentBroker.get('molecules/MessageTile'),
@ -83,6 +84,9 @@ module.exports = {
room: MatrixClientPeg.get().getRoom(this.props.roomId)
});
break;
case'notifier_enabled':
this.forceUpdate();
break;
}
},

View file

@ -25,7 +25,6 @@ var Presence = require("../../Presence");
var dis = require("../../dispatcher");
var ComponentBroker = require('../../ComponentBroker');
var Notifier = ComponentBroker.get('organisms/Notifier');
module.exports = {
@ -163,9 +162,6 @@ module.exports = {
page_type: this.PageTypes.RoomDirectory,
});
break;
case'notifier_enabled':
this.forceUpdate();
break;
}
},