Pull to refresh shell

ionic/components.js

@@ -16,6 +16,7 @@ export * from 'ionic/components/nav/nav'
 export * from 'ionic/components/radio/radio-button'
 export * from 'ionic/components/radio/radio-group'
 export * from 'ionic/components/search-bar/search-bar'
+export * from 'ionic/components/scroll/pull-to-refresh'
 export * from 'ionic/components/split-view/split-view'
 export * from 'ionic/components/switch/switch'
 export * from 'ionic/components/tabs/tabs'

ionic/components/content/test/basic/main.html

@@ -1,5 +1,5 @@
 
-<ion-view nav-title="Checkboxes">
+<ion-view nav-title="Content">
 
   <ion-content>
 

ionic/components/content/test/pull-to-refresh/main.html

@@ -0,0 +1,27 @@
+<ion-view nav-title="Pull to refresh">
+
+  <ion-content ion-refresher>
+
+    <div id="counter"></div>
+
+    <f></f>
+    <f></f>
+    <f></f>
+    <f></f>
+    <f></f>
+
+  </ion-content>
+
+</ion-view>
+<style>
+  f { display: block; height: 400px; width: 100%; background-color: #387ef5; margin-bottom: 15px; }
+  #counter {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    padding: 20px;
+    background-color: rgba(0,0,0,0.4);
+    z-index: 5;
+  }
+</style>

ionic/components/content/test/pull-to-refresh/main.js

@@ -0,0 +1,22 @@
+import {Descendent, NgElement, Component, View as NgView, bootstrap} from 'angular2/angular2';
+import {View} from 'ionic/components/view/view';
+import {Content} from 'ionic/components/content/content';
+import {Icon} from 'ionic/components/icon/icon';
+import {Checkbox} from 'ionic/components/checkbox/checkbox';
+import {List} from 'ionic/components/list/list';
+import {Refresher} from 'ionic/components/scroll/pull-to-refresh';
+
+@Component({ selector: '[ion-app]' })
+@NgView({
+  templateUrl: 'main.html',
+  directives: [View, Content, Icon, Checkbox, List, Refresher]
+})
+class IonicApp {
+  constructor(
+    @NgElement() element:NgElement
+  ) {
+    console.log('IonicApp Start')
+  }
+}
+
+bootstrap(IonicApp)

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

@@ -0,0 +1,19 @@
+import {NgElement, Decorator, Component, View as NgView, PropertySetter} from 'angular2/angular2';
+
+@Decorator({
+  selector: '[ion-refresher]'
+})
+export class Refresher {
+  constructor(
+    @NgElement() element:NgElement
+  ) {
+    this.domElement = element.domElement;
+    this.domElement.classList.add('content');
+
+    console.log(this.domElement);
+
+    this.domElement.children[0].addEventListener('scroll', function(e) {
+      console.log('CONTENT: scroll', e.target.scrollTop);
+    });
+  }
+}