diff --git a/conference.js b/conference.js
index 192a65a6b..0fd7e8d31 100644
--- a/conference.js
+++ b/conference.js
@@ -670,7 +670,10 @@ export default {
});
room.on(ConferenceEvents.TRACK_REMOVED, (track) => {
- // FIXME handle
+ if(!track || track.isLocal())
+ return;
+
+ APP.UI.removeRemoteStream(track);
});
room.on(ConferenceEvents.TRACK_MUTE_CHANGED, (track) => {
diff --git a/modules/UI/UI.js b/modules/UI/UI.js
index e1b77e2f2..c75c7b926 100644
--- a/modules/UI/UI.js
+++ b/modules/UI/UI.js
@@ -444,6 +444,14 @@ UI.addRemoteStream = function (track) {
VideoLayout.onRemoteStreamAdded(track);
};
+/**
+ * Removed remote stream from UI.
+ * @param {JitsiTrack} track stream to remove
+ */
+UI.removeRemoteStream = function (track) {
+ VideoLayout.onRemoteStreamRemoved(track);
+};
+
function chatAddError(errorMessage, originalText) {
return Chat.chatAddError(errorMessage, originalText);
}
diff --git a/modules/UI/videolayout/RemoteVideo.js b/modules/UI/videolayout/RemoteVideo.js
index 7683c671f..f0bb32155 100644
--- a/modules/UI/videolayout/RemoteVideo.js
+++ b/modules/UI/videolayout/RemoteVideo.js
@@ -143,14 +143,16 @@ if (!interfaceConfig.filmStripOnly) {
* @param stream the MediaStream
* @param isVideo true if given stream is a video one.
*/
-RemoteVideo.prototype.removeRemoteStreamElement =
- function (stream, isVideo, id) {
+RemoteVideo.prototype.removeRemoteStreamElement = function (stream) {
if (!this.container)
return false;
+ var isVideo = stream.isVideoTrack();
+
+ var elementID = SmallVideo.getStreamElementID(stream);
var select = null;
if (isVideo) {
- select = $('#' + id);
+ select = $('#' + elementID);
}
else
select = $('#' + this.videoSpanId + '>audio');
diff --git a/modules/UI/videolayout/SmallVideo.js b/modules/UI/videolayout/SmallVideo.js
index 2ea5d87ea..e55eafec6 100644
--- a/modules/UI/videolayout/SmallVideo.js
+++ b/modules/UI/videolayout/SmallVideo.js
@@ -129,7 +129,7 @@ SmallVideo.createStreamElement = function (stream) {
RTCUIHelper.setAutoPlay(element, true);
- element.id = (isVideo ? 'remoteVideo_' : 'remoteAudio_') + stream.getId();
+ element.id = SmallVideo.getStreamElementID(stream);
element.onplay = function () {
console.log("(TIME) Render " + (isVideo ? 'video' : 'audio') + ":\t",
@@ -141,6 +141,15 @@ SmallVideo.createStreamElement = function (stream) {
return element;
};
+/**
+ * Returns the element id for a particular MediaStream.
+ */
+SmallVideo.getStreamElementID = function (stream) {
+ let isVideo = stream.isVideoTrack();
+
+ return (isVideo ? 'remoteVideo_' : 'remoteAudio_') + stream.getId();
+};
+
/**
* Configures hoverIn/hoverOut handlers.
*/
diff --git a/modules/UI/videolayout/VideoLayout.js b/modules/UI/videolayout/VideoLayout.js
index 15502b3ee..b7f20e1e2 100644
--- a/modules/UI/videolayout/VideoLayout.js
+++ b/modules/UI/videolayout/VideoLayout.js
@@ -269,6 +269,11 @@ var VideoLayout = {
}
},
+ onRemoteStreamRemoved (stream) {
+ let id = stream.getParticipantId();
+ remoteVideos[id].removeRemoteStreamElement(stream);
+ },
+
/**
* Return the type of the remote video.
* @param id the id for the remote video