From 8202bb9847788a1a5c5fcb25edf666023ea496d4 Mon Sep 17 00:00:00 2001
From: Vadim <korobeinikovv@mail.ru>
Date: Thu, 21 Jan 2021 20:15:06 +0300
Subject: [PATCH] Rename perPage => slidesToShow

---
 src/ImageCarousel.svelte             | 14 +++++++-------
 src/stories/ImageCarouselView.svelte |  6 +++---
 src/utils/size.js                    | 22 +++++++++++-----------
 3 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/src/ImageCarousel.svelte b/src/ImageCarousel.svelte
index 073d05c..27889af 100644
--- a/src/ImageCarousel.svelte
+++ b/src/ImageCarousel.svelte
@@ -6,7 +6,7 @@
   import {
     getPageIndex,
     getPagesCount,
-    getPerPageTail,
+    getSlidesToShowTail,
     getSlideSize,
     getIsNotCompletePage
   } from './utils/size'
@@ -22,9 +22,9 @@
   export let infinite = true
 
   /**
-   * Elements per page
+   * Number of slides to show at a time
    */
-  export let perPage = 1
+  export let slidesToShow = 1
 
   /**
    * Page to start on
@@ -47,13 +47,13 @@
     contentContainerWidth = contentContainerElement.clientWidth
 
     const slidesCount = children.length
-    pagesCount = getPagesCount({ slidesCount, perPage })
-    const perPageTail = getPerPageTail({ pagesCount, perPage, slidesCount })
+    pagesCount = getPagesCount({ slidesCount, slidesToShow })
+    const slidesToShowTail = getSlidesToShowTail({ pagesCount, slidesToShow, slidesCount })
 
     for (let slideIndex=0; slideIndex<children.length; slideIndex++) {
-      const pageIndex = getPageIndex({ slideIndex, perPage })
+      const pageIndex = getPageIndex({ slideIndex, slidesToShow })
       const isNotCompletePage = getIsNotCompletePage({ pageIndex, pagesCount })
-      const slideSizePx = getSlideSize({ isNotCompletePage, contentContainerWidth, perPage, perPageTail })
+      const slideSizePx = getSlideSize({ isNotCompletePage, contentContainerWidth, slidesToShow, slidesToShowTail })
       children[slideIndex].style.minWidth = `${slideSizePx}px`
       children[slideIndex].style.maxWidth = `${slideSizePx}px`
     }
diff --git a/src/stories/ImageCarouselView.svelte b/src/stories/ImageCarouselView.svelte
index 2202b40..5de8fdd 100644
--- a/src/stories/ImageCarouselView.svelte
+++ b/src/stories/ImageCarouselView.svelte
@@ -12,9 +12,9 @@
   export let infinite = true;
 
   /**
-   * Elements per page
+   * Number of slides to show at a time
    */
-  export let perPage = 1;
+  export let slidesToShow = 1;
 
   /**
    * Page to start on
@@ -44,7 +44,7 @@
   <ImageCarousel
     {arrows}
     {infinite}
-    {perPage}
+    {slidesToShow}
     {initialPage}
     {speed}
   >
diff --git a/src/utils/size.js b/src/utils/size.js
index e89a057..61d9269 100644
--- a/src/utils/size.js
+++ b/src/utils/size.js
@@ -1,13 +1,13 @@
-export function getPagesCount({ slidesCount, perPage }) {
-  return Math.ceil(slidesCount/perPage)
+export function getPagesCount({ slidesCount, slidesToShow }) {
+  return Math.ceil(slidesCount/slidesToShow)
 }
 
-export function getPerPageTail({
-  perPage,
+export function getSlidesToShowTail({
+  slidesToShow,
   slidesCount,
   pagesCount
 }) {
-  return slidesCount - perPage * (pagesCount - 1)
+  return slidesCount - slidesToShow * (pagesCount - 1)
 }
 
 export function getIsNotCompletePage({
@@ -19,15 +19,15 @@ export function getIsNotCompletePage({
 
 export function getSlideSize({
   contentContainerWidth,
-  perPage,
-  perPageTail,
+  slidesToShow,
+  slidesToShowTail,
   isNotCompletePage
 }) {
   return isNotCompletePage
-    ? Math.round(contentContainerWidth/perPageTail) 
-    : Math.round(contentContainerWidth/perPage)
+    ? Math.round(contentContainerWidth/slidesToShowTail) 
+    : Math.round(contentContainerWidth/slidesToShow)
 }
 
-export function getPageIndex({ slideIndex, perPage }) {
-  return Math.floor(slideIndex/perPage)
+export function getPageIndex({ slideIndex, slidesToShow }) {
+  return Math.floor(slideIndex/slidesToShow)
 }