Fix creating or orders. Fix listing of orders.

views/dashboardPage/Merchant.js

@@ -60,7 +60,7 @@ class Transaction{
 class Order{
     constructor(name, date, ingredients, parent){        
         this.name = name;
-        this.date = date;
+        this.date = new Date(date);
         this.ingredients = [];
         this.parent = parent;
 
@@ -75,8 +75,6 @@ class Order{
                 }
             }
         }
-
-        this.parent.orders.push(this);
     }
 }
 
@@ -169,12 +167,12 @@ class Merchant{
     editRecipe(recipe, remove = false){
         let isNew = true;
 
-        for(let i = 0; i < merchant.recipes.length; i++){
-            if(recipe === merchant.recipes[i]){
+        for(let i = 0; i < this.recipes.length; i++){
+            if(recipe === this.recipes[i]){
                 if(remove){
-                    merchant.recipes.splice(i, 1);
+                    this.recipes.splice(i, 1);
                 }else{
-                    merchant.recipes[i] = recipe;
+                    this.recipes[i] = recipe;
                 }
 
                 isNew = false;
@@ -190,6 +188,37 @@ class Merchant{
         closeSidebar();
     }
 
+    /*
+    Updates a list of orders in the merchants list of orders
+    Create/edit/remove
+    orders = [Order object]
+    remove = will remove order when true
+    */
+    editOrders(orders, remove = false){
+        for(let i = 0; i < orders.length; i++){
+            let isNew = true;
+            for(let j = 0; j < this.orders.length; j++){
+                if(orders[i] === this.orders[j]){
+                    if(remove){
+                        this.orders.splice(j, 1);
+                    }else{
+                        this.orders[j] = orders[i];
+                    }
+
+                    isNew = false;
+                    break;
+                }
+            }
+
+            if(isNew){
+                this.orders.push(orders[i]);
+            }
+        }
+
+        ordersStrandObj.populate();
+        closeSidebar();
+    }
+
     /*
     Gets the indices of two dates from transactions
     Inputs

views/dashboardPage/components/addIngredients.ejs

@@ -49,7 +49,7 @@
     <template id="addIngredientsIngredient">
         <div class="addIngredientsIngredient">
             <p></p>
-            <button class="addButton" onclick="addIngredientsComp.addOne(this.parentElement)">+</button>
+            <button class="addButton">+</button>
         </div>
     </template>
 </div>

views/dashboardPage/components/components.js

@@ -167,101 +167,142 @@ let recipeDetailsComp = {
 
 let newOrderComp = {
     isPopulated: false,
+    unused: [],
 
     display: function(){
-        openSidebar(document.querySelector("#newOrder"));
-
         if(!this.isPopulated){
             let categories = merchant.categorizeIngredients();
             let categoriesList = document.querySelector("#newOrderCategories");
             let template = document.querySelector("#addIngredientsCategory").content.children[0];
             let ingredientTemplate = document.querySelector("#addIngredientsIngredient").content.children[0];
-
+    
             for(let i = 0; i < categories.length; i++){
                 let category = template.cloneNode(true);
-
+    
                 category.children[0].children[0].innerText = categories[i].name;
                 category.children[0].children[1].onclick = ()=>{addIngredientsComp.toggleAddIngredient(category)};
                 category.children[0].children[1].children[1].style.display = "none";
                 category.children[1].style.display = "none";
                 
                 categoriesList.appendChild(category);
-
+    
                 for(let j = 0; j < categories[i].ingredients.length; j++){
                     let ingredientDiv = ingredientTemplate.cloneNode(true);
-
-                    ingredientDiv.children[0].innerText = categories[i].ingredients[j].name;
-                    ingredientDiv.children[1].placeholder = categories[i].ingredients[j].unit;
-                    ingredientDiv._id = categories[i].ingredients[j].id;
-                    ingredientDiv._name = categories[i].ingredients[j].name;
-                    ingredientDiv._unit = categories[i].ingredients[j].unit;
-                    ingredientDiv._category = categories[i].name;
-                    
-                    let priceInput = document.createElement("input");
-                    priceInput.type = "number";
-                    priceInput.min = "0";
-                    priceInput.step = "0.01";
-                    priceInput.placeholder = "Price Per Unit";
-                    ingredientDiv.appendChild(priceInput);
-
+    
+                    ingredientDiv.children[0].innerText = categories[i].ingredients[j].ingredient.name;
+                    ingredientDiv.children[1].onclick = ()=>{this.addOne(ingredientDiv, category.children[1])};
+                    ingredientDiv.ingredient = categories[i].ingredients[j].ingredient;
+    
+                    this.unused.push(categories[i].ingredients[j]);
                     category.children[1].appendChild(ingredientDiv);
                 }
             }
 
             this.isPopulated = true;
         }
+
+        openSidebar(document.querySelector("#newOrder"));
+    },
+
+    addOne: function(ingredientDiv, container){
+        for(let i = 0; i < this.unused.length; i++){
+            if(this.unused[i] === ingredientDiv){
+                this.unused.splice(i, 1);
+                break;
+            }
+        }
+
+        let quantityInput = document.createElement("input");
+        quantityInput.type = "number";
+        quantityInput.placeholder = ingredientDiv.ingredient.unit;
+        quantityInput.min = "0";
+        quantityInput.step = "0.01";
+        ingredientDiv.insertBefore(quantityInput, ingredientDiv.children[1]);
+
+        let priceInput = document.createElement("input");
+        priceInput.type = "number";
+        priceInput.placeholder = "Price Per Unit";
+        priceInput.min = "0";
+        priceInput.step = "0.01";
+        ingredientDiv.insertBefore(priceInput, ingredientDiv.children[2]);
+
+        ingredientDiv.children[3].innerText = "-";
+        ingredientDiv.children[3].onclick = ()=>{this.removeOne(ingredientDiv, container)};
+
+        container.removeChild(ingredientDiv);
+        document.getElementById("newOrderAdded").appendChild(ingredientDiv);
+    },
+
+    removeOne: function(ingredientDiv, container){
+        this.unused.push(ingredientDiv.ingredient);
+
+        ingredientDiv.removeChild(ingredientDiv.children[1]);
+        ingredientDiv.removeChild(ingredientDiv.children[1]);
+        ingredientDiv.children[1].innerText = "+";
+        ingredientDiv.children[1].onclick = ()=>{this.addOne(ingredientDiv, container)};
+        
+        ingredientDiv.parentElement.removeChild(ingredientDiv);
+        container.appendChild(ingredientDiv);
     },
 
     submit: function(){
-        let categoriesList = document.querySelector("#newOrderCategories");
+        let categoriesList = document.getElementById("newOrderAdded");
+        let ingredients = [];
 
-        let newOrder = {
-            orderId: document.querySelector("#orderName").value,
-            date: new Date(document.querySelector("#orderDate").value),
-            ingredients: []
+        for(let i = 0; i < categoriesList.children.length; i++){
+            let quantity = categoriesList.children[i].children[1].value;
+            let price = categoriesList.children[i].children[2].value;
+
+            if(quantity !== ""  && price !== ""){
+                ingredients.push({
+                    ingredient: categoriesList.children[i].ingredient.id,
+                    quantity: parseFloat(quantity),
+                    price: parseInt(price * 100)
+                });
+            }
         }
 
-        for(let i = 0; i < categoriesList.children.length; i++){
-            for(let j = 0; j < categoriesList.children[i].children[1].children.length; j++){
-                let ingredientDiv = categoriesList.children[i].children[1].children[j];
-                let quantity = ingredientDiv.children[1].value;
-                let price = ingredientDiv.children[2].value;
-
-                if(quantity !== ""  || price !== ""){
-                    let newIngredient = {
-                        id: ingredientDiv._id,
-                        ingredient: ingredientDiv._id,
-                        quantity: parseFloat(quantity),
-                        price: parseInt(price * 100)
-                    }
+        let order = new Order(
+            document.getElementById("orderName").value,
+            document.getElementById("orderDate").value,
+            ingredients,
+            merchant
+        )
 
-                    newOrder.ingredients.push(newIngredient);
-                }
-            }
+        let data = {
+            orderId: order.name,
+            date: order.date,
+            ingredients: []
+        }
+
+        for(let i = 0; i < order.ingredients.length; i++){
+            data.ingredients.push({
+                ingredient: order.ingredients[i].ingredient.id,
+                quantity: order.ingredients[i].quantity,
+                price: order.ingredients[i].price
+            });
         }
         
-        if(validator.order(newOrder)){
-            fetch("/order", {
-                method: "POST",
-                headers: {
-                    "Content-Type": "application/json;charset=utf-8"
-                },
-                body: JSON.stringify(newOrder)
+        fetch("/order", {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json;charset=utf-8"
+            },
+            body: JSON.stringify(data)
+        })
+            .then(response => response.json())
+            .then((response)=>{
+                if(typeof(response) === "string"){
+                    banner.createError(response);
+                }else{
+                    merchant.editOrders([order]);
+                    banner.createNotification("New order created");
+                    // updateInventory(newOrder.ingredients);
+                }
             })
-                .then(response => response.json())
-                .then((response)=>{
-                    if(typeof(response) === "string"){
-                        banner.createError(response);
-                    }else{
-                        banner.createNotification("New order created");
-                        updateOrders(newOrder);
-                        updateInventory(newOrder.ingredients);
-                    }
-                })
-                .catch((err)=>{
-                    banner.createError("Something went wrong.  Try refreshing the page");
-                });
-        }
+            .catch((err)=>{
+                banner.createError("Something went wrong.  Try refreshing the page");
+            });
     },
 }
 
@@ -448,6 +489,7 @@ let addIngredientsComp = {
             for(let j = 0; j < categories[i].ingredients.length; j++){
                 let ingredientDiv = ingredientTemplate.content.children[0].cloneNode(true);
                 ingredientDiv.children[0].innerText = categories[i].ingredients[j].ingredient.name;
+                ingredientDiv.children[1].onclick = ()=>{this.addOne(ingredientDiv)};
                 ingredientDiv.ingredient = categories[i].ingredients[j].ingredient;
 
                 categoryDiv.children[1].appendChild(ingredientDiv);

views/dashboardPage/components/newOrder.ejs

@@ -18,5 +18,9 @@
 
     <div id=newOrderCategories></div>
 
+    <div class="lineBorder"></div>
+
+    <div id="newOrderAdded"></div>
+
     <button class="button" onclick="newOrderComp.submit()">Create</button>
 </div>

views/dashboardPage/orders.js

@@ -1,8 +1,8 @@
 window.ordersStrandObj = {
-    isPopulated: false,
+    isFetched: false,
 
     display: async function(){
-        if(!this.isPopulated){
+        if(!this.isFetched){
             window.orders = [];
 
             fetch("/order", {
@@ -21,44 +21,48 @@ window.ordersStrandObj = {
                             newOrders.push(new Order(
                                 response[i].name,
                                 new Date(response.date),
-                                response.ingredients,
+                                response[i].ingredients,
                                 merchant
                             ));
                         }
+                        merchant.editOrders(newOrders);
 
-                        let listDiv = document.querySelector("#orderList");
-                        let template = document.querySelector("#order").content.children[0];
-
-                        while(listDiv.children.length > 0){
-                            listDiv.removeChild(listDiv.firstChild);
-                        }
-
-                        for(let i = 0; i < merchant.orders.length; i++){
-                            let row = template.cloneNode(true);
-                            let totalCost = 0;
-                            
-                            for(let j = 0; j < merchant.orders[i].ingredients.length; j++){
-                                
-                                totalCost += merchant.orders[i].ingredients[j].quantity * merchant.orders[i].ingredients[j].price;
-                            }
-
-                            row.children[0].innerText = merchant.orders[i].name;
-                            row.children[1].innerText = `${merchant.orders[i].ingredients.length} items`;
-                            row.children[2].innerText = new Date(merchant.orders[i].date).toLocaleDateString("en-US");
-                            row.children[3].innerText = (totalCost / 100).toFixed(2);
-                            row.order = merchant.orders[i];
-                            row.onclick = ()=>{orderDetailsComp.display(merchant.orders[i])};
-
-                            window.orders.push(row);
-                            listDiv.appendChild(row);
-                        }
+                        isFetched = true;
                     }
                 })
                 .catch((err)=>{
+                    console.log(err);
                     banner.createError("Unable to retrieve your orders at the moment");
                 });
+        }
+    },
+
+    populate: function(){
+        let listDiv = document.querySelector("#orderList");
+        let template = document.querySelector("#order").content.children[0];
+
+        while(listDiv.children.length > 0){
+            listDiv.removeChild(listDiv.firstChild);
+        }
+
+        for(let i = 0; i < merchant.orders.length; i++){
+            let row = template.cloneNode(true);
+            let totalCost = 0;
+            
+            for(let j = 0; j < merchant.orders[i].ingredients.length; j++){
+                
+                totalCost += merchant.orders[i].ingredients[j].quantity * merchant.orders[i].ingredients[j].price;
+            }
+
+            row.children[0].innerText = merchant.orders[i].name;
+            row.children[1].innerText = `${merchant.orders[i].ingredients.length} items`;
+            row.children[2].innerText = new Date(merchant.orders[i].date).toLocaleDateString("en-US");
+            row.children[3].innerText = (totalCost / 100).toFixed(2);
+            row.order = merchant.orders[i];
+            row.onclick = ()=>{orderDetailsComp.display(merchant.orders[i])};
 
-            this.isPopulated = true;
+            window.orders.push(row);
+            listDiv.appendChild(row);
         }
     }
 }