embla-carousel - npm Package Compare versions

Comparing version 0.1.4 to 0.2.0

lib/components/utils.d.ts

 export declare function rectWidth(node: HTMLElement): number;
 export declare function map(value: number, iStart: number, iStop: number, oStart: number, oStop: number): number;
-export declare function debounce(callback: () => void, time: number): () => void;
 export declare function arrayFromCollection(nodeList: HTMLCollection): HTMLElement[];

lib/index.d.ts

 import { Callback as EmblaCallback, Event as EmblaEvent } from './components/eventDispatcher';
-import { EventStore } from './components/eventStore';
 import { UserOptions } from './components/options';
 declare type EmblaCarousel = {
-    container: HTMLElement;
-    slides: HTMLElement[];
     next: () => void;
@@ -11,9 +8,10 @@ previous: () => void;
     destroy: () => void;
-    reActivate: (userOpt: UserOptions) => void;
-    addEvent: () => EventStore;
-    selectedIndex: () => number;
+    getContainer: () => HTMLElement;
+    getSlides: () => HTMLElement[];
+    getSelectedIndex: () => number;
     on: (evt: EmblaEvent, cb: EmblaCallback) => void;
     off: (evt: EmblaEvent, cb: EmblaCallback) => void;
+    resize: () => void;
 };
 export declare function EmblaCarousel(sliderRoot: HTMLElement, userOptions?: UserOptions): EmblaCarousel;
 export default EmblaCarousel;

lib/index.js

@@ -223,14 +223,2 @@ (function webpackUniversalModuleDefinition(root, factory) {
 
-function debounce(callback, time) {
-  var timeout = {
-    id: 0
-  };
-  return function () {
-    window.clearTimeout(timeout.id);
-    timeout.id = window.setTimeout(callback, time) || 0;
-  };
-}
-
-exports.debounce = debounce;
-
 function arrayFromCollection(nodeList) {
@@ -298,3 +286,3 @@ return Array.prototype.slice.call(nodeList);
   var self = {};
-  var state = {
+  var event = {
     listeners: []
@@ -306,3 +294,3 @@ };
     node.addEventListener(type, handler, options);
-    state.listeners.push(function () {
+    event.listeners.push(function () {
       return node.removeEventListener(type, handler, options);
@@ -314,6 +302,5 @@ });
   function removeAll() {
-    state.listeners.forEach(function (remove) {
+    event.listeners.filter(function (remove) {
       return remove();
     });
-    state.listeners = [];
     return self;
@@ -435,4 +422,3 @@ }
   var state = {
-    active: false,
-    lastWindowWidth: 0
+    active: false
   };
@@ -443,4 +429,3 @@
   var eventDispatcher = eventDispatcher_1.EventDispatcher();
-  var internalEvents = eventStore_1.EventStore();
-  var resize = utils_1.debounce(onResize, 500);
+  var eventStore = eventStore_1.EventStore();
   activate(options);
@@ -462,5 +447,5 @@
 
+    elements.root = root;
     elements.container = container;
     elements.slides = utils_1.arrayFromCollection(container.children);
-    state.lastWindowWidth = window.innerWidth;
     state.active = true;
@@ -475,3 +460,4 @@ }
     if (elements.slides.length > 0) {
-      var container = elements.container,
+      var root = elements.root,
+          container = elements.container,
           slides = elements.slides;
@@ -481,9 +467,8 @@
 
-      var engine = engine_1.Engine(sliderRoot, container, slides, newOpt, eventDispatcher);
+      var engine = engine_1.Engine(root, container, slides, newOpt, eventDispatcher);
 
       _extends(slider, engine);
 
-      internalEvents.add(window, 'resize', resize);
       slides.forEach(function (s, i) {
-        return internalEvents.add(s, 'focus', slideFocus(i), true);
+        return eventStore.add(s, 'focus', slideFocus(i), true);
       });
@@ -529,3 +514,3 @@ slider.translate.to(slider.mover.location);
     slider.animation.stop();
-    internalEvents.removeAll();
+    eventStore.removeAll();
     container.style.transform = '';
@@ -543,11 +528,2 @@ slides.forEach(function (s) {
 
-  function onResize() {
-    var windowWidth = window.innerWidth;
-
-    if (windowWidth !== state.lastWindowWidth) {
-      state.lastWindowWidth = windowWidth;
-      reActivate();
-    }
-  }
-
   function slideFocus(index) {
@@ -575,9 +551,19 @@ return function () {
 
-  function selectedIndex() {
+  function getSelectedIndex() {
     return slider.index.get();
   }
 
+  function getContainer() {
+    return elements.container;
+  }
+
+  function getSlides() {
+    return elements.slides;
+  }
+
   return _extends(self, {
-    changeOptions: reActivate,
     destroy: destroy,
+    getContainer: getContainer,
+    getSelectedIndex: getSelectedIndex,
+    getSlides: getSlides,
     goTo: goTo,
@@ -588,3 +574,3 @@ next: next,
     previous: previous,
-    selectedIndex: selectedIndex
+    resize: reActivate
   });
@@ -1397,3 +1383,3 @@ }
   var trackInterval = 10;
-  var state = {
+  var pointer = {
     isDown: false,
@@ -1406,3 +1392,3 @@ isMouse: false,
   function readPoint(evt, axis) {
-    var isMouse = state.isMouse;
+    var isMouse = pointer.isMouse;
     var c = coords[axis];
@@ -1414,7 +1400,7 @@ var value = isMouse ? evt[c] : evt.touches[0][c];
   function down(evt) {
-    state.isMouse = !!evt.type.match(/mouse/);
+    pointer.isMouse = !!evt.type.match(/mouse/);
     var point = readPoint(evt, 'x');
     startDrag.set(point);
     lastDrag.set(point);
-    state.isDown = true;
+    pointer.isDown = true;
     return size.measure(startDrag.get());
@@ -1426,7 +1412,7 @@ }
     var time2 = new Date().getTime();
-    var time1 = state.trackTime;
+    var time1 = pointer.trackTime;
 
     if (time2 - time1 >= trackInterval) {
-      state.trackPoints.push(point.get());
-      state.trackTime = time2;
+      pointer.trackPoints.push(point.get());
+      pointer.trackTime = time2;
     }
@@ -1442,4 +1428,4 @@
     var currentPoint = lastDrag.get();
-    var trackLength = state.isMouse ? 5 : 4;
-    lastDrag.setNumber(state.trackPoints.slice(-trackLength).map(function (point) {
+    var trackLength = pointer.isMouse ? 5 : 4;
+    lastDrag.setNumber(pointer.trackPoints.slice(-trackLength).map(function (point) {
       return currentPoint - point;
@@ -1449,4 +1435,4 @@ }).sort(function (p1, p2) {
     })[0] || 0);
-    state.isDown = false;
-    state.trackPoints = [];
+    pointer.isDown = false;
+    pointer.trackPoints = [];
     return size.measure(lastDrag.get());
@@ -1459,3 +1445,3 @@ }
     isDown: function isDown() {
-      return state.isDown;
+      return pointer.isDown;
     },
@@ -1462,0 +1448,0 @@ move: move,

package.json

 {
   "name": "embla-carousel",
-  "version": "0.1.4",
+  "version": "0.2.0",
   "author": "David Cetinkaya",
@@ -5,0 +5,0 @@ "private": false,

README.md

@@ -133,3 +133,9 @@ # Embla Carousel · ![GitHub](https://img.shields.io/github/license/davidcetinkaya/embla-carousel.svg?color=blue) ![npm](https://img.shields.io/npm/v/embla-carousel.svg) ![Travis (.org) branch](https://img.shields.io/travis/davidcetinkaya/embla-carousel/master.svg) ![prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat)
 
-**`selectedIndex()`**  
+**`getContainer()`**  
+Gets the current container element node.
+
+**`getSlides()`**  
+Gets the slides as an array of element nodes.
+
+**`getSelectedIndex()`**  
 Gets the current selected slide index. First slide starts at index 0.
@@ -146,8 +152,5 @@
 
-**`changeOptions(options: options)`**  
-Reinitializes the carousel with passed options. This will do all the calculations and setup the carousel from scratch.
+**`resize(options: options)`**  
+Useful when you're planning to change slide widths for different breakpoints or similar. This will do all the calculations and reinitialize the carousel with passed options.
 
-**`destroy()`**  
-Removes all styles applied to DOM nodes and kills all event listeners for this Embla instance.
-
 **`on(event: string, callback: function)`**  
@@ -165,4 +168,7 @@ Subscribes to a custom Embla event by firing the passed callback. Below is a list of events you can subscribe to:
 
+**`destroy()`**  
+Removes all styles applied to DOM nodes and kills all event listeners for this Embla instance.
+
 ## License
 
 Embla is [MIT licensed](./LICENSE).

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

172

increased by3.61%

Worsened metrics

Total package byte prevSize

64719

decreased by-0.54%

Lines of code

1805

decreased by-0.82%

No dependency changes