From 7e0ac0f93bd3ec2df081374c16ad52fbc08303e7 Mon Sep 17 00:00:00 2001
From: ruchi <ruchirawperera@gmail.com>
Date: Tue, 16 Feb 2021 22:34:08 -0500
Subject: [PATCH] added checklist

---
 index.html           | 41 ++++++++++++++++++++++-------------------
 scripts/groceries.js |  4 ++--
 scripts/main.js      |  2 +-
 3 files changed, 25 insertions(+), 22 deletions(-)

diff --git a/index.html b/index.html
index be4f6f4..e699cc2 100644
--- a/index.html
+++ b/index.html
@@ -26,26 +26,27 @@
     <div id="Client" class="tabcontent">
       <h3>Client Information</h3>
       <p>Hello, welcome to our grocery store. <br> 
-        We are here to help you choose the perfect groceries for your store.</p>
+        We are here to help you choose the perfect groceries.</p>
       <i><strong>Please Choose a Category:</strong></i>
-      <select
-        id="dietSelect"
-        name="dietSelect"
-        class="sumo"
-        onchange="populateListProductChoices(this.id, 'displayProduct')"
-      >
-        <option value=""></option>
-
-        <option value="Vegetarian">Vegetarian</option>
-        <option value="GlutenFree">Gluten Free</option>
-        <option value="VegetarianANDGluten-Free">
-          Vegetarian and Gluten-Free
-        </option>
-        <option value="Organic">Organic</option>
-        <option value="Non-organic">Non-Organic</option>
-        <option value="None">None</option>
-      </select>
+     
       <br>
+      <label for="category-foods1"> Vegetarian</label>
+      <input type="checkbox" id ="Vegetarian" value="Vegetarian" onchange="populateListProductChoices(this.id, 'displayProduct')">
+      <br>
+
+      <label for="category-foods1"> Gluten-Free</label>
+      <input type="checkbox" id="GlutenFree" value="GlutenFree" onchange="populateListProductChoices(this.id, 'displayProduct')">
+      <br>
+      <label for="category-foods1"> Organic</label>
+      <input type="checkbox" id="Organic" value="Organic" onchange="populateListProductChoices(this.id, 'displayProduct')">
+      <br>
+      <label for="category-foods1"> Non-Organic</label>
+      <input type="checkbox" id="Non-Organic" value="Non-Organic" onchange="populateListProductChoices(this.id, 'displayProduct')">
+      <br>
+      <label for="category-foods1"> None</label>
+      <input type="checkbox" id="None" value="None" onchange="populateListProductChoices(this.id, 'displayProduct')">
+      <br>
+     
       <i><strong>Please Choose a Characteristic:</strong></i>
       <select class="sumo" name="characterSelect">
         <option value=""></option>
@@ -86,7 +87,9 @@
     <div id="Cart" class="tabcontent">
       <h3>Shopping Cart</h3>
       <p>The items you have added to your list will appear here.</p>
-      <div id="displayCart"></div>
+      <div id="displayCart">
+         
+      </div>
 
       <div class="footer">
       <p class="copyright">
diff --git a/scripts/groceries.js b/scripts/groceries.js
index 88ed0b4..ab2ed39 100644
--- a/scripts/groceries.js
+++ b/scripts/groceries.js
@@ -101,13 +101,13 @@ function getProductImg(productName) {
 function restrictListProducts(prods, restriction) {
 	let product_names = [];
 	for (let i=0; i<prods.length; i+=1) {
-		if ((restriction == "Vegetarian") && (prods[i].vegetarian == true)){
+		if ((restriction === "Vegetarian") && (prods[i].vegetarian == true)){
 			product_names.push(prods[i].name);
 		}
 		else if ((restriction == "GlutenFree") && (prods[i].glutenFree == true)){
 			product_names.push(prods[i].name);
 		}
-		else if ((restriction == "VegetarianANDGluten-Free") && (prods[i].glutenFree == true) && (prods[i].vegetarian == true)){
+		else if ((restriction == "Vegetarian" && restriction == "GlutenFree") && (prods[i].glutenFree == true) && (prods[i].vegetarian == true)){
 			product_names.push(prods[i].name);
 		}
 		else if ((restriction == "Organic") && (prods[i].organic == true)){
diff --git a/scripts/main.js b/scripts/main.js
index 4035776..41f1297 100644
--- a/scripts/main.js
+++ b/scripts/main.js
@@ -63,7 +63,6 @@ function populateListProductChoices(slct1, slct2) {
 		// var itemPrice = getItemPrice(productName);
 		// label.appendChild(document.createTextNode(" $" + itemPrice));
 
-
 		s2.appendChild(label);
 		
 		// create a breakline node and add in HTML DOM
@@ -83,6 +82,7 @@ function populateListProductChoices(slct1, slct2) {
 	}
 }
 	
+
 // This function is called when the "Add selected items to cart" button in clicked
 // The purpose is to build the HTML to be displayed (a Paragraph) 
 // We build a paragraph to contain the list of selected items, and the total price