@get-set/gs-zoom 0.0.4 → 0.0.6

package/dist/actions/initAdjust.js

@@ -1,107 +1,96 @@
-import { getTranslateCoord } from './general';
-import getAdjustTransform from './getAdjustTransform';
-import getTranslateCoordToPoint from './getTranslateCoordToPoint';
-import setStyles from './setStyles';
-
-const initAdjust = (ref, $container, $img, withAnimation = true) => {
-  if ($img.classList.contains('gs-zoom-isdragging') || !withAnimation) {
-    const params = ref.currentParams;
-    let needAdjust = false;
-    if (withAnimation) {
-      $img.classList.remove('gs-zoom-isdragging');
-    }
-
-    let scale = $img.dataset.scale != null ? parseFloat($img.dataset.scale) : 1;
-    let isOverzoomed = false;
-    const oldScale = scale;
-
-    if (scale < 1) {
-      scale = 1;
-      needAdjust = true;
-    } else if (scale > params.maxZoom) {
-      isOverzoomed = true;
-      scale = params.maxZoom;
-      needAdjust = true;
-    }
-    $img.dataset.scale = scale;
-    const actualWidth = $img.clientWidth * scale;
-    const actualHeight = $img.clientHeight * scale;
-    const containerWidth = $container.clientWidth;
-    const containerHeight = $container.clientHeight;
-    const coords = getTranslateCoord($img);
-    const translatex = coords.x;
-    const translatey = coords.y;
-    const maxTranslateXValue = (actualWidth - containerWidth) / 2;
-    const maxTranslateYValue = (actualHeight - containerHeight) / 2;
-    const minTranslateXValue = (containerWidth - actualWidth) / 2;
-    const minTranslateYValue = (containerHeight - actualHeight) / 2;
-    let newTranslateXValue = translatex / scale;
-    let newTranslateYValue = translatey / scale;
-    if (actualWidth <= containerWidth) {
-      if (translatex != 0) {
-        needAdjust = true;
-        newTranslateXValue = 0;
-      }
-    } else {
-      if (translatex > maxTranslateXValue) {
-        needAdjust = true;
-        newTranslateXValue = maxTranslateXValue / scale;
-      } else if (translatex < minTranslateXValue) {
-        needAdjust = true;
-        newTranslateXValue = minTranslateXValue / scale;
-      }
-    }
-    if (actualHeight <= containerHeight) {
-      if (translatex != 0) {
-        needAdjust = true;
-        newTranslateYValue = 0;
-      }
-    } else {
-      if (translatey > maxTranslateYValue) {
-        needAdjust = true;
-        newTranslateYValue = maxTranslateYValue / scale;
-      } else if (translatey < minTranslateYValue) {
-        needAdjust = true;
-        newTranslateYValue = minTranslateYValue / scale;
-      }
-    }
-    if (isOverzoomed) {
-      const clientCenterX = (window.clientX + window.clientX2) / 2;
-      const clientCenterY = (window.clientY + window.clientY2) / 2;
-      let [newTranslatex, newTranslatey] = getTranslateCoordToPoint(
-        $img,
-        $container,
-        oldScale,
-        scale,
-        clientCenterX,
-        clientCenterY
-      );
-      [newTranslatex, newTranslatey] = getAdjustTransform(
-        scale,
-        newTranslatex,
-        newTranslatey,
-        $img,
-        $container
-      );
-      newTranslateXValue = newTranslatex;
-      newTranslateYValue = newTranslatey;
-    }
-    if (needAdjust) {
-      if (withAnimation) {
-        $img.classList.add('gs-zoom-is-adjusting');
-      }
-      setStyles(ref, $img, {
-        transform: `scale(${scale}) translate(${newTranslateXValue}px, ${newTranslateYValue}px)`,
-      });
-      $img.dataset.translatex = newTranslateXValue * scale;
-      $img.dataset.translatey = newTranslateYValue * scale;
-      if (withAnimation) {
-        setTimeout(function () {
-          $img.classList.remove('gs-zoom-is-adjusting');
-        }, 400);
-      }
-    }
-  }
-};
-
-export default initAdjust;
+import { getTranslateCoord } from './general';
+import getAdjustTransform from './getAdjustTransform';
+import getTranslateCoordToPoint from './getTranslateCoordToPoint';
+import setStyles from './setStyles';
+const initAdjust = (ref, $container, $img, withAnimation = true) => {
+    if ($img.classList.contains('gs-zoom-isdragging') || !withAnimation) {
+        const params = ref.currentParams;
+        let needAdjust = false;
+        if (withAnimation) {
+            $img.classList.remove('gs-zoom-isdragging');
+        }
+        let scale = $img.dataset.scale != null ? parseFloat($img.dataset.scale) : 1;
+        let isOverzoomed = false;
+        const oldScale = scale;
+        if (scale < 1) {
+            scale = 1;
+            needAdjust = true;
+        }
+        else if (scale > params.maxZoom) {
+            isOverzoomed = true;
+            scale = params.maxZoom;
+            needAdjust = true;
+        }
+        $img.dataset.scale = String(scale);
+        const actualWidth = $img.clientWidth * scale;
+        const actualHeight = $img.clientHeight * scale;
+        const containerWidth = $container.clientWidth;
+        const containerHeight = $container.clientHeight;
+        const coords = getTranslateCoord($img);
+        const translatex = coords.x;
+        const translatey = coords.y;
+        const maxTranslateXValue = (actualWidth - containerWidth) / 2;
+        const maxTranslateYValue = (actualHeight - containerHeight) / 2;
+        const minTranslateXValue = (containerWidth - actualWidth) / 2;
+        const minTranslateYValue = (containerHeight - actualHeight) / 2;
+        let newTranslateXValue = translatex / scale;
+        let newTranslateYValue = translatey / scale;
+        if (actualWidth <= containerWidth) {
+            if (translatex !== 0) {
+                needAdjust = true;
+                newTranslateXValue = 0;
+            }
+        }
+        else {
+            if (translatex > maxTranslateXValue) {
+                needAdjust = true;
+                newTranslateXValue = maxTranslateXValue / scale;
+            }
+            else if (translatex < minTranslateXValue) {
+                needAdjust = true;
+                newTranslateXValue = minTranslateXValue / scale;
+            }
+        }
+        if (actualHeight <= containerHeight) {
+            if (translatey !== 0) {
+                needAdjust = true;
+                newTranslateYValue = 0;
+            }
+        }
+        else {
+            if (translatey > maxTranslateYValue) {
+                needAdjust = true;
+                newTranslateYValue = maxTranslateYValue / scale;
+            }
+            else if (translatey < minTranslateYValue) {
+                needAdjust = true;
+                newTranslateYValue = minTranslateYValue / scale;
+            }
+        }
+        if (isOverzoomed) {
+            const clientCenterX = (window.clientX + window.clientX2) / 2;
+            const clientCenterY = (window.clientY + window.clientY2) / 2;
+            let [newTranslatex, newTranslatey] = getTranslateCoordToPoint($img, $container, oldScale, scale, clientCenterX, clientCenterY);
+            [newTranslatex, newTranslatey] = getAdjustTransform(scale, newTranslatex, newTranslatey, $img, $container);
+            newTranslateXValue = newTranslatex;
+            newTranslateYValue = newTranslatey;
+        }
+        if (needAdjust) {
+            if (withAnimation) {
+                $img.classList.add('gs-zoom-is-adjusting');
+            }
+            setStyles(ref, $img, {
+                transform: `scale(${scale}) translate(${newTranslateXValue}px, ${newTranslateYValue}px)`,
+            });
+            $img.dataset.translatex = String(newTranslateXValue * scale);
+            $img.dataset.translatey = String(newTranslateYValue * scale);
+            if (withAnimation) {
+                setTimeout(() => {
+                    $img.classList.remove('gs-zoom-is-adjusting');
+                }, 400);
+            }
+        }
+    }
+};
+export default initAdjust;
+//# sourceMappingURL=initAdjust.js.map

package/dist/actions/initAdjust.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"initAdjust.js","sourceRoot":"","sources":["../../actions/initAdjust.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AACtD,OAAO,wBAAwB,MAAM,4BAA4B,CAAC;AAClE,OAAO,SAAS,MAAM,aAAa,CAAC;AAGpC,MAAM,UAAU,GAAG,CACjB,GAAQ,EACR,UAAuB,EACvB,IAAiB,EACjB,gBAAyB,IAAI,EACvB,EAAE;IACR,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;QACpE,MAAM,MAAM,GAAG,GAAG,CAAC,aAAa,CAAC;QACjC,IAAI,UAAU,GAAG,KAAK,CAAC;QAEvB,IAAI,aAAa,EAAE,CAAC;YAClB,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC;QAC9C,CAAC;QAED,IAAI,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC5E,IAAI,YAAY,GAAG,KAAK,CAAC;QACzB,MAAM,QAAQ,GAAG,KAAK,CAAC;QAEvB,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;YACd,KAAK,GAAG,CAAC,CAAC;YACV,UAAU,GAAG,IAAI,CAAC;QACpB,CAAC;aAAM,IAAI,KAAK,GAAG,MAAM,CAAC,OAAQ,EAAE,CAAC;YACnC,YAAY,GAAG,IAAI,CAAC;YACpB,KAAK,GAAG,MAAM,CAAC,OAAQ,CAAC;YACxB,UAAU,GAAG,IAAI,CAAC;QACpB,CAAC;QAED,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;QAEnC,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAC7C,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAC/C,MAAM,cAAc,GAAG,UAAU,CAAC,WAAW,CAAC;QAC9C,MAAM,eAAe,GAAG,UAAU,CAAC,YAAY,CAAC;QAChD,MAAM,MAAM,GAAG,iBAAiB,CAAC,IAAI,CAAC,CAAC;QACvC,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC;QAC5B,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC;QAC5B,MAAM,kBAAkB,GAAG,CAAC,WAAW,GAAG,cAAc,CAAC,GAAG,CAAC,CAAC;QAC9D,MAAM,kBAAkB,GAAG,CAAC,YAAY,GAAG,eAAe,CAAC,GAAG,CAAC,CAAC;QAChE,MAAM,kBAAkB,GAAG,CAAC,cAAc,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC;QAC9D,MAAM,kBAAkB,GAAG,CAAC,eAAe,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC;QAChE,IAAI,kBAAkB,GAAG,UAAU,GAAG,KAAK,CAAC;QAC5C,IAAI,kBAAkB,GAAG,UAAU,GAAG,KAAK,CAAC;QAE5C,IAAI,WAAW,IAAI,cAAc,EAAE,CAAC;YAClC,IAAI,UAAU,KAAK,CAAC,EAAE,CAAC;gBACrB,UAAU,GAAG,IAAI,CAAC;gBAClB,kBAAkB,GAAG,CAAC,CAAC;YACzB,CAAC;QACH,CAAC;aAAM,CAAC;YACN,IAAI,UAAU,GAAG,kBAAkB,EAAE,CAAC;gBACpC,UAAU,GAAG,IAAI,CAAC;gBAClB,kBAAkB,GAAG,kBAAkB,GAAG,KAAK,CAAC;YAClD,CAAC;iBAAM,IAAI,UAAU,GAAG,kBAAkB,EAAE,CAAC;gBAC3C,UAAU,GAAG,IAAI,CAAC;gBAClB,kBAAkB,GAAG,kBAAkB,GAAG,KAAK,CAAC;YAClD,CAAC;QACH,CAAC;QAED,IAAI,YAAY,IAAI,eAAe,EAAE,CAAC;YACpC,IAAI,UAAU,KAAK,CAAC,EAAE,CAAC;gBACrB,UAAU,GAAG,IAAI,CAAC;gBAClB,kBAAkB,GAAG,CAAC,CAAC;YACzB,CAAC;QACH,CAAC;aAAM,CAAC;YACN,IAAI,UAAU,GAAG,kBAAkB,EAAE,CAAC;gBACpC,UAAU,GAAG,IAAI,CAAC;gBAClB,kBAAkB,GAAG,kBAAkB,GAAG,KAAK,CAAC;YAClD,CAAC;iBAAM,IAAI,UAAU,GAAG,kBAAkB,EAAE,CAAC;gBAC3C,UAAU,GAAG,IAAI,CAAC;gBAClB,kBAAkB,GAAG,kBAAkB,GAAG,KAAK,CAAC;YAClD,CAAC;QACH,CAAC;QAED,IAAI,YAAY,EAAE,CAAC;YACjB,MAAM,aAAa,GAAG,CAAC,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;YAC7D,MAAM,aAAa,GAAG,CAAC,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;YAC7D,IAAI,CAAC,aAAa,EAAE,aAAa,CAAC,GAAG,wBAAwB,CAC3D,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,KAAK,EACL,aAAa,EACb,aAAa,CACd,CAAC;YACF,CAAC,aAAa,EAAE,aAAa,CAAC,GAAG,kBAAkB,CACjD,KAAK,EACL,aAAa,EACb,aAAa,EACb,IAAI,EACJ,UAAU,CACX,CAAC;YACF,kBAAkB,GAAG,aAAa,CAAC;YACnC,kBAAkB,GAAG,aAAa,CAAC;QACrC,CAAC;QAED,IAAI,UAAU,EAAE,CAAC;YACf,IAAI,aAAa,EAAE,CAAC;gBAClB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,sBAAsB,CAAC,CAAC;YAC7C,CAAC;YACD,SAAS,CAAC,GAAG,EAAE,IAAI,EAAE;gBACnB,SAAS,EAAE,SAAS,KAAK,eAAe,kBAAkB,OAAO,kBAAkB,KAAK;aACzF,CAAC,CAAC;YACH,IAAI,CAAC,OAAO,CAAC,UAAU,GAAG,MAAM,CAAC,kBAAkB,GAAG,KAAK,CAAC,CAAC;YAC7D,IAAI,CAAC,OAAO,CAAC,UAAU,GAAG,MAAM,CAAC,kBAAkB,GAAG,KAAK,CAAC,CAAC;YAC7D,IAAI,aAAa,EAAE,CAAC;gBAClB,UAAU,CAAC,GAAG,EAAE;oBACd,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC;gBAChD,CAAC,EAAE,GAAG,CAAC,CAAC;YACV,CAAC;QACH,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/actions/initAdjustAdditionalActive.d.ts

@@ -0,0 +1,4 @@
+import { Ref } from '../types/ref';
+declare const initAdjustAdditionalActive: (ref: Ref) => void;
+export default initAdjustAdditionalActive;
+//# sourceMappingURL=initAdjustAdditionalActive.d.ts.map

package/dist/actions/initAdjustAdditionalActive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"initAdjustAdditionalActive.d.ts","sourceRoot":"","sources":["../../actions/initAdjustAdditionalActive.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAEnC,QAAA,MAAM,0BAA0B,GAAI,KAAK,GAAG,KAAG,IAyB9C,CAAC;AAEF,eAAe,0BAA0B,CAAC"}

package/dist/actions/initAdjustAdditionalActive.js

@@ -1,33 +1,25 @@
-import { getTranslateCoord } from "./general";
-
-const initAdjustAdditionalActive = (ref) => {
-  if (ref.currentParams.showAdditionals && ref.list.length > 1) {
-    const $container = ref.$container;
-    const $active = $container.querySelector(
-      `.gs-add-list .gs-add-item.active`
-    );
-    if ($active != null) {
-      const $list = $container.querySelector(".gs-add-list");
-      const tranlateLeft = getTranslateCoord($list).x;
-      const offsetLeft = $active.offsetLeft;
-      const containerWidth = $container.clientWidth;
-      const itemWidth = $active.clientWidth;
-      const listWidth = $list.clientWidth;
-      const offsetContainer = offsetLeft + tranlateLeft;
-      const gap = parseFloat(getComputedStyle($list).columnGap);
-      if (offsetContainer < itemWidth + gap) {
-        $list.style.transform = `translateX(${Math.min(
-          itemWidth + gap - offsetLeft,
-          0
-        )}px)`;
-      } else if (offsetContainer > containerWidth - (2 * itemWidth + gap)) {
-        $list.style.transform = `translateX(${Math.max(
-          containerWidth - offsetLeft - 2 * itemWidth - gap,
-          containerWidth - listWidth
-        )}px)`;
-      }
-    }
-  }
-};
-
-export default initAdjustAdditionalActive;
+import { getTranslateCoord } from './general';
+const initAdjustAdditionalActive = (ref) => {
+    if (ref.currentParams.showAdditionals && ref.list.length > 1) {
+        const $container = ref.$container;
+        const $active = $container.querySelector('.gs-add-list .gs-add-item.active');
+        if ($active != null) {
+            const $list = $container.querySelector('.gs-add-list');
+            const tranlateLeft = getTranslateCoord($list).x;
+            const offsetLeft = $active.offsetLeft;
+            const containerWidth = $container.clientWidth;
+            const itemWidth = $active.clientWidth;
+            const listWidth = $list.clientWidth;
+            const offsetContainer = offsetLeft + tranlateLeft;
+            const gap = parseFloat(getComputedStyle($list).columnGap);
+            if (offsetContainer < itemWidth + gap) {
+                $list.style.transform = `translateX(${Math.min(itemWidth + gap - offsetLeft, 0)}px)`;
+            }
+            else if (offsetContainer > containerWidth - (2 * itemWidth + gap)) {
+                $list.style.transform = `translateX(${Math.max(containerWidth - offsetLeft - 2 * itemWidth - gap, containerWidth - listWidth)}px)`;
+            }
+        }
+    }
+};
+export default initAdjustAdditionalActive;
+//# sourceMappingURL=initAdjustAdditionalActive.js.map

package/dist/actions/initAdjustAdditionalActive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"initAdjustAdditionalActive.js","sourceRoot":"","sources":["../../actions/initAdjustAdditionalActive.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC;AAG9C,MAAM,0BAA0B,GAAG,CAAC,GAAQ,EAAQ,EAAE;IACpD,IAAI,GAAG,CAAC,aAAa,CAAC,eAAe,IAAI,GAAG,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QAC7D,MAAM,UAAU,GAAG,GAAG,CAAC,UAAW,CAAC;QACnC,MAAM,OAAO,GAAG,UAAU,CAAC,aAAa,CAAC,kCAAkC,CAAgB,CAAC;QAE5F,IAAI,OAAO,IAAI,IAAI,EAAE,CAAC;YACpB,MAAM,KAAK,GAAG,UAAU,CAAC,aAAa,CAAC,cAAc,CAAgB,CAAC;YACtE,MAAM,YAAY,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YAChD,MAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;YACtC,MAAM,cAAc,GAAG,UAAU,CAAC,WAAW,CAAC;YAC9C,MAAM,SAAS,GAAG,OAAO,CAAC,WAAW,CAAC;YACtC,MAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC;YACpC,MAAM,eAAe,GAAG,UAAU,GAAG,YAAY,CAAC;YAClD,MAAM,GAAG,GAAG,UAAU,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC;YAE1D,IAAI,eAAe,GAAG,SAAS,GAAG,GAAG,EAAE,CAAC;gBACtC,KAAK,CAAC,KAAK,CAAC,SAAS,GAAG,cAAc,IAAI,CAAC,GAAG,CAAC,SAAS,GAAG,GAAG,GAAG,UAAU,EAAE,CAAC,CAAC,KAAK,CAAC;YACvF,CAAC;iBAAM,IAAI,eAAe,GAAG,cAAc,GAAG,CAAC,CAAC,GAAG,SAAS,GAAG,GAAG,CAAC,EAAE,CAAC;gBACpE,KAAK,CAAC,KAAK,CAAC,SAAS,GAAG,cAAc,IAAI,CAAC,GAAG,CAC5C,cAAc,GAAG,UAAU,GAAG,CAAC,GAAG,SAAS,GAAG,GAAG,EACjD,cAAc,GAAG,SAAS,CAC3B,KAAK,CAAC;YACT,CAAC;QACH,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,0BAA0B,CAAC"}

package/dist/actions/initArrows.d.ts

@@ -0,0 +1,4 @@
+import { Ref } from '../types/ref';
+declare const initArrows: (ref: Ref) => void;
+export default initArrows;
+//# sourceMappingURL=initArrows.d.ts.map

package/dist/actions/initArrows.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"initArrows.d.ts","sourceRoot":"","sources":["../../actions/initArrows.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAEnC,QAAA,MAAM,UAAU,GAAI,KAAK,GAAG,KAAG,IA6B9B,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/actions/initArrows.js

@@ -1,44 +1,28 @@
-import icons from "../constants/icons";
-import initChange from "./initChange";
-
-const initArrows = (ref) => {
-  const params = ref.currentParams;
-  const $container = ref.$container;
-
-  if (params.arrows && ref.list.length > 1) {
-    const $btnNavigations = document.createElement("div");
-    const $btnNext = document.createElement("button");
-    const $btnPrev = document.createElement("button");
-    $btnPrev.innerHTML = icons.arrPrev;
-    $btnNext.innerHTML = icons.arrNext;
-    $btnNavigations.classList.add("gs-zoom-navigations");
-    $btnNext.classList.add("gs-zoom-next");
-    $btnNext.classList.add("gs-zoom-hide-inzoomed");
-    $btnPrev.classList.add("gs-zoom-prev");
-    $btnPrev.classList.add("gs-zoom-hide-inzoomed");
-    $btnNavigations.append($btnPrev);
-    $btnNavigations.append($btnNext);
-    $container.append($btnNavigations);
-
-    $btnNext.addEventListener("click", () => {
-      let newIndex = 0;
-      if (ref.currentIndex < ref.list.length - 1) {
-        newIndex = ref.currentIndex + 1;
-      } else {
-        newIndex = 0;
-      }
-      initChange(ref, newIndex);
-    });
-    $btnPrev.addEventListener("click", () => {
-      let newIndex = 0;
-      if (ref.currentIndex == 0) {
-        newIndex = ref.list.length - 1;
-      } else {
-        newIndex = ref.currentIndex - 1;
-      }
-      initChange(ref, newIndex);
-    });
-  }
-};
-
-export default initArrows;
+import icons from '../constants/icons';
+import initChange from './initChange';
+const initArrows = (ref) => {
+    const params = ref.currentParams;
+    const $container = ref.$container;
+    if (params.arrows && ref.list.length > 1) {
+        const $btnNavigations = document.createElement('div');
+        const $btnNext = document.createElement('button');
+        const $btnPrev = document.createElement('button');
+        $btnPrev.innerHTML = icons.arrPrev;
+        $btnNext.innerHTML = icons.arrNext;
+        $btnNavigations.classList.add('gs-zoom-navigations');
+        $btnNext.classList.add('gs-zoom-next', 'gs-zoom-hide-inzoomed');
+        $btnPrev.classList.add('gs-zoom-prev', 'gs-zoom-hide-inzoomed');
+        $btnNavigations.append($btnPrev, $btnNext);
+        $container.append($btnNavigations);
+        $btnNext.addEventListener('click', () => {
+            const newIndex = ref.currentIndex < ref.list.length - 1 ? ref.currentIndex + 1 : 0;
+            initChange(ref, newIndex);
+        });
+        $btnPrev.addEventListener('click', () => {
+            const newIndex = ref.currentIndex === 0 ? ref.list.length - 1 : ref.currentIndex - 1;
+            initChange(ref, newIndex);
+        });
+    }
+};
+export default initArrows;
+//# sourceMappingURL=initArrows.js.map

package/dist/actions/initArrows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"initArrows.js","sourceRoot":"","sources":["../../actions/initArrows.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,oBAAoB,CAAC;AACvC,OAAO,UAAU,MAAM,cAAc,CAAC;AAGtC,MAAM,UAAU,GAAG,CAAC,GAAQ,EAAQ,EAAE;IACpC,MAAM,MAAM,GAAG,GAAG,CAAC,aAAa,CAAC;IACjC,MAAM,UAAU,GAAG,GAAG,CAAC,UAAW,CAAC;IAEnC,IAAI,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACzC,MAAM,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACtD,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAClD,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAElD,QAAQ,CAAC,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC;QACnC,QAAQ,CAAC,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC;QACnC,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,qBAAqB,CAAC,CAAC;QACrD,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,EAAE,uBAAuB,CAAC,CAAC;QAChE,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,EAAE,uBAAuB,CAAC,CAAC;QAChE,eAAe,CAAC,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAC3C,UAAU,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;QAEnC,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;YACtC,MAAM,QAAQ,GACZ,GAAG,CAAC,YAAY,GAAG,GAAG,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACpE,UAAU,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC;QAC5B,CAAC,CAAC,CAAC;QAEH,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;YACtC,MAAM,QAAQ,GACZ,GAAG,CAAC,YAAY,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,YAAY,GAAG,CAAC,CAAC;YACtE,UAAU,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC;QAC5B,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/actions/initAutoplay.d.ts

@@ -0,0 +1,6 @@
+import { Ref } from '../types/ref';
+export declare const initAutoplay: (ref: Ref) => void;
+export declare const pauseAutoplay: (ref: Ref) => void;
+export declare const resumeAutoplay: (ref: Ref) => void;
+export declare const stopAutoplay: (ref: Ref) => void;
+//# sourceMappingURL=initAutoplay.d.ts.map

package/dist/actions/initAutoplay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"initAutoplay.d.ts","sourceRoot":"","sources":["../../actions/initAutoplay.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAEnC,eAAO,MAAM,YAAY,GAAI,KAAK,GAAG,KAAG,IA+BvC,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,KAAK,GAAG,KAAG,IAgBxC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,KAAK,GAAG,KAAG,IAqBzC,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,KAAK,GAAG,KAAG,IAYvC,CAAC"}

package/dist/actions/initAutoplay.js

@@ -1,81 +1,85 @@
-import icons from "../constants/icons";
-import initChange from "./initChange";
-
-export const initAutoplay = (ref) => {
-  const $container = ref.$container;
-  const params = ref.currentParams;
-  const $autoplayLine = document.createElement("div");
-  if ($container.querySelector(".gs-zoom-autoplayline") != null) {
-    $container.querySelector(".gs-zoom-autoplayline").remove();
-  }
-  setTimeout(() => {
-    $autoplayLine.classList.add("gs-zoom-autoplayline");
-    $container.prepend($autoplayLine);
-    $autoplayLine.style.width = "0px";
-    setTimeout(() => {
-      $autoplayLine.style.transition = `${params.autoplaySpeed}ms all linear`;
-      $autoplayLine.style.width = "100vw";
-      clearTimeout(ref.autoplay);
-      ref.autoplay = setTimeout(() => {
-        if ($container.querySelector(".gs-zoom-autoplayline") != null) {
-          $container.querySelector(".gs-zoom-autoplayline").remove();
-        }
-        if (ref.currentIndex == [...ref.list].length - 1) {
-          initChange(ref, 0, true);
-        } else {
-          initChange(ref, ref.currentIndex + 1, true);
-        }
-      }, params.autoplaySpeed - 100);
-    }, 100);
-  }, 0);
-};
-
-export const pauseAutoplay = (ref) => {
-  if (ref.autoplay != undefined) {
-    const $container = ref.$container;
-    const $loader = $container.querySelector(".gs-zoom-autoplayline");
-    const loaded = $loader.clientWidth;
-    const all = $container.clientWidth;
-    const loadedPercent = loaded / all;
-    $loader.transition = "unset";
-    $loader.style.width = loaded + "px";
-    $loader.dataset.loaded = loadedPercent;
-    clearTimeout(ref.autoplay);
-    ref.autoplay = undefined;
-    ref.autoplayStoped = true;
-  }
-};
-
-export const resumeAutoplay = (ref) => {
-  if (ref.autoplayStoped) {
-    ref.autoplayStoped = false;
-    const params = ref.currentParams;
-    const $container = ref.$container;
-    const $loader = $container.querySelector(".gs-zoom-autoplayline");
-    if ($loader != null) {
-      const loaded = +$loader.dataset.loaded;
-      const timeLeft = params.autoplaySpeed * (1 - loaded);
-      $loader.style.transition = `${timeLeft}ms all linear`;
-      $loader.style.width = "100vw";
-      clearTimeout(ref.autoplay);
-      ref.autoplay = setTimeout(() => {
-        if (ref.currentIndex == [...ref.list].length - 1) {
-          initChange(ref, 0, true);
-        } else {
-          initChange(ref, ref.currentIndex + 1, true);
-        }
-      }, timeLeft);
-    }
-  }
-};
-
-export const stopAutoplay = (ref) => {
-  const $container = ref.$container;
-  $container.querySelector(".gs-zoom-btn-autoplay").innerHTML = icons.autoplay;
-  if ($container.querySelector(".gs-zoom-autoplayline") != null) {
-    $container.querySelector(".gs-zoom-autoplayline").remove();
-    clearTimeout(ref.autoplay);
-    ref.autoplay = undefined;
-    ref.autoplayStoped = false;
-  }
-};
+import icons from '../constants/icons';
+import initChange from './initChange';
+export const initAutoplay = (ref) => {
+    const $container = ref.$container;
+    const params = ref.currentParams;
+    if ($container.querySelector('.gs-zoom-autoplayline') != null) {
+        $container.querySelector('.gs-zoom-autoplayline').remove();
+    }
+    const $autoplayLine = document.createElement('div');
+    setTimeout(() => {
+        $autoplayLine.classList.add('gs-zoom-autoplayline');
+        $container.prepend($autoplayLine);
+        $autoplayLine.style.width = '0px';
+        setTimeout(() => {
+            $autoplayLine.style.transition = `${params.autoplaySpeed}ms all linear`;
+            $autoplayLine.style.width = '100vw';
+            clearTimeout(ref.autoplay);
+            ref.autoplay = setTimeout(() => {
+                if ($container.querySelector('.gs-zoom-autoplayline') != null) {
+                    $container.querySelector('.gs-zoom-autoplayline').remove();
+                }
+                if (ref.currentIndex === ref.list.length - 1) {
+                    initChange(ref, 0, true);
+                }
+                else {
+                    initChange(ref, ref.currentIndex + 1, true);
+                }
+            }, params.autoplaySpeed - 100);
+        }, 100);
+    }, 0);
+};
+export const pauseAutoplay = (ref) => {
+    if (ref.autoplay !== undefined) {
+        const $container = ref.$container;
+        const $loader = $container.querySelector('.gs-zoom-autoplayline');
+        if ($loader) {
+            const loaded = $loader.clientWidth;
+            const all = $container.clientWidth;
+            const loadedPercent = loaded / all;
+            $loader.style.transition = 'unset';
+            $loader.style.width = `${loaded}px`;
+            $loader.dataset.loaded = String(loadedPercent);
+            clearTimeout(ref.autoplay);
+            ref.autoplay = undefined;
+            ref.autoplayStoped = true;
+        }
+    }
+};
+export const resumeAutoplay = (ref) => {
+    if (ref.autoplayStoped) {
+        ref.autoplayStoped = false;
+        const params = ref.currentParams;
+        const $container = ref.$container;
+        const $loader = $container.querySelector('.gs-zoom-autoplayline');
+        if ($loader != null) {
+            const loaded = +$loader.dataset.loaded;
+            const timeLeft = params.autoplaySpeed * (1 - loaded);
+            $loader.style.transition = `${timeLeft}ms all linear`;
+            $loader.style.width = '100vw';
+            clearTimeout(ref.autoplay);
+            ref.autoplay = setTimeout(() => {
+                if (ref.currentIndex === ref.list.length - 1) {
+                    initChange(ref, 0, true);
+                }
+                else {
+                    initChange(ref, ref.currentIndex + 1, true);
+                }
+            }, timeLeft);
+        }
+    }
+};
+export const stopAutoplay = (ref) => {
+    const $container = ref.$container;
+    const $btn = $container.querySelector('.gs-zoom-btn-autoplay');
+    if ($btn) {
+        $btn.innerHTML = icons.autoplay;
+    }
+    if ($container.querySelector('.gs-zoom-autoplayline') != null) {
+        $container.querySelector('.gs-zoom-autoplayline').remove();
+        clearTimeout(ref.autoplay);
+        ref.autoplay = undefined;
+        ref.autoplayStoped = false;
+    }
+};
+//# sourceMappingURL=initAutoplay.js.map

package/dist/actions/initAutoplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"initAutoplay.js","sourceRoot":"","sources":["../../actions/initAutoplay.ts"],"names":[],"mappings":"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"}

package/dist/actions/initChange.d.ts

@@ -0,0 +1,4 @@
+import { Ref } from '../types/ref';
+declare const initChange: (ref: Ref, index: number, isAutoplay?: boolean) => void;
+export default initChange;
+//# sourceMappingURL=initChange.d.ts.map

package/dist/actions/initChange.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"initChange.d.ts","sourceRoot":"","sources":["../../actions/initChange.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAEnC,QAAA,MAAM,UAAU,GAAI,KAAK,GAAG,EAAE,OAAO,MAAM,EAAE,aAAY,OAAe,KAAG,IAiI1E,CAAC;AAEF,eAAe,UAAU,CAAC"}