From 7102772f63f627fdbe7c955336320b54f8dddb67 Mon Sep 17 00:00:00 2001 From: Matchu Date: Sat, 10 Oct 2020 04:32:53 -0700 Subject: [PATCH] fix positioning of movie layers on large screens Oops, movie canvases were drawing larger than the images, if there was more than 600px of space available! fixed! --- src/app/components/OutfitPreview.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/app/components/OutfitPreview.js b/src/app/components/OutfitPreview.js index f58797d..6dbcf59 100644 --- a/src/app/components/OutfitPreview.js +++ b/src/app/components/OutfitPreview.js @@ -128,9 +128,17 @@ export function OutfitLayers({ React.useLayoutEffect(() => { function computeAndSaveCanvasSize() { setCanvasSize( + // Follow an algorithm similar to the sizing: a square that + // covers the available space, without exceeding the natural image size + // (which is 600px). + // + // TODO: Once we're entirely off PNGs, we could drop the 600 + // requirement, and let SVGs and movies scale up as far as they + // want... Math.min( containerRef.current.offsetWidth, - containerRef.current.offsetHeight + containerRef.current.offsetHeight, + 600 ) ); }