fixed various scope issues

Author: fieg

src/event-handlers.js

@@ -1,35 +1,37 @@
 import {getScrollPosition} from './dimensions';
 
-// @todo 1) verify that this is NOT shared among multiple instances
-// @todo 2) fill in these values on bind instead of zeroing them all
-let lastScroll = {
+const defaultLastScroll = {
   y: 0,
   x: 0,
   deltaY: 0,
   deltaX: 0
 };
 
-function calculateScroll(scrollContainer) {
+function calculateScroll(scrollContainer, lastScroll) {
   let scroll = getScrollPosition(scrollContainer);
 
   scroll.deltaY = scroll.y - (lastScroll ? lastScroll.y : scroll.y);
   scroll.deltaX = scroll.x - (lastScroll ? lastScroll.x : scroll.x);
 
-  lastScroll = scroll;
-
   return scroll;
 }
 
 export function scrollHandler() {
-  const scroll = calculateScroll(this.scrollContainer);
+  let ias = this;
+  let lastScroll = ias._lastScroll || defaultLastScroll;
+
+  const scroll = ias._lastScroll = calculateScroll(ias.scrollContainer, lastScroll);
 
   this.emitter.emit('scrolled', {scroll});
 
   this.measure();
 }
 
 export function resizeHandler() {
-  const scroll = calculateScroll(this.scrollContainer);
+  let ias = this;
+  let lastScroll = ias._lastScroll || defaultLastScroll;
+
+  const scroll = ias._lastScroll = calculateScroll(ias.scrollContainer, lastScroll);
 
   this.emitter.emit('resized', {scroll});
 

src/infinite-ajax-scroll.js

@@ -13,9 +13,6 @@ import Logger from './logger';
 import Paging from './paging';
 import {appendFn} from './append';
 
-let scrollListener;
-let resizeListener;
-
 export default class InfiniteAjaxScroll {
   constructor(container, options = {}) {
     Assert.singleElement(container, 'container');
@@ -70,11 +67,11 @@ export default class InfiniteAjaxScroll {
       return;
     }
 
-    scrollListener = throttle(scrollHandler, 200).bind(this);
-    resizeListener = throttle(resizeHandler, 200).bind(this);
+    this._scrollListener = throttle(scrollHandler, 200).bind(this);
+    this._resizeListener = throttle(resizeHandler, 200).bind(this);
 
-    this.scrollContainer.addEventListener('scroll', scrollListener);
-    this.scrollContainer.addEventListener('resize', resizeListener);
+    this.scrollContainer.addEventListener('scroll', this._scrollListener);
+    this.scrollContainer.addEventListener('resize', this._resizeListener);
 
     this.binded = true;
 
@@ -86,8 +83,8 @@ export default class InfiniteAjaxScroll {
       return;
     }
 
-    this.scrollContainer.removeEventListener('resize', resizeListener);
-    this.scrollContainer.removeEventListener('scroll', scrollListener);
+    this.scrollContainer.removeEventListener('resize', this._resizeListener);
+    this.scrollContainer.removeEventListener('scroll', this._scrollListener);
 
     this.binded = false;
 

src/logger.js

@@ -10,10 +10,10 @@ const defaultLogger = {
   unbinded: () => {
     console.log(`Unbinded event handlers`);
   },
-  // scrolled: () => {
+  // scrolled: (event) => {
   //   console.log('Scrolled');
   // },
-  // resized: () => {
+  // resized: (event) => {
   //   console.log('Resized');
   // },
   next: (event) => {

src/next-handler.js

@@ -1,29 +1,26 @@
 import $ from 'tealight';
 
 export function nextHandler(pageIndex) {
-  if (!this.lastResponse) {
-    this.lastResponse = document;
-  }
-  let nextUrl;
   let ias = this;
+  let lastResponse = ias._lastResponse || document;
 
-  let nextEl = $(ias.options.next, this.lastResponse)[0];
+  let nextEl = $(ias.options.next, lastResponse)[0];
 
   if (!nextEl) {
     return;
   }
 
-  nextUrl = nextEl.href;
+  let nextUrl = nextEl.href;
 
   return ias.load(nextUrl)
-      .then((data) => {
-        this.lastResponse = data.xhr.response;
+    .then((data) => {
+      lastResponse = ias._lastResponse = data.xhr.response;
 
-        let nextEl = $(ias.options.next, this.lastResponse)[0];
+      let nextEl = $(ias.options.next, lastResponse)[0];
 
-        return ias.append(data.items)
-            .then(() => {
-              return !!nextEl;
-            });
-      });
+      return ias.append(data.items)
+        .then(() => {
+          return !!nextEl;
+        });
+    });
 }