Merge remote-tracking branch 'origin/master'

app/Http/Controllers/ClientController.php

@@ -40,7 +40,7 @@ class ClientController extends Controller
             // $response = new \Illuminate\Http\Response(view('client/index'));
             // $response->withCookie($cookie);
             // return $response;
-        } 
+        }
         // else {
         //     return view('client/index');
         // }

resources/js/components/pages/ClientEntrance.vue

@@ -55,15 +55,15 @@
                         <br />Then, someone should be with you shortly.
                     </p>
 
-                    <v-card class="mb-12" color="grey lighten-1" height="200px">
+                    <v-card class="mb-12" color="grey lighten-1" height="50vh">
                         <grid-layout
                             :layout="videoGridPreview"
                             :key="`preview_${uniqueId}`"
                             :col-num="maxCols"
                             :max-rows="maxRows"
                             :row-height="rowHeight"
-                            :is-draggable="true"
-                            :is-resizable="true"
+                            :is-draggable="false"
+                            :is-resizable="false"
                             :verticalCompact="true"
                             :margin="[gridPadding, gridPadding]"
                             :use-css-transforms="true"
@@ -78,17 +78,17 @@
                 </v-stepper-content>
 
                 <v-stepper-content step="3">
-                    <p>Great!</p>
+                    <p>Great! Please wait a little, doctor should join shortly.</p>
 
-                    <v-card class="mb-12" color="grey lighten-1" height="200px">
+                    <v-card class="mb-12" color="grey lighten-1" height="50vh">
                         <grid-layout
                             :layout="videoGrid"
                             :key="uniqueId"
                             :col-num="maxCols"
                             :max-rows="maxRows"
                             :row-height="rowHeight"
-                            :is-draggable="true"
-                            :is-resizable="true"
+                            :is-draggable="false"
+                            :is-resizable="false"
                             :verticalCompact="true"
                             :margin="[gridPadding, gridPadding]"
                             :use-css-transforms="true"
@@ -96,10 +96,6 @@
                             <grid-item v-for="video in videoGrid" :key="video.id" :id="video.id" :x="video.x" :y="video.y" :w="video.w" :h="video.h" :i="video.i"></grid-item>
                         </grid-layout>
                     </v-card>
-
-                    <v-btn color="primary" @click="stepper = 1">Continue</v-btn>
-
-                    <v-btn text @click="stepper = 2">Cancel</v-btn>
                 </v-stepper-content>
             </v-stepper-items>
         </v-stepper>
@@ -324,7 +320,7 @@ export default {
                 videoGrid = this.videoGrid = [];
             }
 
-            let windowHeight = window.innerHeight;
+            let windowHeight = window.innerHeight / 2;
             this.rowHeight = (windowHeight - this.gridPadding * (this.maxRows + 1)) / this.maxRows;
 
             let cols = Math.ceil(Math.sqrt(this.videos.length));

resources/js/components/pages/MeetingsAppRoot.vue

@@ -8,7 +8,7 @@
                 </v-expansion-panel-content>
             </v-expansion-panel>
 
-            <v-expansion-panel>
+            <v-expansion-panel class="no-v-padding">
                 <v-expansion-panel-header>Meeting Room</v-expansion-panel-header>
                 <v-expansion-panel-content>
                     <meeting-room></meeting-room>
@@ -124,10 +124,6 @@ export default {
 </script>
 
 <style>
-.v-expansion-panel--active {
-    height: 100%;
-}
-
 .v-expansion-panel-content__wrap {
     padding: 24px 16px;
 }

resources/js/components/partials/MeetingRoom.vue

@@ -60,10 +60,10 @@ export default {
             videoGrid: [],
             bigMembersCountSelectedId: null,
             lowMembersCountSelectedId: null,
-            maxCols: 12,
-            maxRows: 4,
-            rowHeight: 240,
-            gridPadding: 8,
+            maxCols: 1,
+            maxRows: 12,
+            rowHeight: 120,
+            gridPadding: 0,
             loadingInProgress: false
         };
     },
@@ -139,28 +139,31 @@ export default {
         adjustVideoContainers() {
             this.videoGrid = [];
 
-            let windowHeight = window.innerHeight;
+            let windowHeight = window.innerHeight * 0.75;
             this.rowHeight = (windowHeight - this.gridPadding * (this.maxRows + 1)) / this.maxRows;
 
-            let cols = Math.ceil(Math.sqrt(this.videos.length));
-            let rows = Math.ceil(this.videos.length / cols);
+            //let cols = Math.ceil(Math.sqrt(this.videos.length));
+            let cols = 1
+            let rows = Math.ceil(this.videos.length / cols)
 
-            let elementsLastRow = this.videos.length % cols;
-            let lastNormalIndex = this.videos.length - elementsLastRow;
+            let elementsLastRow = this.videos.length % cols
+            let lastNormalIndex = this.videos.length - elementsLastRow
 
             if (elementsLastRow) {
-                this.maxCols = cols * elementsLastRow;
+                this.maxCols = cols * elementsLastRow
             } else {
-                this.maxCols = cols;
+                this.maxCols = cols
             }
 
-            let colsPerElement = this.maxCols / cols;
-            let rowsPerElement = this.maxRows / rows;
+            //let colsPerElement = this.maxCols / cols;
+            let rowsPerElement = this.maxRows / rows
 
-            let colsLastRow = Math.ceil(this.maxCols / elementsLastRow);
+            let colsPerElement = 1
 
-            let cntX = 0;
-            let cntY = 0;
+            let colsLastRow = Math.ceil(this.maxCols / elementsLastRow)
+
+            let cntX = 0
+            let cntY = 0
 
             for (let [index, video] of this.videos.entries()) {
                 video.i = index;

resources/sass/app.scss

@@ -52,6 +52,18 @@ $orange: #F08322;
     transform: scale(0.3);
 }
 
+/* MC */
+
+.mc-page {
+    overflow: hidden;
+}
+
+#meetingsApp.pro {
+    overflow-y: scroll;
+    overflow-x: hidden;
+    height: 100vh;
+}
+
 /* Client App */
 
 #meetingsApp.client {

resources/views/mc.blade.php

@@ -13,12 +13,12 @@
     <link href="https://cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css" rel="stylesheet">
     <title>Meeting Center</title>
 </head>
-<body class="d-flex align-items-stretch h-100">
+<body class="d-flex align-items-stretch h-100 mc-page">
     <div class="row w-100">
         <div class="col-9 pr-0 app-left-panel">
             <iframe src="{{ $page }}" frameborder="0" class="h-100 w-100"></iframe>
         </div>
-        <div id="meetingsApp" class="col-3 border-left app-right-panel">
+        <div id="meetingsApp" class="pro col-3 border-left app-right-panel">
             <meetings-app-root :user-prop="{!! str_replace('"','\'',str_replace('\'','\\\'',json_encode($user))) !!}"></meetings-app-root>
         </div>
     </div>