fix proportional sizing

1 files changed, 7 insertions, 7 deletions

diff --git a/frontend/app/views/tile/tile.utils.js b/frontend/app/views/tile/tile.utils.js
index ed1cbc8..46d7764 100644
--- a/frontend/app/views/tile/tile.utils.js
+++ b/frontend/app/views/tile/tile.utils.js
@@ -1,4 +1,4 @@
-export const generateTransform = (tile, box, videoBounds) => {
+export const generateTransform = (tile, box, bounds, videoBounds) => {
   let { x, y, align, rotation, scale, units, is_tiled } = tile.settings
   if (is_tiled) {
     return 'translateZ(0)'
@@ -18,8 +18,8 @@ export const generateTransform = (tile, box, videoBounds) => {
   }
   // if (x % 2 == 1) x += 0.5
   // if (y % 2 == 1) y += 0.5
-  const xUnits = units === 'video' ? videoUnits(x, videoBounds) : x + units
-  const yUnits = units === 'video' ? videoUnits(y, videoBounds) : y + units
+  const xUnits = units === 'video' ? videoUnits(x, bounds, videoBounds) : x + units
+  const yUnits = units === 'video' ? videoUnits(y, bounds, videoBounds) : y + units
 
   transform.push('translateX(' + xUnits + ')')
   transform.push('translateY(' + yUnits + ')')
@@ -63,18 +63,18 @@ export const generateVideoStyle = (tile, bounds) => {
   return style
 }
 
-export const unitsDimension = (tile, dimension, videoBounds) => {
+export const unitsDimension = (tile, dimension, bounds, videoBounds) => {
   const value = tile.settings[dimension]
   if (!value) return "auto"
   if (tile.settings.units) {
     if (tile.settings.units === 'video') {
-      return videoUnits(value, videoBounds)
+      return videoUnits(value, bounds, videoBounds)
     }
     return value + tile.settings.units
   }
   return value + "px"
 }
 
-export const videoUnits = (value, videoBounds) => (
-  (value / 1000 * Math.max(videoBounds.width, videoBounds.height)) + 'px'
+export const videoUnits = (value, bounds, videoBounds) => (
+  Math.round(value / videoBounds.width * bounds.width) + 'px'
 )
\ No newline at end of file