Fixes active speaker avatar and active speaker audio level missmatch.

This commit is contained in:
fo 2014-12-12 11:32:16 +02:00
parent 4230aa1ff1
commit d1c634abc2
6 changed files with 30 additions and 19 deletions

View File

@ -77,8 +77,7 @@ var Avatar = (function(my) {
//currently shown
if (activeSpeakerJid === jid && VideoLayout.isLargeVideoOnTop()) {
setVisibility($("#largeVideo"), !show);
setVisibility($('#activeSpeakerAvatar'), show);
setVisibility($('#activeSpeakerAudioLevel'), show);
setVisibility($('#activeSpeaker'), show);
setVisibility(avatar, false);
setVisibility(video, false);
} else {

View File

@ -377,11 +377,21 @@
pointer-events: none;
}
#activeSpeakerAudioLevel {
#activeSpeaker {
visibility: hidden;
width: 150px;
height: 150px;
margin: auto;
overflow: hidden;
position: relative;
}
#activeSpeakerAudioLevel {
position: absolute;
top: 113px;
top: 0px;
left: 0px;
z-index: 1;
visibility: inherit;
}
#mixedstream {
@ -389,13 +399,14 @@
}
#activeSpeakerAvatar {
visibility: hidden;
width: 100px;
height: 100px;
top: 25px;
margin: auto;
position: relative;
border-radius: 50px;
z-index: 2;
visibility: inherit;
}
.userAvatar {

View File

@ -42,6 +42,7 @@ var Etherpad = (function (my) {
largeVideo = $('#largeVideo');
if ($('#etherpad>iframe').css('visibility') === 'hidden') {
$('#activeSpeaker').css('visibility', 'hidden');
largeVideo.fadeOut(300, function () {
if (Prezi.isPresentationVisible()) {
largeVideo.css({opacity: '0'});

View File

@ -41,15 +41,15 @@
<script src="contact_list.js?v=7"></script><!-- contact list logic -->
<script src="side_panel_toggler.js?v=1"></script>
<script src="util.js?v=7"></script><!-- utility functions -->
<script src="etherpad.js?v=9"></script><!-- etherpad plugin -->
<script src="prezi.js?v=6"></script><!-- prezi plugin -->
<script src="etherpad.js?v=10"></script><!-- etherpad plugin -->
<script src="prezi.js?v=7"></script><!-- prezi plugin -->
<script src="smileys.js?v=3"></script><!-- smiley images -->
<script src="replacement.js?v=7"></script><!-- link and smiley replacement -->
<script src="moderatemuc.js?v=4"></script><!-- moderator plugin -->
<script src="analytics.js?v=1"></script><!-- google analytics plugin -->
<script src="rtp_sts.js?v=5"></script><!-- RTP stats processing -->
<script src="local_sts.js?v=2"></script><!-- Local stats processing -->
<script src="videolayout.js?v=30"></script><!-- video ui -->
<script src="videolayout.js?v=31"></script><!-- video ui -->
<script src="connectionquality.js?v=1"></script>
<script src="toolbar.js?v=6"></script><!-- toolbar ui -->
<script src="toolbar_toggler.js?v=2"></script>
@ -66,11 +66,11 @@
<script src="message_handler.js?v=2"></script>
<script src="api_connector.js?v=2"></script>
<script src="settings_menu.js?v=1"></script>
<script src="avatar.js?v=2"></script><!-- avatars -->
<script src="avatar.js?v=3"></script><!-- avatars -->
<link rel="stylesheet" href="css/font.css?v=6"/>
<link rel="stylesheet" href="css/toastr.css?v=1">
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css?v=30"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/videolayout_default.css?v=15" id="videolayout_default"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/videolayout_default.css?v=16" id="videolayout_default"/>
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="css/jquery-impromptu.css?v=4">
<link rel="stylesheet" href="css/modaldialog.css?v=3">
@ -264,8 +264,10 @@
<a target="_new"><div class="watermark leftwatermark"></div></a>
<a target="_new"><div class="watermark rightwatermark"></div></a>
<a class="poweredby" href="http://jitsi.org" target="_new" >powered by jitsi.org</a>
<img id="activeSpeakerAvatar" src=""/>
<canvas id="activeSpeakerAudioLevel"></canvas>
<div id="activeSpeaker">
<img id="activeSpeakerAvatar" src=""/>
<canvas id="activeSpeakerAudioLevel"></canvas>
</div>
<video id="largeVideo" autoplay oncontextmenu="return false;"></video>
</div>
<div id="remoteVideos">

View File

@ -25,7 +25,7 @@ var Prezi = (function (my) {
ToolbarToggler.dockToolbar(true);
VideoLayout.setLargeVideoVisible(false);
});
$('#activeSpeakerAvatar').css('visibility', 'hidden');
$('#activeSpeaker').css('visibility', 'hidden');
}
else {
if (prezi.css('opacity') == '1') {

View File

@ -173,8 +173,7 @@ var VideoLayout = (function (my) {
if (RTC.getVideoSrc($('#largeVideo')[0]) !== newSrc) {
$('#activeSpeakerAvatar').css('visibility', 'hidden');
$('#activeSpeakerAudioLevel').css('visibility', 'hidden');
$('#activeSpeaker').css('visibility', 'hidden');
// Due to the simulcast the localVideoSrc may have changed when the
// fadeOut event triggers. In that case the getJidFromVideoSrc and
// isVideoSrcDesktop methods will not function correctly.
@ -434,6 +433,7 @@ var VideoLayout = (function (my) {
}
else {
$('#largeVideo').css({visibility: 'hidden'});
$('#activeSpeaker').css('visibility', 'hidden');
$('.watermark').css({visibility: 'hidden'});
VideoLayout.enableDominantSpeaker(resourceJid, false);
if(focusedVideoInfo) {
@ -1040,10 +1040,8 @@ var VideoLayout = (function (my) {
$('#largeVideoContainer').height(availableHeight);
var avatarSize = interfaceConfig.ACTIVE_SPEAKER_AVATAR_SIZE;
var top = (availableHeight - avatarSize) / 2;
$('#activeSpeakerAvatar').css('top', top);
$('#activeSpeakerAudioLevel').css('top', top - avatarSize / 4);
$('#activeSpeakerAudioLevel').css('left', availableWidth / 2 - avatarSize * 3 / 4);
var top = availableHeight / 2 - avatarSize / 4 * 3;
$('#activeSpeaker').css('top', top);
VideoLayout.resizeThumbnails();
};