Merge pull request #776 from jitsi/isolate-object-fix-browser-specific

Isolate object-fit fix for Windows Qt browser only

css/videolayout_default.css

     background-size: contain;
     border-radius:1px;
     border: 1px solid #212425;
-    /**
-      * Some browsers don't have full support of the object-fit property for the
-      * video element and when we set video object-fit to "cover" the video
-      * actually overflows the boundaries of its container, so it's important
-      * to indicate that the "overflow" should be hidden.
-      */
-    overflow: hidden;
 }
 
 #remoteVideos .videocontainer.videoContainerFocused {

modules/UI/videolayout/LocalVideo.js

             return APP.conference.getMyUserId();
         }
     });
+    this.initBrowserSpecificProperties();
+
     SmallVideo.call(this, VideoLayout);
 }
 

modules/UI/videolayout/RemoteVideo.js

 
 RemoteVideo.prototype.addRemoteVideoContainer = function() {
     this.container = RemoteVideo.createContainer(this.videoSpanId);
+
+    this.initBrowserSpecificProperties();
+
     if (APP.conference.isModerator) {
         this.addRemoteVideoMenu();
     }

modules/UI/videolayout/SmallVideo.js

     };
 };
 
+/**
+ * Initalizes any browser specific properties. Currently sets the overflow
+ * property for Qt browsers on Windows to hidden, thus fixing the following
+ * problem:
+ * Some browsers don't have full support of the object-fit property for the
+ * video element and when we set video object-fit to "cover" the video
+ * actually overflows the boundaries of its container, so it's important
+ * to indicate that the "overflow" should be hidden.
+ *
+ * Setting this property for all browsers will result in broken audio levels,
+ * which makes this a temporary solution, before reworking audio levels.
+ */
+SmallVideo.prototype.initBrowserSpecificProperties = function() {
+
+    var userAgent = window.navigator.userAgent;
+    if (userAgent.indexOf("QtWebEngine") > -1
+        && userAgent.indexOf("Windows") > -1) {
+        $('#' + this.videoSpanId).css("overflow", "hidden");
+    }
+};
+
 export default SmallVideo;