commit 7f7e881eaba0b5bab75023531ac801d314f6985b Author: Batuhan Berk Başoğlu Date: Wed Feb 10 20:27:58 2021 -0500 first commit diff --git a/README.md b/README.md new file mode 100644 index 0000000..f388834 --- /dev/null +++ b/README.md @@ -0,0 +1,12 @@ +# SEG3125-LAB2 + +The website of a Sam's Grocery Store made by Ruchira Perrera, Sam Oyediran, Batuhan Basoglu, and Kene Ojukwu + +https://arctichawk1.github.io/SEG3125-LAB2/ + +# Authors + +- Batuhan Basoglu, 300001274 - ArcticHawk1 +- Ruchira Perrera, 8714992 - ruchirawp +- Sam Oyediran, 300016349 - soyed +- Kene Ojukwu, 300027974 - kene17 diff --git a/images/bread.png b/images/bread.png new file mode 100644 index 0000000..bacda6d Binary files /dev/null and b/images/bread.png differ diff --git a/images/broccoli.png b/images/broccoli.png new file mode 100644 index 0000000..8dfc4f9 Binary files /dev/null and b/images/broccoli.png differ diff --git a/images/carrot.png b/images/carrot.png new file mode 100644 index 0000000..573c8ca Binary files /dev/null and b/images/carrot.png differ diff --git a/images/cereal.png b/images/cereal.png new file mode 100644 index 0000000..3b96eb5 Binary files /dev/null and b/images/cereal.png differ diff --git a/images/cheese.png b/images/cheese.png new file mode 100644 index 0000000..12ee91e Binary files /dev/null and b/images/cheese.png differ diff --git a/images/chicken.png b/images/chicken.png new file mode 100644 index 0000000..6028861 Binary files /dev/null and b/images/chicken.png differ diff --git a/images/honey.png b/images/honey.png new file mode 100644 index 0000000..c5c41b8 Binary files /dev/null and b/images/honey.png differ diff --git a/images/logo.png b/images/logo.png new file mode 100644 index 0000000..1536772 Binary files /dev/null and b/images/logo.png differ diff --git a/images/onion.png b/images/onion.png new file mode 100644 index 0000000..cec7089 Binary files /dev/null and b/images/onion.png differ diff --git a/images/salmon.png b/images/salmon.png new file mode 100644 index 0000000..f2dfc74 Binary files /dev/null and b/images/salmon.png differ diff --git a/images/white-fish.png b/images/white-fish.png new file mode 100644 index 0000000..5cac5ab Binary files /dev/null and b/images/white-fish.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..1274b4c --- /dev/null +++ b/index.html @@ -0,0 +1,104 @@ + + + + + + + + +
+

Sam's Mart

+ mart-img +
+ + +
+ + + +
+ + +
+

Client Information

+

Tell us a bit about you.

+ Choose a Category: + +
+ Choose a Characteristic: + + +
+

+ Website created by Ruchira, Sam, Batuhan, and Kene +

+
+ +
+ +
+

Your targeted products

+

We preselected products based on your restrictions.

+ Choose items to buy: +
+ +
+

+ Website created by Ruchira, Sam, Batuhan, and Kene +

+
+ + +
+ +
+

Cart

+

Here is your cart.

+
+ +
+

+ Website created by Ruchira, Sam, Batuhan, and Kene +

+
+ +
+ + + + + + + + diff --git a/scripts/groceries.js b/scripts/groceries.js new file mode 100644 index 0000000..88ed0b4 --- /dev/null +++ b/scripts/groceries.js @@ -0,0 +1,144 @@ + +// Array of products, each product is an object with different fieldset +// A set of ingredients should be added to products + +var products = [ + { + name: "broccoli", + vegetarian: true, + glutenFree: true, + organic: true, + price: 1.99, + productImg: "images/broccoli.png" + }, + { + name: "bread", + vegetarian: true, + glutenFree: false, + organic: false, + price: 2.35, + productImg: "images/bread.png" + }, + { + name: "salmon", + vegetarian: false, + glutenFree: true, + organic: false, + price: 10.00, + productImg: "images/salmon.png" + }, + { + name: "carrot", + vegetarian: true, + glutenFree: true, + organic: true, + price: 2.63, + productImg: "images/carrot.png" + }, + { + name: "chicken", + vegetarian: false, + glutenFree: true, + organic: false, + price: 6.87, + productImg: "images/chicken.png" + }, + { + name: "cereal", + vegetarian: false, + glutenFree: false, + organic: false, + price: 2.97, + productImg: "images/cereal.png" + }, + { + name: "cheese", + vegetarian: false, + glutenFree: false, + organic: false, + price: 5.14, + productImg: "images/cheese.png" + }, + { + name: "white fish", + vegetarian: false, + glutenFree: true, + organic: false, + price: 13.50, + productImg: "images/white-fish.png" + }, + { + name: "honey", + vegetarian: false, + glutenFree: false, + organic: true, + price: 1.89, + productImg: "images/honey.png" + }, + { + name: "onion", + vegetarian: true, + glutenFree: true, + organic: true, + price: 2.22, + productImg: "images/onion.png" + } +]; + +products.sort(function(a, b) { + return a.price - b.price; +}) + +function getProductImg(productName) { + var prodVal = products.find(prod => prod.name === productName); + return prodVal.productImg; +} + + +// given restrictions provided, make a reduced list of products +// prices should be included in this list, as well as a sort based on price + +function restrictListProducts(prods, restriction) { + let product_names = []; + for (let i=0; i -1){ + totalPrice += products[i].price; + } + } + return totalPrice; +} + +function getItemPrice(chosenProduct){ + for (let i=0; i -1){ + return products[i].price; + } + } +} + diff --git a/scripts/main.js b/scripts/main.js new file mode 100644 index 0000000..a941a3a --- /dev/null +++ b/scripts/main.js @@ -0,0 +1,124 @@ + +// This function is called when any of the tab is clicked +// It is adapted from https://www.w3schools.com/howto/howto_js_tabs.asp + +function openInfo(evt, tabName) { + + // Get all elements with class="tabcontent" and hide them + tabcontent = document.getElementsByClassName("tabcontent"); + for (i = 0; i < tabcontent.length; i++) { + tabcontent[i].style.display = "none"; + } + + // Get all elements with class="tablinks" and remove the class "active" + tablinks = document.getElementsByClassName("tablinks"); + for (i = 0; i < tablinks.length; i++) { + tablinks[i].className = tablinks[i].className.replace(" active", ""); + } + + // Show the current tab, and add an "active" class to the button that opened the tab + document.getElementById(tabName).style.display = "block"; + evt.currentTarget.className += " active"; + +} + + + +// generate a checkbox list from a list of products +// it makes each product name as the label for the checkbos + +function populateListProductChoices(slct1, slct2) { + var s1 = document.getElementById(slct1); + var s2 = document.getElementById(slct2); + + // s2 represents the
in the Products tab, which shows the product list, so we first set it empty + s2.innerHTML = ""; + + // obtain a reduced list of products based on restrictions + var optionArray = restrictListProducts(products, s1.value); + + // for each item in the array, create a checkbox element, each containing information such as: + // + //