[BUGFIX] #16 Rebuild order when disabling ScrollSnapLoop Plugin

barthy-koeln · May 6, 2022 · db67b9c · db67b9c
1 parent 911b741
commit db67b9c
Show file tree

Hide file tree

Showing 22 changed files with 18 additions and 23 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml
diff --git a/.github/workflows/npm-publish.yml b/.github/workflows/npm-publish.yml
diff --git a/.gitignore b/.gitignore
diff --git a/.stylelintrc.json b/.stylelintrc.json
diff --git a/LICENSE b/LICENSE
diff --git a/README.md b/README.md
diff --git a/bin/io.sh b/bin/io.sh
diff --git a/demo/feature_toggle.css b/demo/feature_toggle.css
diff --git a/demo/index.css b/demo/index.css
diff --git a/demo/index.js b/demo/index.js
@@ -7,21 +7,10 @@ const sliderElement = document.querySelector('.example-slider')
 const slides = sliderElement.getElementsByClassName('scroll-snap-slide')
 const slider = new ScrollSnapSlider(sliderElement)
 
-slider.roundingMethod = function (x) {
-  const direction = x <= slider.slide ? -1 : 1
-
-  if (direction < 0) {
-    return Math.floor(x)
-  }
-
-  return Math.ceil(x)
-}
-
 /**
  * @param {Number} x the current slide position as a decimal (e.g. 1,5 = slide at index 1 has been slided by 50%)
  */
 slider.roundingMethod = function (x) {
-  // TODO return an integer that will be the the slider.slide
   return Math.round(x)
 }
 
@@ -46,7 +35,10 @@ for (const button of buttons) {
   button.addEventListener('click', function (event) {
     event.preventDefault()
 
-    const slideElementIndex = Array.from(slides).findIndex(item => item.dataset.index === button.control.value)
+    const slideElementIndex = Array.prototype.slice
+      .call(slides)
+      .findIndex(item => item.dataset.index === button.control.value)
+
     slider.slideTo(slideElementIndex)
   })
 }
@@ -108,3 +100,5 @@ draggableInput.addEventListener('change', function () {
 
   disablePlugin(draggablePlugin)
 })
+
+window.slider = slider
diff --git a/demo/page.css b/demo/page.css
diff --git a/index.html b/index.html
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "scroll-snap-slider",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "description": "Mostly CSS slider with great performance.",
   "keywords": [
     "slider",

diff --git a/src/ScrollSnapAutoplay.js b/src/ScrollSnapAutoplay.js
diff --git a/src/ScrollSnapDraggable.js b/src/ScrollSnapDraggable.js
diff --git a/src/ScrollSnapLoop.js b/src/ScrollSnapLoop.js
@@ -14,7 +14,7 @@ export class ScrollSnapLoop extends ScrollSnapPlugin {
   enable (slider) {
     this.slider = slider
     this.element = this.slider.element
-    this.slides = this.slider.element.getElementsByClassName('scroll-snap-slide')
+    this.slides = this.element.getElementsByClassName('scroll-snap-slide')
 
     this.slider.addEventListener('slide-stop', this.loopSlides)
     this.loopSlides()
@@ -26,6 +26,12 @@ export class ScrollSnapLoop extends ScrollSnapPlugin {
   disable () {
     this.slider.removeEventListener('slide-stop', this.loopSlides)
 
+    const sortedSlides = Array.prototype.slice
+      .call(this.slides)
+      .sort((a, b) => parseInt(a.dataset.index, 10) - parseInt(b.dataset.index, 10))
+
+    Element.prototype.append.apply(this.element, sortedSlides)
+
     this.slider = null
     this.element = null
     this.slides = null

diff --git a/src/ScrollSnapPlugin.js b/src/ScrollSnapPlugin.js
diff --git a/src/ScrollSnapSlider.js b/src/ScrollSnapSlider.js
diff --git a/src/scroll-snap-slider.css b/src/scroll-snap-slider.css
diff --git a/src/scroll-snap-slider.scss b/src/scroll-snap-slider.scss
diff --git a/yarn.lock b/yarn.lock
@@ -513,15 +513,10 @@ camelcase@^5.3.1:
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.3.1.tgz#e3c9b31569e106811df242f715725a1f4c494320"
   integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
 
-caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001219, caniuse-lite@^1.0.30001274:
-  version "1.0.30001280"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001280.tgz#066a506046ba4be34cde5f74a08db7a396718fb7"
-  integrity sha512-kFXwYvHe5rix25uwueBxC569o53J6TpnGu0BEEn+6Lhl2vsnAumRFWEBhDft1fwyo6m1r4i+RqA4+163FpeFcA==
-
-caniuse-lite@^1.0.30001245:
-  version "1.0.30001279"
-  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001279.tgz"
-  integrity sha512-VfEHpzHEXj6/CxggTwSFoZBBYGQfQv9Cf42KPlO79sWXCD1QNKWKsKzFeWL7QpZHJQYAvocqV6Rty1yJMkqWLQ==
+caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001219, caniuse-lite@^1.0.30001245, caniuse-lite@^1.0.30001274:
+  version "1.0.30001338"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001338.tgz"
+  integrity sha512-1gLHWyfVoRDsHieO+CaeYe7jSo/MT7D7lhaXUiwwbuR5BwQxORs0f1tAwUSQr3YbxRXJvxHM/PA5FfPQRnsPeQ==
 
 chalk@^2.0.0:
   version "2.4.2"