Merge pull request #20 from tuckerevans/edit-page

Add edit-recipe form/page

1 files changed, 188 insertions, 0 deletions

diff --git a/recipeBuddy/src/app/edit-recipe/edit-recipe.component.ts b/recipeBuddy/src/app/edit-recipe/edit-recipe.component.ts
new file mode 100644
index 0000000..203f733
--- /dev/null
+++ b/recipeBuddy/src/app/edit-recipe/edit-recipe.component.ts
@@ -0,0 +1,188 @@
+import { Component, OnInit } from '@angular/core';
+
+import { FormControl } from '@angular/forms';
+
+import { FormBuilder } from '@angular/forms';
+import { FormArray } from '@angular/forms';
+
+import { Validators } from '@angular/forms';
+
+import { Router } from '@angular/router';
+
+import { Recipe } from '../DataModels/recipe';
+import { Ingredient } from '../DataModels/ingredient'
+import { Step } from '../DataModels/step';
+import { BackendService } from '../REST_service/backend.service';
+
+@Component({
+  selector: 'app-edit-recipe',
+  templateUrl: './edit-recipe.component.html',
+  styleUrls: ['./edit-recipe.component.css']
+})
+export class EditRecipeComponent implements OnInit {
+
+  baseRecipe: Recipe = new Recipe (15,                    //id
+                             '',  //name
+                             '',        //description
+                             [],          //ingredients
+                             [],                //steps
+                             0, //servingSize
+                             0,    //cookTime
+                             0,                    //timesCooked
+                             0,                    //rating
+                             [],        //tags
+                             []       //photos
+                             );
+
+  recipeForm = this.fb.group({
+    recipeName: ['', Validators.required],
+    desc: [''],
+    ingredients: this.fb.array([
+      this.fb.group({
+        name: [''],
+        amount: ['', Validators.pattern('^[0-9]*(\.[0-9]*)?$')],
+        unit: ['']
+        })
+    ]),
+    steps: this.fb.array([
+      this.fb.group({
+        instruction: [''],
+        timer: ['']
+        })
+    ]),
+    servingSize: ['', Validators.pattern('^[0-9]*(\.[0-9]*)?$')],
+    cookTime: ['', Validators.pattern('^[0-9]*$')],
+    tags: [''],
+    photos: ['']
+  });
+
+  constructor(private fb: FormBuilder,
+              private restService: BackendService,
+              private router: Router,
+              /*private passService: PassService,*/
+              )
+  {
+    restService.getRecipe(this.baseRecipe.id).subscribe(
+      res=> this.updateRecipe(res),
+      err=> console.log('EditRecipeComponent:restService:getRecipes: id='+ this.baseRecipe.id + 'err=' + err),
+      () => console.log('EditRecipe:restService:getRecipes: completed')
+    )
+
+    this.rmIngredient(0);
+    this.rmStep(0);
+  }
+
+  updateRecipe(r: Recipe)
+  {
+    var i: number;
+
+    this.recipeForm.patchValue(
+      {
+        recipeName:  r.name,
+        desc:        r.description,
+        servingSize: r.servingSize,
+        cookTime:    r.cookTime,
+        tags:        r.tags.join(','),
+        photos:      r.photos.join(','),
+      }
+    )
+
+    console.log(r.tags.join(','));
+
+    for(i = 0; i < r.ingredients.length; i++) {
+      this.addIngredient();
+      this.ingredients.controls[0].setValue(r.ingredients[i]);
+    }
+    for(i = 0; i < r.steps.length; i++) {
+      this.addStep();
+      console.log(r.steps[i])
+      this.steps.controls[0].setValue(r.steps[i]);
+    }
+  }
+
+  ngOnInit() {
+  }
+
+  get ingredients() {
+    return this.recipeForm.get('ingredients') as FormArray;
+  }
+
+  addIngredient() {
+    this.ingredients.push(
+    this.fb.group({
+      name: [''],
+      amount: ['', Validators.pattern('^[0-9]*(\.[0-9]*)?$')],
+      unit: ['']
+      })
+  );
+  }
+
+  rmIngredient(i) {
+    this.ingredients.removeAt(i);
+  }
+
+  get steps() {
+    return this.recipeForm.get('steps') as FormArray;
+  }
+
+  addStep() {
+    this.steps.push(
+    this.fb.group({
+      instruction: [''],
+      timer: ['', Validators.pattern('^[0-9]*$')]
+      })
+  );
+  }
+
+  rmStep(i) {
+    this.steps.removeAt(i);
+  }
+
+  onSubmit() {
+    var formData = this.recipeForm.value;
+
+    var ingredients = []
+    var i;
+    for  (i = 0; i < formData.ingredients.length; i++) {
+    var tmp_amount = parseFloat(formData.ingredients[0].amount)
+      ingredients.push(new Ingredient(formData.ingredients[0].name,
+                                      (isNaN(tmp_amount) ? 0 : tmp_amount),
+                                      formData.ingredients[0].unit,
+                                      ""
+                       ));
+    }
+
+    var steps = []
+    for  (i = 0; i < formData.steps.length; i++) {
+      var tmp_timer = parseInt(formData.steps[0].timer)
+      steps.push(new Step(formData.steps[0].instruction,
+                          (isNaN(tmp_timer) ? 0 : tmp_timer)
+                       ));
+    }
+
+    console.log(steps);
+
+    var servingsTmp = parseFloat(formData.servingSize)
+    var cookTimeTmp = parseInt(formData.cookTime)
+
+    var recipe = new Recipe (this.baseRecipe.id,                    //id
+                             formData.recipeName,  //name
+                             formData.desc,        //description
+                             ingredients,          //ingredients
+                             steps,                //steps
+                             (isNaN(servingsTmp) ? 0 :servingsTmp), //servingSize
+                             (isNaN(cookTimeTmp) ? 0 :cookTimeTmp),    //cookTime
+                             0,                    //timesCooked
+                             0,                    //rating
+                             formData.tags.split(',').filter(word => !(word==="")),        //tags
+                             formData.photos.split(',').filter(word => !(word===""))       //photos
+                             );
+    console.log(recipe)
+    this.restService.updateRecipe(recipe).subscribe()
+    this.router.navigate(['/']);
+  }
+
+  onCancel() {
+    this.router.navigate(['/']);
+  }
+}