Fixes shifted audio level glow on thumbnails. Fixes missing audio level indicator on large video avatar.

This commit is contained in:
yanas 2016-02-05 11:32:09 -06:00
parent 4228537390
commit e7e8dc3457
4 changed files with 29 additions and 19 deletions

View File

@ -420,7 +420,7 @@
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
z-index: 2;
visibility: inherit;
}
@ -435,7 +435,7 @@
margin: auto;
position: relative;
border-radius: 50px;
z-index: 2;
z-index: 3;
visibility: inherit;
}

View File

@ -50,7 +50,8 @@ function drawAudioLevelCanvas(id, audioLevel) {
* been observed to pile into the console, strain the CPU.
*/
if (audioLevelCanvasOrig) {
audioLevelCanvasCache[id] = CanvasUtil.cloneCanvas(audioLevelCanvasOrig);
audioLevelCanvasCache[id]
= CanvasUtil.cloneCanvas(audioLevelCanvasOrig);
}
}
@ -68,13 +69,14 @@ function drawAudioLevelCanvas(id, audioLevel) {
if (shadowLevel > 0) {
// drawContext, x, y, w, h, r, shadowColor, shadowLevel
CanvasUtil.drawRoundRectGlow(drawContext,
interfaceConfig.CANVAS_EXTRA / 2, interfaceConfig.CANVAS_EXTRA / 2,
canvas.width - interfaceConfig.CANVAS_EXTRA,
canvas.height - interfaceConfig.CANVAS_EXTRA,
interfaceConfig.CANVAS_RADIUS,
interfaceConfig.SHADOW_COLOR,
shadowLevel);
CanvasUtil.drawRoundRectGlow(
drawContext,
interfaceConfig.CANVAS_EXTRA / 2, interfaceConfig.CANVAS_EXTRA / 2,
canvas.width - interfaceConfig.CANVAS_EXTRA,
canvas.height - interfaceConfig.CANVAS_EXTRA,
interfaceConfig.CANVAS_RADIUS,
interfaceConfig.SHADOW_COLOR,
shadowLevel);
}
}
@ -88,11 +90,14 @@ function getShadowLevel (audioLevel) {
let shadowLevel = 0;
if (audioLevel <= 0.3) {
shadowLevel = Math.round(interfaceConfig.CANVAS_EXTRA/2*(audioLevel/0.3));
shadowLevel
= Math.round(interfaceConfig.CANVAS_EXTRA/2*(audioLevel/0.3));
} else if (audioLevel <= 0.6) {
shadowLevel = Math.round(interfaceConfig.CANVAS_EXTRA/2*((audioLevel - 0.3) / 0.3));
shadowLevel
= Math.round(interfaceConfig.CANVAS_EXTRA/2*((audioLevel - 0.3) / 0.3));
} else {
shadowLevel = Math.round(interfaceConfig.CANVAS_EXTRA/2*((audioLevel - 0.6) / 0.4));
shadowLevel
= Math.round(interfaceConfig.CANVAS_EXTRA/2*((audioLevel - 0.6) / 0.4));
}
return shadowLevel;
@ -203,7 +208,8 @@ const AudioLevels = {
},
updateDominantSpeakerAudioLevel (audioLevel) {
if($("#domiantSpeaker").css("visibility") == "hidden" || ASDrawContext === null) {
if($("#dominantSpeaker").css("visibility") == "hidden"
|| ASDrawContext === null) {
return;
}
@ -214,7 +220,6 @@ const AudioLevels = {
ASDrawContext.shadowBlur = getShadowLevel(audioLevel);
// Fill the shape.
ASDrawContext.fill();
},
@ -223,7 +228,10 @@ const AudioLevels = {
let canvasWidth = thumbWidth + interfaceConfig.CANVAS_EXTRA;
let canvasHeight = thumbHeight + interfaceConfig.CANVAS_EXTRA;
BottomToolbar.getThumbs().children('canvas').width(canvasWidth).height(canvasHeight);
BottomToolbar.getThumbs().children('canvas').each(function () {
$(this).attr('width', canvasWidth);
$(this).attr('height', canvasHeight);
});
Object.keys(audioLevelCanvasCache).forEach(function (id) {
audioLevelCanvasCache[id].width = canvasWidth;

View File

@ -418,13 +418,14 @@ export default class LargeVideoManager {
// change the avatar url on large
this.updateAvatar(Avatar.getAvatarUrl(id));
let isVideoMuted = stream? stream.isMuted() : true;
let isVideoMuted = stream ? stream.isMuted() : true;
// show the avatar on large if needed
this.videoContainer.showAvatar(isVideoMuted);
// do not show stream if video is muted
let promise = isVideoMuted ? Promise.resolve() : this.videoContainer.show();
let promise
= isVideoMuted ? Promise.resolve() : this.videoContainer.show();
// resolve updateLargeVideo promise after everything is done
promise.then(resolve);

View File

@ -150,7 +150,8 @@ var VideoLayout = {
this.onVideoTypeChanged(localId, stream.videoType);
let {thumbWidth, thumbHeight} = this.calculateThumbnailSize();
AudioLevels.updateAudioLevelCanvas(null, thumbWidth, thumbHeight);
AudioLevels.updateAudioLevelCanvas(
null, thumbWidth, thumbHeight);
if (!stream.isMuted()) {
localVideoThumbnail.changeVideo(stream);