Factor out a separate auxpanel, and cleanup the maxHeight management

Basically two changes here:

1. Factor out auxpanel from RoomView
2. Rather than setting maxHeight attributes by poking directly into the DOM,
pass them down as properties.
This commit is contained in:
Richard van der Hoff 2016-02-23 15:46:27 +00:00
parent bb6a36b911
commit 7a20fda7e7
6 changed files with 169 additions and 90 deletions

View file

@ -19,38 +19,32 @@ var CallHandler = require("../../../CallHandler");
var sdk = require('../../../index');
var MatrixClientPeg = require("../../../MatrixClientPeg");
/*
* State vars:
* this.state.call = MatrixCall|null
*
* Props:
* this.props.room = Room (JS SDK)
* this.props.ConferenceHandler = A Conference Handler implementation
* Must have a function signature:
* getConferenceCallForRoom(roomId: string): MatrixCall
*/
module.exports = React.createClass({
displayName: 'CallView',
propTypes: {
// a callback which is called when the video within the callview
// due to a change in video metadata
// js-sdk room object
room: React.PropTypes.object.isRequired,
// A Conference Handler implementation
// Must have a function signature:
// getConferenceCallForRoom(roomId: string): MatrixCall
ConferenceHandler: React.PropTypes.object,
// maxHeight style attribute for the video panel
maxVideoHeight: React.PropTypes.number,
// a callback which is called when the user clicks on the video div
onClick: React.PropTypes.func,
// a callback which is called when the video within the callview is
// resized due to a change in video metadata
onResize: React.PropTypes.func,
},
componentDidMount: function() {
this.dispatcherRef = dis.register(this.onAction);
if (this.props.room) {
this.showCall(this.props.room.roomId);
}
else {
// XXX: why would we ever not have a this.props.room?
var call = CallHandler.getAnyActiveCall();
if (call) {
this.showCall(call.roomId);
}
}
this.showCall(this.props.room.roomId);
},
componentWillUnmount: function() {
@ -103,7 +97,10 @@ module.exports = React.createClass({
render: function(){
var VideoView = sdk.getComponent('voip.VideoView');
return (
<VideoView ref="video" onClick={ this.props.onClick } onResize={ this.props.onResize }/>
<VideoView ref="video" onClick={ this.props.onClick }
onResize={ this.props.onResize }
maxHeight={ this.props.maxVideoHeight }
/>
);
}
});