init edit page

l10178 · Nov 7, 2019 · e199d79 · e199d79
1 parent de48aab
commit e199d79
Show file tree

Hide file tree

Showing 6 changed files with 142 additions and 188 deletions.
diff --git a/src/app/constants.ts b/src/app/constants.ts
diff --git a/src/app/detail/detail.page.ts b/src/app/detail/detail.page.ts
@@ -1,37 +1,18 @@
-import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-
-import {
-  GITHUB_USER,
-  GITHUB_MARKDOWN_REPO,
-  GITHUB_MARKDOWN_REPO_DEFAULT_BR
-} from './../constants';
+import {Component, OnInit} from '@angular/core';
+import {ActivatedRoute} from '@angular/router';
 
 @Component({
-  selector: 'app-detail',
-  templateUrl: 'detail.page.html',
-  styleUrls: ['detail.page.scss']
+    selector: 'app-detail',
+    templateUrl: 'detail.page.html',
+    styleUrls: ['detail.page.scss']
 })
 export class DetailPage implements OnInit {
-  public path: string;
-  public id: string;
-  constructor(private route: ActivatedRoute) {}
+    public path: string;
+    public id: string;
 
-  ngOnInit() {
-    const user = GITHUB_USER;
-    const repo = GITHUB_MARKDOWN_REPO;
-    const branch = GITHUB_MARKDOWN_REPO_DEFAULT_BR;
-    this.route.params.subscribe(params => {
-      let id = params.id;
-      this.id = id;
-      this.path = `https://raw.githubusercontent.com/${user}/${repo}/${branch}/${id}`;
-    });
+    constructor(private route: ActivatedRoute) {
+    }
 
-    // let github = new GitHub();
-    // let repo = github.getRepo('l10178', 'little-jelly-bean-pieces');
-    // let filePath = 'README.md';
-    // repo.getContents('master', filePath, true).then(response => {
-    //   this.content = response.data;
-    // });
-  }
+    ngOnInit() {
+    }
 }
diff --git a/src/app/edit/edit.page.html b/src/app/edit/edit.page.html
@@ -1,22 +1,59 @@
 <ion-header>
-  <ion-toolbar>
-    <ion-buttons slot="start">
-      <ion-menu-button></ion-menu-button>
-    </ion-buttons>
-    <ion-buttons slot="primary">
-      <ion-icon name="done-all" size="large" color="primary" (click)="save()"></ion-icon>
-    </ion-buttons>
-  </ion-toolbar>
+    <ion-toolbar>
+        <ion-buttons slot="start">
+            <ion-menu-button></ion-menu-button>
+        </ion-buttons>
+        <ion-buttons slot="primary">
+            <ion-icon name="done-all" size="large" color="primary" (click)="save()"></ion-icon>
+        </ion-buttons>
+    </ion-toolbar>
 </ion-header>
 
 <ion-content>
-  <form name="form" action="javascript:return true;" novalidate>
-    <ion-item>
-      <ion-label>Title</ion-label>
-      <ion-input [(ngModel)]="beanPiece.title" name="form.title" (ionBlur)="autoSave()"></ion-input>
-    </ion-item>
-    <ion-textarea class="ion-padding" rows="20" [(ngModel)]="beanPiece.description" name="form.description"
-      (ionBlur)="autoSave()">
-    </ion-textarea>
-  </form>
+    <form name="form" action="javascript:return true;" novalidate>
+        <ion-item>
+            <ion-label>Title</ion-label>
+            <ion-input [(ngModel)]="beanPiece.title"
+                       required
+                       name="form.title"
+                       placeholder="Enter a title here..."
+                       (ionBlur)="autoSave()"></ion-input>
+        </ion-item>
+
+        <ion-item-group>
+            <ion-item-divider>
+                <ion-label>Tags</ion-label>
+            </ion-item-divider>
+            <ion-item>
+                <ion-label>Breakfast</ion-label>
+                <ion-checkbox slot="start" color="primary"></ion-checkbox>
+            </ion-item>
+            <ion-item>
+                <ion-label>Lunch</ion-label>
+                <ion-checkbox slot="start" color="dark"></ion-checkbox>
+            </ion-item>
+            <ion-item>
+                <ion-label>Dinner</ion-label>
+                <ion-checkbox slot="start" color="danger"></ion-checkbox>
+            </ion-item>
+            <ion-item>
+                <ion-label>Snack</ion-label>
+                <ion-checkbox slot="start" color="secondary"></ion-checkbox>
+            </ion-item>
+        </ion-item-group>
+
+        <ion-item-group>
+            <ion-item-divider>
+                <ion-label>Description</ion-label>
+            </ion-item-divider>
+            <ion-textarea class="ion-padding"
+                          rows="10"
+                          [(ngModel)]="beanPiece.description"
+                          name="form.description"
+                          placeholder="Enter the description here..."
+                          clearOnEdit="true"
+                          (ionBlur)="autoSave()">
+            </ion-textarea>
+        </ion-item-group>
+    </form>
 </ion-content>
diff --git a/src/app/edit/edit.page.ts b/src/app/edit/edit.page.ts
@@ -1,128 +1,55 @@
-import { AccountService } from './../shared/account/account.service';
-import { BeanPiece } from './../shared/bean-piece.model';
-import { Component, OnInit } from '@angular/core';
-import { ToastController } from '@ionic/angular';
-import { Storage } from '@ionic/storage';
-import { ModalController } from '@ionic/angular';
+import {BeanPiece} from './../shared/bean-piece.model';
+import {Component, OnInit} from '@angular/core';
+import {ModalController, ToastController} from '@ionic/angular';
+import {Storage} from '@ionic/storage';
 
-import { Router, ActivatedRoute } from '@angular/router';
-
-import {
-  GITHUB_USER,
-  GITHUB_MARKDOWN_REPO,
-  GITHUB_MARKDOWN_REPO_DEFAULT_BR
-} from './../constants';
-import GitHub from 'github-api';
-import { LoginPage } from '../login/login.page';
+import {ActivatedRoute, Router} from '@angular/router';
 
 @Component({
-  selector: 'app-edit',
-  templateUrl: 'edit.page.html',
-  styleUrls: ['edit.page.scss']
+    selector: 'app-edit',
+    templateUrl: 'edit.page.html',
+    styleUrls: ['edit.page.scss']
 })
 export class EditPage implements OnInit {
-  public beanPiece: BeanPiece;
-  constructor(
-    private route: ActivatedRoute,
-    private router: Router,
-    private toastController: ToastController,
-    private storage: Storage,
-    private accountService: AccountService,
-    public modalController: ModalController
-  ) {}
-
-  ngOnInit() {
-    this.initContent();
-    // check use login, if not, show login dialog
-    this.checkLogin();
-  }
-
-  private initContent() {
-    this.beanPiece = new BeanPiece();
-    this.route.params.subscribe(params => {
-      let fileId = params.id;
-      if (fileId) {
-        // TODO: redo
-        this.beanPiece.title = fileId;
-        let github = new GitHub();
-        let repo = github.getRepo(GITHUB_USER, GITHUB_MARKDOWN_REPO);
-        repo
-          .getContents(GITHUB_MARKDOWN_REPO_DEFAULT_BR, fileId, true)
-          .then(response => {
-            this.beanPiece.description = response.data;
-          });
-      }
-    });
-  }
+    public beanPiece: BeanPiece;
+
+    constructor(
+        private route: ActivatedRoute,
+        private router: Router,
+        private toastController: ToastController,
+        private storage: Storage,
+        public modalController: ModalController
+    ) {
+    }
 
-  async checkLogin() {
-    const loginUser = await this.accountService.getLoginUser();
-    if (loginUser === null) {
-      // show login dialog
-      this.showLoginModal();
+    ngOnInit() {
+        this.beanPiece = new BeanPiece();
     }
-  }
 
-  async showLoginModal() {
-    const modal = await this.modalController.create({
-      component: LoginPage
-    });
-    return await modal.present();
-  }
 
-  autoSave() {
-    // auto save to local
-    if (this.beanPiece.title) {
-      this.storage.set(this.beanPiece.title, this.beanPiece);
+    autoSave() {
+        // auto save to local
+        if (this.beanPiece.title) {
+            this.storage.set(this.beanPiece.title, this.beanPiece);
+        }
     }
-  }
 
-  async save() {
-    const loginUser = await this.accountService.getLoginUser();
-    if (loginUser === null) {
-      // show login dialog
-      this.showLoginModal();
+    async save() {
+        this.doSuccess();
     }
 
-    let github = new GitHub(loginUser);
-    let repo = github.getRepo(GITHUB_USER, GITHUB_MARKDOWN_REPO);
-    const result = repo.writeFile(
-      GITHUB_MARKDOWN_REPO_DEFAULT_BR,
-      this.beanPiece.title + '.md',
-      this.beanPiece.description,
-      'auto push by my app.',
-      {
-        encode: true
-      }
-    );
-    result
-      .then(data => {
-        this.doSuccess(data);
-      })
-      .catch(error => {
-        this.doError(error);
-      });
-  }
-  private doError(error: any) {
-    this.toast(error.message, 'danger');
-    if (error.response.status === 401) {
-      this.showLoginModal();
+    private doSuccess() {
+        this.toast('Success.', 'success');
+        this.router.navigate(['/list']);
     }
-  }
-
-  private doSuccess(data: any) {
-    this.toast(data.statusText, 'success');
-    this.storage.remove(this.beanPiece.title);
-    this.router.navigate(['/list']);
-  }
 
-  async toast(message: string, color: string) {
-    const toast = await this.toastController.create({
-      message: message,
-      position: 'top',
-      color: color,
-      duration: 2000
-    });
-    toast.present();
-  }
+    async toast(message: string, color: string) {
+        const toast = await this.toastController.create({
+            message: message,
+            position: 'top',
+            color: color,
+            duration: 2000
+        });
+        toast.present();
+    }
 }
diff --git a/src/app/shared/model/meal-tag.model.ts b/src/app/shared/model/meal-tag.model.ts
@@ -0,0 +1,9 @@
+export class MealTag {
+    name: string;
+    alias: string;
+    start: Date;
+    end: Date;
+
+    constructor() {
+    }
+}
diff --git a/src/app/shared/security/security.service.ts b/src/app/shared/security/security.service.ts
@@ -1,36 +1,39 @@
-import { Injectable } from '@angular/core';
+import {Injectable} from '@angular/core';
 import * as CryptoJS from 'crypto-js';
+import {Time} from '@angular/common';
+import {Data} from '@angular/router';
 
 @Injectable()
 export class SecurityService {
-  constructor() {}
+    constructor() {
+    }
 
-  public encrypt(data: Object): string {
-    if (data === null) {
-      return null;
+    public encrypt(data: Object): string {
+        if (data === null) {
+            return null;
+        }
+        // // Encrypt
+        const ciphertext = CryptoJS.AES.encrypt(
+            JSON.stringify(data),
+            this.getSecurityKey()
+        );
+        return ciphertext.toString();
     }
-    // // Encrypt
-    const ciphertext = CryptoJS.AES.encrypt(
-      JSON.stringify(data),
-      this.getSecurityKey()
-    );
-    return ciphertext.toString();
-  }
 
-  public decrypt(ciphertext: Object): any {
-    if (ciphertext === null) {
-      return null;
+    public decrypt(ciphertext: Object): any {
+        if (ciphertext === null) {
+            return null;
+        }
+        // // Decrypt
+        const bytes = CryptoJS.AES.decrypt(
+            ciphertext.toString(),
+            this.getSecurityKey()
+        );
+        const decryptedData = JSON.parse(bytes.toString(CryptoJS.enc.Utf8));
+        return decryptedData;
     }
-    // // Decrypt
-    var bytes = CryptoJS.AES.decrypt(
-      ciphertext.toString(),
-      this.getSecurityKey()
-    );
-    var decryptedData = JSON.parse(bytes.toString(CryptoJS.enc.Utf8));
-    return decryptedData;
-  }
 
-  getSecurityKey(): string {
-    return 'this is just a test key.';
-  }
+    getSecurityKey(): string {
+        return 'this is just a test key.';
+    }
 }