Update bottle unit to have an altUnit.

Updated in creation and updating.
Discovered error in unit conversion display.

controllers/ingredientData.js

@@ -7,12 +7,13 @@ module.exports = {
         ingredient: {
             name: name of ingredient,
             category: category of ingredient,
+            unit: String
+            altUnit: String (optional)
             convert: {
                 toMass: Number
                 toVolume: Number
                 toLength: Number
             }
-            unit: String
         }
             quantity: quantity of ingredient for current merchant,
     }
@@ -24,6 +25,7 @@ module.exports = {
             name: req.body.ingredient.name,
             category: req.body.ingredient.category,
             unit: req.body.ingredient.unit,
+            altUnit: req.body.ingredient.altUnit,
             convert: req.body.ingredient.convert,
             ingredients: []
         });
@@ -59,6 +61,7 @@ module.exports = {
             name: String
             category: String
             unit: String
+            altUnit: String (optional)
             convert: {
                 toMass: Number
                 toVolume: Number
@@ -76,6 +79,7 @@ module.exports = {
                 ingredient.category = req.body.ingredient.category;
                 ingredient.convert = req.body.ingredient.convert;
                 ingredient.unit = req.body.ingredient.unit;
+                ingredient.altUnit = req.body.ingredient.altUnit;
                 
                 //find and update ingredient on merchant
                 for(let i = 0; i < res.locals.merchant.inventory.length; i++){

models/ingredient.js

@@ -25,6 +25,10 @@ const IngredientSchema = new mongoose.Schema({
         type: String,
         required: true
     },
+    altUnit: {
+        type: String,
+        required: false
+    },
     convert: {
         toMass: Number,
         toVolume: Number,

views/dashboardPage/ejs/sidebars/editIngredient.ejs

@@ -23,11 +23,11 @@
 
     <label id="editSpecialLabel"></label>
 
-    <div class="lineBorder bottleHide"></div>
+    <div class="lineBorder"></div>
 
-    <h3 class="bottleHide">DEFAULT UNIT</h3>
+    <h3>DEFAULT UNIT</h3>
 
-    <div class="bottleHide" id="unitButtons"></div>
+    <div id="unitButtons"></div>
 
     <div class="lineBorder"></div>
 

views/dashboardPage/js/classes/Ingredient.js

@@ -24,11 +24,12 @@ class SubIngredient{
 }
 
 class Ingredient{
-    constructor(id, name, category, unit, subIngredients, convert, parent){
+    constructor(id, name, category, unit, altUnit, subIngredients, convert, parent){
         this._id = id;
         this._name = name;
         this._category = category;
         this.unit = unit;
+        this.altUnit = altUnit;
         this._subIngredients = [];
         this._parent = parent;
         this._convert = convert;
@@ -115,7 +116,7 @@ class Ingredient{
             case "mass": return ["g", "kg", "oz", "lb"];
             case "volume": return ["ml", "l", "tsp", "tbsp", "ozfl", "cup", "pt", "qt", "gal"];
             case "length": return ["mm", "cm", "m", "in", "ft"];
-            default: return [];
+            case "bottle": return ["ml", "l", "tsp", "tbsp", "ozfl", "cup", "pt", "qt", "gal"];
         }
     }
 }

views/dashboardPage/js/classes/Merchant.js

@@ -106,6 +106,7 @@ class Merchant{
                 ingredients[i].ingredient.name,
                 ingredients[i].ingredient.category,
                 ingredients[i].ingredient.unit,
+                ingredients[i].ingredient.altUnit,
                 ingredients[i].ingredient.ingredients,
                 ingredients[i].ingredient.convert,
                 this
@@ -252,6 +253,7 @@ class Merchant{
                 ingredient.name,
                 ingredient.category,
                 unit,
+                ingredients[i].ingredient.altUnit,
                 ingredient.ingredients,
                 ingredient.convert,
                 this

views/dashboardPage/js/sidebars/editIngredient.js

@@ -1,9 +1,11 @@
 let editIngredient = {
-
     display: function(ingredient){
         let buttonList = document.getElementById("unitButtons");
         let quantLabel = document.getElementById("editIngQuantityLabel");
+        let name = document.getElementById("editIngName");
+        let unit = ingredient.ingredient.unit;
 
+        name.focus();
         document.getElementById("editSubIngredients").onclick = ()=>{controller.openModal("editSubIngredients", ingredient.ingredient)};
 
         //Clear any existing data
@@ -12,25 +14,15 @@ let editIngredient = {
         }
 
         //Populate basic fields
-        document.getElementById("editIngTitle").innerText = ingredient.ingredient.name;
+        name.innerText = ingredient.ingredient.name;
         document.getElementById("editIngName").value = ingredient.ingredient.name;
         document.getElementById("editIngCategory").value = ingredient.ingredient.category;
-        quantLabel.innerText = `CURRENT STOCK (${ingredient.ingredient.unit.toUpperCase()})`;
+        quantLabel.innerText = `CURRENT STOCK (${unit.toUpperCase()})`;
         document.getElementById("editIngSubmit").onclick = ()=>{this.submit(ingredient)};
 
         //Populate the unit buttons
         let units = ingredient.ingredient.getPotentialUnits();
-        let hiders = document.querySelectorAll(".bottleHide");
-        if(units.length === 0){
-            for(let i = 0; i < hiders.length; i++){
-                hiders[i].style.display = "none";
-            }
-        }else{
-            for(let i = 0; i < hiders.length; i++){
-                hiders[i].style.display = "flex";
-            }
-        }
-
+        let ingredientUnit = (unit === "bottle") ? ingredient.ingredient.altUnit : unit;
         for(let i = 0; i < units.length; i++){
             let button = document.createElement("button");
             button.classList.add("unitButton");
@@ -38,37 +30,37 @@ let editIngredient = {
             button.onclick = ()=>{this.changeUnit(button, ingredient)};
             buttonList.appendChild(button);
             
-            if(units[i] === ingredient.ingredient.unit) button.classList.add("unitActive");
+            if(units[i] === ingredientUnit) button.classList.add("unitActive");
         }
 
         //Offer conversions
         let massDiv = document.getElementById("editIngMass");
         let volumeDiv = document.getElementById("editIngVolume");
         let lengthDiv = document.getElementById("editIngLength");
-        let multiplier = controller.unitMultiplier(controller.getBaseUnit(ingredient.ingredient.unit), ingredient.ingredient.unit);
+        let multiplier = controller.unitMultiplier(controller.getBaseUnit(unit), unit);
 
         massDiv.children[0].value = 1;
-        massDiv.children[1].innerText = ingredient.ingredient.unit.toUpperCase();
+        massDiv.children[1].innerText = (unit === "bottle") ? ingredient.ingredient.altUnit.toUpperCase() : unit.toUpperCase();
         massDiv.children[3].value = parseFloat((ingredient.ingredient.convert.toMass / multiplier).toFixed(3));
         massDiv.children[4].value = "g";
         massDiv.children[4].previousValue = "g";
         massDiv.children[4].onchange = ()=>{this.changeConversionSelect(massDiv)};
 
         volumeDiv.children[0].value = 1;
-        volumeDiv.children[1].innerText = ingredient.ingredient.unit.toUpperCase();
+        volumeDiv.children[1].innerText = (unit === "bottle") ? ingredient.ingredient.altUnit.toUpperCase() : unit.toUpperCase();
         volumeDiv.children[3].value = parseFloat((ingredient.ingredient.convert.toVolume / multiplier).toFixed(3));
         volumeDiv.children[4].value = "l";
         volumeDiv.children[4].previousValue = "l";
         volumeDiv.children[4].onchange = ()=>{this.changeConversionSelect(volumeDiv)};
 
         lengthDiv.children[0].value = 1;
-        lengthDiv.children[1].innerText = ingredient.ingredient.unit.toUpperCase();
+        lengthDiv.children[1].innerText = (unit === "bottle") ? ingredient.ingredient.altUnit.toUpperCase() : unit.toUpperCase();
         lengthDiv.children[3].value = parseFloat((ingredient.ingredient.convert.toLength / multiplier).toFixed(3));
         lengthDiv.children[4].value = "m";
         lengthDiv.children[4].value = "m";
         lengthDiv.children[4].onchange = ()=>{this.changeConversionSelect(lengthDiv)};
 
-        switch(controller.getBaseUnit(ingredient.ingredient.unit)){
+        switch(controller.getBaseUnit(unit)){
             case "g": 
                 massDiv.style.display = "none";
                 volumeDiv.style.display = "flex";
@@ -97,7 +89,8 @@ let editIngredient = {
     changeUnit: function(button, ingredient){
         //update current stock quantity
         let label = document.getElementById("editIngQuantityLabel");
-        label.innerText = `CURRENT STOCK (${button.innerText})`;
+        if(ingredient.ingredient.unit !== "bottle") label.innerText = `CURRENT STOCK (${button.innerText})`;
+        if(ingredient.ingredient.unit === "bottle") label.innerText = "CURRENT STOCK (bottle)";
         let input = document.createElement("input");
         input.id = "editIngQuantity";
         input.type = "number";
@@ -115,7 +108,6 @@ let editIngredient = {
         volumeDiv.children[1].innerText = button.innerText;
         lengthDiv.children[1].innerText = button.innerText;
         let multiplier = controller.unitMultiplier(document.querySelector(".unitActive").innerText.toLowerCase(), button.innerText.toLowerCase());
-        
     
         massDiv.children[0].value = parseFloat((massDiv.children[0].value * multiplier).toFixed(3));
         massDiv.children[3].value = parseFloat((massDiv.children[3].value * multiplier).toFixed(3));
@@ -142,7 +134,8 @@ let editIngredient = {
 
     submit: function(ingredient){
         let quantity = parseFloat(document.getElementById("editIngQuantityLabel").children[0].value);
-        let unit = (ingredient.ingredient.unit === "bottle") ? "bottle" : document.getElementById("unitButtons").querySelector(".unitActive").innerText.toLowerCase();
+        let selectedUnit = document.getElementById("unitButtons").querySelector(".unitActive").innerText.toLowerCase();
+        let unit = (ingredient.ingredient.unit === "bottle") ? "bottle" : selectedUnit;
 
         let massDiv = document.getElementById("editIngMass");
         let volumeDiv = document.getElementById("editIngVolume");
@@ -167,6 +160,7 @@ let editIngredient = {
         rightVolume *= controller.unitMultiplier(rightUnitVolume, controller.getBaseUnit(rightUnitVolume));
         rightLength *= controller.unitMultiplier(rightUnitLength, controller.getBaseUnit(rightUnitLength));
 
+        console.log(quantity);
         let data = {
             ingredient: {
                 id: ingredient.ingredient.id,
@@ -180,7 +174,7 @@ let editIngredient = {
                 }
             },
             quantity: quantity * controller.unitMultiplier(unit, controller.getBaseUnit(unit))
-        }
+        };
 
         switch(controller.getUnitType(unit)){
             case "mass": data.ingredient.convert.toMass = 1; break;
@@ -188,10 +182,13 @@ let editIngredient = {
             case "length": data.ingredient.convert.toLength = 1; break;
             case "bottle":
                 data.quantity = quantity / data.ingredient.convert.toVolume;
-                data.ingredient.convert.toMass = 1 / controller.toBase(rightMass / leftMass);
+                // data.ingredient.convert.toMass = 1 / controller.toBase(rightMass / leftMass);
                 data.ingredient.convert.toVolume = ingredient.ingredient.convert.toVolume;
-                data.ingredient.convert.toLength = 1 / controller.toBase(rightLength / leftLength);
+                // data.ingredient.convert.toLength = 1 / controller.toBase(rightLength / leftLength);
+                data.ingredient.altUnit = selectedUnit;
+                break;
         }
+        console.log(data);
 
         let loader = document.getElementById("loaderContainer");
         loader.style.display = "flex";

views/dashboardPage/js/sidebars/newIngredient.js

@@ -1,8 +1,10 @@
 let newIngredient = {
     display: function(){
-        const selector = document.getElementById("unitSelector");
+        let selector = document.getElementById("unitSelector");
+        let name = document.getElementById("newIngName");
 
-        document.getElementById("newIngName").placeholder = "NAME";
+        name.focus();
+        name.placeholder = "NAME";
         document.getElementById("newIngCategory").placeholder = "CATEGORY";
         document.getElementById("newIngQuantity").placeholder = "QUANTITY";
         document.getElementById("bottleSizeLabel").style.display = "none";
@@ -106,6 +108,7 @@ let newIngredient = {
                 let bottleUnit = document.getElementById("bottleUnits").value;
                 newIngredient.ingredient.convert.toVolume = 1 / controller.toBase(bottleQuant, bottleUnit);
                 newIngredient.quantity = quantityValue * controller.toBase(bottleQuant, bottleUnit);
+                newIngredient.ingredient.altUnit = bottleUnit;
                 break;
         }