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 2603447  [OPENMEETINGS-2045] video window sizes are CSS based
2603447 is described below

commit 2603447c094388f920dc7aa3037447facf085ad9
Author: Maxim Solodovnik <[email protected]>
AuthorDate: Sat Aug 17 07:15:29 2019 +0700

    [OPENMEETINGS-2045] video window sizes are CSS based
---
 .../apache/openmeetings/web/room/RoomPanel.java    |   3 +
 .../org/apache/openmeetings/web/room/raw-video.js  |  32 +-----
 openmeetings-web/src/main/webapp/css/raw-room.css  | 126 ++++++++++++---------
 .../src/main/webapp/css/raw-variables.css          |   5 +
 4 files changed, 85 insertions(+), 81 deletions(-)

diff --git 
a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/RoomPanel.java
 
b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/RoomPanel.java
index c6f85ca..2326dfc 100644
--- 
a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/RoomPanel.java
+++ 
b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/RoomPanel.java
@@ -797,6 +797,9 @@ public class RoomPanel extends BasePanel {
                if (r.isHidden(RoomElement.Chat)) {
                        clazz += " no-chat";
                }
+               if (!r.isHidden(RoomElement.MicrophoneStatus)) {
+                       clazz += " mic-status";
+               }
                return clazz;
        }
 }
diff --git 
a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/raw-video.js 
b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/raw-video.js
index 96f0d81..7e7d0f5 100644
--- 
a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/raw-video.js
+++ 
b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/raw-video.js
@@ -6,33 +6,13 @@ var Video = (function() {
                , lastVolume = 50, muted = false, aCtx, aSrc, aDest, gainNode, 
analyser
                , lm, level, userSpeaks = false, muteOthers;
 
-       function _getExtra() {
-               return t.height() + 2 + (f.is(':visible') ? f.height() : 0);
-       }
        function _resizeDlgArea(_w, _h) {
-               if (v.dialog('instance')) {
-                       v.dialog('option', 'width', _w).dialog('option', 
'height', _h);
-               }
-               const h = _h - _getExtra();
-               _resize(_w, h);
                if (Room.getOptions().interview) {
                        VideoUtil.setPos(v, VideoUtil.getPos());
+               } else if (v.dialog('instance')) {
+                       v.dialog('option', 'width', _w).dialog('option', 
'height', _h);
                }
        }
-       function _resizePod() {
-               const p = v.parents('.pod,.pod-big')
-                       , pw = p.width(), ph = p.height();
-               _resizeDlgArea(pw, ph);
-       }
-       function _resizeLm(h) {
-               lm && lm.attr('height', h).height(h);
-               return lm;
-       }
-       function _resize(w, h) {
-               vc.width(w).height(h);
-               _resizeLm(h - 10);
-               video && video.width(w).height(h);
-       }
        function _micActivity(level) {
                const speaks = level > 5;
                if (speaks !== userSpeaks) {
@@ -95,7 +75,6 @@ var Video = (function() {
                                        if (stream.getAudioTracks().length !== 
0) {
                                                vol.show();
                                                lm = vc.find('.level-meter');
-                                               _resizeLm(vc.height() - 
10).show();
                                                aCtx = new AudioCtx();
                                                gainNode = aCtx.createGain();
                                                analyser = 
aCtx.createAnalyser();
@@ -286,12 +265,6 @@ var Video = (function() {
                } else {
                        v.dialog('option', 'draggable', true);
                        v.dialog('option', 'resizable', true);
-                       v.on('dialogresizestop', function(event, ui) {
-                               const w = ui.size.width - 2
-                                       , h = ui.size.height - t.height() - 4 - 
(f.is(':visible') ? f.height() : 0);
-                               size = {width: w, height: h};
-                               _resize(w, h);
-                       });
                        if (VideoUtil.isSharing(sd)) {
                                v.on('dialogclose', function() {
                                        VideoManager.close(sd.uid, true);
@@ -531,7 +504,6 @@ var Video = (function() {
                        , luid: sd.self ? sd.uid : opts.uid
                });
        };
-       self.resizePod = _resizePod;
        self.reattachStream = _reattachStream;
        return self;
 });
diff --git a/openmeetings-web/src/main/webapp/css/raw-room.css 
b/openmeetings-web/src/main/webapp/css/raw-room.css
index c9caca7..aee382b 100644
--- a/openmeetings-web/src/main/webapp/css/raw-room.css
+++ b/openmeetings-web/src/main/webapp/css/raw-room.css
@@ -240,18 +240,6 @@ html[dir="rtl"] .room-block .sidebar {
        font-weight: bold;
        background-color: #00FF00;
 }
-.ui-dialog.video, .ui-dialog.video .ui-dialog-titlebar, .ui-dialog.video 
.ui-dialog-content {
-       padding: 0;
-}
-.ui-dialog.video .ui-dialog-content {
-       overflow: hidden;
-}
-.ui-dialog.video .ui-dialog-titlebar {
-       padding-left: 10px
-}
-.ui-dialog.video.user-video.user-speaks{
-       box-shadow: 3px 3px 4px green;
-}
 .dropdown-menu.video.volume, .dropdown-menu.video.volume li {
        width: 20px;
        min-width: 20px;
@@ -286,45 +274,6 @@ ul.settings-menu {
        float: right;
        margin-right: .3em;
 }
-.ui-dialog.user-video .level-meter {
-       display: inline-block;
-       position: absolute;
-       bottom: 5px;
-       left: 5px;
-       width: 10px;
-}
-.ui-dialog.video .sett-container {
-       position: relative;
-       min-height: 250px;
-}
-.ui-dialog.video .sett-row {
-       padding-top: 10px;
-}
-.ui-dialog.video .sett-row.right {
-       text-align: right;
-}
-.ui-dialog.video .vid-block .video-conainer {
-       overflow: auto;
-       max-height: 300px;
-       position: relative;
-}
-.sett-container .vid-block .timer {
-       float: left;
-       padding: 2px 4px;
-}
-.ui-dialog.video .ui-dialog-titlebar-collapse span
-, .ui-dialog.video .ui-dialog-titlebar-volume span
-, .ui-dialog.video .ui-dialog-titlebar-refresh span
-{
-       display: block;
-       margin: 1px;
-}
-.ui-dialog.video .footer {
-       display: none;
-}
-.ui-dialog.video.mic-status .footer {
-       display: block;
-}
 .input .select2-container {
        max-height: 100px;
        overflow-y: auto;
@@ -401,6 +350,57 @@ ul.settings-menu {
        border-radius: 10px;
 }
 /************ VIDEO **************/
+.ui-dialog.video, .ui-dialog.video .ui-dialog-titlebar, .ui-dialog.video 
.ui-dialog-content {
+       padding: 0;
+}
+.ui-dialog.video .ui-dialog-content {
+       overflow: hidden;
+}
+.ui-dialog.video .ui-dialog-titlebar {
+       padding-left: 10px
+}
+.ui-dialog.video.user-video.user-speaks {
+       box-shadow: 3px 3px 4px green;
+}
+.ui-dialog.user-video .level-meter {
+       display: inline-block;
+       position: absolute;
+       bottom: 5px;
+       left: 5px;
+       width: 10px;
+}
+.ui-dialog.video .sett-container {
+       position: relative;
+       min-height: 250px;
+}
+.ui-dialog.video .sett-row {
+       padding-top: 10px;
+}
+.ui-dialog.video .sett-row.right {
+       text-align: right;
+}
+.ui-dialog.video .vid-block .video-conainer {
+       overflow: auto;
+       max-height: 300px;
+       position: relative;
+}
+.sett-container .vid-block .timer {
+       float: left;
+       padding: 2px 4px;
+}
+.ui-dialog.video .ui-dialog-titlebar-collapse span
+, .ui-dialog.video .ui-dialog-titlebar-volume span
+, .ui-dialog.video .ui-dialog-titlebar-refresh span
+{
+       display: block;
+       margin: 1px;
+}
+.ui-dialog.video .footer {
+       display: none;
+}
+.ui-dialog.video.mic-status .footer {
+       display: block;
+}
 .room-block .container .user-video {
        display: inline-block !important;
 }
@@ -493,6 +493,12 @@ ul.settings-menu {
 }
 .pod-area .pod {
 }
+.pod-area .pod .user-video.ui-dialog
+, .pod-area .pod-big .user-video.ui-dialog
+{
+       height: calc(100% - var(--buffer-size)) !important;
+       width:  calc(100% - var(--buffer-size)) !important;
+}
 .pod-area .pod.ui-sortable-placeholder {
        background-color: whitesmoke;
        visibility: visible !important;
@@ -591,6 +597,24 @@ ul.settings-menu {
 .video:hover .mute-others.enabled {
        display: block;
 }
+.user-video.ui-dialog .ui-dialog-content {
+       height: calc(100% - var(--vdialog-titlebar-height)) !important;
+       width: 100% !important;
+}
+.user-video.ui-dialog .ui-dialog-content .video {
+       height: calc(100% - var(--vdialog-footer-height)) !important;
+       width: 100%  !important;
+}
+.user-video.ui-dialog .ui-dialog-content .video video, .user-video.ui-dialog 
.ui-dialog-content .video audio {
+       height: 100% !important;
+       width: 100% !important;
+}
+.user-video.ui-dialog .ui-dialog-content .video .level-meter {
+       height: calc(100% - 10px) !important;
+}
+.user-video.ui-dialog .ui-dialog-content .footer {
+       height: var(--vdialog-footer-height) !important;
+}
 @media screen and (max-width: 1280px) {
        .room-block .sidebar .tab.om-icon.big {
                max-width: 0px;
diff --git a/openmeetings-web/src/main/webapp/css/raw-variables.css 
b/openmeetings-web/src/main/webapp/css/raw-variables.css
index a8d110a..10ea9fb 100644
--- a/openmeetings-web/src/main/webapp/css/raw-variables.css
+++ b/openmeetings-web/src/main/webapp/css/raw-variables.css
@@ -49,6 +49,8 @@ body.no-menu {
        --chat-width: 20px;
        --chat-height: calc(100% - var(--room-menu-height));
        --activities-height: 20px;
+       --vdialog-titlebar-height: 27px;
+       --vdialog-footer-height: 0px;
 }
 .main.room.interview {
        --rec-btn-height: 40px;
@@ -62,6 +64,9 @@ body.no-menu {
 .main.room.no-chat {
        --chat-width: 0px;
 }
+.main.room.mic-status {
+       --vdialog-footer-height: 22px;
+}
 @media screen and (max-width: 1280px) {
        .main.room {
                --room-sidebar-width: 155px;

Reply via email to