This is an automated email from the ASF dual-hosted git repository. solomax pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/openmeetings.git
The following commit(s) were added to refs/heads/master by this push: new f4f7033 [OPENMEETINGS-2000] video pods can be fixed size f4f7033 is described below commit f4f7033ce984468a0f6ff48976db9d4084313946 Author: Maxim Solodovnik <solomax...@gmail.com> AuthorDate: Thu Jan 21 09:37:31 2021 +0700 [OPENMEETINGS-2000] video pods can be fixed size --- openmeetings-web/src/main/front/room/src/room.js | 8 --- .../src/main/front/room/src/user-list.js | 27 ++++++-- .../src/main/front/room/src/user-settings.js | 41 ++++++----- openmeetings-web/src/main/front/room/src/video.js | 22 +++++- .../src/main/front/settings/src/settings.js | 13 +++- .../src/main/front/settings/src/video-util.js | 13 +++- .../apache/openmeetings/web/room/RoomPanel.html | 80 +++++++++++----------- 7 files changed, 125 insertions(+), 79 deletions(-) diff --git a/openmeetings-web/src/main/front/room/src/room.js b/openmeetings-web/src/main/front/room/src/room.js index 2891503..a4a699e 100644 --- a/openmeetings-web/src/main/front/room/src/room.js +++ b/openmeetings-web/src/main/front/room/src/room.js @@ -33,14 +33,6 @@ function _init(_options) { }); }); __dockSetMode(true); - const header = $('#room-sidebar-tab-users .header'); - header.find('.om-icon.settings').off().click(VideoSettings.open); - header.find('.om-icon.activity.cam').off().click(function() { - VideoManager.toggleActivity('VIDEO'); - }); - header.find('.om-icon.activity.mic').off().click(function() { - VideoManager.toggleActivity('AUDIO'); - }); menuHeight = menu.length === 0 ? 0 : menu.height(); VideoManager.init(); Activities.init(); diff --git a/openmeetings-web/src/main/front/room/src/user-list.js b/openmeetings-web/src/main/front/room/src/user-list.js index f437581..1c94628 100644 --- a/openmeetings-web/src/main/front/room/src/user-list.js +++ b/openmeetings-web/src/main/front/room/src/user-list.js @@ -6,7 +6,7 @@ const QuickPoll = require('./quick-poll'); let options; function __activityAVIcon(elem, selector, predicate, onfunc, disabledfunc) { - let icon = elem.find(selector); + const icon = elem.find(selector); if (predicate()) { icon.show(); const on = onfunc() @@ -25,6 +25,7 @@ function __activityAVIcon(elem, selector, predicate, onfunc, disabledfunc) { } else { icon.hide(); } + return icon; } function __activityIcon(elem, selector, predicate, action, confirm) { let icon = elem.find(selector); @@ -189,14 +190,26 @@ function _updateClient(c) { QuickPoll.setRights(); options.activities = c.activities; const header = $('#room-sidebar-tab-users .header'); + header.find('.om-icon.settings').off().click(VideoSettings.open); __rightVideoIcon(c, header); - __activityAVIcon(header, '.activity.cam', () => !options.audioOnly && UserListUtil.hasRight('VIDEO') - , () => hasVideo - , () => Settings.load().video.cam < 0); + __activityAVIcon( + header + , '.activity.cam' + , () => !options.audioOnly && UserListUtil.hasRight('VIDEO') + , () => hasVideo + , () => Settings.load().video.cam < 0) + .off().click(function() { + VideoManager.toggleActivity('VIDEO'); + });; __rightAudioIcon(c, header); - __activityAVIcon(header, '.activity.mic', () => UserListUtil.hasRight('AUDIO') - , () => hasAudio - , () => Settings.load().video.mic < 0); + __activityAVIcon( + header + , '.activity.mic', () => UserListUtil.hasRight('AUDIO') + , () => hasAudio + , () => Settings.load().video.mic < 0) + .off().click(function() { + VideoManager.toggleActivity('AUDIO'); + }); __rightOtherIcons(c, header); } VideoManager.update(c) diff --git a/openmeetings-web/src/main/front/room/src/user-settings.js b/openmeetings-web/src/main/front/room/src/user-settings.js index 372deed..43aed96 100644 --- a/openmeetings-web/src/main/front/room/src/user-settings.js +++ b/openmeetings-web/src/main/front/room/src/user-settings.js @@ -30,25 +30,32 @@ function __initChat() { }); } function __initVideo() { - let s = VideoSettings.load() - , resolutions = $('#video-settings .cam-resolution').clone(); - if (typeof(s.fixed) === 'undefined') { - s.fixed = { - enabled: false - , width: 120 - , height: 90 - }; - VideoSettings.save() - } - $('#video-sizes-container').html('') - .append(resolutions); - $('#sendOnCtrlEnter') + const resolutions = $('#video-settings .cam-resolution').clone(); + let s = VideoSettings.load(); + resolutions + .change(function() { + const o = resolutions.find('option:selected').data(); + s.fixed.width = o.width; + s.fixed.height = o.height; + VideoSettings.save(); + }) + .find('option').each(function() { + const o = $(this).data(); + if (o.width === s.fixed.width && o.height === s.fixed.height) { + $(this).prop('selected', true); + return false; + } + }); + $('#video-sizes-container') + .html('') + .append(resolutions.prop('disabled', !s.fixed.enabled)); + $('#fixedVideoPod') .prop('checked', s.fixed.enabled) .off().click(function() { - s = Settings.load(); - s.chat.sendOn = $('#sendOnCtrlEnter').prop('checked') ? Chat.SEND_CTRL : Chat.SEND_ENTER; - Settings.save(s); - Chat.reload(); + s = VideoSettings.load(); + s.fixed.enabled = $('#fixedVideoPod').prop('checked'); + resolutions.prop('disabled', !s.fixed.enabled) + VideoSettings.save(); }); } function _open() { diff --git a/openmeetings-web/src/main/front/room/src/video.js b/openmeetings-web/src/main/front/room/src/video.js index e4fa218..5d74181 100644 --- a/openmeetings-web/src/main/front/room/src/video.js +++ b/openmeetings-web/src/main/front/room/src/video.js @@ -267,7 +267,25 @@ module.exports = class Video { function _initContainer(_id, name, opts, instanceUid) { let contSel = '#user' + sd.cuid; const _hasVideo = VideoUtil.hasVideo(sd) - size = {width: _hasVideo ? sd.width : 120, height: _hasVideo ? sd.height : 90}; + if (_hasVideo) { + const s = VideoSettings.load(); + if (s.fixed.enabled) { + size = { + width: s.fixed.width + , height: s.fixed.height + }; + } else { + size = { + width: sd.width + , height: sd.height + }; + } + } else { + size = { + width: 120 + , height: 90 + }; + } hasVideo = _hasVideo || $(contSel).length < 1; if (hasVideo) { if (opts.interview) { @@ -380,7 +398,7 @@ module.exports = class Video { const _id = VideoUtil.getVid(sd.uid); _resizeDlgArea(size.width, size.height); if (hasVideo && !isSharing && !isRecording) { - VideoUtil.setPos(v, VideoUtil.getPos(VideoUtil.getRects(VIDWIN_SEL), sd.width, sd.height + 25)); + VideoUtil.setPos(v, VideoUtil.getPos(VideoUtil.getRects(VIDWIN_SEL, _id), sd.width, sd.height + 25)); } state.video = $(hasVideo ? '<video>' : '<audio>').attr('id', 'vid' + _id) .attr('playsinline', 'playsinline') diff --git a/openmeetings-web/src/main/front/settings/src/settings.js b/openmeetings-web/src/main/front/settings/src/settings.js index 391ca00..e982ec9 100644 --- a/openmeetings-web/src/main/front/settings/src/settings.js +++ b/openmeetings-web/src/main/front/settings/src/settings.js @@ -3,11 +3,13 @@ const MicLevel = require('./mic-level'); const VideoUtil = require('./video-util'); const kurentoUtils = require('kurento-utils'); -const DEV_AUDIO = 'audioinput', DEV_VIDEO = 'videoinput'; +const DEV_AUDIO = 'audioinput' + , DEV_VIDEO = 'videoinput' + , MsgBase = {type: 'kurento', mode: 'test'}; let vs, lm, s, cam, mic, res, o, rtcPeer, timer , vidScroll, vid, recBtn, playBtn, recAllowed = false , level; -const MsgBase = {type: 'kurento', mode: 'test'}; + function _load() { s = Settings.load(); if (!s.video) { @@ -19,6 +21,13 @@ function _load() { , height: _res.height }; } + if (!s.fixed) { + s.fixed = { + enabled: false + , width: 120 + , height: 90 + }; + } return s; } function _save() { diff --git a/openmeetings-web/src/main/front/settings/src/video-util.js b/openmeetings-web/src/main/front/settings/src/video-util.js index c2f983a..ca59500 100644 --- a/openmeetings-web/src/main/front/settings/src/video-util.js +++ b/openmeetings-web/src/main/front/settings/src/video-util.js @@ -160,7 +160,14 @@ function _arrange() { }); } function _arrangeResize() { - const list = []; + const list = [] + , s = VideoSettings.load() + , size = {width: 120, height: 90}; + if (s.fixed.enabled) { + size.width = s.fixed.width; + size.height = s.fixed.height; + } + function __getDialog(_v) { return $(_v).find('.video-container.ui-dialog-content'); } @@ -171,8 +178,8 @@ function _arrangeResize() { }).forEach(_v => { const v = $(_v); __getDialog(v) - .dialog('option', 'width', 120) - .dialog('option', 'height', 90); + .dialog('option', 'width', size.width) + .dialog('option', 'height', size.height); v.css(_getPos(list, v.width(), v.height(), __processEqualsBottomToTop)); list.push(_getRect(v)); }); diff --git a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/RoomPanel.html b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/RoomPanel.html index 1b12ee5..a9184a4 100644 --- a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/RoomPanel.html +++ b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/RoomPanel.html @@ -37,6 +37,46 @@ <div wicket:id="nickname" class="room-nickname-dialog"></div> <div wicket:id="client-kicked"></div> <div wicket:id="wait-moderator" class="wait-moder"></div> + <div id="room-local-settings" class="modal fade" tabindex="-1" role="dialog" data-backdrop="static" aria-hidden="true"> + <div class="modal-dialog modal-sm" role="document"> + <div class="modal-content"> + <div class="modal-header"> + <h5 class="modal-title"><wicket:message key="edit.settings"/></h5> + <button type="button" class="close" data-dismiss="modal" wicket:message="aria-label:85"> + <span aria-hidden="true">×</span> + </button> + </div> + <div class="modal-body"> + <h5><wicket:message key="video.muteothers"/></h5> + <div class="row justify-content-end"> + <div class="custom-control custom-checkbox col-10"> + <input type="checkbox" class="custom-control-input" id="muteOthersAsk"> + <label class="custom-control-label" for="muteOthersAsk"><wicket:message key="dont.ask.again"/></label> + </div> + </div> + <h5 class="mt-2"><wicket:message key="244"/></h5> + <div class="row justify-content-end"> + <div class="custom-control custom-checkbox col-10"> + <input type="checkbox" class="custom-control-input" id="chatNotify"> + <label class="custom-control-label" for="chatNotify"><wicket:message key="sound.enable"/></label> + </div> + <div class="custom-control custom-checkbox col-10"> + <input type="checkbox" class="custom-control-input" id="sendOnCtrlEnter"> + <label class="custom-control-label" for="sendOnCtrlEnter"><wicket:message key="send.on.ctrl.enter"/></label> + </div> + </div> + <h5 class="mt-2">Video</h5> <!-- FIXME TODO localize --> + <div class="row justify-content-end"> + <div class="custom-control custom-checkbox col-10"> + <input type="checkbox" class="custom-control-input" id="fixedVideoPod"> + <label class="custom-control-label" for="fixedVideoPod">Fixed video pod size</label> + </div> + <div id="video-sizes-container" class="col-10"></div> + </div> + </div> + </div> + </div> + </div> </div> <div id="disconnected-dlg" class="modal fade" tabindex="-1" role="dialog" data-backdrop="static" aria-hidden="true"> <div class="modal-dialog modal-sm" role="document"> @@ -58,46 +98,6 @@ </div> </div> </div> - <div id="room-local-settings" class="modal fade" tabindex="-1" role="dialog" data-backdrop="static" aria-hidden="true"> - <div class="modal-dialog modal-sm" role="document"> - <div class="modal-content"> - <div class="modal-header"> - <h5 class="modal-title"><wicket:message key="edit.settings"/></h5> - <button type="button" class="close" data-dismiss="modal" wicket:message="aria-label:85"> - <span aria-hidden="true">×</span> - </button> - </div> - <div class="modal-body"> - <h5><wicket:message key="video.muteothers"/></h5> - <div class="row justify-content-end"> - <div class="custom-control custom-checkbox col-10"> - <input type="checkbox" class="custom-control-input" id="muteOthersAsk"> - <label class="custom-control-label" for="muteOthersAsk"><wicket:message key="dont.ask.again"/></label> - </div> - </div> - <h5 class="mt-2"><wicket:message key="244"/></h5> - <div class="row justify-content-end"> - <div class="custom-control custom-checkbox col-10"> - <input type="checkbox" class="custom-control-input" id="chatNotify"> - <label class="custom-control-label" for="chatNotify"><wicket:message key="sound.enable"/></label> - </div> - <div class="custom-control custom-checkbox col-10"> - <input type="checkbox" class="custom-control-input" id="sendOnCtrlEnter"> - <label class="custom-control-label" for="sendOnCtrlEnter"><wicket:message key="send.on.ctrl.enter"/></label> - </div> - </div> - <h5 class="mt-2">Video</h5> <!-- FIXME TODO localize --> - <div class="row justify-content-end"> - <div class="custom-control custom-checkbox col-10"> - <input type="checkbox" class="custom-control-input" id="fixedVideoPod"> - <label class="custom-control-label" for="fixedVideoPod">Fixed video pod size</label> - </div> - <div id="video-sizes-container col-10"></div> - </div> - </div> - </div> - </div> - </div> <div hidden="hidden"> <div id="user-video" class="video-container"> <div class="video">