Changeset View
Changeset View
Standalone View
Standalone View
src/resources/js/meet/app.js
| Show First 20 Lines • Show All 1,003 Lines • ▼ Show 20 Lines | function publisherCreate(params, content) { | ||||
| let isScreen = params.role & Roles.SCREEN | let isScreen = params.role & Roles.SCREEN | ||||
| // Create the element | // Create the element | ||||
| let wrapper = $( | let wrapper = $( | ||||
| '<div class="meet-video">' | '<div class="meet-video">' | ||||
| + svgIcon('user', 'fas', 'watermark') | + svgIcon('user', 'fas', 'watermark') | ||||
| + '<div class="controls">' | + '<div class="controls">' | ||||
| + '<button type="button" class="btn btn-link link-setup hidden" title="' + $t('meet.media-setup') + '">' + svgIcon('cog') + '</button>' | + '<button type="button" class="btn btn-link link-setup hidden" title="' + $t('meet.media-setup') + '">' + svgIcon('cog') + '</button>' | ||||
| + '<div class="volume hidden"><input type="range" min="0" max="1" step="0.1" /></div>' | |||||
| + '<button type="button" class="btn btn-link link-audio hidden" title="' + $t('meet.menu-audio-mute') + '">' + svgIcon('volume-mute') + '</button>' | + '<button type="button" class="btn btn-link link-audio hidden" title="' + $t('meet.menu-audio-mute') + '">' + svgIcon('volume-mute') + '</button>' | ||||
| + '<button type="button" class="btn btn-link link-fullscreen closed hidden" title="' + $t('meet.menu-fullscreen') + '">' + svgIcon('expand') + '</button>' | + '<button type="button" class="btn btn-link link-fullscreen closed hidden" title="' + $t('meet.menu-fullscreen') + '">' + svgIcon('expand') + '</button>' | ||||
| + '<button type="button" class="btn btn-link link-fullscreen open hidden" title="' + $t('meet.menu-fullscreen') + '">' + svgIcon('compress') + '</button>' | + '<button type="button" class="btn btn-link link-fullscreen open hidden" title="' + $t('meet.menu-fullscreen') + '">' + svgIcon('compress') + '</button>' | ||||
| + '</div>' | + '</div>' | ||||
| + '<div class="status">' | + '<div class="status">' | ||||
| + '<span class="bg-warning status-audio hidden">' + svgIcon('microphone-slash') + '</span>' | + '<span class="bg-warning status-audio hidden">' + svgIcon('microphone-slash') + '</span>' | ||||
| + '<span class="bg-warning status-video hidden">' + svgIcon('video-slash') + '</span>' | + '<span class="bg-warning status-video hidden">' + svgIcon('video-slash') + '</span>' | ||||
| + '</div>' | + '</div>' | ||||
| Show All 9 Lines | function publisherCreate(params, content) { | ||||
| if (isScreen) { | if (isScreen) { | ||||
| wrapper.addClass('screen') | wrapper.addClass('screen') | ||||
| } | } | ||||
| if (params.isSelf) { | if (params.isSelf) { | ||||
| wrapper.find('.link-setup').removeClass('hidden').click(() => sessionData.onMediaSetup()) | wrapper.find('.link-setup').removeClass('hidden').click(() => sessionData.onMediaSetup()) | ||||
| } else { | } else { | ||||
| // Enable audio mute button | let volumeInput = wrapper.find('.volume input') | ||||
| wrapper.find('.link-audio').removeClass('hidden') | let audioButton = wrapper.find('.link-audio') | ||||
| let inVolume = false | |||||
| let hideVolumeTimeout | |||||
| let hideVolume = () => { | |||||
| if (inVolume) { | |||||
| hideVolumeTimeout = setTimeout(hideVolume, 1000) | |||||
| } else { | |||||
| volumeInput.parent().addClass('hidden') | |||||
| } | |||||
| } | |||||
| // Enable and set up the audio mute button | |||||
| audioButton.removeClass('hidden') | |||||
| .on('click', e => { | .on('click', e => { | ||||
| let video = wrapper.find('video')[0] | let video = wrapper.find('video')[0] | ||||
| video.muted = !video.muted | video.muted = !video.muted | ||||
| wrapper.find('.link-audio')[video.muted ? 'addClass' : 'removeClass']('text-danger') | video.volume = video.muted ? 0 : 1 | ||||
| audioButton[video.muted ? 'addClass' : 'removeClass']('text-danger') | |||||
| volumeInput.val(video.volume) | |||||
| }) | |||||
| // Show the volume slider when mouse is over the audio mute/unmute button | |||||
| .on('mouseenter', () => { | |||||
| let video = wrapper.find('video')[0] | |||||
| clearTimeout(hideVolumeTimeout) | |||||
| volumeInput.parent().removeClass('hidden') | |||||
| volumeInput.val(video.volume) | |||||
| }) | |||||
| .on('mouseleave', () => { | |||||
| hideVolumeTimeout = setTimeout(hideVolume, 1000) | |||||
| }) | |||||
| // Set up the audio volume control | |||||
| volumeInput | |||||
| .on('mouseenter', () => { inVolume = true }) | |||||
| .on('mouseleave', () => { inVolume = false }) | |||||
| .on('change input', () => { | |||||
| let video = wrapper.find('video')[0] | |||||
| let volume = volumeInput.val() | |||||
| video.volume = volume | |||||
| video.muted = volume == 0 | |||||
| audioButton[video.muted ? 'addClass' : 'removeClass']('text-danger') | |||||
| }) | }) | ||||
| } | } | ||||
| participantUpdate(wrapper, params, true) | participantUpdate(wrapper, params, true) | ||||
| // Fullscreen control | // Fullscreen control | ||||
| if (document.fullscreenEnabled) { | if (document.fullscreenEnabled) { | ||||
| wrapper.find('.link-fullscreen.closed').removeClass('hidden') | wrapper.find('.link-fullscreen.closed').removeClass('hidden') | ||||
| ▲ Show 20 Lines • Show All 633 Lines • Show Last 20 Lines | |||||