Fix recipe delete button not working. Remove extraneous code from recipe details sidebar. Add loader to recipe deletion.

views/dashboardPage/bundle.js

@@ -2914,6 +2914,7 @@ let newRecipe = {
                         merchant
                     ));
 
+                    banner.createNotification("RECIPE CREATED");
                     controller.openStrand("recipeBook");
                 }
             })
@@ -3416,10 +3417,9 @@ let recipeBook = {
 module.exports = recipeBook;
 },{}],20:[function(require,module,exports){
 let recipeDetails = {
-    recipe: {},
-
     display: function(recipe){
         document.getElementById("editRecipeBtn").onclick = ()=>{controller.openSidebar("editRecipe", recipe)};
+        document.getElementById("removeRecipeBtn").onclick = ()=>{this.remove(recipe)};
         document.getElementById("recipeName").innerText = recipe.name;
 
         //ingredient list
@@ -3440,88 +3440,22 @@ let recipeDetails = {
         document.getElementById("recipePrice").children[1].innerText = `$${recipe.price.toFixed(2)}`;
     },
 
-    edit: function(){
-        let ingredientDivs = document.getElementById("recipeIngredientList");
-
-        if(merchant.pos === "none"){
-            let name = document.getElementById("recipeName");
-            let nameIn = document.getElementById("recipeNameIn");
-            name.style.display = "none";
-            nameIn.style.display = "block";
-            nameIn.value = this.recipe.name;
-
-            let price = document.getElementById("recipePrice");
-            price.children[1].style.display = "none";
-            price.children[2].style.display = "block";
-            price.children[2].value = parseFloat((this.recipe.price / 100).toFixed(2));
-        }
-
-        for(let i = 0; i < ingredientDivs.children.length; i++){
-            let div = ingredientDivs.children[i];
-
-            div.children[2].innerText = this.recipe.ingredients[i].ingredient.unit;
-            div.children[1].style.display = "block";
-            div.children[1].value = this.recipe.ingredients[i].ingredient.convert(this.recipe.ingredients[i].quantity).toFixed(2);
-            div.children[3].style.display = "block";
-            div.children[3].onclick = ()=>{div.parentElement.removeChild(div)};
-        }
-
-        document.getElementById("addRecIng").style.display = "flex";
-        document.getElementById("recipeUpdate").style.display = "flex";
-    },
-
-    update: function(){
-        this.recipe.name = document.getElementById("recipeNameIn").value || this.recipe.name;
-        this.recipe.price = Math.round((document.getElementById("recipePrice").children[2].value * 100)) || this.recipe.price;
-        this.recipe.ingredients = [];
-
-        let divs = document.getElementById("recipeIngredientList").children;
-        for(let i = 0; i < divs.length; i++){
-            if(divs[i].name === "new"){
-                let select = divs[i].children[0];
-                this.recipe.ingredients.push({
-                    ingredient: select.options[select.selectedIndex].ingredient,
-                    quantity: controller.convertToMain(select.options[select.selectedIndex].ingredient.unit, divs[i].children[1].value)
-                });
-            }else{
-                this.recipe.ingredients.push({
-                    ingredient: divs[i].ingredient,
-                    quantity: controller.convertToMain(divs[i].ingredient.unit, divs[i].children[1].value)
-                });
-            }
-        }
-
-        let data = {
-            id: this.recipe.id,
-            name: this.recipe.name,
-            price: this.recipe.price,
-            ingredients: []
-        }
-
-        for(let i = 0; i < this.recipe.ingredients.length; i++){
-            data.ingredients.push({
-                ingredient: this.recipe.ingredients[i].ingredient.id,
-                quantity: this.recipe.ingredients[i].quantity
-            });
-        }
-
+    remove: function(recipe){
         let loader = document.getElementById("loaderContainer");
         loader.style.display = "flex";
 
-        fetch("/recipe/update", {
-            method: "PUT",
-            headers: {
-                "Content-Type": "application/json;charset=utf-8"
-            },
-            body: JSON.stringify(data)
+        fetch(`/merchant/recipes/remove/${recipe.id}`, {
+            method: "DELETE"
         })
             .then((response) => response.json())
             .then((response)=>{
                 if(typeof(response) === "string"){
                     banner.createError(response);
                 }else{
-                    //Edit Recipe here
-                    banner.createNotification("RECIPE UPDATE");
+                    merchant.removeRecipe(recipe);
+
+                    banner.createNotification("RECIPE REMOVED");
+                    controller.openStrand("recipeBook");
                 }
             })
             .catch((err)=>{
@@ -3532,24 +3466,6 @@ let recipeDetails = {
             });
     },
 
-    remove: function(){
-        fetch(`/merchant/recipes/remove/${this.recipe.id}`, {
-            method: "DELETE"
-        })
-            .then((response) => response.json())
-            .then((response)=>{
-                if(typeof(response) === "string"){
-                    banner.createError(response);
-                }else{
-                    merchant.removeRecipe(this.recipe);
-                    banner.createNotification("RECIPE REMOVED");
-                }
-            })
-            .catch((err)=>{
-                banner.createError("SOMETHING WENT WRONG. PLEASE REFRESH THE PAGE");
-            });
-    },
-
     displayAddIngredient: function(){
         let template = document.getElementById("addRecIngredient").content.children[0].cloneNode(true);
         template.name = "new";

views/dashboardPage/js/newRecipe.js

@@ -110,6 +110,7 @@ let newRecipe = {
                         merchant
                     ));
 
+                    banner.createNotification("RECIPE CREATED");
                     controller.openStrand("recipeBook");
                 }
             })

views/dashboardPage/js/recipeDetails.js

@@ -1,8 +1,7 @@
 let recipeDetails = {
-    recipe: {},
-
     display: function(recipe){
         document.getElementById("editRecipeBtn").onclick = ()=>{controller.openSidebar("editRecipe", recipe)};
+        document.getElementById("removeRecipeBtn").onclick = ()=>{this.remove(recipe)};
         document.getElementById("recipeName").innerText = recipe.name;
 
         //ingredient list
@@ -23,88 +22,22 @@ let recipeDetails = {
         document.getElementById("recipePrice").children[1].innerText = `$${recipe.price.toFixed(2)}`;
     },
 
-    edit: function(){
-        let ingredientDivs = document.getElementById("recipeIngredientList");
-
-        if(merchant.pos === "none"){
-            let name = document.getElementById("recipeName");
-            let nameIn = document.getElementById("recipeNameIn");
-            name.style.display = "none";
-            nameIn.style.display = "block";
-            nameIn.value = this.recipe.name;
-
-            let price = document.getElementById("recipePrice");
-            price.children[1].style.display = "none";
-            price.children[2].style.display = "block";
-            price.children[2].value = parseFloat((this.recipe.price / 100).toFixed(2));
-        }
-
-        for(let i = 0; i < ingredientDivs.children.length; i++){
-            let div = ingredientDivs.children[i];
-
-            div.children[2].innerText = this.recipe.ingredients[i].ingredient.unit;
-            div.children[1].style.display = "block";
-            div.children[1].value = this.recipe.ingredients[i].ingredient.convert(this.recipe.ingredients[i].quantity).toFixed(2);
-            div.children[3].style.display = "block";
-            div.children[3].onclick = ()=>{div.parentElement.removeChild(div)};
-        }
-
-        document.getElementById("addRecIng").style.display = "flex";
-        document.getElementById("recipeUpdate").style.display = "flex";
-    },
-
-    update: function(){
-        this.recipe.name = document.getElementById("recipeNameIn").value || this.recipe.name;
-        this.recipe.price = Math.round((document.getElementById("recipePrice").children[2].value * 100)) || this.recipe.price;
-        this.recipe.ingredients = [];
-
-        let divs = document.getElementById("recipeIngredientList").children;
-        for(let i = 0; i < divs.length; i++){
-            if(divs[i].name === "new"){
-                let select = divs[i].children[0];
-                this.recipe.ingredients.push({
-                    ingredient: select.options[select.selectedIndex].ingredient,
-                    quantity: controller.convertToMain(select.options[select.selectedIndex].ingredient.unit, divs[i].children[1].value)
-                });
-            }else{
-                this.recipe.ingredients.push({
-                    ingredient: divs[i].ingredient,
-                    quantity: controller.convertToMain(divs[i].ingredient.unit, divs[i].children[1].value)
-                });
-            }
-        }
-
-        let data = {
-            id: this.recipe.id,
-            name: this.recipe.name,
-            price: this.recipe.price,
-            ingredients: []
-        }
-
-        for(let i = 0; i < this.recipe.ingredients.length; i++){
-            data.ingredients.push({
-                ingredient: this.recipe.ingredients[i].ingredient.id,
-                quantity: this.recipe.ingredients[i].quantity
-            });
-        }
-
+    remove: function(recipe){
         let loader = document.getElementById("loaderContainer");
         loader.style.display = "flex";
 
-        fetch("/recipe/update", {
-            method: "PUT",
-            headers: {
-                "Content-Type": "application/json;charset=utf-8"
-            },
-            body: JSON.stringify(data)
+        fetch(`/merchant/recipes/remove/${recipe.id}`, {
+            method: "DELETE"
         })
             .then((response) => response.json())
             .then((response)=>{
                 if(typeof(response) === "string"){
                     banner.createError(response);
                 }else{
-                    //Edit Recipe here
-                    banner.createNotification("RECIPE UPDATE");
+                    merchant.removeRecipe(recipe);
+
+                    banner.createNotification("RECIPE REMOVED");
+                    controller.openStrand("recipeBook");
                 }
             })
             .catch((err)=>{
@@ -115,24 +48,6 @@ let recipeDetails = {
             });
     },
 
-    remove: function(){
-        fetch(`/merchant/recipes/remove/${this.recipe.id}`, {
-            method: "DELETE"
-        })
-            .then((response) => response.json())
-            .then((response)=>{
-                if(typeof(response) === "string"){
-                    banner.createError(response);
-                }else{
-                    merchant.removeRecipe(this.recipe);
-                    banner.createNotification("RECIPE REMOVED");
-                }
-            })
-            .catch((err)=>{
-                banner.createError("SOMETHING WENT WRONG. PLEASE REFRESH THE PAGE");
-            });
-    },
-
     displayAddIngredient: function(){
         let template = document.getElementById("addRecIngredient").content.children[0].cloneNode(true);
         template.name = "new";