create and update works

Author: silencer07

src/pages/home/home.html

@@ -8,11 +8,20 @@
 </ion-header>
 
 <ion-content padding>
-  <h3>Ionic Menu Starter</h3>
-
-  <p>
-    If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will show you the way.
-  </p>
-
-  <button ion-button secondary menuToggle>Toggle Menu</button>
+  <ion-grid align="center">
+    <ion-row>
+      <ion-col>
+        <ion-item>
+          <ion-input type="text" placeholder="Project Name" [(ngModel)]="project.name" #ctrl="ngModel"></ion-input>
+        </ion-item>
+      </ion-col>
+    </ion-row>
+    <ion-row>
+      <ion-col>
+        <button ion-button block type="button" [disabled]="!ctrl.valid" (click)="saveOrUpdateProject()">
+          {{project ? "Create" : "Update"}}
+        </button>
+      </ion-col>
+    </ion-row>
+  </ion-grid>
 </ion-content>

src/pages/home/home.ts

@@ -1,14 +1,45 @@
 import { Component } from '@angular/core';
-import { NavController } from 'ionic-angular';
+import {AlertController, NavController, NavParams} from 'ionic-angular';
+import {Project} from "../../model/project";
+import {ProjectProvider} from "../../providers/project/project";
+import {Validator} from "validator.ts/Validator";
 
 @Component({
   selector: 'page-home',
   templateUrl: 'home.html'
 })
 export class HomePage {
+  project: Project = new Project();
 
-  constructor(public navCtrl: NavController) {
-
+  constructor(public navCtrl: NavController,
+              public navParams: NavParams,
+              private projectProvider: ProjectProvider,
+              private alertController: AlertController) {
+    this.project = navParams.get('item') ? navParams.get('item') : this.project;
   }
 
+  saveOrUpdateProject(): void {
+    let validator = new Validator();
+    let errors = validator.validate(this.project);
+    if(errors.length === 0){
+      this.projectProvider.saveOrUpdate(this.project).subscribe(project => {
+        this.navCtrl.pop();
+      }, error => {
+        let message = this.alertController.create({
+          title: 'Error',
+          subTitle: error,
+          buttons: ['OK']
+        });
+        message.present();
+      });
+    } else {
+      let message = this.alertController.create({
+        title: 'Error',
+        subTitle: errors.map(error => error.errorMessage).toString(),
+        buttons: ['OK']
+      });
+      message.present();
+    }
+
+  }
 }

src/pages/list/list.ts

@@ -1,5 +1,5 @@
 import { Component } from '@angular/core';
-import { NavController, NavParams } from 'ionic-angular';
+import { NavController } from 'ionic-angular';
 import {HomePage} from "../home/home";
 import {Project} from "../../model/project";
 import {ProjectProvider} from "../../providers/project/project";
@@ -9,17 +9,18 @@ import {ProjectProvider} from "../../providers/project/project";
   templateUrl: 'list.html'
 })
 export class ListPage {
-  selectedItem: any;
-  icons: string[];
   items: Array<Project>;
 
-  constructor(public navCtrl: NavController, public navParams: NavParams, private projectProvider: ProjectProvider) {
-    this.projectProvider.list().subscribe(projects => this.items = projects);
+  constructor(public navCtrl: NavController, private projectProvider: ProjectProvider) {
   }
 
   itemTapped(event, item) {
     this.navCtrl.push(HomePage, {
       item: item
     });
   }
+
+  ionViewWillEnter() {
+    this.projectProvider.list().subscribe(projects => this.items = projects);
+  }
 }

src/providers/project/project.ts

@@ -27,14 +27,19 @@ export class ProjectProvider {
     return Observable.of(JSON.parse(localStorage.getItem(ProjectProvider.PROJECT_KEY)) as Array<Project>);
   }
 
-  create(name: string): Observable<Project> {
+  save(name: string): Observable<Project> {
+    if(!name){
+      return Observable.throw("name cannot be blank")
+    }
+
     return this.searchByName(name).flatMap((result: Project) => {
-      if(result !== null){
+      if(result){
         return Observable.throw(`${name} already exists(case-insensitive)`);
       }
 
       return this.list().flatMap((projects: Array<Project>) => {
-        let id = Math.max(...projects.map(proj => proj.id)) + 1;
+        projects = projects ? projects : [];
+        let id = projects.length ? Math.max(...projects.map(proj => proj.id)) + 1 : 1;
         let newProject = new Project();
         newProject.id = id;
         newProject.name = name;
@@ -47,30 +52,40 @@ export class ProjectProvider {
   }
 
   update(id: number, name: string): Observable<Project> {
-    return this.searchById(id).flatMap(proj => {
-      if(proj !== null){
-        proj.name = name;
-        return this.list().flatMap(projects => {
-          let index = projects.findIndex(p => p.id === id);
-          projects[index] = proj;
-
-          return Observable.of(proj);
-
+    return this.searchById(id).flatMap(byId => {
+      if(byId !== null){
+        return this.searchByName(name).flatMap(byName =>{
+          if(!byName) {
+            return this.list().flatMap(projects => {
+              byId.name = name;
+              let index = projects.findIndex(p => p.id === id);
+              projects[index] = byId;
+              localStorage.setItem(ProjectProvider.PROJECT_KEY, JSON.stringify(projects));
+              return Observable.of(byId);
+            });
+          } else {
+            return Observable.throw(`project with name ${name} already exists`);
+          }
         });
       }
       return Observable.throw(`project with id:${id} does not exists`);
     });
   }
 
+  saveOrUpdate(project: Project): Observable<Project> {
+    return project.id > 0 ? this.update(project.id, project.name) : this.save(project.name);
+  }
+
   searchById(id: number): Observable<Project> {
     return this.list().flatMap((projects: Array<Project>) =>
-      Observable.of(projects.length > 0 ? projects.filter(proj => proj.id === id)[0] : null)
+      Observable.of(projects && projects.length > 0 ? projects.find(proj => proj.id === id) : null)
     );
   }
 
   searchByName(name: string): Observable<Project> {
-    return this.list().flatMap((projects: Array<Project>) =>
-      Observable.of(projects.length > 0 ? projects.filter(proj => proj.name.toLowerCase() === name)[0] : null)
-    );
+    return this.list().flatMap((projects: Array<Project>) => {
+      let project = projects && projects.length > 0 ? projects.find(proj => proj.name.toLowerCase() === name) : null;
+      return Observable.of(project);
+    });
   }
 }