new post and reply to functions

This commit is contained in:
Morgan McMillian 2017-06-10 19:12:54 -07:00
parent fe25cf647e
commit d799f6023d
4 changed files with 139 additions and 18 deletions

View file

@ -6,7 +6,7 @@ import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home'; import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list'; import { ListPage } from '../pages/list/list';
import { LoginPage } from '../pages/login/login'; import { LoginPage } from '../pages/login/login';
import { StreamPage } from '../pages/stream/stream'; import { StreamPage, NewPostModal } from '../pages/stream/stream';
import { PostDetailsPage } from '../pages/post-details/post-details'; import { PostDetailsPage } from '../pages/post-details/post-details';
import { StatusBar } from '@ionic-native/status-bar'; import { StatusBar } from '@ionic-native/status-bar';
@ -22,7 +22,8 @@ import { TimeagoPipe } from '../pipes/timeago/timeago';
LoginPage, LoginPage,
StreamPage, StreamPage,
PostDetailsPage, PostDetailsPage,
TimeagoPipe TimeagoPipe,
NewPostModal
], ],
imports: [ imports: [
BrowserModule, BrowserModule,
@ -36,7 +37,8 @@ import { TimeagoPipe } from '../pipes/timeago/timeago';
ListPage, ListPage,
LoginPage, LoginPage,
StreamPage, StreamPage,
PostDetailsPage PostDetailsPage,
NewPostModal
], ],
providers: [ providers: [
StatusBar, StatusBar,

View file

@ -0,0 +1,20 @@
<ion-header>
<ion-toolbar>
<ion-title>New Post</ion-title>
<ion-buttons start>
<button ion-button (click)="dismiss()">
<span ion-text color="primary" showWhen="ios">Cancel</span>
<ion-icon name="md-close" showWhen="android,windows"></ion-icon>
</button>
</ion-buttons>
<ion-buttons end>
<button ion-button>
<span ion-text color="primary" showWhen="ios">Post</span>
<ion-icon name="send" showWhen="android,windows"></ion-icon>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content>
<p>Blarp</p>
</ion-content>

View file

@ -26,7 +26,10 @@
</ion-avatar> </ion-avatar>
<h2>{{ post.user.name }}</h2> <h2>{{ post.user.name }}</h2>
<p>@{{ post.user.username }}</p> <p>@{{ post.user.username }}</p>
<ion-note item-end>{{ post.created_at | timeago }}</ion-note> <ion-note item-end right>
{{ post.created_at | timeago }}<br/>
{{ post.source.name }}
</ion-note>
</ion-item> </ion-item>
<ion-card-content> <ion-card-content>
<p>{{ post.is_deleted ? '{post deleted}' : post.content.text }}</p> <p>{{ post.is_deleted ? '{post deleted}' : post.content.text }}</p>
@ -40,7 +43,7 @@
</div> </div>
<ion-row> <ion-row>
<ion-col> <ion-col>
<button ion-button icon-left clear small block> <button ion-button icon-left clear small block (click)="showReplyPost(post)">
<ion-icon name="text"></ion-icon> <ion-icon name="text"></ion-icon>
</button> </button>
</ion-col> </ion-col>
@ -77,7 +80,7 @@
</ion-list> </ion-list>
<ion-fab right bottom> <ion-fab right bottom>
<button ion-fab> <button ion-fab (click)="showNewPost()">
<ion-icon name="add"></ion-icon> <ion-icon name="add"></ion-icon>
</button> </button>
</ion-fab> </ion-fab>

View file

@ -1,5 +1,5 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular'; import { ViewController, IonicPage, NavController, NavParams, ModalController } from 'ionic-angular';
import { PostDetailsPage } from '../post-details/post-details'; import { PostDetailsPage } from '../post-details/post-details';
import * as pnut from 'pnut-butter'; import * as pnut from 'pnut-butter';
@ -20,7 +20,7 @@ export class StreamPage {
title: string; title: string;
posts: Array<Object> = [] posts: Array<Object> = []
constructor(public navCtrl: NavController, public navParams: NavParams) { constructor(public navCtrl: NavController, public navParams: NavParams, public modalCtrl: ModalController) {
// console.log(JSON.stringify(navParams)); // console.log(JSON.stringify(navParams));
switch (navParams.data.stream) { switch (navParams.data.stream) {
case 'global': case 'global':
@ -62,14 +62,14 @@ export class StreamPage {
if (bookmarked) { if (bookmarked) {
pnut.deleteBookmark(postid).then(res => { pnut.deleteBookmark(postid).then(res => {
console.log(res); console.log(res);
this.updatePost(res.data); this.updatePost(res.data.id);
}).catch(err => { }).catch(err => {
console.log(err); console.log(err);
}); });
} else { } else {
pnut.bookmark(postid).then(res => { pnut.bookmark(postid).then(res => {
console.log(res); console.log(res);
this.updatePost(res.data); this.updatePost(res.data.id);
}).catch(err => { }).catch(err => {
console.log(err); console.log(err);
}); });
@ -80,27 +80,123 @@ export class StreamPage {
if (reposted) { if (reposted) {
pnut.deleteRepost(postid).then(res => { pnut.deleteRepost(postid).then(res => {
console.log(res); console.log(res);
this.updatePost(res.data); this.updatePost(res.data.id);
}).catch(err => { }).catch(err => {
console.log(err); console.log(err);
}); });
} else { } else {
pnut.repost(postid).then(res => { pnut.repost(postid).then(res => {
console.log(res); console.log(res);
this.updatePost(res.data); this.updatePost(res.data.id);
}).catch(err => { }).catch(err => {
console.log(err); console.log(err);
}); });
} }
} }
updatePost(postData) { updatePost(postid) {
pnut.post(postid, {include_raw: 1}).then(res => {
for (var i = 0; i < this.posts.length; i++) { for (var i = 0; i < this.posts.length; i++) {
if (this.posts[i]['id'] === postData.id) { if (this.posts[i]['id'] === postid) {
this.posts[i] = postData; this.posts[i] = res.data;
break; break;
} }
} }
}).catch(err => {
console.log(err);
});
}
showNewPost() {
let newPostModal = this.modalCtrl.create(NewPostModal);
newPostModal.present();
}
showReplyPost(postData) {
console.log(postData);
let newPostModal = this.modalCtrl.create(NewPostModal, {type: 'reply', post: postData});
newPostModal.present();
} }
} }
@Component({
// templateUrl: 'new-post.html'
template: `
<ion-header>
<ion-toolbar>
<ion-buttons start>
<button ion-button (click)="dismiss()">
<span ion-text color="primary">Cancel</span>
</button>
</ion-buttons>
<ion-title>New Post</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-card>
<ion-card-content>
<ion-textarea [(ngModel)]="ptext"></ion-textarea>
</ion-card-content>
<ion-row justify-content-end>
<ion-col col-2>
<button ion-button (click)="send()">
<ion-icon name="send"></ion-icon>
</button>
</ion-col>
</ion-row>
</ion-card>
</ion-content>
`
})
export class NewPostModal {
replyid: string;
ptext: string;
options: Object;
constructor(public navParams: NavParams, public viewCtrl: ViewController) {
console.log(this.navParams);
if (navParams.data.type === 'reply') {
this.replyid = navParams.data.post.id;
this.options = {replyTo: this.replyid};
this.ptext = "@" + navParams.data.post.user.username + " ";
if (navParams.data.post.content.entities) {
if (navParams.data.post.content.entities.mentions) {
this.ptext = this.ptext + this.parseMentions(navParams.data.post.content.entities.mentions);
}
}
}
console.log('replying to ' + this.replyid);
}
dismiss() {
this.viewCtrl.dismiss();
}
send() {
console.log(this.ptext);
pnut.createPost(this.ptext, this.options).then(res => {
console.log(res);
}).catch(err => {
console.log(err);
});
this.viewCtrl.dismiss();
}
parseMentions(mentions) {
let mtext = ""
for(var i = 0; i < mentions.length; i++) {
let mu = mentions[i].text;
mtext += "@" + mu + " ";
}
if (mtext.length > 0) {
return mtext;
} else {
return "";
}
}
}