From 62ee33936be664551445b8954a084b72e0d06b0c Mon Sep 17 00:00:00 2001 From: ronikar Date: Sat, 12 Jan 2019 14:58:45 +0200 Subject: [PATCH] Improving the projection of video by setting videoElement style (#6038) * Improving the projection of video by setting videoElement style * use the improvement only for supported browsers and when user want it * small fixes + add a note about browser compatibility --- src/layer/VideoOverlay.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/layer/VideoOverlay.js b/src/layer/VideoOverlay.js index 366e519a83e..d4c0ee07d41 100644 --- a/src/layer/VideoOverlay.js +++ b/src/layer/VideoOverlay.js @@ -32,7 +32,12 @@ export var VideoOverlay = ImageOverlay.extend({ // @option loop: Boolean = true // Whether the video will loop back to the beginning when played. - loop: true + loop: true, + + // @option keepAspectRatio: Boolean = true + // Whether the video will save aspect ratio after the projection. + // Relevant for supported browsers. Browser compatibility- https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit + keepAspectRatio: true }, _initImage: function () { @@ -62,6 +67,7 @@ export var VideoOverlay = ImageOverlay.extend({ if (!Util.isArray(this._url)) { this._url = [this._url]; } + if (!this.options.keepAspectRatio && vid.style.hasOwnProperty('objectFit')) { vid.style['objectFit'] = 'fill'; } vid.autoplay = !!this.options.autoplay; vid.loop = !!this.options.loop; for (var i = 0; i < this._url.length; i++) {