fix/epmgcip-143/fix-slider-zoom-adjustment (#25)

Co-authored-by: Siarhei Balonikau <[email protected]>

Author: gordoney

src/components/organisms/ImageGallery/ImageGallery.tsx

@@ -90,18 +90,18 @@ function ImageGallery({ images }: Props) {
 
   const determineWrapperDimensions = (
     image: { width: number; height: number },
-    carouselPadding: number,
+    padding: number,
   ) => {
     const { innerWidth, innerHeight } = window
     const aspectRatio = image.width / image.height
     let wrapperX = 0
     let wrapperY = 0
 
     if (image.height > window.innerHeight && image.width < window.innerWidth) {
-      wrapperY = Math.min(innerHeight - carouselPadding * 2, image.height)
+      wrapperY = Math.min(innerHeight - padding * 2, image.height)
       wrapperX = wrapperY * aspectRatio
     } else {
-      wrapperX = Math.min(innerWidth - carouselPadding * 2, image.width)
+      wrapperX = Math.min(innerWidth - padding * 2, image.width)
       wrapperY = wrapperX / aspectRatio
     }
 
@@ -113,11 +113,13 @@ function ImageGallery({ images }: Props) {
     wrapperY: number,
     translateX: number,
     translateY: number,
-    zoomValue: number,
+    zoom: number,
   ) {
-    const removeShift = 1 + 1 / zoomValue
-    const offsetX = (wrapperX / 100) * (translateX - 50) * removeShift
-    const offsetY = (wrapperY / 100) * (translateY - 50) * removeShift
+    const yetAnotherReactLightboxShift = 1 - 1 / zoom
+    const offsetX =
+      ((wrapperX / 100) * (translateX - 50)) / yetAnotherReactLightboxShift
+    const offsetY =
+      ((wrapperY / 100) * (translateY - 50)) / yetAnotherReactLightboxShift
     return { offsetX, offsetY }
   }