diff options
Diffstat (limited to 'recipeBuddy/src/app/recipe-card/recipe-card.component.ts')
| -rw-r--r-- | recipeBuddy/src/app/recipe-card/recipe-card.component.ts | 171 |
1 files changed, 45 insertions, 126 deletions
diff --git a/recipeBuddy/src/app/recipe-card/recipe-card.component.ts b/recipeBuddy/src/app/recipe-card/recipe-card.component.ts index e5e3a03..bd44316 100644 --- a/recipeBuddy/src/app/recipe-card/recipe-card.component.ts +++ b/recipeBuddy/src/app/recipe-card/recipe-card.component.ts @@ -1,142 +1,61 @@ import {Component,OnInit} from '@angular/core'; +import{BackendService} from '../REST_service/backend.service'; /** * @title Card with multiple sections */ @Component({ - selector: 'card-fancy-example', - templateUrl: 'card-fancy-example.html', - styleUrls: ['card-fancy-example.css'], + selector: 'RecipeCardComponent', + templateUrl: 'recipe-card.component.html', + styleUrls: ['recipe-card.component.css'] }) -export class CardFancyExample implements OnInit { - recipeNumber: number; - totalRecipeNum: number; - recipeNames: string[] = ["Pizza", "Pancakes", "Pasta", "Chicken", "Eggs", "Sandwich", "Meatballs"]; - recipeName1: string; - recipeName2: string; - recipeName3: string; - recipeImgs: string[] = ["https://images.unsplash.com/photo-1534308983496-4fabb1a015ee?ixlib=rb-1.2.1&w=1000&q=80", - "https://www.mamaknowsglutenfree.com/wp-content/uploads/2019/01/gluten-free-pancakes-rc.jpg", - "https://feedmephoebe.com/wp-content/uploads/2017/10/Homemade-Gluten-Free-Pasta-Recipe-Tuscan-Pici-Spaghetti-Noodles-19.jpg", "https://images.all-free-download.com/images/graphicthumb/chicken_picture_3_167117.jpg", "https://www.photos-public-domain.com/wp-content/uploads/2011/11/fried-eggs.jpg", "https://image.freepik.com/free-photo/sandwich_1339-1108.jpg", "https://www.glutenfreepalate.com/wp-content/uploads/2019/05/Gluten-Free-Meatballs-3.2-720x720.jpg"]; - faceImgs: string[] = ["https://making-the-web.com/sites/default/files/clipart/174377/sad-face-pictures-free-174377-9562118.png","https://cdn.shopify.com/s/files/1/1061/1924/products/Neutral_Face_Emoji_large.png?v=1571606037","https://img.clipartlook.com/smiley-face-clipart-free-happy-face-clip-art-free-250_250.png" ] - likeRatings: number[] = [2,2,0,1,2,0,1] - likeRatingImg1: string; - likeRatingImg2: string; - likeRatingImg3: string; - recipeImage1: string; - recipeImage2: string; - recipeImage3: string; +export class RecipeCardComponent implements OnInit { + + constructor(private restService: BackendService) {} + + recipes = []; //array of recipe objects + mynumbers = []; ngOnInit() { - this.recipeNumber = 0; - this.totalRecipeNum = this.recipeNames.length; - this.recipeName1 = this.recipeNames[this.recipeNumber]; - this.recipeName2 = this.recipeNames[this.recipeNumber + 1]; - this.recipeName3 = this.recipeNames[this.recipeNumber + 2]; - this.recipeImage1 = this.recipeImgs[this.recipeNumber]; - this.recipeImage2 = this.recipeImgs[this.recipeNumber + 1]; - this.recipeImage3 = this.recipeImgs[this.recipeNumber + 2]; - this.likeRatingImg1 = this.faceImgs[this.likeRatings[this.recipeNumber]]; - this.likeRatingImg2 = this.faceImgs[this.likeRatings[this.recipeNumber + 1]]; - this.likeRatingImg3 = this.faceImgs[this.likeRatings[this.recipeNumber + 2]]; - } - - addPage() { - /**Code here to open add page */ - } - submitSearch() { - /**Code here to submit search */ - } - shoppingCart() { - /**Code here to open shopping cart with no ingredients */ - } - - previous() { - if(this.recipeNumber > 2) - { - this.recipeNumber = this.recipeNumber - 3; - this.recipeName1 = this.recipeNames[this.recipeNumber]; - this.recipeName2 = this.recipeNames[this.recipeNumber + 1]; - this.recipeName3 = this.recipeNames[this.recipeNumber + 2]; - this.recipeImage1 = this.recipeImgs[this.recipeNumber]; - this.recipeImage2 = this.recipeImgs[this.recipeNumber + 1]; - this.recipeImage3 = this.recipeImgs[this.recipeNumber + 2]; - this.likeRatingImg1 = this.faceImgs[this.likeRatings[this.recipeNumber]]; - this.likeRatingImg2 = this.faceImgs[this.likeRatings[this.recipeNumber + 1]]; - this.likeRatingImg3 = this.faceImgs[this.likeRatings[this.recipeNumber + 2]]; - } else - { - this.recipeNumber = 0; - this.recipeName1 = this.recipeNames[this.recipeNumber]; - this.recipeName2 = this.recipeNames[this.recipeNumber + 1]; - this.recipeName3 = this.recipeNames[this.recipeNumber + 2]; - this.recipeImage1 = this.recipeImgs[this.recipeNumber]; - this.recipeImage2 = this.recipeImgs[this.recipeNumber + 1]; - this.recipeImage3 = this.recipeImgs[this.recipeNumber + 2]; - this.likeRatingImg1 = this.faceImgs[this.likeRatings[this.recipeNumber]]; - this.likeRatingImg2 = this.faceImgs[this.likeRatings[this.recipeNumber + 1]]; - this.likeRatingImg3 = this.faceImgs[this.likeRatings[this.recipeNumber + 2]]; - } - } - next() { - this.recipeNumber = this.recipeNumber + 3; - if(this.recipeNumber + 3 > this.totalRecipeNum) - { - this.recipeNumber = this.totalRecipeNum - 3; + this.restService.getRecipes().subscribe( + res => { + var i: number; + for(i = 0; i < res.length; i++) { + this.restService.getRecipe(res[i]).subscribe( + res2 => { + this.recipes.push(res2) + }, err => {/*Deal with error*/}, () => {/*Code for complete observable*/} + ); } - this.recipeName1 = this.recipeNames[this.recipeNumber]; - this.recipeName2 = this.recipeNames[this.recipeNumber + 1]; - this.recipeName3 = this.recipeNames[this.recipeNumber + 2]; - this.recipeImage1 = this.recipeImgs[this.recipeNumber]; - this.recipeImage2 = this.recipeImgs[this.recipeNumber + 1]; - this.recipeImage3 = this.recipeImgs[this.recipeNumber + 2]; - this.likeRatingImg1 = this.faceImgs[this.likeRatings[this.recipeNumber]]; - this.likeRatingImg2 = this.faceImgs[this.likeRatings[this.recipeNumber + 1]]; - this.likeRatingImg3 = this.faceImgs[this.likeRatings[this.recipeNumber + 2]]; - } - - cookPage1(){ - /**Code here to go to cook page for recipe in position 1 */ - } - edit1() { - /**Code here to edit recipe in position 1 */ - } - shoppingCart1() { - /**Code here to open shopping cart with ingredients from the recipe in position 1 */ - } - delete1() { - /**Code here to delete recipe in position 1 */ - } - - cookPage2(){ - /**Code here to go to cook page for recipe in position 2 */ - } - edit2() { - /**Code here to edit recipe in position 2 */ + }, + err => { +//Deal with error + }, + () => { +//Complete observable + } +); + for(var i = 0; i <10; ++i) + { + mynumbers.push(i); + } + } + + shoppingCart() { + /**Code here to open shopping cart */ } - shoppingCart2() { - /**Code here to open shopping cart with ingredients from the recipe in position 2 */ + + cookPage(id){ + /**Code here to go to cook page for recipe with id */ + //this.recipes[id]; } - delete2() { - /**Code here to delete recipe in position 2 */ + + edit(id) { + /**Code here to edit recipe with id */ } - cookPage3(){ - /**Code here to go to cook page for recipe in position 3 */ + delete(id) { + /**Code here to delete recipe with id */ } - edit3() { - /**Code here to edit recipe in position 3 */ - } - shoppingCart3() { - /**Code here to open shopping cart with ingredients from the recipe in position 3 */ - } - delete3() { - /**Code here to delete recipe in position 3 */ - } - } - - -/** Copyright 2019 Google LLC. All Rights Reserved. - Use of this source code is governed by an MIT-style license that - can be found in the LICENSE file at http://angular.io/license */
\ No newline at end of file +
\ No newline at end of file |