Browse Source

refactor pages

Carsten Porth 5 years ago
parent
commit
b19b295b70

+ 5 - 9
app/src/pages/home/home.module.ts

@@ -1,13 +1,9 @@
-import { NgModule } from '@angular/core';
-import { IonicPageModule } from 'ionic-angular';
-import { HomePage } from './home';
+import { NgModule } from "@angular/core";
+import { IonicPageModule } from "ionic-angular";
+import { HomePage } from "./home";
 
 @NgModule({
-  declarations: [
-    HomePage,
-  ],
-  imports: [
-    IonicPageModule.forChild(HomePage),
-  ],
+  declarations: [HomePage],
+  imports: [IonicPageModule.forChild(HomePage)]
 })
 export class HomePageModule {}

+ 0 - 3
app/src/pages/home/home.scss

@@ -1,3 +0,0 @@
-page-home {
-
-}

+ 22 - 21
app/src/pages/home/home.ts

@@ -1,12 +1,17 @@
-import { Component } from '@angular/core';
-import { IonicPage, NavController, MenuController, InfiniteScroll } from 'ionic-angular';
-import { TwitterApiProvider } from '../../providers/twitter-api/twitter-api';
-import { WriteTweetPage } from '../write-tweet/write-tweet';
+import { Component } from "@angular/core";
+import {
+  IonicPage,
+  NavController,
+  MenuController,
+  InfiniteScroll
+} from "ionic-angular";
+import { TwitterApiProvider } from "../../providers/twitter-api/twitter-api";
+import { WriteTweetPage } from "../write-tweet/write-tweet";
 
 @IonicPage()
 @Component({
-  selector: 'page-home',
-  templateUrl: 'home.html'
+  selector: "page-home",
+  templateUrl: "home.html"
 })
 export class HomePage {
   menuController: MenuController;
@@ -15,35 +20,31 @@ export class HomePage {
   constructor(
     public navCtrl: NavController,
     private twitter: TwitterApiProvider,
-    private menuCtrl: MenuController) {
-  }
+    private menuCtrl: MenuController
+  ) {}
 
   ionViewDidLoad() {
-    this.menuCtrl.enable(true, 'sideNav');
-
+    this.menuCtrl.enable(true, "sideNav");
   }
 
   ionViewDidEnter() {
-    this.twitter.fetchHomeFeed()
-      .then(res => {
-        this.data = res.data;
-      });
+    this.twitter.fetchHomeFeed().then(res => (this.data = res.data));
   }
 
   doRefresh(refresher) {
-    this.twitter.fetchHomeFeed()
-      .then(res => {
-        this.data = res.data;
-        refresher.complete();
-      })
+    this.twitter.fetchHomeFeed().then(res => {
+      this.data = res.data;
+      refresher.complete();
+    });
   }
 
   loadMore(infiniteScroll: InfiniteScroll) {
-    this.twitter.fetchHomeFeedSince(this.data[this.data.length - 1].id)
+    this.twitter
+      .fetchHomeFeedSince(this.data[this.data.length - 1].id)
       .then(res => {
         this.data = this.data.concat(res.data);
         infiniteScroll.complete();
-      })
+      });
   }
 
   writeTweet() {

+ 5 - 9
app/src/pages/login/login.module.ts

@@ -1,13 +1,9 @@
-import { NgModule } from '@angular/core';
-import { IonicPageModule } from 'ionic-angular';
-import { LoginPage } from './login';
+import { NgModule } from "@angular/core";
+import { IonicPageModule } from "ionic-angular";
+import { LoginPage } from "./login";
 
 @NgModule({
-  declarations: [
-    LoginPage,
-  ],
-  imports: [
-    IonicPageModule.forChild(LoginPage),
-  ],
+  declarations: [LoginPage],
+  imports: [IonicPageModule.forChild(LoginPage)]
 })
 export class LoginPageModule {}

+ 0 - 1
app/src/pages/profile/profile.html

@@ -12,7 +12,6 @@
 
 </ion-header>
 
-
 <ion-content>
   <profile-header [user]="user"></profile-header>
   <feed [data]="tweets" (onRefresh)="doRefresh($event)" (onLoadMore)="loadMore($event)"></feed>

+ 5 - 9
app/src/pages/profile/profile.module.ts

@@ -1,13 +1,9 @@
-import { NgModule } from '@angular/core';
-import { IonicPageModule } from 'ionic-angular';
-import { ProfilePage } from './profile';
+import { NgModule } from "@angular/core";
+import { IonicPageModule } from "ionic-angular";
+import { ProfilePage } from "./profile";
 
 @NgModule({
-  declarations: [
-    ProfilePage,
-  ],
-  imports: [
-    IonicPageModule.forChild(ProfilePage)
-  ],
+  declarations: [ProfilePage],
+  imports: [IonicPageModule.forChild(ProfilePage)]
 })
 export class ProfilePageModule {}

+ 0 - 3
app/src/pages/profile/profile.scss

@@ -1,3 +0,0 @@
-page-profile {
-
-}

+ 27 - 25
app/src/pages/profile/profile.ts

@@ -1,6 +1,11 @@
-import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams, InfiniteScroll } from 'ionic-angular';
-import { TwitterApiProvider } from '../../providers/twitter-api/twitter-api';
+import { Component } from "@angular/core";
+import {
+  IonicPage,
+  NavController,
+  NavParams,
+  InfiniteScroll
+} from "ionic-angular";
+import { TwitterApiProvider } from "../../providers/twitter-api/twitter-api";
 
 /**
  * Generated class for the ProfilePage page.
@@ -11,50 +16,47 @@ import { TwitterApiProvider } from '../../providers/twitter-api/twitter-api';
 
 @IonicPage()
 @Component({
-  selector: 'page-profile',
-  templateUrl: 'profile.html',
+  selector: "page-profile",
+  templateUrl: "profile.html"
 })
 export class ProfilePage {
-
   userId: string;
   user: any = [];
+
   tweets: any[];
 
   constructor(
     public navCtrl: NavController,
     public navParams: NavParams,
     private twitter: TwitterApiProvider
-  ) {
-  }
+  ) {}
 
   ionViewDidLoad() {
-    this.userId = this.navParams.get('userId');
+    this.userId = this.navParams.get("userId");
 
-    this.twitter.fetchUser(this.userId)
-      .then(res => {
-        console.log(res);
-        this.user = res;
-      });
+    this.twitter.fetchUser(this.userId).then(res => (this.user = res));
 
-    this.twitter.fetchUserTimeline(this.userId)
-      .then(res => {
-        this.tweets = res;
-      })
+    this.twitter
+      .fetchUserTimeline(this.userId)
+      .then(res => (this.tweets = res));
   }
 
   doRefresh(refresher) {
-    this.twitter.fetchUserTimeline(this.userId)
-      .then(res => {
-        this.tweets = res;
-        refresher.complete();
-      })
+    this.twitter.fetchUserTimeline(this.userId).then(res => {
+      this.tweets = res;
+      refresher.complete();
+    });
   }
 
   loadMore(infiniteScroll: InfiniteScroll) {
-    this.twitter.fetchUserTimelineSince(this.userId, this.tweets[this.tweets.length - 1].id)
+    this.twitter
+      .fetchUserTimelineSince(
+        this.userId,
+        this.tweets[this.tweets.length - 1].id
+      )
       .then(res => {
         this.tweets = this.tweets.concat(res);
         infiniteScroll.complete();
-      })
+      });
   }
 }

+ 2 - 1
app/src/pages/settings/settings.html

@@ -20,7 +20,8 @@
   <ion-card>
     <ion-card-header>Encryption</ion-card-header>
     <ion-card-content>
-      <p>To protect your privacy, all data send to the P2P network will be encrypted. Therefore you need to enter or generate a pair of keys. If you run the app on multiple devices, please enter everywhere the same pair of keys.</p>
+      <p>To protect your privacy, all data send to the P2P network will be encrypted. Therefore you need to enter or generate
+        a pair of keys. If you run the app on multiple devices, please enter everywhere the same pair of keys.</p>
       <button ion-button block>Generate keys</button>
       <ion-label color="primary" stacked>Public Key:</ion-label>
       <ion-textarea [(ngModel)]="privateKey"></ion-textarea>

+ 12 - 24
app/src/pages/settings/settings.ts

@@ -1,13 +1,12 @@
-import { Component } from '@angular/core';
-import { NavController, ToastController } from 'ionic-angular';
-import { Storage } from '@ionic/storage';
+import { Component } from "@angular/core";
+import { NavController, ToastController } from "ionic-angular";
+import { Storage } from "@ionic/storage";
 
 @Component({
-  selector: 'page-settings',
-  templateUrl: 'settings.html'
+  selector: "page-settings",
+  templateUrl: "settings.html"
 })
 export class SettingsPage {
-
   keywords: string;
   privateKey: string;
   publicKey: string;
@@ -17,24 +16,13 @@ export class SettingsPage {
     public toastCtrl: ToastController,
     private storage: Storage
   ) {
-    this.loadValuesFromStorage()
+    this.loadValuesFromStorage();
   }
 
-  loadValuesFromStorage() {
-    this.storage.get("privateKey")
-      .then(value => {
-        this.privateKey = value;
-      })
-
-    this.storage.get("publicKey")
-      .then(value => {
-        this.publicKey = value;
-      })
-
-    this.storage.get("keywords")
-      .then(value => {
-        this.keywords = value;
-      })
+  async loadValuesFromStorage() {
+    this.privateKey = await this.storage.get("privateKey");
+    this.publicKey = await this.storage.get("publicKey");
+    this.keywords = await this.storage.get("keywords");
   }
 
   save() {
@@ -43,8 +31,8 @@ export class SettingsPage {
     this.storage.set("keywords", this.keywords);
 
     const toast = this.toastCtrl.create({
-      message: 'Successfully saved!',
-      position: 'bottom',
+      message: "Successfully saved!",
+      position: "bottom",
       duration: 3000
     });
     toast.present();

+ 10 - 10
app/src/pages/write-tweet/write-tweet.html

@@ -22,18 +22,18 @@
 
     <div class="actions">
       <span class="progress">
-          <svg width="20" height="20" class="progress-circle">
-              <circle class="background-stroke" cx="10" cy="10" r="8"></circle>
-              <circle class="progress-stroke" cx="10" cy="10" r="8" transform="rotate(-90, 10, 10)" [style.strokeDashoffset]="tweetCharProgress"></circle>
-            </svg>
-      
-            <span class="progress-stats">{{ (tweet.value.text).length }}/140</span>
+        <svg width="20" height="20" class="progress-circle">
+          <circle class="background-stroke" cx="10" cy="10" r="8"></circle>
+          <circle class="progress-stroke" cx="10" cy="10" r="8" transform="rotate(-90, 10, 10)" [style.strokeDashoffset]="tweetCharProgress"></circle>
+        </svg>
+
+        <span class="progress-stats">{{ (tweet.value.text).length }}/140</span>
       </span>
-      
+
       <span class="network-switch">
-          <ion-icon name="logo-twitter"></ion-icon>
-          <ion-toggle checked="false" formControlName="p2p" color="dark"></ion-toggle>
-          <ion-icon name="glasses"></ion-icon>
+        <ion-icon name="logo-twitter"></ion-icon>
+        <ion-toggle checked="false" formControlName="p2p" color="dark"></ion-toggle>
+        <ion-icon name="glasses"></ion-icon>
       </span>
 
       <button ion-button type="submit" [disabled]="!tweet.valid" class="submit-tweet">tweet!</button>

+ 5 - 9
app/src/pages/write-tweet/write-tweet.module.ts

@@ -1,13 +1,9 @@
-import { NgModule } from '@angular/core';
-import { IonicPageModule } from 'ionic-angular';
-import { WriteTweetPage } from './write-tweet';
+import { NgModule } from "@angular/core";
+import { IonicPageModule } from "ionic-angular";
+import { WriteTweetPage } from "./write-tweet";
 
 @NgModule({
-  declarations: [
-    WriteTweetPage,
-  ],
-  imports: [
-    IonicPageModule.forChild(WriteTweetPage),
-  ],
+  declarations: [WriteTweetPage],
+  imports: [IonicPageModule.forChild(WriteTweetPage)]
 })
 export class WriteTweetPageModule {}

+ 34 - 34
app/src/pages/write-tweet/write-tweet.scss

@@ -1,37 +1,37 @@
 page-write-tweet {
-    .padding-0 {
-        padding: 0;
+  .padding-0 {
+    padding: 0;
+  }
+  .actions {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    .progress {
+      display: flex;
+      align-items: center;
+      .progress-stats {
+        margin-left: 5px;
+      }
+      .background-stroke,
+      .progress-stroke {
+        fill: transparent;
+        stroke-width: 2;
+        stroke-dasharray: 50.2654825;
+        transition: stroke-dashoffset 0.5s;
+        -webkit-animation-play-state: running;
+      }
+      .background-stroke {
+        stroke: #ddd;
+      }
+      .progress-stroke {
+        stroke: blue;
+      }
     }
-    .actions {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        justify-content: space-between;
-        .progress {
-            display: flex;
-            align-items: center;
-            .progress-stats {
-                margin-left: 5px;
-            }
-            .background-stroke,
-            .progress-stroke {
-                fill: transparent;
-                stroke-width: 2;
-                stroke-dasharray: 50.2654825;
-                transition: stroke-dashoffset 0.5s;
-                -webkit-animation-play-state: running;
-            }
-            .background-stroke {
-                stroke: #ddd;
-            }
-            .progress-stroke {
-                stroke: blue;
-            }
-        }
-        .network-switch {
-            display: flex;
-            align-items: center;
-            margin-left: 16px;
-        }
+    .network-switch {
+      display: flex;
+      align-items: center;
+      margin-left: 16px;
     }
-}
+  }
+}

+ 21 - 18
app/src/pages/write-tweet/write-tweet.ts

@@ -1,7 +1,12 @@
-import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams, AlertController } from 'ionic-angular';
-import { FormBuilder, Validators, FormGroup } from '@angular/forms';
-import { TwitterApiProvider } from '../../providers/twitter-api/twitter-api';
+import { Component } from "@angular/core";
+import {
+  IonicPage,
+  NavController,
+  NavParams,
+  AlertController
+} from "ionic-angular";
+import { FormBuilder, Validators, FormGroup } from "@angular/forms";
+import { TwitterApiProvider } from "../../providers/twitter-api/twitter-api";
 
 /**
  * Generated class for the WriteTweetPage page.
@@ -12,11 +17,10 @@ import { TwitterApiProvider } from '../../providers/twitter-api/twitter-api';
 
 @IonicPage()
 @Component({
-  selector: 'page-write-tweet',
-  templateUrl: 'write-tweet.html',
+  selector: "page-write-tweet",
+  templateUrl: "write-tweet.html"
 })
 export class WriteTweetPage {
-
   tweet: FormGroup;
 
   constructor(
@@ -27,14 +31,12 @@ export class WriteTweetPage {
     private alertCtrl: AlertController
   ) {
     this.tweet = this.formBuilder.group({
-      text: ['', Validators.maxLength(140)],
+      text: ["", Validators.maxLength(140)],
       p2p: [false]
     });
   }
 
-  ionViewDidLoad() {
-
-  }
+  ionViewDidLoad() {}
 
   get tweetCharProgress() {
     let progress = 1 - this.tweet.value["text"].length / 140;
@@ -44,18 +46,19 @@ export class WriteTweetPage {
   }
 
   submitTweet() {
-
     if (this.tweet.value.p2p) {
-      this.alertCtrl.create({
-        title: 'Private Mode',
-        subTitle: 'Your tweet will be encrypted and send to the private network. TODO!',
-        buttons: ['OK']
-      }).present();
+      this.alertCtrl
+        .create({
+          title: "Private Mode",
+          subTitle:
+            "Your tweet will be encrypted and send to the private network. TODO!",
+          buttons: ["OK"]
+        })
+        .present();
     } else {
       this.twitter.tweet(this.tweet.value["text"]);
     }
 
     this.navCtrl.pop();
   }
-
 }