Isolate object-fit fix for Windows Qt browser only

This commit is contained in:
yanas 2016-08-08 17:03:00 -05:00
parent 541f83cf71
commit da0898a066
4 changed files with 26 additions and 7 deletions

View File

@ -41,13 +41,6 @@
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 {

View File

@ -21,6 +21,8 @@ function LocalVideo(VideoLayout, emitter) {
return APP.conference.getMyUserId();
}
});
this.initBrowserSpecificProperties();
SmallVideo.call(this, VideoLayout);
}

View File

@ -27,6 +27,9 @@ RemoteVideo.prototype.constructor = RemoteVideo;
RemoteVideo.prototype.addRemoteVideoContainer = function() {
this.container = RemoteVideo.createContainer(this.videoSpanId);
this.initBrowserSpecificProperties();
if (APP.conference.isModerator) {
this.addRemoteVideoMenu();
}

View File

@ -528,4 +528,25 @@ SmallVideo.prototype.waitForResolutionChange = function() {
};
};
/**
* 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;