Add some style to the display of locations.

views/dashboardPage/dashboard.css

@@ -607,6 +607,26 @@ ACCOUNT STRAND
         max-width: 500px;
     }
 
+    #settingsMerchants{
+        width: 85%;
+    }
+
+        .locationDiv{
+            width: 100%;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            padding: 0 25px;
+            background: rgb(240, 252, 255);
+            box-shadow: 0 0 10px black;
+            margin: 10px 0;
+        }
+
+            .locationDiv p{
+                font-size: 25px;
+                font-weight: bold;
+            }
+
     #accountShowPassword{
         max-width: 300px;
     }

views/dashboardPage/ejs/strands/account.ejs

@@ -54,5 +54,16 @@
                 <p>* This will log you out of all current sessions</p>
             </div>
         </div>
+
+        <template id="locationDiv">
+            <div class="locationDiv">
+                <p></p>
+
+                <div>
+                    <button class="button">USE</button>
+                    <button class="button">DELETE</button>
+                </div>
+            </div>
+        </template>
     </div>
 </div>

views/dashboardPage/js/classes/Merchant.js

@@ -3,12 +3,6 @@ const Recipe = require("./Recipe.js");
 const Transaction = require("./Transaction.js");
 const Order = require("./Order.js");
 
-const homeStrand = require("../strands/home.js");
-const ingredientsStrand = require("../strands/ingredients.js");
-const recipeBookStrand = require("../strands/recipeBook");
-const analyticsStrand = require("../strands/analytics.js");
-const ordersStrand = require("../strands/orders");
-
 class MerchantIngredient{
     constructor(ingredient, quantity){
         this._quantity = quantity;
@@ -414,6 +408,10 @@ class Merchant{
         return this._units;
     }
 
+    get owner(){
+        return this._owner;
+    }
+
     getRevenue(from, to = new Date()){
         const {start, end} = this.getTransactionIndices(from, to);
 

views/dashboardPage/js/strands/account.js

@@ -7,6 +7,16 @@ let account = {
 
         //Display alternate locations
         document.getElementById("settingsAddMerchant").onclick = ()=>{controller.openModal("newMerchant")};
+        let container = document.getElementById("settingsMerchants");
+        let template = document.getElementById("locationDiv").content.children[0];
+
+        for(let i = 0; i < merchant.owner.merchants.length; i++){
+            let div = template.cloneNode(true);
+            div.children[0].innerText = merchant.owner.merchants[i].name;
+            div.children[1].children[0].onclick = ()=>{this.switchMerchant(merchant.owner.merchants[i].name)};
+            div.children[1].children[1].onclick = ()=>{this.deleteMerchant(merchant.owner.merchants[i]._id)};
+            container.appendChild(div);
+        }
 
         //Handle the password changey stuffs
         let passButton = document.getElementById("accountShowPassword");
@@ -99,6 +109,14 @@ let account = {
             .finally(()=>{
                 loader.style.display = "none";
             });
+    },
+
+    switchMerchant: function(id){
+        console.log("switching");
+    },
+
+    deleteMerchant: function(){
+        console.log("deleting");
     }
 }