From 9a08349b364ac021c0466e36b57fc8f9d757e25b Mon Sep 17 00:00:00 2001
From: Vitor Mateus De Almeida <vitormateusalmeida@gmail.com>
Date: Mon, 6 Jul 2020 11:35:11 -0300
Subject: [PATCH] Fix webcams bug in screenshare

---
 .../ui/components/layout/layout-manager.jsx   | 70 +++----------------
 .../webcam-draggable-overlay/component.jsx    |  2 +
 2 files changed, 13 insertions(+), 59 deletions(-)

diff --git a/bigbluebutton-html5/imports/ui/components/layout/layout-manager.jsx b/bigbluebutton-html5/imports/ui/components/layout/layout-manager.jsx
index 0ef6dd6f3a..bdf632dfd1 100644
--- a/bigbluebutton-html5/imports/ui/components/layout/layout-manager.jsx
+++ b/bigbluebutton-html5/imports/ui/components/layout/layout-manager.jsx
@@ -350,7 +350,6 @@ class LayoutManager extends Component {
     const autoArrangeLayout = Storage.getItem('autoArrangeLayout');
     const webcamsAreaUserSetsHeight = Storage.getItem('webcamsAreaUserSetsHeight');
     const webcamsAreaUserSetsWidth = Storage.getItem('webcamsAreaUserSetsWidth');
-    const isScreenShare = isVideoBroadcasting();
 
     let webcamsAreaWidth;
     let webcamsAreaHeight;
@@ -362,23 +361,6 @@ class LayoutManager extends Component {
       };
     }
 
-    if (isScreenShare) {
-      if (webcamsPlacement === 'left' || webcamsPlacement === 'right') {
-        webcamsAreaWidth = mediaAreaWidth * WEBCAMSAREA_MIN_PERCENT;
-        webcamsAreaHeight = mediaAreaHeight;
-      } else {
-        webcamsAreaWidth = mediaAreaWidth;
-        webcamsAreaHeight = (mediaAreaHeight - presentationHeight)
-          < (mediaAreaHeight * WEBCAMSAREA_MIN_PERCENT)
-          ? mediaAreaHeight * WEBCAMSAREA_MIN_PERCENT
-          : mediaAreaHeight - presentationHeight;
-      }
-      return {
-        webcamsAreaWidth,
-        webcamsAreaHeight,
-      };
-    }
-
     if (autoArrangeLayout) {
       if (webcamsPlacement === 'left' || webcamsPlacement === 'right') {
         webcamsAreaWidth = (mediaAreaWidth - presentationWidth)
@@ -460,23 +442,6 @@ class LayoutManager extends Component {
     };
   }
 
-  calculatesScreenShareAreaSize(
-    mediaAreaWidth, mediaAreaHeight, webcamAreaWidth, webcamAreaHeight,
-  ) {
-    const { layoutContextState } = this.props;
-    const { numUsersVideo } = layoutContextState;
-    if (numUsersVideo < 1) {
-      return {
-        screenShareAreaWidth: mediaAreaWidth,
-        screenShareAreaHeight: mediaAreaHeight - 20,
-      };
-    }
-    return {
-      screenShareAreaWidth: mediaAreaWidth,
-      screenShareAreaHeight: mediaAreaHeight - webcamAreaHeight - 30,
-    };
-  }
-
   calculatesLayout(panelChanged = false) {
     const {
       layoutContextState,
@@ -518,8 +483,6 @@ class LayoutManager extends Component {
       left: firstPanel.width + secondPanel.width,
     };
 
-    const isScreenShare = isVideoBroadcasting();
-
     const { presentationWidth, presentationHeight } = LayoutManager.calculatesPresentationSize(
       mediaAreaWidth, mediaAreaHeight, presentationSlideWidth, presentationSlideHeight,
     );
@@ -538,30 +501,19 @@ class LayoutManager extends Component {
     };
     let newPresentationAreaSize;
     let newScreenShareAreaSize;
-
-    if (isScreenShare) {
-      const { screenShareAreaWidth, screenShareAreaHeight } = this.calculatesPresentationAreaSize(
-        mediaAreaWidth, mediaAreaHeight, webcamsAreaWidth, webcamsAreaHeight,
-      );
-      newScreenShareAreaSize = {
-        width: screenShareAreaWidth,
-        height: screenShareAreaHeight,
+    const { presentationAreaWidth, presentationAreaHeight } = this.calculatesPresentationAreaSize(
+      mediaAreaWidth, mediaAreaHeight, webcamsAreaWidth, webcamsAreaHeight,
+    );
+    if (!presentationIsFullscreen) {
+      newPresentationAreaSize = {
+        width: presentationAreaWidth || 0,
+        height: presentationAreaHeight || 0,
       };
     } else {
-      const { presentationAreaWidth, presentationAreaHeight } = this.calculatesPresentationAreaSize(
-        mediaAreaWidth, mediaAreaHeight, webcamsAreaWidth, webcamsAreaHeight,
-      );
-      if (!presentationIsFullscreen) {
-        newPresentationAreaSize = {
-          width: presentationAreaWidth || 0,
-          height: presentationAreaHeight || 0,
-        };
-      } else {
-        newPresentationAreaSize = {
-          width: windowWidth(),
-          height: windowHeight(),
-        };
-      }
+      newPresentationAreaSize = {
+        width: windowWidth(),
+        height: windowHeight(),
+      };
     }
 
     return {
diff --git a/bigbluebutton-html5/imports/ui/components/media/webcam-draggable-overlay/component.jsx b/bigbluebutton-html5/imports/ui/components/media/webcam-draggable-overlay/component.jsx
index ca23bace85..a47575fcd6 100644
--- a/bigbluebutton-html5/imports/ui/components/media/webcam-draggable-overlay/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/media/webcam-draggable-overlay/component.jsx
@@ -21,6 +21,8 @@ const propTypes = {
   webcamDraggableState: PropTypes.objectOf(Object).isRequired,
   webcamDraggableDispatch: PropTypes.func.isRequired,
   refMediaContainer: PropTypes.shape({ current: PropTypes.instanceOf(Element) }),
+  layoutContextState: PropTypes.objectOf(Object).isRequired,
+  layoutContextDispatch: PropTypes.func.isRequired,
 };
 
 const defaultProps = {