fetching newer and older posts

src/pages/login/login.ts

@@ -1,7 +1,7 @@
 import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { NavController, NavParams } from 'ionic-angular';
 import { Storage } from '@ionic/storage';
-import { HomePage } from '../home/home';
+import { StreamPage } from '../stream/stream';
 
 import { OauthCordova } from 'ng2-cordova-oauth/platform/cordova';
 // import { OauthBrowser } from 'ng2-cordova-oauth/platform/browser';
@@ -35,7 +35,7 @@ export class LoginPage {
       console.log('RESULT: ' + JSON.stringify(success));
       this.storage.set('token', success['access_token']);
       pnut.token = success['access_token'];
-      this.navCtrl.setRoot(HomePage);
+      this.navCtrl.setRoot(StreamPage, {stream: 'global'});
     }, error=> {
       console.log('ERROR: ' + error);
     });

src/pages/post-details/post-details.ts

@@ -1,5 +1,5 @@
 import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { NavController, NavParams } from 'ionic-angular';
 
 /**
  * Generated class for the PostDetailsPage page.

src/pages/stream/stream.html

@@ -18,6 +18,10 @@
 
 <ion-content>
 
+  <ion-refresher (ionRefresh)="fetchNewerPosts($event)">
+    <ion-refresher-content></ion-refresher-content>
+  </ion-refresher>
+
   <ion-list>
     <ion-card *ngFor="let post of posts">
       <ion-item>
@@ -48,7 +52,7 @@
           </button>
         </ion-col>
         <ion-col>
-          <button ion-button icon-left clear small block>
+          <button ion-button icon-left clear small block (click)="showQuotedPost(post)">
             <ion-icon name="quote"></ion-icon>
           </button>
         </ion-col>
@@ -70,15 +74,19 @@
             <div *ngIf="post.counts.replies > 0">{{ post.counts.replies }}</div>
           </button>
         </ion-col>
-        <ion-col>
+<!--         <ion-col>
           <button ion-button icon-left clear small block>
             <ion-icon name="more"></ion-icon>
           </button>
-        </ion-col>
+        </ion-col> -->
       </ion-row>
     </ion-card>
   </ion-list>
 
+ <ion-infinite-scroll (ionInfinite)="fetchOlderPosts($event)">
+   <ion-infinite-scroll-content></ion-infinite-scroll-content>
+ </ion-infinite-scroll>
+
   <ion-fab right bottom>
     <button ion-fab (click)="showNewPost()">
       <ion-icon name="add"></ion-icon>

src/pages/stream/stream.ts

@@ -1,5 +1,5 @@
 import { Component } from '@angular/core';
-import { ViewController, IonicPage, NavController, NavParams, ModalController } from 'ionic-angular';
+import { ViewController, NavController, NavParams, ModalController } from 'ionic-angular';
 import { PostDetailsPage } from '../post-details/post-details';
 
 import * as pnut from 'pnut-butter';
@@ -17,37 +17,63 @@ import * as pnut from 'pnut-butter';
 export class StreamPage {
 
   title: string;
-  posts: Array<Object> = []
+  posts: Array<Object> = [];
+  since_id: string;
+  before_id: string;
+  fetcher: any;
 
   constructor(public navCtrl: NavController, public navParams: NavParams, public modalCtrl: ModalController) {
     // console.log(JSON.stringify(navParams));
     switch (navParams.data.stream) {
       case 'global':
         this.title = 'Global';
-        this.fetchGlobal();
+        this.fetcher = pnut.global;
+        this.fetchPosts();
         break;
       case 'personal':
         this.title = 'Home';
-        this.fetchPersonal();
+        this.fetcher = pnut.personal;
+        this.fetchPosts();
         break;
     }
   }
 
-  fetchGlobal() {
+  fetchOlderPosts(infiniteScroll) {
-    console.log('-- fetching global stream --');
+    this.fetcher({include_raw: 1, before_id: this.before_id, count: 40}).then(res => {
-    pnut.global({include_raw: 1, count: 50}).then(res => {
+      if (res.data.length > 0) {
-      // console.log(res);
+        this.posts.push.apply(this.posts, res.data);
-      this.posts = res.data;
+        this.before_id = res.meta.min_id;
-      // console.log(this.posts);
+      }
+      console.log('since_id: ' + this.since_id);
+      console.log('before_id: ' + this.before_id);
+      infiniteScroll.complete();
     }).catch(err => {
       console.log(err);
     });
   }
 
-  fetchPersonal() {
+  fetchNewerPosts(refresher) {
-    console.log('-- fetching personal stream --');
+    this.fetcher({include_raw: 1, since_id: this.since_id, count: 40}).then(res => {
-    pnut.personal().then(res => {
+      if (res.data.length > 0) {
+        Array.prototype.unshift.apply(this.posts, res.data);
+        this.since_id = res.meta.max_id;
+      }
+      console.log('since_id: ' + this.since_id);
+      console.log('before_id: ' + this.before_id);
+      refresher.complete();
+    }).catch(err => {
+      console.log(err);
+    });
+  }
+
+  fetchPosts() {
+    console.log('-- fetching global stream --');
+    this.fetcher({include_raw: 1, count: 40}).then(res => {
       this.posts = res.data;
+      this.since_id = res.meta.max_id;
+      this.before_id = res.meta.min_id;
+      console.log('since_id: ' + this.since_id);
+      console.log('before_id: ' + this.before_id);
     }).catch(err => {
       console.log(err);
     });
@@ -112,11 +138,16 @@ export class StreamPage {
   }
 
   showReplyPost(postData) {
-    console.log(postData);
     let newPostModal = this.modalCtrl.create(NewPostModal, {type: 'reply', post: postData});
     newPostModal.present();
   }
 
+  showQuotedPost(postData) {
+    console.log(postData);
+    let newPostModal = this.modalCtrl.create(NewPostModal, {type: 'quote', post: postData});
+    newPostModal.present();
+  }
+
 }
 
 @Component({
@@ -131,7 +162,7 @@ export class StreamPage {
       </button>
     </ion-buttons>
 
-    <ion-title>New Post</ion-title>
+    <ion-title>{{ title }}</ion-title>
 
   </ion-toolbar>
 </ion-header>
@@ -153,6 +184,7 @@ export class StreamPage {
 `
 })
 export class NewPostModal {
+  title: string;
   replyid: string;
   ptext: string;
   options: Object;
@@ -168,8 +200,13 @@ export class NewPostModal {
           this.ptext = this.ptext + this.parseMentions(navParams.data.post.content.entities.mentions);
         }
       }
+      this.title = "Reply to " + navParams.data.post.user.username
+    } else if (navParams.data.type === 'quote') {
+      this.ptext = " >> @" + navParams.data.post.user.username + ": " + navParams.data.post.content.text;
+      this.title = "New Post";
+    } else {
+      this.title = "New Post";
     }
-    console.log('replying to ' + this.replyid);
   }
 
   dismiss() {