Get rid of too generic merchant update in back end

controllers/home.js

@@ -326,5 +326,57 @@ module.exports = {
                 console.log(err);
                 return res.render("error");
             });
+    },
+
+    removeMerchantIngredient: function(req, res){
+        Merchant.findOne({_id: req.session.user})
+            .then((merchant)=>{
+                for(let i = 0; i < merchant.inventory.length; i++){
+                    if(req.body.ingredientId === merchant.inventory[i]._id.toString()){
+                        merchant.inventory.splice(i, 1);
+                        break;
+                    }
+                }
+
+                merchant.save()
+                    .then(()=>{
+                        return res.json();
+                    })
+                    .catch((err)=>{
+                        console.log(err);
+                        return res.render("error");
+                    });
+            })
+            .catch((err)=>{
+                console.log(err);
+                return res.render("error");
+            });
+    },
+
+    updateRecipeIngredient: function(req, res){
+        Merchant.findOne({_id: req.session.user})
+            .then((merchant)=>{
+                let recipe = merchant.recipes.find(r => r._id.toString() === req.body.recipeId);
+                
+                for(let i = 0; i < recipe.ingredients.length; i++){
+                    if(recipe.ingredients[i]._id.toString() === req.body.ingredient._id){
+                        recipe.ingredients[i].quantity = req.body.ingredient.quantity;
+                        break;
+                    }
+                }
+
+                merchant.save()
+                    .then(()=>{
+                        return res.json();
+                    })
+                    .catch((err)=>{
+                        console.log(err);
+                        return res.render("error");
+                    });
+            })
+            .catch((err)=>{
+                console.log(err);
+                return res.render("error");
+            });
     }
 }

routes.js

@@ -9,9 +9,10 @@ module.exports = function(app){
     //Merchant
     app.get("/merchant/recipes/update", home.updateRecipes); //this is fucked
     app.post("/merchant/create", home.createMerchant);
-    app.post("/merchant/update", home.updateMerchant); //Too generic
     app.post("/merchant/ingredients/create", home.addMerchantIngredient);
+    app.post("/merchant/ingredients/remove", home.removeMerchantIngredient);
     app.post("/merchant/recipes/ingredients/create", home.addRecipeIngredient);
+    app.post("/merchant/recipes/ingredients/update", home.updateRecipeIngredient);
     app.post("/merchant/recipes/ingredients/remove", home.removeRecipeIngredient);
 
     //Ingredients
@@ -20,6 +21,5 @@ module.exports = function(app){
     app.post("/ingredients/createone", home.createIngredient);  //also adds to merchant
 
     //Clover API
-    
     app.get("/getrecipes", home.getCloverRecipes);
 }

views/inventory/inventory.css

@@ -73,6 +73,8 @@
     display: flex;
     background-size: cover;
     padding: 50px;
+    max-height: 75%;
+    overflow-y: auto;
 }
 
     th{

views/inventory/inventory.ejs

@@ -14,17 +14,17 @@
 
             <a href="/recipes">View Recipes</a>
 
-            <button onclick="displayAdd()">Add Ingredient</button>
+            <button onclick="inventoryPage.displayAdd()">Add Ingredient</button>
 
-            <input id="filter" onkeyup="filter()" type="text" placeholder="Start typing to filter">
+            <input id="filter" onkeyup="inventoryPage.filter()" type="text" placeholder="Start typing to filter">
 
             <table>
                 <thead>
                     <tr>
-                        <th onclick="sortIngredients('name')">Item</th>
-                        <th onclick="sortIngredients('category')">Category</th>
-                        <th onclick="sortIngredients('quantity')">Quantity</th>
-                        <th onclick="sortIngredients('unit')">Unit</th>
+                        <th onclick="inventoryPage.sortIngredients('name')">Item</th>
+                        <th onclick="inventoryPage.sortIngredients('category')">Category</th>
+                        <th onclick="inventoryPage.sortIngredients('quantity')">Quantity</th>
+                        <th onclick="inventoryPage.sortIngredients('unit')">Unit</th>
                         <th></th>
                     </tr>
                     <tbody></tbody>

views/inventory/inventory.js

@@ -1,271 +1,267 @@
-let items = []; //the ingredients to be displayed
-let tbody = document.querySelector("tbody");
-let currentSort = "";
-
-//Remove any existing ingredients in table
-//loop through items and create rows for the table
-let renderIngredients = ()=>{
-    while(tbody.hasChildNodes()){
-        tbody.removeChild(tbody.firstChild);
-    }
-
-    for(let item of items){
-        let row = document.createElement("tr");
-        tbody.appendChild(row);
-
-        let name = document.createElement("td");
-        name.innerText = item.name;
-        row.appendChild(name);
+let inventoryPage = {
+    items: [], //the ingredients to be displayed
+    currentSort: "",
+
+    //Remove any existing ingredients in table
+    //loop through this.items and create rows for the table
+    renderIngredients: function(){
+        let tbody = document.querySelector(".container table tbody");
+        while(tbody.hasChildNodes()){
+            tbody.removeChild(tbody.firstChild);
+        }
 
-        let category = document.createElement("td");
-        category.innerText = item.category;
-        row.appendChild(category);
+        for(let item of this.items){
+            let row = document.createElement("tr");
+            tbody.appendChild(row);
 
-        let quantity = document.createElement("td");
-        quantity.innerText = item.quantity;
-        row.appendChild(quantity);
+            let name = document.createElement("td");
+            name.innerText = item.name;
+            row.appendChild(name);
 
-        let unit = document.createElement("td");
-        unit.innerText = item.unit;
-        row.appendChild(unit);
+            let category = document.createElement("td");
+            category.innerText = item.category;
+            row.appendChild(category);
 
-        let action = document.createElement("td");
-        row.appendChild(action);
+            let quantity = document.createElement("td");
+            quantity.innerText = item.quantity;
+            row.appendChild(quantity);
 
-        let editBtn = document.createElement("button");
-        editBtn.onclick = ()=>{editIngredient(item.id, row)};
-        editBtn.innerText = "Edit";
-        editBtn.className = "edit-button"
-        action.appendChild(editBtn);
+            let unit = document.createElement("td");
+            unit.innerText = item.unit;
+            row.appendChild(unit);
 
-        let removeBtn = document.createElement("button");
-        removeBtn.onclick = ()=>{removeIngredient(item.id, row)};
-        removeBtn.innerText = "Remove";
-        removeBtn.className = "edit-button";
-        action.appendChild(removeBtn);
-    }
-}
+            let action = document.createElement("td");
+            row.appendChild(action);
 
-//sorts items by specified property
-let sortIngredients = (property)=>{
-    if(currentSort === property){
-        items.sort((a, b) => (a[property] > b[property]) ? -1 : 1);
-        currentSort = "";
-    }else{
-        items.sort((a, b) => (a[property] > b[property]) ? 1 : -1);
-        currentSort = property;
-    }
-    renderIngredients();
-}
+            let editBtn = document.createElement("button");
+            editBtn.onclick = ()=>{this.editIngredient(item.id, row)};
+            editBtn.innerText = "Edit";
+            editBtn.className = "edit-button"
+            action.appendChild(editBtn);
 
-//Empty items list
-//Add ingredients back to items list based on filter input
-let filter = ()=>{
-    items = [];
-    let searchString = document.querySelector("#filter").value.toLowerCase();
-    for(let item of merchant.inventory){
-        if(item.ingredient.name.toLowerCase().includes(searchString)){
-            items.push({
-                id: item._id,
-                name: item.ingredient.name,
-                category: item.ingredient.category,
-                quantity: item.quantity,
-                unit: item.ingredient.unit
-            });
+            let removeBtn = document.createElement("button");
+            removeBtn.onclick = ()=>{this.removeIngredient(item.id, row)};
+            removeBtn.innerText = "Remove";
+            removeBtn.className = "edit-button";
+            action.appendChild(removeBtn);
         }
-    }
+    },
 
-    sortIngredients("name");
-    renderIngredients(items);
-}
+    //sorts this.items by specified property
+    sortIngredients: function(property){
+        if(this.currentSort === property){
+            this.items.sort((a, b) => (a[property] > b[property]) ? -1 : 1);
+            this.currentSort = "";
+        }else{
+            this.items.sort((a, b) => (a[property] > b[property]) ? 1 : -1);
+            this.currentSort = property;
+        }
+        this.renderIngredients();
+    },
+
+    //Empty this.items list
+    //Add ingredients back to this.items list based on this.filter input
+    filter: function(){
+        this.items = [];
+        let searchString = document.querySelector("#filter").value.toLowerCase();
+        for(let item of merchant.inventory){
+            if(item.ingredient.name.toLowerCase().includes(searchString)){
+                this.items.push({
+                    id: item._id,
+                    name: item.ingredient.name,
+                    category: item.ingredient.category,
+                    quantity: item.quantity,
+                    unit: item.ingredient.unit
+                });
+            }
+        }
 
-//Create input allowing for user edit of ingredient
-let editIngredient = (id, row)=>{
-    let quantity = row.children[2];
-    let button = row.children[4].children[0];
-    let originalQuantity = quantity.innerText;
+        this.sortIngredients("name");
+        this.renderIngredients(this.items);
+    },
+
+    //Create input allowing for user edit of ingredient
+    editIngredient: function(id, row){
+        let quantity = row.children[2];
+        let button = row.children[4].children[0];
+        let originalQuantity = quantity.innerText;
+
+        let quantityInput = document.createElement("input");
+        quantityInput.type = "number";
+        quantityInput.step = "0.01";
+        quantityInput.value = quantity.innerText;
+
+        quantity.innerText = "";
+        quantity.appendChild(quantityInput);
+
+        button.innerText = "Save";
+        button.onclick = ()=>{this.updateOne(id, row, originalQuantity)};
+    },
+
+    //Save user input of ingredient
+    //Update both page and database
+    updateOne: function(id, row, originalQuantity){
+        let quantityField = row.children[2];
+        let quantity = quantityField.children[0].value;
+        let button = row.children[4].children[0];
+
+        quantityField.removeChild(quantityField.firstChild);
+
+        if(validator.ingredient.quantity(quantity)){
+            let updateIngredient = merchant.inventory.find(i => i._id === id);
+            updateIngredient.quantity = quantity;
+            axios.post("merchant/update", merchant)
+                .then((merchant)=>{
+                    banner.createNotification("The ingredient has been successfully updated");
+                })
+                .catch((err)=>{
+                    banner.createError("There was an error and the ingredient was not updated");
+                    console.log(err);
+                });
 
-    let quantityInput = document.createElement("input");
-    quantityInput.type = "number";
-    quantityInput.step = "0.01";
-    quantityInput.value = quantity.innerText;
+            quantityField.innerText = quantity;
+        }else{
+            quantityField.innerText = originalQuantity;
+        }
 
-    quantity.innerText = "";
-    quantity.appendChild(quantityInput);
+        button.innerText = "Edit";
+        button.onclick = ()=>{this.editIngredient(id, row)};
+    },
+
+    //Delete an ingredient from both the page and the database
+    removeIngredient: function(id, row){
+        axios.post("/merchant/ingredients/remove", {ingredientId: id})
+            .then(()=>{
+                for(let i = 0; i < this.items.length; i++){
+                    if(id === this.items[i].id){
+                        this.items.splice(i, 1);
+                    }
+                }
 
-    button.innerText = "Save";
-    button.onclick = ()=>{updateOne(id, row, originalQuantity)};
-}
+                row.parentNode.removeChild(row);
 
-//Save user input of ingredient
-//Update both page and database
-let updateOne = (id, row, originalQuantity)=>{
-    let quantityField = row.children[2];
-    let quantity = quantityField.children[0].value;
-    let button = row.children[4].children[0];
-
-    quantityField.removeChild(quantityField.firstChild);
-
-    if(validator.ingredient.quantity(quantity)){
-        let updateIngredient = merchant.inventory.find(i => i._id === id);
-        updateIngredient.quantity = quantity;
-        axios.post("merchant/update", merchant)
-            .then((merchant)=>{
-                banner.createNotification("The ingredient has been successfully updated");
+                banner.createNotification("The ingredient has been removed from your inventory");
             })
             .catch((err)=>{
-                banner.createError("There was an error and the ingredient was not updated");
+                banner.createError("There was an error and the ingredient has not been removed from your inventory");
                 console.log(err);
             });
+    },
 
-        quantityField.innerText = quantity;
-    }else{
-        quantityField.innerText = originalQuantity;
-    }
-
-    button.innerText = "Edit";
-    button.onclick = ()=>{editIngredient(id, row)};
-}
-
-//Delete an ingredient from both the page and the database
-let removeIngredient = (id, row)=>{
-    for(let i = 0; i < merchant.inventory.length; i++){
-        if(merchant.inventory[i]._id === id){
-            merchant.inventory.splice(i, 1);
-            break;
-        }
-    }
-
-    axios.post("/merchant/update", merchant)
-        .then((merchant)=>{
-            for(let i = 0; i < items.length; i++){
-                if(id === items[i].id){
-                    items.splice(i, 1);
-                }
-            }
-            banner.createNotification("The ingredient has been removed from your inventory");
-            renderIngredients();
-        })
-        .catch((err)=>{
-            banner.createError("There was an error and the ingredient has not been removed from your inventory");
-            console.log(err);
-        });
-}
+    //Display the modal to allow for adding a new ingredient
+    displayAdd: function(){
+        document.querySelector("#existingIngredient").style.display = "block";
+        document.querySelector("#quantityInput").style.display = "none";
+        document.querySelector("#newIngredient").style.display = "none";
+        document.querySelector("#createNew").onclick = ()=>{this.displayNew();};
 
-//Display the modal to allow for adding a new ingredient
-let displayAdd = ()=>{
-    document.querySelector("#existingIngredient").style.display = "block";
-    document.querySelector("#quantityInput").style.display = "none";
-    document.querySelector("#newIngredient").style.display = "none";
-    document.querySelector("#createNew").onclick = ()=>{displayNew();};
+        let modal = document.querySelector(".add-ingredient");
 
-    let modal = document.querySelector(".add-ingredient");
+        let removeModal = (modal)=>{modal.style.visibility = "hidden";}
 
-    let removeModal = (modal)=>{modal.style.visibility = "hidden";}
+        modal.onclick = ()=>{removeModal(modal);};
 
-    modal.onclick = ()=>{removeModal(modal);};
+        modal.style.visibility = "visible";
 
-    modal.style.visibility = "visible";
+        axios.get("/ingredients")
+            .then((ingredients)=>{
+                let tbody = document.querySelector("#existingIngredient table tbody");
 
-    axios.get("/ingredients")
-        .then((ingredients)=>{
-            let tbody = document.querySelector("#existingIngredient table tbody");
+                while(tbody.children.length > 0){
+                    tbody.removeChild(tbody.firstChild);
+                }
 
-            while(tbody.children.length > 0){
-                tbody.removeChild(tbody.firstChild);
-            }
+                for(let ingredient of ingredients.data){
+                    let row = document.createElement("tr");
+                    tbody.appendChild(row);
 
-            for(let ingredient of ingredients.data){
-                let row = document.createElement("tr");
-                tbody.appendChild(row);
+                    let name = document.createElement("td");
+                    name.innerText = ingredient.name;
+                    row.appendChild(name);
 
-                let name = document.createElement("td");
-                name.innerText = ingredient.name;
-                row.appendChild(name);
+                    let category = document.createElement("td");
+                    category.innerText = ingredient.category;
+                    row.appendChild(category);
 
-                let category = document.createElement("td");
-                category.innerText = ingredient.category;
-                row.appendChild(category);
+                    let unit = document.createElement("td");
+                    unit.innerText = ingredient.unit;
+                    row.appendChild(unit);
 
-                let unit = document.createElement("td");
-                unit.innerText = ingredient.unit;
-                row.appendChild(unit);
+                    let addButton = document.createElement("button");
+                    addButton.innerText = "Add";
+                    addButton.onclick = ()=>{this.configureAddIngredient(ingredient);};
+                    row.appendChild(addButton);
+                }
+            })
+            .catch((err)=>{
+                banner.createError("Failed to retrieve ingredients list");
+            });
+    },
+
+    configureAddIngredient: function(ingredient){
+        document.querySelector("#existingIngredient").style.display = "none";
+        document.querySelector("#quantityInput").style.display = "block";
+        document.querySelector("#newIngredient").style.display = "none";
+        
+        document.querySelector("#quantityInputTitle").innerText = `${ingredient.name} (${ingredient.unit})`;
+
+        let button = document.querySelector("#addIngredient");
+        let input = document.querySelector("#quantityInput input");
+
+        button.onclick = ()=>{this.addIngredient({ingredient: ingredient, quantity: input.value});};
+    },
+
+    displayNew: function(){
+        document.querySelector("#existingIngredient").style.display = "none";
+        document.querySelector("#quantityInput").style.display = "none";
+        document.querySelector("#newIngredient").style.display = "block";
+        document.querySelector("#createIngredient").onclick = ()=>{this.createIngredient();};
+    },
+
+    createIngredient: function(){
+        let newItem = {
+            ingredient: {
+                name: document.querySelector("#newName").value,
+                category: document.querySelector("#newCategory").value,
+                unit: document.querySelector("#newUnit").value
+            },
+            quantity: document.querySelector("#newQuantity").value
+        }
 
-                let addButton = document.createElement("button");
-                addButton.innerText = "Add";
-                addButton.onclick = ()=>{configureAddIngredient(ingredient);};
-                row.appendChild(addButton);
+        this.addIngredient(newItem);
+    },
+
+    //Update new ingredient on both the page and the database
+    //Close the modal
+    addIngredient: function(item){
+        if(validator.ingredient.all(item.ingredient, item.quantity)){
+            merchant.inventory.push(item);
+            if(item.ingredient._id){
+                axios.post("/merchant/ingredients/create", item)
+                    .then((newMerchant)=>{
+                        this.filter();
+                        banner.createNotification("The new ingredient has been successfully added to your inventory");
+                    })
+                    .catch((err)=>{
+                        banner.createError("There was an error and the ingredient could not be added to your inventory");
+                        console.log(err);
+                    });
+            }else{
+                axios.post("/ingredients/createone", item)
+                    .then((newMerchant)=>{
+                        this.filter();
+                        banner.createNotification("The new ingredient has been successfully added to your inventory");
+                    })
+                    .catch((err)=>{
+                        console.log(err);
+                        banner.createError("There was an error and the ingredient could not be added to your inventory");
+                    });
             }
-        })
-        .catch((err)=>{
-            banner.createError("Failed to retrieve ingredients list");
-        });
-}
-
-let configureAddIngredient = (ingredient)=>{
-    document.querySelector("#existingIngredient").style.display = "none";
-    document.querySelector("#quantityInput").style.display = "block";
-    document.querySelector("#newIngredient").style.display = "none";
-    
-    document.querySelector("#quantityInputTitle").innerText = `${ingredient.name} (${ingredient.unit})`;
-
-    let button = document.querySelector("#addIngredient");
-    let input = document.querySelector("#quantityInput input");
-
-    button.onclick = ()=>{addIngredient({ingredient: ingredient, quantity: input.value});};
-}
-
-let displayNew = ()=>{
-    document.querySelector("#existingIngredient").style.display = "none";
-    document.querySelector("#quantityInput").style.display = "none";
-    document.querySelector("#newIngredient").style.display = "block";
-    document.querySelector("#createIngredient").onclick = ()=>{createIngredient();};
-}
-
-let createIngredient = ()=>{
-    let newItem = {
-        ingredient: {
-            name: document.querySelector("#newName").value,
-            category: document.querySelector("#newCategory").value,
-            unit: document.querySelector("#newUnit").value
-        },
-        quantity: document.querySelector("#newQuantity").value
-    }
-
-    addIngredient(newItem);
-}
-
-//Update new ingredient on both the page and the database
-//Close the modal
-let addIngredient = (item)=>{
-    if(validator.ingredient.all(item.ingredient, item.quantity)){
-        merchant.inventory.push(item);
-        if(item.ingredient._id){
-            axios.post("/merchant/ingredients/create", item)
-                .then((newMerchant)=>{
-                    filter();
-                    banner.createNotification("The new ingredient has been successfully added to your inventory");
-                })
-                .catch((err)=>{
-                    banner.createError("There was an error and the ingredient could not be added to your inventory");
-                    console.log(err);
-                });
-        }else{
-            axios.post("/ingredients/createone", item)
-                .then((newMerchant)=>{
-                    filter();
-                    banner.createNotification("The new ingredient has been successfully added to your inventory");
-                })
-                .catch((err)=>{
-                    console.log(err);
-                    banner.createError("There was an error and the ingredient could not be added to your inventory");
-                });
         }
-    }
 
-    let modal = document.querySelector(".add-ingredient");
-    modal.style.visibility = "hidden";
+        let modal = document.querySelector(".add-ingredient");
+        modal.style.visibility = "hidden";
+    }
 }
 
-//Initial run 
-filter();
+inventoryPage.filter();

views/recipesPage/recipes.js

@@ -1,4 +1,5 @@
 let recipesPage = {
+    currentRecipe: {},
     //Display all recipes on a card
     displayRecipes: function(){
         document.querySelector("#recipes").style.display = "flex";
@@ -6,6 +7,8 @@ let recipesPage = {
 
         let body = document.querySelector("#recipesContainer");
 
+        currentRecipe = {};
+
         while(body.children.length > 0){
             body.removeChild(body.firstChild);
         }
@@ -42,17 +45,17 @@ let recipesPage = {
             tbody.removeChild(tbody.firstChild);
         }
 
-        let recipe = merchant.recipes.find(r => r._id === recipeId);
+        this.currentRecipe = merchant.recipes.find(r => r._id === recipeId);
 
-        document.querySelector("#addButton").onclick = ()=>{this.displayAdd(recipe)};
-        title.innerText = recipe.name;
+        document.querySelector("#addButton").onclick = ()=>{this.displayAdd(this.currentRecipe)};
+        title.innerText = this.currentRecipe.name;
 
         recipesDiv.style.display = "none";
         ingredientDiv.style.display = "flex";
 
-        for(let ingredient of recipe.ingredients){
+        for(let ingredient of this.currentRecipe.ingredients){
             let row = document.createElement("tr");
-            row.recipeId = recipe._id;
+            row.recipeId = this.currentRecipe._id;
             tbody.appendChild(row);
 
             let name = document.createElement("td");
@@ -73,7 +76,7 @@ let recipesPage = {
 
             let removeButton = document.createElement("button");
             removeButton.innerText = "Remove";
-            removeButton.onclick = ()=>{this.deleteIngredient(recipe._id, ingredient._id, row);};
+            removeButton.onclick = ()=>{this.deleteIngredient(recipeId, ingredient._id, row);};
             actions.appendChild(removeButton);
         }
     },
@@ -216,8 +219,9 @@ let recipesPage = {
         let button = row.children[2].children[0];
         button.innerText = "Edit";
         button.onclick = ()=>{this.editIngredient(row, ingredient);};
+        console.log(this.currentRecipe._id);
 
-        axios.post("/merchant/update", merchant)
+        axios.post("/merchant/recipes/ingredients/update", {recipeId: this.currentRecipe._id, ingredient: ingredient})
             .then((recipe)=>{
                 banner.createNotification("Ingredient successfully updated");
             })