diff --git a/src/skins/vector/img/hide.png b/src/skins/vector/img/hide.png
index 31604589af..c5aaf0dd0d 100644
Binary files a/src/skins/vector/img/hide.png and b/src/skins/vector/img/hide.png differ
diff --git a/src/skins/vector/skindex.js b/src/skins/vector/skindex.js
index 167ee6442c..e1476fac18 100644
--- a/src/skins/vector/skindex.js
+++ b/src/skins/vector/skindex.js
@@ -35,6 +35,7 @@ skin['atoms.MessageTimestamp'] = require('./views/atoms/MessageTimestamp');
skin['atoms.RoomAvatar'] = require('./views/atoms/RoomAvatar');
skin['atoms.voip.VideoFeed'] = require('./views/atoms/voip/VideoFeed');
skin['molecules.BottomLeftMenu'] = require('./views/molecules/BottomLeftMenu');
+skin['molecules.BottomLeftMenuTile'] = require('./views/molecules/BottomLeftMenuTile');
skin['molecules.ChangeAvatar'] = require('./views/molecules/ChangeAvatar');
skin['molecules.ChangeDisplayName'] = require('./views/molecules/ChangeDisplayName');
skin['molecules.ChangePassword'] = require('./views/molecules/ChangePassword');
diff --git a/src/skins/vector/views/molecules/BottomLeftMenu.js b/src/skins/vector/views/molecules/BottomLeftMenu.js
index 2af3bfc723..2020d29d84 100644
--- a/src/skins/vector/views/molecules/BottomLeftMenu.js
+++ b/src/skins/vector/views/molecules/BottomLeftMenu.js
@@ -17,7 +17,7 @@ limitations under the License.
'use strict';
var React = require('react');
-
+var sdk = require('matrix-react-sdk')
var dis = require('matrix-react-sdk/lib/dispatcher');
module.exports = React.createClass({
@@ -35,28 +35,24 @@ module.exports = React.createClass({
dis.dispatch({action: 'view_create_room'});
},
+ getLabel: function(name) {
+ if (!this.props.collapsed) {
+ return
{name}
+ }
+ else if (this.state.hover) {
+ var RoomTooltip = sdk.getComponent("molecules.RoomTooltip");
+ return ;
+ }
+ },
+
render: function() {
+ var BottomLeftMenuTile = sdk.getComponent('molecules.BottomLeftMenuTile');
return (
-
-
-
-
-
Create new room
-
-
-
-
-
-
Directory
-
-
-
-
-
-
Settings
-
+
+
+
);
diff --git a/src/skins/vector/views/molecules/BottomLeftMenuTile.js b/src/skins/vector/views/molecules/BottomLeftMenuTile.js
new file mode 100644
index 0000000000..b0d00c62c0
--- /dev/null
+++ b/src/skins/vector/views/molecules/BottomLeftMenuTile.js
@@ -0,0 +1,60 @@
+/*
+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.
+*/
+
+'use strict';
+
+var React = require('react');
+var classNames = require('classnames');
+
+var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg');
+
+var sdk = require('matrix-react-sdk')
+
+module.exports = React.createClass({
+ displayName: 'BottomLeftMenuTile',
+
+ getInitialState: function() {
+ return( { hover : false });
+ },
+
+ onMouseEnter: function() {
+ this.setState( { hover : true });
+ },
+
+ onMouseLeave: function() {
+ this.setState( { hover : false });
+ },
+
+ render: function() {
+ var label;
+ if (!this.props.collapsed) {
+ label = { this.props.label }
;
+ }
+ else if (this.state.hover) {
+ var RoomTooltip = sdk.getComponent("molecules.RoomTooltip");
+ label = ;
+ }
+
+ return (
+
+
+
+
+ { label }
+
+ );
+ }
+});
diff --git a/src/skins/vector/views/molecules/RoomTile.js b/src/skins/vector/views/molecules/RoomTile.js
index 92ac743f6e..39e7b43c5b 100644
--- a/src/skins/vector/views/molecules/RoomTile.js
+++ b/src/skins/vector/views/molecules/RoomTile.js
@@ -77,7 +77,7 @@ module.exports = React.createClass({
}
else if (this.state.hover) {
var RoomTooltip = sdk.getComponent("molecules.RoomTooltip");
- label = ;
+ label = ;
}
var RoomAvatar = sdk.getComponent('atoms.RoomAvatar');
diff --git a/src/skins/vector/views/molecules/RoomTooltip.js b/src/skins/vector/views/molecules/RoomTooltip.js
index 61c62908df..5116b3a977 100644
--- a/src/skins/vector/views/molecules/RoomTooltip.js
+++ b/src/skins/vector/views/molecules/RoomTooltip.js
@@ -28,25 +28,35 @@ module.exports = React.createClass({
displayName: 'RoomTooltip',
componentDidMount: function() {
- // tell the roomlist about us
- dis.dispatch({
- action: 'view_tooltip',
- tooltip: this.getDOMNode(),
- });
+ if (!this.props.bottom) {
+ // tell the roomlist about us so it can position us
+ dis.dispatch({
+ action: 'view_tooltip',
+ tooltip: this.getDOMNode(),
+ });
+ }
+ else {
+ var tooltip = this.getDOMNode();
+ tooltip.style.top = tooltip.parentElement.getBoundingClientRect().top + "px";
+ tooltip.style.display = "block";
+ }
},
componentDidUnmount: function() {
- dis.dispatch({
- action: 'view_tooltip',
- tooltip: null,
- });
+ if (!this.props.bottom) {
+ dis.dispatch({
+ action: 'view_tooltip',
+ tooltip: null,
+ });
+ }
},
render: function() {
+ var label = this.props.room ? this.props.room.name : this.props.label;
return (
- { this.props.room.name }
+ { label }
);
}
diff --git a/src/skins/vector/views/organisms/LeftPanel.js b/src/skins/vector/views/organisms/LeftPanel.js
index e1b8e252c7..a57f7a0a58 100644
--- a/src/skins/vector/views/organisms/LeftPanel.js
+++ b/src/skins/vector/views/organisms/LeftPanel.js
@@ -48,7 +48,7 @@ module.exports = React.createClass({
{ collapseButton }
-
+
);
}