Changeset View
Changeset View
Standalone View
Standalone View
src/resources/js/meet/app.js
| import anchorme from 'anchorme' | import anchorme from 'anchorme' | ||||
| import { Dropdown } from 'bootstrap' | |||||
| import { library } from '@fortawesome/fontawesome-svg-core' | import { library } from '@fortawesome/fontawesome-svg-core' | ||||
| import { OpenVidu } from 'openvidu-browser' | import { OpenVidu } from 'openvidu-browser' | ||||
| class Roles { | class Roles { | ||||
| static get SUBSCRIBER() { return 1 << 0; } | static get SUBSCRIBER() { return 1 << 0; } | ||||
| static get PUBLISHER() { return 1 << 1; } | static get PUBLISHER() { return 1 << 1; } | ||||
| static get MODERATOR() { return 1 << 2; } | static get MODERATOR() { return 1 << 2; } | ||||
| static get SCREEN() { return 1 << 3; } | static get SCREEN() { return 1 << 3; } | ||||
| ▲ Show 20 Lines • Show All 1,018 Lines • ▼ Show 20 Lines | function publisherCreate(params, content) { | ||||
| wrapper.prepend(content) | wrapper.prepend(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').on('click', () => sessionData.onMediaSetup()) | ||||
| } else { | } else { | ||||
| let volumeInput = wrapper.find('.volume input') | let volumeInput = wrapper.find('.volume input') | ||||
| let audioButton = wrapper.find('.link-audio') | let audioButton = wrapper.find('.link-audio') | ||||
| let inVolume = false | let inVolume = false | ||||
| let hideVolumeTimeout | let hideVolumeTimeout | ||||
| let hideVolume = () => { | let hideVolume = () => { | ||||
| if (inVolume) { | if (inVolume) { | ||||
| hideVolumeTimeout = setTimeout(hideVolume, 1000) | hideVolumeTimeout = setTimeout(hideVolume, 1000) | ||||
| ▲ Show 20 Lines • Show All 234 Lines • ▼ Show 20 Lines | function nicknameWidget(params) { | ||||
| + '</span>' | + '</span>' | ||||
| + '</a>' | + '</a>' | ||||
| + '<div class="dropdown-menu">' | + '<div class="dropdown-menu">' | ||||
| + '<a class="dropdown-item action-nickname" href="#">Nickname</a>' | + '<a class="dropdown-item action-nickname" href="#">Nickname</a>' | ||||
| + '<a class="dropdown-item action-dismiss" href="#">Dismiss</a>' | + '<a class="dropdown-item action-dismiss" href="#">Dismiss</a>' | ||||
| + '<div class="dropdown-divider permissions"></div>' | + '<div class="dropdown-divider permissions"></div>' | ||||
| + '<div class="permissions">' | + '<div class="permissions">' | ||||
| + '<h6 class="dropdown-header">' + $t('meet.perm') + '</h6>' | + '<h6 class="dropdown-header">' + $t('meet.perm') + '</h6>' | ||||
| + '<label class="dropdown-item action-role-publisher custom-control custom-switch">' | + '<label class="dropdown-item action-role-publisher form-check form-switch">' | ||||
| + '<input type="checkbox" class="custom-control-input">' | + '<input type="checkbox" class="form-check-input">' | ||||
| + ' <span class="custom-control-label">' + $t('meet.perm-av') + '</span>' | + ' <span class="form-check-label">' + $t('meet.perm-av') + '</span>' | ||||
| + '</label>' | + '</label>' | ||||
| + '<label class="dropdown-item action-role-moderator custom-control custom-switch">' | + '<label class="dropdown-item action-role-moderator form-check form-switch">' | ||||
| + '<input type="checkbox" class="custom-control-input">' | + '<input type="checkbox" class="form-check-input">' | ||||
| + ' <span class="custom-control-label">' + $t('meet.perm-mod') + '</span>' | + ' <span class="form-check-label">' + $t('meet.perm-mod') + '</span>' | ||||
| + '</label>' | + '</label>' | ||||
| + '</div>' | + '</div>' | ||||
| + '<div class="dropdown-divider interpreting"></div>' | + '<div class="dropdown-divider interpreting"></div>' | ||||
| + '<div class="interpreting">' | + '<div class="interpreting">' | ||||
| + '<h6 class="dropdown-header">' + $t('meet.lang-int') + '</h6>' | + '<h6 class="dropdown-header">' + $t('meet.lang-int') + '</h6>' | ||||
| + '<div class="ml-4 mr-4"><select class="custom-select">' | + '<div class="ps-3 pe-3"><select class="form-select">' | ||||
| + '<option value="">- ' + $t('form.none') + ' -</option>' | + '<option value="">- ' + $t('form.none') + ' -</option>' | ||||
| + languages.join('') | + languages.join('') | ||||
| + '</select></div>' | + '</select></div>' | ||||
| + '</div>' | + '</div>' | ||||
| + '</div>' | + '</div>' | ||||
| + '</div>' | + '</div>' | ||||
| ) | ) | ||||
| let nickname = element.find('.meet-nickname') | let nickname = element.find('.meet-nickname') | ||||
| .addClass('btn btn-outline-' + (params.isSelf ? 'primary' : 'secondary')) | .addClass('btn btn-outline-' + (params.isSelf ? 'primary' : 'secondary')) | ||||
| .attr({title: $t('meet.menu-options'), 'data-toggle': 'dropdown'}) | .attr({title: $t('meet.menu-options'), 'data-bs-toggle': 'dropdown'}) | ||||
| .dropdown({boundary: container.parentNode}) | |||||
| const dropdown = new Dropdown(nickname[0], {boundary: container.parentNode}) | |||||
| if (params.isSelf) { | if (params.isSelf) { | ||||
| // Add events for nickname change | // Add events for nickname change | ||||
| let editable = element.find('.content')[0] | let editable = element.find('.content')[0] | ||||
| let editableEnable = () => { | let editableEnable = () => { | ||||
| editable.contentEditable = true | editable.contentEditable = true | ||||
| editable.focus() | editable.focus() | ||||
| } | } | ||||
| ▲ Show 20 Lines • Show All 68 Lines • ▼ Show 20 Lines | function nicknameWidget(params) { | ||||
| sessionData.onConnectionChange(params.connectionId, { role }) | sessionData.onConnectionChange(params.connectionId, { role }) | ||||
| }) | }) | ||||
| element.find('.interpreting select') | element.find('.interpreting select') | ||||
| .on('change', e => { | .on('change', e => { | ||||
| const language = $(e.target).val() | const language = $(e.target).val() | ||||
| sessionData.onConnectionChange(params.connectionId, { language }) | sessionData.onConnectionChange(params.connectionId, { language }) | ||||
| element.find('.meet-nickname').dropdown('hide') | dropdown.hide() | ||||
| }) | }) | ||||
| .on('click', e => { | .on('click', e => { | ||||
| // Prevents from closing the dropdown menu on click | // Prevents from closing the dropdown menu on click | ||||
| e.stopPropagation() | e.stopPropagation() | ||||
| }) | }) | ||||
| return element.get(0) | return element.get(0) | ||||
| } | } | ||||
| ▲ Show 20 Lines • Show All 320 Lines • Show Last 20 Lines | |||||