jiti-meet/modules/UI/audio_levels/AudioLevels.js

67 lines
1.7 KiB
JavaScript

/* global interfaceConfig */
import UIUtil from '../util/UIUtil';
/**
* Responsible for drawing audio levels.
*/
const AudioLevels = {
/**
* Updates the audio level of the large video.
*
* @param audioLevel the new audio level to set.
*/
updateLargeVideoAudioLevel(elementId, audioLevel) {
const element = document.getElementById(elementId);
if (!UIUtil.isVisible(element)) {
return;
}
let level = parseFloat(audioLevel);
level = isNaN(level) ? 0 : level;
let shadowElement = element.getElementsByClassName('dynamic-shadow');
if (shadowElement && shadowElement.length > 0) {
shadowElement = shadowElement[0];
}
shadowElement.style.boxShadow = this._updateLargeVideoShadow(level);
},
/**
* Updates the large video shadow effect.
*/
_updateLargeVideoShadow(level) {
const scale = 2;
// Internal circle audio level.
const int = {
level: level > 0.15 ? 20 : 0,
color: interfaceConfig.AUDIO_LEVEL_PRIMARY_COLOR
};
// External circle audio level.
const ext = {
level: parseFloat(
((int.level * scale * level) + int.level).toFixed(0)),
color: interfaceConfig.AUDIO_LEVEL_SECONDARY_COLOR
};
// Internal blur.
int.blur = int.level ? 2 : 0;
// External blur.
ext.blur = ext.level ? 6 : 0;
return [
`0 0 ${int.blur}px ${int.level}px ${int.color}`,
`0 0 ${ext.blur}px ${ext.level}px ${ext.color}`
].join(', ');
}
};
export default AudioLevels;