Merge remote-tracking branch 'origin/master' into WIP-api-demos

ionic/components/scroll/pull-to-refresh.ts

@@ -1,40 +1,62 @@
-import {Component, NgIf, NgClass, ElementRef, EventEmitter, Host} from 'angular2/angular2'
+import {Component, ElementRef, EventEmitter, Host} from 'angular2/core'
+import {NgIf, NgClass} from 'angular2/common';
 
 import {Content} from '../content/content';
-import * as util from 'ionic/util';
-import {raf, ready, CSS} from 'ionic/util/dom';
+import * as util from '../../util';
+import {raf, ready, CSS} from '../../util/dom';
 
 
 /**
+ * @name Refresher
+ * @description
  * Allows you to add pull-to-refresh to an Content component.
- *
  * Place it as the first child of your Content or Scroll element.
  *
  * When refreshing is complete, call `refresher.complete()` from your controller.
  *
  *  @usage
+ *  ```html
+ *  <ion-content>
+ *    <ion-refresher (starting)="doStarting()"
+ *                   (refresh)="doRefresh($event, refresher)"
+ *                   (pulling)="doPulling($event, amt)">
+ *    </ion-refresher>
+ *
+ *  </ion-content>
+
+ *  ```
+ *
  *  ```ts
- *  <ion-refresher (starting)="doStarting()" (refresh)="doRefresh($event, refresher)" (pulling)="doPulling($event, amt)">
+ *  export class MyClass {
+ *  constructor(){}
+ *    doRefresh(refresher) {
+ *      console.log('Refreshing!', refresher);
  *
+ *      setTimeout(() => {
+ *        console.log('Pull to refresh complete!', refresher);
+ *        refresher.complete();
+ *      })
+ *    }
  *
- *  doRefresh(refresher) {
- *    console.log('Refreshing!', refresher);
+ *    doStarting() {
+ *      console.log('Pull started!');
+ *    }
  *
- *    setTimeout(() => {
- *      console.log('Pull to refresh complete!', refresher);
- *      refresher.complete();
- *    })
- *  }
- *
- *  doStarting() {
- *    console.log('Pull started!');
- *  }
- *
- *  doPulling(amt) {
- *    console.log('You have pulled', amt);
+ *    doPulling(amt) {
+ *      console.log('You have pulled', amt);
+ *    }
  *  }
  *  ```
- * @demo /docs/v2/demos/refresher/
+ *  @demo /docs/v2/demos/refresher/
+ *
+ *  @property {string} [pullingIcon] - the icon you want to display when you begin to pull down
+ *  @property {string} [pullingText] - the text you want to display when you begin to pull down
+ *  @property {string} [refreshingIcon] - the icon you want to display when performing a refresh
+ *  @property {string} [refreshingText] - the text you want to display when performing a refresh
+ *
+ *  @property {any} (refresh) - the methond on your class you want to perform when you refreshing
+ *  @property {any} (starting) - the methond on your class you want to perform when you start pulling down
+ *  @property {any} (pulling) - the methond on your class you want to perform when you are pulling down
  *
  */
 @Component({
@@ -56,19 +78,19 @@ import {raf, ready, CSS} from 'ionic/util/dom';
   template:
     '<div class="refresher-content" [class.refresher-with-text]="pullingText || refreshingText">' +
       '<div class="icon-pulling">' +
-        '<i class="icon" [ng-class]="pullingIcon"></i>' +
+        '<i class="icon" [ngClass]="pullingIcon"></i>' +
       '</div>' +
-      '<div class="text-pulling" [inner-html]="pullingText" *ng-if="pullingText"></div>' +
+      '<div class="text-pulling" [innerHTML]="pullingText" *ngIf="pullingText"></div>' +
       '<div class="icon-refreshing">' +
-        '<i class="icon" [ng-class]="refreshingIcon"></i>' +
+        '<i class="icon" [ngClass]="refreshingIcon"></i>' +
       '</div>' +
-      '<div class="text-refreshing" [inner-html]="refreshingText" *ng-if="refreshingText"></div>' +
+      '<div class="text-refreshing" [innerHTML]="refreshingText" *ngIf="refreshingText"></div>' +
     '</div>',
   directives: [NgIf, NgClass]
 })
 export class Refresher {
   /**
-   * TODO
+   * @private
    * @param {Content} content  TODO
    * @param {ElementRef} elementRef  TODO
    */
@@ -86,11 +108,15 @@ export class Refresher {
     this.pulling = new EventEmitter('pulling');
   }
 
+  /**
+   * @private
+   */
   ngOnInit() {
     this.initEvents();
   }
 
   /**
+   * @private
    * Initialize touch and scroll event listeners.
    */
   initEvents() {
@@ -129,6 +155,9 @@ export class Refresher {
     sc.addEventListener('scroll', this._handleScrollListener);
   }
 
+  /**
+   * @private
+   */
   onDehydrate() {
     console.log('DEHYDRATION');
     let sc = this.content.scrollElement;
@@ -138,7 +167,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    * @param {TODO} val  TODO
    */
   overscroll(val) {
@@ -147,7 +176,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    * @param {TODO} target  TODO
    * @param {TODO} newScrollTop  TODO
    */
@@ -161,7 +190,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    * @param {TODO} enabled  TODO
    */
   setScrollLock(enabled) {
@@ -183,7 +212,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    */
   activate() {
     //this.ele.classList.add('active');
@@ -192,7 +221,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    */
   deactivate() {
     // give tail 150ms to finish
@@ -205,6 +234,9 @@ export class Refresher {
     }, 150);
   }
 
+  /**
+   * @private
+   */
   start() {
     // startCallback
     this.isRefreshing = true;
@@ -213,7 +245,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    */
   show() {
     // showCallback
@@ -221,7 +253,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    */
   hide() {
     // showCallback
@@ -229,7 +261,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    */
   tail() {
     // tailCallback
@@ -237,7 +269,7 @@ export class Refresher {
   }
 
   /**
-   * TODO
+   * @private
    */
   complete() {
     setTimeout(() => {
@@ -258,7 +290,7 @@ export class Refresher {
   }
 
 /**
- * TODO
+ * @private
  * @param {TODO} Y  TODO
  * @param {TODO} duration  TODO
  * @param {Function} callback  TODO