mirror of https://github.com/vector-im/riot-web
fix layout bug for general auxPanel
parent
684255044a
commit
aa80a5d494
|
@ -1065,20 +1065,25 @@ module.exports = React.createClass({
|
||||||
// a minimum of the height of the video element, whilst also capping it from pushing out the page
|
// a minimum of the height of the video element, whilst also capping it from pushing out the page
|
||||||
// so we have to do it via JS instead. In this implementation we cap the height by putting
|
// so we have to do it via JS instead. In this implementation we cap the height by putting
|
||||||
// a maxHeight on the underlying remote video tag.
|
// a maxHeight on the underlying remote video tag.
|
||||||
var auxPanelMaxHeight;
|
|
||||||
if (this.refs.callView) {
|
|
||||||
// XXX: don't understand why we have to call findDOMNode here in react 0.14 - it should already be a DOM node.
|
|
||||||
var video = ReactDOM.findDOMNode(this.refs.callView.refs.video.refs.remote);
|
|
||||||
|
|
||||||
// header + footer + status + give us at least 100px of scrollback at all times.
|
// header + footer + status + give us at least 100px of scrollback at all times.
|
||||||
auxPanelMaxHeight = window.innerHeight - (83 + 72 + 36 + 100);
|
var auxPanelMaxHeight = window.innerHeight - (83 + 72 + 36 + 100);
|
||||||
|
|
||||||
// XXX: this is a bit of a hack and might possibly cause the video to push out the page anyway
|
// XXX: this is a bit of a hack and might possibly cause the video to push out the page anyway
|
||||||
// but it's better than the video going missing entirely
|
// but it's better than the video going missing entirely
|
||||||
if (auxPanelMaxHeight < 50) auxPanelMaxHeight = 50;
|
if (auxPanelMaxHeight < 50) auxPanelMaxHeight = 50;
|
||||||
|
|
||||||
|
if (this.refs.callView) {
|
||||||
|
// XXX: don't understand why we have to call findDOMNode here in react 0.14 - it should already be a DOM node.
|
||||||
|
var video = ReactDOM.findDOMNode(this.refs.callView.refs.video.refs.remote);
|
||||||
|
|
||||||
video.style.maxHeight = auxPanelMaxHeight + "px";
|
video.style.maxHeight = auxPanelMaxHeight + "px";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// we need to do this for general auxPanels too
|
||||||
|
if (this.refs.auxPanel) {
|
||||||
|
this.refs.auxPanel.style.maxHeight = auxPanelMaxHeight + "px";
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
onFullscreenClick: function() {
|
onFullscreenClick: function() {
|
||||||
|
@ -1404,7 +1409,7 @@ module.exports = React.createClass({
|
||||||
(myMember && myMember.membership === "join") ? this.onLeaveClick : null
|
(myMember && myMember.membership === "join") ? this.onLeaveClick : null
|
||||||
} />
|
} />
|
||||||
{ fileDropTarget }
|
{ fileDropTarget }
|
||||||
<div className="mx_RoomView_auxPanel">
|
<div className="mx_RoomView_auxPanel" ref="auxPanel">
|
||||||
<CallView ref="callView" room={this.state.room} ConferenceHandler={this.props.ConferenceHandler}/>
|
<CallView ref="callView" room={this.state.room} ConferenceHandler={this.props.ConferenceHandler}/>
|
||||||
{ conferenceCallNotification }
|
{ conferenceCallNotification }
|
||||||
{ aux }
|
{ aux }
|
||||||
|
|
Loading…
Reference in New Issue