add profile menu with mute and block functions

src/app/app.module.ts

@@ -11,6 +11,7 @@ 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 { ProfileMenu } from '../pages/profile/profile-menu';
 import { UserListPage } from '../pages/user-list/user-list';
 import { PostComponent } from '../components/post/post';
 
@@ -36,6 +37,7 @@ import { ParserPipe } from '../pipes/parser/parser';
     TimeagoPipe,
     NewPostModal,
     PostMenu,
+    ProfileMenu,
     ParserPipe,
     PostComponent
   ],
@@ -55,7 +57,8 @@ import { ParserPipe } from '../pipes/parser/parser';
     ProfilePage,
     UserListPage,
     NewPostModal,
-    PostMenu
+    PostMenu,
+    ProfileMenu
   ],
   providers: [
     SplashScreen,

src/components/post/post.html

@@ -1,6 +1,6 @@
 
-<ion-item color="{{ post.you_are_mentioned ? 'mention' : '' }}">
-  <ion-avatar item-start (click)="showProfile(post.user)">
+<ion-item color="{{ post.you_are_mentioned ? 'mention' : '' }}" (click)="showProfile(post.user)">
+  <ion-avatar item-start >
     <img src="{{ post.user.content.avatar_image.link }}">
   </ion-avatar>
   <h2>{{ post.user.name }}</h2>

src/pages/profile/profile-menu.ts

@@ -0,0 +1,70 @@
+import { Component } from '@angular/core';
+import { ViewController, NavParams,  ToastController } from 'ionic-angular';
+import { Events } from 'ionic-angular';
+
+import * as pnut from 'pnut-butter';
+
+@Component({
+  template: `
+<ion-list>
+  <button ion-item (click)="browse()">Open in browser</button>
+  <button ion-item >Block</button>
+  <button ion-item >Mute</button>
+</ion-list>
+`
+})
+export class ProfileMenu {
+
+  private userid: string;
+  private username: string;
+
+  constructor(public navParams: NavParams, public viewCtrl: ViewController,
+    public toastCtrl: ToastController, public events: Events) {
+      this.userid = this.navParams.data.userid;
+      this.username = this.navParams.data.username;
+  }
+
+  browse() {
+    window.open('https://pnut.io/@' + this.username, '_system');
+    this.close();
+  }
+
+  mute() {
+    if (this.user.you_muted) {
+      pnut.unmute(this.userid).then(res => {
+        this.presentToast('User unmuted');
+      });
+    } else {
+      pnut.mute(this.userid).then(res => {
+        this.presentToast('User muted');
+      });
+    }
+    this.close();
+  }
+
+  block() {
+    if (this.user.you_blocked) {
+      pnut.unblock(this.userid).then(res => {
+        this.presentToast('User unblocked');
+      });
+    } else {
+      pnut.block(this.userid).then(res => {
+        this.presentToast('User blocked');
+      });
+    }
+    this.close();
+  }
+
+  presentToast(text) {
+    let toast = this.toastCtrl.create({
+      position: 'top',
+      message: text,
+      duration: 2000
+    });
+    toast.present();
+  }
+
+  close() {
+    this.viewCtrl.dismiss();
+  }
+}

src/pages/profile/profile.html

@@ -8,6 +8,11 @@
 
   <ion-navbar>
     <ion-title>{{ user.username }}</ion-title>
+    <ion-buttons end>
+      <button ion-button icon-only (click)="presentProfileMenu($event)">
+        <ion-icon name="more"></ion-icon>
+      </button>
+    </ion-buttons>
   </ion-navbar>
 
 </ion-header>
@@ -24,7 +29,7 @@
     <h2>{{ user.name }}</h2>
     <p>@{{ user.username }}</p>
     <ion-col item-end text-right>
-      <button ion-button disabled>{{ user.you_follow ? "Unfollow" : "Follow" }}</button>
+      <button ion-button (click)="followUser()">{{ user.you_follow ? "Unfollow" : "Follow" }}</button>
       <ion-note>{{ user.follows_you ? "Follows you" : ""}}</ion-note>
     </ion-col>
   </ion-item>

src/pages/profile/profile.ts

@@ -1,6 +1,7 @@
 import { Component } from '@angular/core';
-import { NavController, NavParams } from 'ionic-angular';
+import { NavController, NavParams, PopoverController, ToastController } from 'ionic-angular';
 import { UserListPage } from '../user-list/user-list';
+import { ProfileMenu } from './profile-menu'
 
 import * as pnut from 'pnut-butter';
 
@@ -25,15 +26,14 @@ export class ProfilePage {
   private myUsername: string;
   public activeTab: string = 'posts';
 
-  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  constructor(public navCtrl: NavController, public navParams: NavParams,
+    public popoverCtrl: PopoverController, public toastCtrl: ToastController) {
     this.user = this.navParams.data.user;
     this.myUsername = this.navParams.data.me;
   }
 
   ionViewDidLoad() {
     console.log('ionViewDidLoad ProfilePage');
-    // console.log(JSON.stringify(this.user));
-    // console.log('-----');
     let params = {
       include_deleted: 0,
       include_raw: 1,
@@ -114,4 +114,34 @@ export class ProfilePage {
       list: list});
   }
 
+  followUser() {
+    if (this.user.you_follow) {
+      pnut.unfollow(this.user.id).then(res => {
+        this.user = res.data;
+        this.presentToast('User unfollowed');
+      });
+    } else {
+      pnut.follow(this.user.id).then(res => {
+        this.user = res.data;
+        this.presentToast('User followed');
+      });
+    }
+  }
+
+  presentProfileMenu(myEvent) {
+    let popover = this.popoverCtrl.create(ProfileMenu, {
+      userid: this.user.id,
+      username: this.user.username});
+    popover.present({ev: myEvent});
+  }
+
+  presentToast(text) {
+    let toast = this.toastCtrl.create({
+      position: 'top',
+      message: text,
+      duration: 2000
+    });
+    toast.present();
+  }
+
 }

src/pages/user-list/user-list.html

@@ -21,10 +21,10 @@
       </ion-avatar>
       <h2>{{ user.name }}</h2>
       <p>@{{ user.username }}</p>
-      <ion-col item-end text-right>
+      <!-- <ion-col item-end text-right>
         <button ion-button disabled>{{ user.you_follow ? "Unfollow" : "Follow" }}</button>
         <ion-note>{{ user.follows_you ? "Follows you" : ""}}</ion-note>
-      </ion-col>
+      </ion-col> -->
     </ion-item>
   </ion-list>