haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixes active speaker relevant issues. Moves all UI related code in the videolayout.js

This commit is contained in:
yanas 2014-06-24 14:59:14 +03:00
parent 49cf8cba3a
commit 1c1c3f8f5b
3 changed files with 76 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app.js
View File

@ -319,7 +319,10 @@ $(document).bind('remotestreamadded.jingle', function (event, data, sid) {
// If the video has been "pinned" by the user we want to keep the
// display name on place.
if (focusedVideoSrc !== videoSrc)
if (focusedVideoSrc && focusedVideoSrc !== videoSrc
|| (!focusedVideoSrc
&& container.id
!== VideoLayout.getActiveSpeakerContainerId()))
VideoLayout.showDisplayName(container.id, false);
}
);
@ -436,6 +439,8 @@ function statsUpdated(statsCollector)
{
console.info(jid + " audio level: " +
peerStats.ssrc2AudioLevel[ssrc] + " of ssrc: " + ssrc);
// VideoLayout.updateAudioLevel( Strophe.getResourceFromJid(jid),
// peerStats.ssrc2AudioLevel[ssrc]);
});
});
}

23
data_channels.js
View File

@ -30,27 +30,14 @@ function onDataChannel(event)
console.info("Got Data Channel Message:", msgData, dataChannel);
// Active speaker event
if (msgData.indexOf('activeSpeaker') === 0 && !focusedVideoSrc)
if (msgData.indexOf('activeSpeaker') === 0)
{
// Endpoint ID from the bridge
var endpointId = msgData.split(":")[1];
console.info("New active speaker: " + endpointId);
var resourceJid = msgData.split(":")[1];
var container = document.getElementById(
'participant_' + endpointId);
// Local video will not have container found, but that's ok
// since we don't want to switch to local video
if (container)
{
var video = container.getElementsByTagName("video");
if (video.length)
{
VideoLayout.updateLargeVideo(video[0].src);
VideoLayout.enableActiveSpeaker(endpointId, true);
}
}
console.info(
"Data channel new active speaker event: " + resourceJid);
$(document).trigger('activespeakerchanged', [resourceJid]);
}
};

84
videolayout.js
View File

@ -138,8 +138,7 @@ var VideoLayout = (function (my) {
my.handleVideoThumbClicked = function(videoSrc) {
// Restore style for previously focused video
var focusJid = getJidFromVideoSrc(focusedVideoSrc);
var oldContainer =
getParticipantContainer(focusJid);
var oldContainer = getParticipantContainer(focusJid);
if (oldContainer) {
oldContainer.removeClass("videoContainerFocused");
@ -147,12 +146,22 @@ var VideoLayout = (function (my) {
Strophe.getResourceFromJid(focusJid), false);
}
// Unlock
// Unlock current focused.
if (focusedVideoSrc === videoSrc)
{
focusedVideoSrc = null;
// Enable the currently set active speaker.
if (currentActiveSpeaker) {
VideoLayout.enableActiveSpeaker(currentActiveSpeaker, true);
}
return;
}
// Remove style for current active speaker if we're going to lock
// another video.
else if (currentActiveSpeaker) {
VideoLayout.enableActiveSpeaker(currentActiveSpeaker, false);
}
// Lock new video
focusedVideoSrc = videoSrc;
@ -526,7 +535,12 @@ var VideoLayout = (function (my) {
* disabled
*/
my.enableActiveSpeaker = function(resourceJid, isEnable) {
console.log("Enable active speaker", resourceJid, isEnable);
var displayName = resourceJid;
var nameSpan = $('#participant_' + resourceJid + '>span.displayname');
if (nameSpan.length > 0)
displayName = nameSpan.text();
console.log("Enable active speaker", displayName, isEnable);
var videoSpanId = null;
if (resourceJid
@ -542,21 +556,6 @@ var VideoLayout = (function (my) {
return;
}
// If there's an active speaker (automatically) selected we have to
// disable this state and update the current active speaker.
if (isEnable) {
if (currentActiveSpeaker) {
var oldSpeaker = currentActiveSpeaker;
setTimeout(function () {
VideoLayout.enableActiveSpeaker(oldSpeaker, false);
}, 200);
}
currentActiveSpeaker = resourceJid;
}
else if (resourceJid === currentActiveSpeaker)
currentActiveSpeaker = null;
var video = $('#' + videoSpanId + '>video');
if (video && video.length > 0) {
@ -733,6 +732,13 @@ var VideoLayout = (function (my) {
}
};
/**
* Returns the current active speaker.
*/
my.getActiveSpeakerContainerId = function () {
return 'participant_' + currentActiveSpeaker;
};
/**
* Adds the remote video menu element for the given <tt>jid</tt> in the
* given <tt>parentElement</tt>.
@ -841,5 +847,45 @@ var VideoLayout = (function (my) {
VideoLayout.showVideoIndicator(videoSpanId, isMuted);
});
/**
* On active speaker changed event.
*/
$(document).bind('activespeakerchanged', function (event, resourceJid) {
// Disable style for previous active speaker.
if (currentActiveSpeaker
&& currentActiveSpeaker !== resourceJid
&& !focusedVideoSrc) {
var oldContainer = document.getElementById(
'participant_' + currentActiveSpeaker);
if (oldContainer) {
VideoLayout.enableActiveSpeaker(currentActiveSpeaker, false);
}
}
// Obtain container for new active speaker.
var container = document.getElementById(
'participant_' + resourceJid);
// Update the current active speaker.
if (resourceJid !== currentActiveSpeaker)
currentActiveSpeaker = resourceJid;
else
return;
// Local video will not have container found, but that's ok
// since we don't want to switch to local video.
if (container && !focusedVideoSrc)
{
var video = container.getElementsByTagName("video");
if (video.length)
{
VideoLayout.updateLargeVideo(video[0].src);
VideoLayout.enableActiveSpeaker(resourceJid, true);
}
}
});
return my;
}(VideoLayout || {}));