spacenerdmo/goober-ionic
Archived
1
0
Fork 0
Code Issues 33 Pull requests Packages Projects Releases 12 Wiki Activity

add posts and bookmarks to profile page

Browse source
This commit is contained in:
Morgan McMillian 2018-11-17 22:34:32 -08:00
parent bc995eb707
commit 38f8849972
4 changed files with 113 additions and 92 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/post/post.ts
View file

@ -45,7 +45,7 @@ export class PostComponent {
}
showProfile(user) {
this.navCtrl.push(ProfilePage, {user: user});
this.navCtrl.push(ProfilePage, {user: user, me: this.myUsername});
}
showReplyPost(postData, repType) {

44
src/pages/profile/profile.html
View file

@ -13,7 +13,7 @@
</ion-header>
<ion-content padding>
<ion-content>
<img src="{{ user.content.cover_image.link }}">
@ -26,25 +26,53 @@
<button ion-button item-end disabled>{{ user.you_follow ? "Unfollow" : "Follow" }}</button>
</ion-item>
<p><div [innerHTML]="user.content.html | parser"></div>
<p><hr>
<ion-row>
<div padding [innerHTML]="user.content.html | parser"></div>
<ion-row padding>
<ion-col>
<ion-row>
<button ion-button full disabled>{{ user.counts.posts }}<br/>posts</button>
<button ion-button full clear>{{ user.counts.posts }}<br/>posts</button>
</ion-row>
<ion-row>
<button ion-button full disabled>{{ user.counts.bookmarks }}<br/>stars</button>
<button ion-button full >{{ user.counts.followers }}<br/>followers</button>
</ion-row>
</ion-col>
<ion-col>
<ion-row>
<button ion-button full disabled>{{ user.counts.followers }}<br/>followers</button>
<button ion-button full clear>{{ user.counts.bookmarks }}<br/>stars</button>
</ion-row>
<ion-row>
<button ion-button full disabled>{{ user.counts.following }}<br/>following</button>
<button ion-button full >{{ user.counts.following }}<br/>following</button>
</ion-row>
</ion-col>
</ion-row>
<ion-segment [(ngModel)]="activeTab">
<ion-segment-button value="posts">Posts</ion-segment-button>
<ion-segment-button value="bookmarks">Stars</ion-segment-button>
</ion-segment>
<div [ngSwitch]="activeTab">
<div *ngSwitchCase="'posts'">
<ion-list>
<ion-card *ngFor="let post of posts" color="{{ post.you_are_mentioned ? 'mention' : '' }}">
<post [post]="post" [hideImg]="hideImg" [ccOnReply]="ccOnReply" [myUsername]="myUsername"></post>
</ion-card>
</ion-list>
</div>
<div *ngSwitchCase="'bookmarks'">
<ion-list>
<ion-card *ngFor="let post of bookmarks" color="{{ post.you_are_mentioned ? 'mention' : '' }}">
<post [post]="post" [hideImg]="hideImg" [ccOnReply]="ccOnReply" [myUsername]="myUsername"></post>
</ion-card>
</ion-list>
</div>
<ion-infinite-scroll (ionInfinite)="fetchOlderPosts($event, activeTab)">
<ion-infinite-scroll-content></ion-infinite-scroll-content>
</ion-infinite-scroll>
</div>
</ion-content>

76
src/pages/profile/profile.ts
View file

@ -1,6 +1,8 @@
import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import * as pnut from 'pnut-butter';
/**
* Generated class for the ProfilePage page.
*
@ -15,13 +17,87 @@ import { NavController, NavParams } from 'ionic-angular';
export class ProfilePage {
private user: any;
private posts: Array<Object> = [];
private bookmarks: Array<Object> = [];
private before_id_post: string;
private before_id_stars: string;
private myUsername: string;
constructor(public navCtrl: NavController, public navParams: NavParams) {
this.user = this.navParams.data.user;
this.myUsername = this.navParams.data.me;
}
ionViewDidLoad() {
console.log('ionViewDidLoad ProfilePage');
let params = {
include_deleted: 0,
include_raw: 1,
count: 40
};
pnut.postsFrom(this.user.id, params).then(res => {
this.posts = this.parseData(res.data);
this.before_id_post = res.meta.min_id;
});
pnut.bookmarks(this.user.id, params).then(res => {
this.bookmarks = this.parseData(res.data);
this.before_id_stars = res.meta.min_id;
});
}
fetchOlderPosts(infiniteScroll, stream) {
let before_id = this.before_id_post;
let fetcher = pnut.postsFrom;
if (stream === 'bookmarks') {
before_id = this.before_id_stars;
fetcher = pnut.bookmarks;
}
let params = {
include_deleted: 0,
include_raw: 1,
before_id: before_id,
count: 40
};
fetcher(this.user.id, params).then(res => {
if (res.data.length > 0) {
if (stream === 'posts') {
this.posts.push.apply(this.posts, this.parseData(res.data));
this.before_id_post = res.meta.min_id;
} else if (stream === 'bookmarks') {
this.bookmarks.push.apply(this.bookmarks, this.parseData(res.data));
this.before_id_stars = res.meta.min_id;
}
}
infiniteScroll.complete();
}).catch(err => {
console.log(err);
});
}
parseData(data) {
var pdata = [];
for (var i = 0; i < data.length; i++) {
if (!data[i].is_deleted) {
if (data[i]['repost_of']) {
data[i] = data[i]['repost_of']
var reposted_by_string = "";
for (var j = 0; j < data[i]['reposted_by'].length; j++) {
reposted_by_string = reposted_by_string + data[i]['reposted_by'][j]['username'] + ", ";
}
// data[i]['reposted_by_string'] = "Reposted by: " + reposted_by_string;
}
if (data[i].content) {
for (var k = 0; k < data[i]['content']['entities']['mentions'].length; k++) {
var men = data[i]['content']['entities']['mentions'][k]['text'];
if (this.myUsername === men) {
data[i]['you_are_mentioned'] = true;
}
}
}
pdata.push(data[i]);
}
}
return pdata;
}
}

83
src/pages/stream/stream.html
View file

@ -25,89 +25,6 @@
<ion-list>
<ion-card *ngFor="let post of posts" color="{{ post.you_are_mentioned ? 'mention' : '' }}">
<post [post]="post" [hideImg]="hideImg" [ccOnReply]="ccOnReply" [myUsername]="myUsername"></post>
<!-- <ion-item color="{{ post.you_are_mentioned ? 'mention' : '' }}">
<ion-avatar item-start (click)="showProfile(post.user)">
<img src="{{ post.user.content.avatar_image.link }}">
</ion-avatar>
<h2>{{ post.user.name }}</h2>
<p>@{{ post.user.username }}</p>
<ion-note item-end>
<div text-right>
{{ post.created_at | timeago }}<br/>
{{ post.source.name }}
</div>
</ion-note>
</ion-item>
<ion-card-content>
<div *ngIf="post.is_deleted; else renderBlock"></div>
<ng-template #renderBlock >
<div [innerHTML]="post.content.html | parser"></div>
<div *ngIf="post.raw">
<div *ngFor="let r of post.raw">
<div *ngIf="r.type == 'nl.chimpnut.blog.post'">
<hr>
<div>{{ r.value.body }}</div>
</div>
</div>
</div>
</ng-template>
</ion-card-content>
<div *ngIf="post.raw">
<div *ngFor="let r of post.raw">
<div *ngIf="r.type == 'io.pnut.core.oembed'">
<ion-item>
<div *ngIf="hideImg; then imgbtn else thumbnail"></div>
<ng-template #imgbtn >
<button ion-button icon-start (click)="showImage(r.value.url)">
<ion-icon name="image"></ion-icon>
{{ r.value.title }}
</button>
</ng-template>
<ng-template #thumbnail >
<img src="{{ r.value.thumbnail_url || r.value.url }}" (click)="showImage(r.value.url)">
</ng-template>
</ion-item>
</div>
</div>
</div>
<div *ngIf="post.reposted_by_string">
<ion-item><ion-note>{{ post.reposted_by_string }}</ion-note></ion-item>
</div>
<ion-row>
<ion-col>
<button ion-button icon-left clear small block (click)="showReplyPost(post)">
<ion-icon name="ios-undo"></ion-icon>
</button>
</ion-col>
<ion-col>
<button ion-button icon-left clear small block (click)="showQuotedPost(post)">
<ion-icon name="quote"></ion-icon>
</button>
</ion-col>
<ion-col>
<button ion-button icon-left clear small block (click)="repost(post.id, post.you_reposted)">
<ion-icon name="repeat"></ion-icon>
<div *ngIf="post.counts.reposts > 0">{{ post.counts.reposts }}</div>
</button>
</ion-col>
<ion-col>
<button ion-button icon-left clear small block (click)="bookmark(post.id, post.you_bookmarked)">
<ion-icon name="star"></ion-icon>
<div *ngIf="post.counts.bookmarks > 0">{{ post.counts.bookmarks }}</div>
</button>
</ion-col>
<ion-col>
<button ion-button icon-left clear small block (click)="fetchThread(post.thread_id)">
<ion-icon name="chatboxes"></ion-icon>
<div *ngIf="post.counts.replies > 0">{{ post.counts.replies }}</div>
</button>
</ion-col>
<ion-col>
<button ion-button icon-left clear small block (click)="presentPostMenu($event, post)">
<ion-icon name="more"></ion-icon>
</button>
</ion-col>
</ion-row> -->
</ion-card>
</ion-list>