possibly fixing video tiles

1 files changed, 5 insertions, 1 deletions

diff --git a/frontend/app/views/tile/tile.utils.js b/frontend/app/views/tile/tile.utils.js
index b946716..f172545 100644
--- a/frontend/app/views/tile/tile.utils.js
+++ b/frontend/app/views/tile/tile.utils.js
@@ -49,6 +49,7 @@ export const generateVideoStyle = (tile, bounds) => {
       style.height = "auto"
       break
     case 'cover':
+      style.backgroundSize = tile.settings.video_style
       if (tile.settings.width && (tile.settings.width / tile.settings.height) > (bounds.width / bounds.height)) {
         style.width = Math.round((tile.settings.width / tile.settings.height) * bounds.height)
         style.height = bounds.height
@@ -58,6 +59,7 @@ export const generateVideoStyle = (tile, bounds) => {
       }
       break
     case 'contain':
+      style.backgroundSize = tile.settings.video_style
       if (tile.settings.width && (tile.settings.width / tile.settings.height) > (bounds.width / bounds.height)) {
         style.width = bounds.width
         style.height = Math.round((tile.settings.height / tile.settings.width) * bounds.width)
@@ -83,7 +85,9 @@ export const unitsDimension = (tile, dimension, bounds, videoBounds) => {
 }
 
 export const videoUnits = (value, bounds, videoBounds) => (
-  Math.round(value / videoBounds.width * bounds.width) + 'px'
+  (videoBounds.backgroundSize === "contain")
+  ? Math.round(value / videoBounds.height * bounds.height) + 'px'
+  : Math.round(value / videoBounds.width * bounds.width) + 'px'
 )
 
 export const hexToRgb = (hex) => {