Update to mediasoup 1.2.0

app/lib/Client.js

@@ -369,7 +369,7 @@ export default class Client extends events.EventEmitter
 
 	disableRemoteVideo(msid)
 	{
-		this._protooPeer.send('disableremotevideo', { msid, disable: true })
+		return this._protooPeer.send('disableremotevideo', { msid, disable: true })
 			.catch((error) =>
 			{
 				logger.warn('disableRemoteVideo() failed: %o', error);
@@ -378,7 +378,7 @@ export default class Client extends events.EventEmitter
 
 	enableRemoteVideo(msid)
 	{
-		this._protooPeer.send('disableremotevideo', { msid, disable: false })
+		return this._protooPeer.send('disableremotevideo', { msid, disable: false })
 			.catch((error) =>
 			{
 				logger.warn('enableRemoteVideo() failed: %o', error);

app/lib/components/RemoteVideo.jsx

@@ -20,15 +20,29 @@ export default class RemoteVideo extends React.Component
 		{
 			audioMuted : false
 		};
+
+		let videoTrack = props.stream.getVideoTracks()[0];
+
+		if (videoTrack)
+		{
+			videoTrack.addEventListener('mute', () =>
+			{
+				logger.debug('video track "mute" event');
+			});
+
+			videoTrack.addEventListener('unmute', () =>
+			{
+				logger.debug('video track "unmute" event');
+			});
+		}
 	}
 
 	render()
 	{
 		let props = this.props;
 		let state = this.state;
-		let hasVideo = !!props.stream.getVideoTracks()[0];
+		let videoTrack = props.stream.getVideoTracks()[0];
-
+		let videoEnabled = videoTrack && videoTrack.enabled;
-		global.SS = props.stream;
 
 		return (
 			<div
@@ -41,6 +55,7 @@ export default class RemoteVideo extends React.Component
 				<Video
 					stream={props.stream}
 					muted={state.audioMuted}
+					videoDisabled={!videoEnabled}
 				/>
 
 				<div className='controls'>
@@ -53,14 +68,16 @@ export default class RemoteVideo extends React.Component
 						/>
 					</IconButton>
 
-					<IconButton
+					{videoTrack ?
-						className='control'
+						<IconButton
-						onClick={this.handleClickDisableVideo.bind(this)}
+							className='control'
-					>
+							onClick={this.handleClickDisableVideo.bind(this)}
-						<VideoOffIcon
+						>
-							color={hasVideo ? '#fff' : '#ff8a00'}
+							<VideoOffIcon
-						/>
+								color={videoEnabled ? '#fff' : '#ff8a00'}
-					</IconButton>
+							/>
+						</IconButton>
+					:null}
 				</div>
 
 				<div className='info'>
@@ -83,14 +100,29 @@ export default class RemoteVideo extends React.Component
 	{
 		logger.debug('handleClickDisableVideo()');
 
+		let videoTrack = this.props.stream.getVideoTracks()[0];
+		let videoEnabled = videoTrack && videoTrack.enabled;
 		let stream = this.props.stream;
 		let msid = stream.id;
-		let hasVideo = !!stream.getVideoTracks()[0];
 
-		if (hasVideo)
+		if (videoEnabled)
-			this.props.onDisableVideo(msid);
+		{
+			this.props.onDisableVideo(msid)
+				.then(() =>
+				{
+					videoTrack.enabled = false;
+					this.forceUpdate();
+				});
+		}
 		else
-			this.props.onEnableVideo(msid);
+		{
+			this.props.onEnableVideo(msid)
+				.then(() =>
+				{
+					videoTrack.enabled = true;
+					this.forceUpdate();
+				});
+		}
 	}
 }
 

app/lib/components/Room.jsx

@@ -242,14 +242,14 @@ export default class Room extends React.Component
 	{
 		logger.debug('handleDisableRemoteVideo() [msid:"%s"]', msid);
 
-		this._client.disableRemoteVideo(msid);
+		return this._client.disableRemoteVideo(msid);
 	}
 
 	handleEnableRemoteVideo(msid)
 	{
 		logger.debug('handleEnableRemoteVideo() [msid:"%s"]', msid);
 
-		this._client.enableRemoteVideo(msid);
+		return this._client.enableRemoteVideo(msid);
 	}
 
 	_runClient()

app/lib/components/Video.jsx

@@ -63,7 +63,11 @@ export default class Video extends React.Component
 
 				<video
 					ref='video'
-					className={classnames({ mirror: props.mirror })}
+					className={classnames(
+						{
+							mirror : props.mirror,
+							hidden : props.videoDisabled
+						})}
 					autoPlay
 					muted={props.muted}
 				/>
@@ -74,6 +78,7 @@ export default class Video extends React.Component
 	componentDidMount()
 	{
 		let stream = this.props.stream;
+		let videoDisabled = !!this.props.videoDisabled;
 		let video = this.refs.video;
 
 		video.srcObject = stream;
@@ -81,6 +86,9 @@ export default class Video extends React.Component
 		this._showVideoResolution();
 		this._videoResolutionTimer = setInterval(() =>
 		{
+			if (!videoDisabled)
+				return;
+
 			this._showVideoResolution();
 		}, 500);
 
@@ -228,6 +236,7 @@ Video.propTypes =
 	stream             : React.PropTypes.object.isRequired,
 	resolution         : React.PropTypes.string,
 	muted              : React.PropTypes.bool,
+	videoDisabled      : React.PropTypes.bool,
 	mirror             : React.PropTypes.bool,
 	onResolutionChange : React.PropTypes.func
 };

app/stylus/components/Video.styl

@@ -2,6 +2,12 @@
 	position: relative;
 	height: 100%;
 	width: 100%;
+	object-fit: cover;
+	background-color: rgba(#041918, 0.65);
+	background-image: url('/resources/images/buddy.svg');
+	background-position: bottom;
+	background-size: auto 85%;
+	background-repeat: no-repeat;
 	overflow: hidden;
 
 	> .resolution {
@@ -66,14 +72,13 @@
 		height: 100%;
 		width: 100%;
 		object-fit: cover;
-		background-color: rgba(#041918, 0.65);
-		background-image: url('/resources/images/buddy.svg');
-		background-position: bottom;
-		background-size: auto 85%;
-		background-repeat: no-repeat;
 
 		&.mirror {
 			transform: scaleX(-1);
 		}
+
+		&.hidden {
+			display: none;
+		}
 	}
 }

server/lib/Room.js

@@ -380,12 +380,15 @@ class Room extends EventEmitter
 									.then(() =>
 									{
 										if (disable)
-											return videoRtpSender.disable();
+											return videoRtpSender.disable({ emit: false });
 										else
-											return videoRtpSender.enable();
+											return videoRtpSender.enable({ emit: false });
 									})
 									.then(() =>
 									{
+										logger.log('"disableremotevideo" request succeed [disable:%s]',
+											!!disable);
+
 										accept();
 									})
 									.catch((error) =>