Merge branch 'fix-updateDimensions' into develop

app/lib/components/FullView.jsx

@@ -52,21 +52,21 @@ export default class FullView extends React.Component
 
 		this._setTracks(videoTrack);
 
-		if (fscreen.fullscreenEnabled) 
+		if (fscreen.fullscreenEnabled)
 		{
 			fscreen.addEventListener('fullscreenchange', this.handleExitFullscreen, false);
 			fscreen.requestFullscreen(this.video.current);
 		}
 	}
 
-	componentWillUnmount() 
+	componentWillUnmount()
 	{
 		fscreen.removeEventListener('fullscreenchange', this.handleExitFullscreen);
 	}
 
-	handleExitFullscreen = () => 
+	handleExitFullscreen = () =>
 	{
-		if (!fscreen.fullscreenElement) 
+		if (!fscreen.fullscreenElement)
 		{
 			this.props.toggleFullscreen();
 		}

app/lib/components/Peer.jsx

@@ -147,7 +147,11 @@ class Peer extends Component
 
 				{screenConsumer ?
 					<div className={classnames('view-container', 'screen')} style={style}>
-						<div className='controls'>
+						<div
+							className={classnames('controls', {
+								visible : this.state.controlsVisible
+							})}
+						>
 							<div
 								className={classnames('button', 'screen', {
 									on       : screenVisible,

app/lib/components/Peers.jsx

@@ -22,7 +22,12 @@ class Peers extends React.Component
 
 	updateDimensions = () =>
 	{
-		const n = this.props.peers.length;
+		const n = this.props.boxes;
+
+		if (n === 0)
+		{
+			return;
+		}
 
 		const width = this.refs.peers.clientWidth;
 		const height = this.refs.peers.clientHeight;
@@ -116,27 +121,24 @@ class Peers extends React.Component
 }
 
 Peers.propTypes =
-{
-	advancedMode      : PropTypes.bool,
-	peers             : PropTypes.arrayOf(appPropTypes.Peer).isRequired,
-	videoStreams      : PropTypes.any,
-	activeSpeakerName : PropTypes.string,
-	toolAreaOpen      : PropTypes.bool
-};
+	{
+		advancedMode      : PropTypes.bool,
+		peers             : PropTypes.arrayOf(appPropTypes.Peer).isRequired,
+		boxes             : PropTypes.number,
+		activeSpeakerName : PropTypes.string,
+		toolAreaOpen      : PropTypes.bool
+	};
 
 const mapStateToProps = (state) =>
 {
-	const peersArray = Object.values(state.peers);
-	const videoStreamsArray = Object.values(state.consumers);
-	const videoStreams =
-		videoStreamsArray.filter((consumer) =>
-		{
-			return (consumer.source === 'webcam' || consumer.source === 'screen');
-		}).length;
+	const peers = Object.values(state.peers);
+
+	const boxes = peers.length + Object.values(state.consumers)
+		.filter((consumer) => consumer.source === 'screen').length;
 
 	return {
-		peers             : peersArray,
-		videoStreams      : videoStreams,
+		peers,
+		boxes,
 		activeSpeakerName : state.room.activeSpeakerName,
 		toolAreaOpen      : state.toolarea.toolAreaOpen
 	};