new post and reply to functions
This commit is contained in:
parent
fe25cf647e
commit
d799f6023d
4 changed files with 139 additions and 18 deletions
|
@ -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,
|
||||||
|
|
20
src/pages/stream/new-post.html
Normal file
20
src/pages/stream/new-post.html
Normal 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>
|
|
@ -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>
|
||||||
|
|
|
@ -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) {
|
||||||
for (var i = 0; i < this.posts.length; i++) {
|
pnut.post(postid, {include_raw: 1}).then(res => {
|
||||||
if (this.posts[i]['id'] === postData.id) {
|
for (var i = 0; i < this.posts.length; i++) {
|
||||||
this.posts[i] = postData;
|
if (this.posts[i]['id'] === postid) {
|
||||||
break;
|
this.posts[i] = res.data;
|
||||||
|
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 "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Reference in a new issue