@blinkk/degu - npm Package Compare versions

Comparing version 0.0.323 to 0.0.324

lib/ui/carousel/carousel.d.ts

@@ -48,2 +48,4 @@ import { Transition } from './transitions';
     constructor(container: HTMLElement, slides: HTMLElement[], { condition, activeCssClass, beforeCssClass, afterCssClass, distanceToActiveSlideAttr, loop, transition, autoplaySpeed }?: CarouselOptions);
+    isDisabled(): boolean;
+    isEnabled(): boolean;
     goTo(target: number | HTMLElement, drivenBySync?: boolean): void;
@@ -71,2 +73,5 @@ goToSlide(targetSlide: HTMLElement, drivenBySync?: boolean): void;
     sync(...carousels: Carousel[]): void;
+    pause(): void;
+    unpause(): void;
+    isPaused(): boolean;
     private transitionSlidesBy;
@@ -73,0 +78,0 @@ private syncTo;

lib/ui/carousel/carousel.js

@@ -25,2 +25,32 @@ "use strict";
 })(DefaultCssClass || (DefaultCssClass = {}));
+class AutoplayTimeout {
+    constructor(callback, delay) {
+        this.callback = callback;
+        this.delay = delay;
+        this.timePassed = 0;
+        this.timeout = setTimeout(callback, delay);
+        this.lastStartTime = +new Date();
+    }
+    isPaused() {
+        return this.timeout !== null;
+    }
+    pause() {
+        this.timePassed += +new Date() - this.lastStartTime;
+        this.clear();
+    }
+    unpause() {
+        if (!this.isPaused()) {
+            return;
+        }
+        this.timeout = setTimeout(this.callback, this.delay - this.timePassed);
+        this.lastStartTime = +new Date();
+    }
+    dispose() {
+        this.clear();
+    }
+    clear() {
+        clearTimeout(this.timeout);
+        this.timeout = null;
+    }
+}
 class Carousel {
@@ -64,2 +94,8 @@ constructor(container, slides, { condition = () => true, activeCssClass = DefaultCssClass.ACTIVE_SLIDE, beforeCssClass = DefaultCssClass.BEFORE_SLIDE, afterCssClass = DefaultCssClass.AFTER_SLIDE, distanceToActiveSlideAttr = DEFAULT_DISTANCE_TO_ACTIVE_SLIDE_ATTR, loop = true, transition = null, autoplaySpeed = null } = {}) {
     }
+    isDisabled() {
+        return !this.condition();
+    }
+    isEnabled() {
+        return this.condition();
+    }
     goTo(target, drivenBySync = false) {
@@ -176,2 +212,11 @@ if (typeof target === 'number') {
     }
+    pause() {
+        this.autoplayTimeout.pause();
+    }
+    unpause() {
+        this.autoplayTimeout.unpause();
+    }
+    isPaused() {
+        return this.autoplayTimeout.isPaused();
+    }
     transitionSlidesBy(value) {
@@ -237,5 +282,7 @@ const nextIndex = this.getSlides()
         if (this.autoplaySpeed !== null) {
-            clearTimeout(this.autoplayTimeout);
+            if (this.autoplayTimeout !== null) {
+                this.autoplayTimeout.dispose();
+            }
             this.autoplayTimeout =
-                window.setTimeout(() => this.next(), this.autoplaySpeed);
+                new AutoplayTimeout(() => this.next(), this.autoplaySpeed);
         }
@@ -242,0 +289,0 @@ }

lib/ui/carousel/draggable-slide.d.ts

@@ -16,2 +16,3 @@ import { Carousel } from './carousel';
     private readonly xTranslate;
+    private readonly lastXTranslate;
     private transitionTarget;
@@ -18,0 +19,0 @@ private carousel;

lib/ui/carousel/draggable-slide.js

@@ -46,2 +46,4 @@ "use strict";
             default_map_1.DefaultMap.usingFunction((el) => getTranslateX(el));
+        this.lastXTranslate =
+            default_map_1.DefaultMap.usingFunction((el) => null);
     }
@@ -59,2 +61,5 @@ static sumWidth(slides) {
     onRaf() {
+        if (this.carousel.isDisabled()) {
+            return;
+        }
         this.raf.read(() => {
@@ -101,2 +106,3 @@ if (!this.isInteracting() && this.transitionTarget) {
         this.xTranslate.clear();
+        this.lastXTranslate.clear();
     }
@@ -135,3 +141,6 @@ initResizeHandler() {
             this.xTranslate.forEach((xTranslate, slide) => {
-                slide.style.transform = `translateX(${xTranslate}px)`;
+                if (this.lastXTranslate.get(slide) !== xTranslate) {
+                    slide.style.transform = `translateX(${xTranslate}px)`;
+                    this.lastXTranslate.set(slide, xTranslate);
+                }
             });
@@ -138,0 +147,0 @@ });

package.json

 {
   "name": "@blinkk/degu",
-  "version": "0.0.323",
+  "version": "0.0.324",
   "description": "A general utility library for interactive websites, with a focus on performance.",
@@ -5,0 +5,0 @@ "author": "Blinkk <[e-mail]>",

No alert changes

Improved metrics

Total package byte prevSize

626444

increased by0.26%

Lines of code

17418

increased by0.36%

No dependency changes