docs(InfiniteScroll): add correct documentation

Author: edoparearyee

README.md

@@ -2,16 +2,14 @@
 [![Build Status][travis-badge]][travis-badge-url]
 [![Coverage Status][coveralls-badge]][coveralls-badge-url]
 
-A simple progressive/responsive/lazy loading image library for [Angular (2/4+)][angular] that detects browser size and loads the appropriate image only when the element is in view. This package requires [angular-inviewport][angular-inviewport]
-
-<img src="https://raw.githubusercontent.com/thisissoon/angular-infinite-scroll/master/src/demo/example.gif" alt="example">
+Simple, lightweight infinite scrolling directive for [Angular (2/4+)][angular] with no other dependencies which emits and event when element has scrolled to the end.
 
 This is a simple library for [Angular][angular], implemented in the [Angular Package Format v4.0](https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs/edit#heading=h.k0mh3o8u5hx).
 
 
 ## Install
 
-`npm i @thisissoon/{angular-infinite-scroll,angular-inviewport} --save`
+`npm i @thisissoon/angular-infinite-scroll --save`
 
 `app.module.ts`
 ```ts
@@ -33,54 +31,30 @@ a working example can be found inside [/src/demo](https://github.com/thisissoon/
 ### `app.component.html`
 
 ```html
-<sn-infinite-scroll [image]="image" [sizes]="sizes" imgClass="foo" alt="lorem ipsum"></sn-infinite-scroll>
+<div
+  class="foo"
+  snInfiniteScroll
+  (onScrollEnd)="onScrollEnd()"
+  [offset]="100"
+  [disabled]="disabled">
+</div>
 ```
 
 ### `app.component.ts`
 
 ```ts
 export class AppComponent {
-  sizes: Breakpoint[] = [
-    { size: 'xs', width: 0},
-    { size: 'md', width: 768},
-    { size: 'lg', width: 992},
-  ];
-
-  image: ResponsiveImage = {
-    placeholder: 'http://via.placeholder.com/35x15?text=placeholder',
-    fallback: 'http://via.placeholder.com/350x150?text=fallback',
-    xs: {
-      '@1x': 'http://via.placeholder.com/150x350?text=xs+1x',
-      '@2x': 'http://via.placeholder.com/300x700?text=xs+2x'
-    },
-    md: {
-      '@1x': 'http://via.placeholder.com/350x250?text=md+1x',
-      '@2x': 'http://via.placeholder.com/700x500?text=md+2x'
-    },
-    lg: {
-      '@1x': 'http://via.placeholder.com/700x400?text=lg+1x',
-      '@2x': 'http://via.placeholder.com/1400x800?text=lg+2x'
-    }
-  };
-}
-```
-
-### `app.component.css`
-
-```css
-.foo {
-  transition: all .35s ease-in-out;
+  onScrollEnd() {
+    // Do something here
+  }
 }
 
-.sn-image-not-loaded /deep/ .foo {
-  filter: blur(20px);
-}
-
-.sn-image-loaded /deep/ .foo {
-  filter: blur(0px);
-}
 ```
 
+## Options
+
+* `offset` (number): distance in px from bottom of element to trigger `onSctollEnd` event (default: 0)
+* `disabled` (boolean): If true directive will not trigger event
 
 [travis-badge]: https://travis-ci.org/thisissoon/angular-infinite-scroll.svg?branch=master
 [travis-badge-url]: https://travis-ci.org/thisissoon/angular-infinite-scroll

package.json

@@ -2,7 +2,7 @@
   "name": "@thisissoon/angular-infinite-scroll",
   "version": "0.1.0",
   "private": false,
-  "description": "Simple, lightweight infinite scrolling for Angular (2/4+), with no other dependencies.",
+  "description": "Simple, lightweight infinite scrolling directive for Angular (2/4+) with no other dependencies.",
   "keywords": [
     "angular",
     "angular 2",
@@ -56,8 +56,7 @@
     "postrelease": "npm run build"
   },
   "peerDependencies": {
-    "@angular/core": ">=4.0.0 <5.0.0 || >=4.0.0-beta <5.0.0",
-    "rxjs": ">=5.0.0 <6.0.0"
+    "@angular/core": ">=4.0.0 <5.0.0 || >=4.0.0-beta <5.0.0"
   },
   "devDependencies": {
     "@angular/common": "^4.3.4",

src/lib/src/infinite-scroll/infinite-scroll.directive.ts

@@ -8,6 +8,22 @@ import 'rxjs/add/operator/map';
 import { Scroll } from '../scroll.model';
 import * as events from '../events';
 
+/**
+ * @example
+ * ```
+ * <div
+ *   class="foo"
+ *   snInfiniteScroll
+ *   (onScrollEnd)="onScrollEnd()"
+ *   [offset]="100"
+ *   [disabled]="disabled">
+ * </div>
+ * ```
+ *
+ * @export
+ * @class InfiniteScrollDirective
+ * @implements {AfterViewInit}
+ */
 @Directive({
   selector: '[snInfiniteScroll]'
 })