Add inverse scrolling and timeout fix.

bower.json

@@ -1,7 +1,7 @@
 {
   "name": "lrInfiniteScroll",
   "main": "lrInfiniteScroll.js",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "homepage": "https://github.com/lorenzofox3/lrInfiniteScroll",
   "authors": [
     "lorenzofox3 <[email protected]>"

lrInfiniteScroll.js

@@ -2,40 +2,66 @@
     'use strict';
     var module = ng.module('lrInfiniteScroll', []);
 
-    module.directive('lrInfiniteScroll', ['$timeout', function (timeout) {
+    module.directive('lrInfiniteScroll', ['$timeout', function ($timeout) {
         return{
             link: function (scope, element, attr) {
-                var
-                    lengthThreshold = attr.scrollThreshold || 50,
+                var lengthThreshold = attr.scrollThreshold || 50,
                     timeThreshold = attr.timeThreshold || 400,
-                    handler = scope.$eval(attr.lrInfiniteScroll),
+                    handlerTop = scope.$eval(attr.lrInfiniteScroll),
+                    handlerBottom = scope.$eval(attr.lrInfiniteScrollInverse),
+                    inverse = (typeof handlerBottom == 'function') ? true : false,
                     promise = null,
-                    lastRemaining = 9999;
+                    lastRemaining = 9999,
+                    lastRemainingInverse = 9999;
 
                 lengthThreshold = parseInt(lengthThreshold, 10);
                 timeThreshold = parseInt(timeThreshold, 10);
 
-                if (!handler || !ng.isFunction(handler)) {
-                    handler = ng.noop;
+                if (!handlerTop || !ng.isFunction(handlerTop)) {
+                    handlerTop = ng.noop;
+                }
+
+                if (!handlerBottom || !ng.isFunction(handlerBottom)) {
+                    handlerBottom = ng.noop;
                 }
 
                 element.bind('scroll', function () {
-                    var
-                        remaining = element[0].scrollHeight - (element[0].clientHeight + element[0].scrollTop);
+                    var el = element[0];
+                    var remainingInverse = inverse ? el.scrollTop : null;
+                    var remaining = el.scrollHeight - (el.clientHeight + el.scrollTop);
 
                     //if we have reached the threshold and we scroll down
                     if (remaining < lengthThreshold && (remaining - lastRemaining) < 0) {
-
                         //if there is already a timer running which has no expired yet we have to cancel it and restart the timer
                         if (promise !== null) {
-                            timeout.cancel(promise);
+                            $timeout.cancel(promise);
                         }
-                        promise = timeout(function () {
-                            handler();
+                        promise = $timeout(function () {
+                            if (typeof handlerTop == 'function') {
+                                handlerTop();
+                            }
                             promise = null;
                         }, timeThreshold);
                     }
                     lastRemaining = remaining;
+
+                    if (remainingInverse !== null && remainingInverse < lengthThreshold && (remainingInverse - lastRemainingInverse) < 0) {
+                        //if there is already a timer running which has no expired yet we have to cancel it and restart the timer
+                        if (promise !== null) {
+                            $timeout.cancel(promise);
+                        }
+                        promise = $timeout(function () {
+                            if (typeof handlerBottom == 'function') {
+                                handlerBottom();
+                            }
+                            promise = null;
+                        }, timeThreshold);
+                    }
+                    lastRemainingInverse = remainingInverse;
+                });
+
+                element.on('$destroy', function() {
+                    $timeout.cancel(promise);
                 });
             }
 

readme.md

@@ -1,8 +1,8 @@
 # lrInfiniteScroll
 
 It is a module for [AngularJS](http://angularjs.org/) which allow you to attach an event handler to the element when this element
-has been scrolled almost to its bottom. In most of the case it will be used for infinite scrolling.
-It is very light (about 45 lines of code) and optimized to reduce the amount of $digest loop.
+has been scrolled almost to its bottom or top (or both). In most of the case it will be used for infinite scrolling.
+It is very light (about 70 lines of code) and optimized to reduce the amount of $digest loop.
 
 See the [example section](http://lorenzofox3.github.io/lrInfiniteScroll/index.html#example)
 
@@ -16,6 +16,16 @@ simply set as attribute a function accessible within the $scope
 </ul>
 ```
 
+## Set inverse scroll direction
+
+Set if scrolling from bottom to top so the event handler will be called when scrolled almost to the top.
+
+```html
+<ul lr-infinite-scroll-inverse="myEventHandler">
+    <li ng-repeat="item in myCollection">
+</ul>
+```
+
 ## Change the scroll threshold
 
 By default the handler will be called when the user is scrolling *down* and only *50* pixels are remaining before reaching the end