recipeBook.js 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. window.recipeBookStrandObj = {
  2. isPopulated: false,
  3. recipeDivList: [],
  4. display: function(){
  5. if(!this.isPopulated){
  6. this.populateRecipes();
  7. this.isPopulated = true;
  8. }
  9. },
  10. populateRecipes: function(){
  11. let recipeList = document.querySelector("#recipeList");
  12. while(recipeList.children.length > 0){
  13. recipeList.removeChild(recipeList.firstChild);
  14. }
  15. for(let recipe of merchant.recipes){
  16. let recipeDiv = document.createElement("div");
  17. recipeDiv.classList = "rowItem";
  18. recipeDiv.onclick = ()=>{recipeDetailsComp.display(recipe)};
  19. recipeDiv._name = recipe.name;
  20. recipeList.appendChild(recipeDiv);
  21. let recipeName = document.createElement("p");
  22. recipeName.innerText = recipe.name;
  23. recipeDiv.appendChild(recipeName);
  24. let recipePrice = document.createElement("p");
  25. recipePrice.innerText = `$${(recipe.price / 100).toFixed(2)}`;
  26. recipeDiv.appendChild(recipePrice);
  27. this.recipeDivList.push(recipeDiv);
  28. }
  29. },
  30. displayAddRecipe: function(){
  31. openSidebar(document.querySelector("#addRecipe"));
  32. let ingredientsSelect = document.querySelector("#recipeInputIngredients select");
  33. let categories = categorizeIngredients(merchant.inventory);
  34. for(let category of categories){
  35. let optgroup = document.createElement("optgroup");
  36. optgroup.label = category.name;
  37. ingredientsSelect.appendChild(optgroup);
  38. for(let ingredient of category.ingredients){
  39. let option = document.createElement("option");
  40. option.value = ingredient.id;
  41. option.innerText = ingredient.name;
  42. optgroup.appendChild(option);
  43. }
  44. }
  45. },
  46. //Updates the number of ingredient inputs displayed for new recipes
  47. changeRecipeCount: function(){
  48. let newCount = document.querySelector("#ingredientCount").value;
  49. let ingredientsDiv = document.querySelector("#recipeInputIngredients");
  50. let oldCount = ingredientsDiv.children.length;
  51. if(newCount > oldCount){
  52. let newDivs = newCount - oldCount;
  53. for(let i = 0; i < newDivs; i++){
  54. let newNode = ingredientsDiv.children[0].cloneNode(true);
  55. newNode.children[2].children[0].value = "";
  56. ingredientsDiv.appendChild(newNode);
  57. }
  58. for(let i = 0; i < newCount; i++){
  59. ingredientsDiv.children[i].children[0].innerText = `Ingredient ${i + 1}`;
  60. }
  61. }else if(newCount < oldCount){
  62. let newDivs = oldCount - newCount;
  63. for(let i = 0; i < newDivs; i++){
  64. ingredientsDiv.removeChild(ingredientsDiv.children[ingredientsDiv.children.length-1]);
  65. }
  66. }
  67. },
  68. submitNewRecipe: function(){
  69. let newRecipe = {
  70. name: document.querySelector("#newRecipeName").value,
  71. price: document.querySelector("#newRecipePrice").value,
  72. ingredients: []
  73. }
  74. let inputs = document.querySelectorAll("#recipeInputIngredients > div");
  75. for(let input of inputs){
  76. newRecipe.ingredients.push({
  77. ingredient: input.children[1].children[0].value,
  78. quantity: input.children[2].children[0].value
  79. });
  80. }
  81. if(!validator.recipe(newRecipe)){
  82. return;
  83. }
  84. fetch("/recipe/create", {
  85. method: "POST",
  86. headers: {
  87. "Content-Type": "application/json;charset=utf-8"
  88. },
  89. body: JSON.stringify(newRecipe)
  90. })
  91. .then((response) => response.json())
  92. .then((response)=>{
  93. if(typeof(response) === "string"){
  94. banner.createError(response);
  95. }else{
  96. newRecipe._id = response._id;
  97. newRecipe.price = Math.round(newRecipe.price * 100);
  98. for(let i = 0; i < newRecipe.ingredients.length; i++){
  99. newRecipe.ingredients[i].quantity = parseFloat(newRecipe.ingredients[i].quantity);
  100. }
  101. updateRecipes(newRecipe);
  102. banner.createNotification("New recipe successfully created");
  103. }
  104. })
  105. .catch((err)=>{
  106. banner.createError("Refresh page to update data");
  107. });
  108. },
  109. search: function(){
  110. let input = document.getElementById("recipeSearch").value.toLowerCase();
  111. let recipeList = document.getElementById("recipeList");
  112. let clearButton = document.getElementById("recipeClearButton");
  113. let matchingRecipes = [];
  114. for(let i = 0; i < this.recipeDivList.length; i++){
  115. if(this.recipeDivList[i]._name.toLowerCase().includes(input)){
  116. matchingRecipes.push(this.recipeDivList[i]);
  117. }
  118. }
  119. while(recipeList.children.length > 0){
  120. recipeList.removeChild(recipeList.firstChild);
  121. }
  122. for(let i = 0; i < matchingRecipes.length; i++){
  123. recipeList.appendChild(matchingRecipes[i]);
  124. }
  125. if(input === ""){
  126. clearButton.style.display = "none";
  127. }else{
  128. clearButton.style.display = "inline";
  129. }
  130. },
  131. clearSorting: function(){
  132. document.getElementById("recipeSearch").value = "";
  133. this.search();
  134. }
  135. }