Add Profile page issue #32

src/app/app.module.ts

@@ -10,6 +10,7 @@ import { NewPostModal } from '../pages/stream/new-post';
 import { ThreadPage } from '../pages/thread/thread';
 import { SettingsPage } from '../pages/settings/settings';
 import { AboutPage } from '../pages/about/about';
+import { ProfilePage } from '../pages/profile/profile';
 
 import { SplashScreen } from '@ionic-native/splash-screen';
 import { IonicStorageModule } from '@ionic/storage';
@@ -28,6 +29,7 @@ import { ParserPipe } from '../pipes/parser/parser';
     ThreadPage,
     SettingsPage,
     AboutPage,
+    ProfilePage,
     TimeagoPipe,
     NewPostModal,
     PostMenu,
@@ -46,6 +48,7 @@ import { ParserPipe } from '../pipes/parser/parser';
     ThreadPage,
     SettingsPage,
     AboutPage,
+    ProfilePage,
     NewPostModal,
     PostMenu
   ],

src/pages/profile/profile.html

@@ -0,0 +1,43 @@
+<!--
+  Generated template for the ProfilePage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>{{ user.username }}</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+
+  <img src="{{ user.content.cover_image.link }}">
+
+  <ion-item>
+    <ion-avatar item-start>
+      <img src="{{ user.content.avatar_image.link }}">
+    </ion-avatar>
+    <h2>{{ user.name }}</h2>
+    <p>@{{ user.username }}</p>
+    <button ion-button item-end>{{ user.you_follow ? "Unfollow" : "Follow" }}</button>
+  </ion-item>
+
+  <p><div [innerHTML]="user.content.html | parser"></div>
+
+  <p>
+  <ion-row>
+    <ion-col text-center>
+      <button ion-button >{{ user.counts.posts }}<br/>posts</button>
+      <button ion-button >{{ user.counts.followers }}<br/>followers</button>
+      <button ion-button >{{ user.counts.following }}<br/>following</button>
+      <button ion-button >{{ user.counts.bookmarks }}<br/>stars</button>
+    </ion-col>
+  </ion-row>
+
+
+
+</ion-content>

src/pages/profile/profile.scss

@@ -0,0 +1,14 @@
+page-profile {
+  .item-md ion-avatar img {
+    border-radius: 10px;
+    background-color: #e9e9e9;
+  }
+  .item-wp ion-avatar img {
+    border-radius: 10px;
+    background-color: #e9e9e9;
+  }
+  .item-ios ion-avatar img {
+      border-radius: 10px;
+    background-color: #e9e9e9;
+  }
+}

src/pages/profile/profile.ts

@@ -0,0 +1,27 @@
+import { Component } from '@angular/core';
+import { NavController, NavParams } from 'ionic-angular';
+
+/**
+ * Generated class for the ProfilePage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@Component({
+  selector: 'page-profile',
+  templateUrl: 'profile.html',
+})
+export class ProfilePage {
+
+  private user: any;
+
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
+    this.user = this.navParams.data.user;
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad ProfilePage');
+  }
+
+}

src/pages/stream/stream.html

@@ -25,7 +25,7 @@
   <ion-list>
     <ion-card *ngFor="let post of posts" color="{{ post.you_are_mentioned ? 'mention' : '' }}">
       <ion-item color="{{ post.you_are_mentioned ? 'mention' : '' }}">
-        <ion-avatar item-start>
+        <ion-avatar item-start (click)="showProfile(post.user)">
           <img src="{{ post.user.content.avatar_image.link }}">
         </ion-avatar>
         <h2>{{ post.user.name }}</h2>

src/pages/stream/stream.scss

@@ -1,14 +1,14 @@
 page-stream {
   .item-md ion-avatar img {
-    border-radius: 0;
+    border-radius: 10px;
     background-color: #e9e9e9;
   }
   .item-wp ion-avatar img {
-    border-radius: 0;
+    border-radius: 10px;
     background-color: #e9e9e9;
   }
   .item-ios ion-avatar img {
-    border-radius: 0;
+    border-radius: 10px;
     background-color: #e9e9e9;
   }
 }

src/pages/stream/stream.ts

@@ -4,6 +4,7 @@ import { ThreadPage } from '../thread/thread';
 import { Storage } from '@ionic/storage';
 import { Events } from 'ionic-angular';
 import { LoginPage } from '../login/login';
+import { ProfilePage } from '../profile/profile';
 import { PostMenu } from '../stream/post-menu';
 import { NewPostModal } from '../stream/new-post';
 
@@ -311,6 +312,10 @@ export class StreamPage {
     window.open(url, '_blank');
   }
 
+  showProfile(user) {
+    this.navCtrl.push(ProfilePage, {user: user});
+  }
+
   presentToast(text) {
     let toast = this.toastCtrl.create({
       position: 'top',