Fix presentation size

bigbluebutton-html5/imports/ui/components/layout/layout-manager.jsx

@@ -255,6 +255,9 @@ class LayoutManager extends Component {
       };
     }
 
+    console.log('>> webcamsAreaUserSetsWidth', webcamsAreaUserSetsWidth);
+
+
     if (presentationWidth === null || presentationHeight === null) {
       if (webcamsPlacement === 'left' || webcamsPlacement === 'right') {
         newWebcamAreaWidth = min(
@@ -379,7 +382,10 @@ class LayoutManager extends Component {
     );
     const { presentationWidth, presentationHeight } = presentationMaxSize;
 
-    console.log('presentationMaxSize', presentationMaxSize);
+    console.log('mediaAreaHeight', mediaAreaHeight);
+
+
+    console.log('>> webcamAreaWidth', webcamAreaWidth);
 
 
     if (webcamAreaWidth === null || webcamAreaHeight === null) {
@@ -392,10 +398,26 @@ class LayoutManager extends Component {
       newPresentationAreaWidth = mediaAreaWidth;
       newPresentationAreaHeight = mediaAreaHeight - webcamAreaHeight - 30; // 30 is margins
     }
+    console.log('>> newPresentationAreaWidth', newPresentationAreaWidth);
+
+    if (newPresentationAreaWidth < (mediaAreaWidth * PRESENTATIONAREA_MIN_PERCENT)) {
+      if (newPresentationAreaWidth < 400) {
+        newPresentationAreaWidth = 400;
+      } else {
+        newPresentationAreaWidth = mediaAreaWidth * PRESENTATIONAREA_MIN_PERCENT;
+      }
+    }
+
+
+    console.log('>> newPresentationAreaWidth', newPresentationAreaWidth);
+
 
     return {
-      newPresentationAreaWidth: max(newPresentationAreaWidth, 400),
+      newPresentationAreaWidth,
-      newPresentationAreaHeight,
+      newPresentationAreaHeight: newPresentationAreaHeight
+        < (mediaAreaHeight * PRESENTATIONAREA_MIN_PERCENT)
+        ? mediaAreaHeight * PRESENTATIONAREA_MIN_PERCENT
+        : newPresentationAreaHeight,
     };
   }
 
@@ -431,8 +453,6 @@ class LayoutManager extends Component {
       );
     } else {
       webcamsSize = this.calculatesWebcamsAreaSize(mediaAreaWidth, mediaAreaHeight);
-      console.log('+++ webcamsSize', webcamsSize);
-
       presentationSize = this.calculatesPresentationAreaSize(
         mediaAreaWidth,
         mediaAreaHeight,

bigbluebutton-html5/imports/ui/components/media/webcam-draggable-overlay/component.jsx

@@ -168,6 +168,9 @@ class WebcamDraggable extends PureComponent {
       height: Math.trunc(webcamsAreaResizable.height) + resizableHeight,
     };
 
+    console.log('>>  newWebcamsAreaResizable', newWebcamsAreaResizable);
+
+
     if (webcamsPlacement === 'top' || webcamsPlacement === 'bottom') {
       layoutContextDispatch(
         {
@@ -181,7 +184,7 @@ class WebcamDraggable extends PureComponent {
       layoutContextDispatch(
         {
           type: 'setWebcamsAreaUserSetsWidth',
-          value: newWebcamsAreaResizable.height,
+          value: newWebcamsAreaResizable.width,
         },
       );
     }

bigbluebutton-html5/imports/ui/components/presentation/component.jsx

@@ -142,12 +142,6 @@ class PresentationArea extends PureComponent {
     const { width: prevWidth, height: prevHeight } = prevProps.slidePosition;
     const { width: currWidth, height: currHeight } = slidePosition;
 
-    console.log('presentation currWidth', currWidth);
-    console.log('presentation currHeight', currHeight);
-
-
-
-
     if (prevWidth !== currWidth || prevHeight !== currHeight) {
       layoutContextDispatch({
         type: 'setPresentationSlideSize',
@@ -310,6 +304,14 @@ class PresentationArea extends PureComponent {
     const viewBoxWidth = viewBoxDimensions.width;
     const viewBoxHeight = viewBoxDimensions.height;
 
+
+    console.log('-- presentationAreaHeight', presentationAreaHeight);
+    console.log('-- presentationAreaWidth', presentationAreaWidth);
+    console.log('-- originalWidth', originalWidth);
+    console.log('-- originalHeight', originalHeight);
+    console.log('-- viewBoxWidth', viewBoxWidth);
+    console.log('-- viewBoxHeight', viewBoxHeight);
+
     let svgWidth;
     let svgHeight;