From 40e32f0c8db5cfb7fa8f8e2466907eddd764c4ab Mon Sep 17 00:00:00 2001 From: Erin Leigh <123396256+erinnoliviaaa@users.noreply.github.com> Date: Wed, 27 Mar 2024 14:24:41 -0400 Subject: [PATCH] Add files via upload --- CAPSTONE/Breakfast.html | 89 +++++++++++++++++++++++++ CAPSTONE/Brunch.html | 90 ++++++++++++++++++++++++++ CAPSTONE/Dinner.html | 89 +++++++++++++++++++++++++ CAPSTONE/Lunch.html | 91 ++++++++++++++++++++++++++ CAPSTONE/README.md | 32 +++++++++ CAPSTONE/about.html | 46 +++++++++++++ CAPSTONE/aboutstyle.css | 72 +++++++++++++++++++++ CAPSTONE/foodFeedback.css | 109 +++++++++++++++++++++++++++++++ CAPSTONE/foodFeedback.html | 86 ++++++++++++++++++++++++ CAPSTONE/general-feedback.css | 90 ++++++++++++++++++++++++++ CAPSTONE/general-feedback.html | 111 +++++++++++++++++++++++++++++++ CAPSTONE/index.html | 45 +++++++++++++ CAPSTONE/rating.css | 27 ++++++++ CAPSTONE/ratingscript.js | 82 +++++++++++++++++++++++ CAPSTONE/script.js | 32 +++++++++ CAPSTONE/style.css | 115 +++++++++++++++++++++++++++++++++ 16 files changed, 1206 insertions(+) create mode 100644 CAPSTONE/Breakfast.html create mode 100644 CAPSTONE/Brunch.html create mode 100644 CAPSTONE/Dinner.html create mode 100644 CAPSTONE/Lunch.html create mode 100644 CAPSTONE/README.md create mode 100644 CAPSTONE/about.html create mode 100644 CAPSTONE/aboutstyle.css create mode 100644 CAPSTONE/foodFeedback.css create mode 100644 CAPSTONE/foodFeedback.html create mode 100644 CAPSTONE/general-feedback.css create mode 100644 CAPSTONE/general-feedback.html create mode 100644 CAPSTONE/index.html create mode 100644 CAPSTONE/rating.css create mode 100644 CAPSTONE/ratingscript.js create mode 100644 CAPSTONE/script.js create mode 100644 CAPSTONE/style.css diff --git a/CAPSTONE/Breakfast.html b/CAPSTONE/Breakfast.html new file mode 100644 index 0000000..2ee1b66 --- /dev/null +++ b/CAPSTONE/Breakfast.html @@ -0,0 +1,89 @@ + + + + + + + Capstone project + + + + + + + + + +
+

BREAKFAST

+
+ +
+ Eggs +
+ + + + + +
+ + + + +
+ +
+
+ Omelet +
+ + + + + +
+ +
+ + + +
+ +
+ + + +
+ +
+ + + + + + + \ No newline at end of file diff --git a/CAPSTONE/Brunch.html b/CAPSTONE/Brunch.html new file mode 100644 index 0000000..f8d371f --- /dev/null +++ b/CAPSTONE/Brunch.html @@ -0,0 +1,90 @@ + + + + + + + Capstone project + + + + + + + + + + +
+

BRUNCH

+
+ +
+ Chicken and Waffles +
+ + + + + +
+ + + + +
+ +
+
+ Bagel +
+ + + + + +
+ +
+ + + +
+ +
+ + + +
+ +
+ + + + + + + \ No newline at end of file diff --git a/CAPSTONE/Dinner.html b/CAPSTONE/Dinner.html new file mode 100644 index 0000000..8693cfb --- /dev/null +++ b/CAPSTONE/Dinner.html @@ -0,0 +1,89 @@ + + + + + + + Capstone project + + + + + + + + + +
+

DINNER

+
+ +
+ Rice and Chicken +
+ + + + + +
+ + + + +
+ +
+
+ Chicken Alfredo +
+ + + + + +
+ +
+ + + +
+ +
+ + + +
+ +
+ + + + + + + \ No newline at end of file diff --git a/CAPSTONE/Lunch.html b/CAPSTONE/Lunch.html new file mode 100644 index 0000000..48014e7 --- /dev/null +++ b/CAPSTONE/Lunch.html @@ -0,0 +1,91 @@ + + + + + + + Capstone project + + + + + + + + + +
+

LUNCH

+
+ +
+ Southern Fried Chicken +
+ + + + + +
+ + + + +
+ +
+
+ Meatloaf +
+ + + + + +
+ + +
+ + + + +
+ +
+ + + +
+ +
+ + + + + + + \ No newline at end of file diff --git a/CAPSTONE/README.md b/CAPSTONE/README.md new file mode 100644 index 0000000..c2f2a6e --- /dev/null +++ b/CAPSTONE/README.md @@ -0,0 +1,32 @@ +# CAPSTONE + +Members: +- Karam Hack +- Nicole Edoziem +- Xandria Bramble +- Erin Leigh + +# Topic +____________ +We will develop a website that provides real-time data on food available at the Cornell Campus Center (CC), and students who have already been to the CC will be able to fill it out. Our site will also have the option of giving feedback on the food specifically how it was in terms of taste and what could be added. Also, in the event that an item runs out and gets replaced with something else, students can also indicate if that food item is no longer on the website. This website won’t replace the current CC menu website but can be used as an extension/plugin by the actual menu website. + +# Motivation +____________ +Our motivation for selecting this as our project was to prevent students from traveling to the CC from a far distance and students needing clarification on what food was being served at the CC during the designated meal times (breakfast, lunch, and dinner). The motivation for this website is also based on the personal experiences of us Rollins students going to the CC and not finding anything appealing enough to eat based on our dietary preferences or allergies. We also want the online presence of the CC’s menu to be more accurate and readable. The availability of websites related to the Rollins campus is essential to provide students with up-to-date information. + +# Primary Objective +_____________ +This system will serve to provide more accurate and real-time data regarding the food available at the Cornell Campus Center. It will provide a better description and indication of what is available to help the students with allergies better select foods to eat. Some students also have about 5 swipes per week. Since swipes are non-refundable, our website can provide info about what is available to them before they physically come to the CC and potentially waste a swipe. Some students also live very far from the CC for example in the Sutton apartments or Holt. This website will serve to help minimize the amount of walking done by students. + +# Scope +_____________ + +Our overall goal is to create a website to help with the accuracy of the food in the dining hall at Rollins College. To begin, we will send out a survey to loyal dining hall users to see if they will use this website and benefit from it. The website can be accessed online from any device or browser, such as Safari, Google Chrome, etc. Faculty and students can use the website at any time of the day within proximity of Rollins College using an IP address. The website will have three different tabs or pages for the three different meal times: breakfast, lunch, and dinner. The data for the website will stay on for 24 hours from 12:00 A.M. to 11:59 P.M. Each page will consist of the meal name (breakfast, lunch, or dinner), a table of contents that scrolls to a different section on the website, the meals, and a feedback section. This will allow the users to voice their opinion on the food or upload a picture of the food for the day. For each food item on the website, there will be a thumbs up and thumbs down icon next to it. Users can click on an icon to indicate if the item is still there (thumbs up) or no longer available (thumbs down). The food item will be “grayed” out if there are 5 or more clicks on the thumbs down icon, confirming that the item is not available. The target market for our system is Rollins students, faculty, and staff who frequent the dining hall. To gauge interest in our system, we will send out surveys to groups of Rollins students, Faculty, and staff who use the dining hall to track if and how much they will use the website. As a strategy to promote our website, we will make posts about the website on our social media and put up flyers with a QR code linking to our website all around campus. + + + + + + + + diff --git a/CAPSTONE/about.html b/CAPSTONE/about.html new file mode 100644 index 0000000..d4afa3a --- /dev/null +++ b/CAPSTONE/about.html @@ -0,0 +1,46 @@ + + + + + + About page + + + + +
+

ABOUT US

+

We are a group of senior Computer Science majors who want to make a difference in accessing the menu for the CC. We want to improve the accuracy of the menu so other students who frequently use the CC will be able to know what food is and isn't available.

+
+ +
+
+

OUR MOTIVATION

+

Our motivation for selecting this as our project was to prevent students from traveling to the CC from a far distance and students needing clarification on what food was being served at the CC during the designated meal times (breakfast, lunch, and dinner). The motivation for this website is also based on the personal experiences of us Rollins students going to the CC and not finding anything appealing enough to eat based on our dietary preferences or allergies. We also want the online presence of the CC’s menu to be more accurate and readable. The availability of websites related to the Rollins campus is essential to provide students with up-to-date information.

+
+ +
+

OUR MISSION

+

This system will serve to provide more accurate and real-time data regarding the food available at the Cornell Campus Center. It will provide a better description and indication of what is available to help the students with allergies better select foods to eat. Some students also have about 5 swipes per week. Since swipes are non-refundable, our website can provide info about what is available to them before they physically come to the CC and potentially waste a swipe. Some students also live very far from the CC for example in the Sutton apartments or Holt. This website will serve to help minimize the amount of walking done by students.

+
+ +
+

OUR VALUES

+

We value accuracy and availabilty to students on campus.

+
+
+ +
+ +
+ +
+ +
+ + + \ No newline at end of file diff --git a/CAPSTONE/aboutstyle.css b/CAPSTONE/aboutstyle.css new file mode 100644 index 0000000..b015fca --- /dev/null +++ b/CAPSTONE/aboutstyle.css @@ -0,0 +1,72 @@ +body, h1, h2, p { + margin: 0; + padding: 0; + font-family: 'Arial', sans-serif; +} + +.header-container h1 { + background-color: #65B5FF; + color: black; + text-align: center; + padding: 20px 0; + font-size: 2em; +} + +.header-container p { + background-color: #f9f9f9; + color: #333; + padding: 20px; + border: 2px solid #65B5FF; + text-align: center; +} + +.content-container { + display: flex; + justify-content: space-between; + padding: 20px; +} + +.section { + width: 30%; + text-align: center; +} + +.section h2 { + background-color: #65B5FF; + color: black; + padding: 20px 0; + margin-bottom: 20px; +} + +.section p { + background-color: #fff; + color: #333; + padding: 20px; + border: 2px solid #65B5FF; + min-height: 150px; +} + +/* Feedback Button */ +.feedback-button{ + position: fixed; + bottom: 20px; + right: 20px; + background-color: white; + color: black; + padding: 10px 20px; + border-color: #65B5FF; + border-radius: 10px; + cursor: pointer; +} + +/* Home button */ +.material-symbols-outlined{ + position: fixed; + bottom: 10px; + left: 10px; + color: #65B5FF; + border: none; + background: none; + padding: 10px 10px; + cursor: pointer; +} \ No newline at end of file diff --git a/CAPSTONE/foodFeedback.css b/CAPSTONE/foodFeedback.css new file mode 100644 index 0000000..b97da07 --- /dev/null +++ b/CAPSTONE/foodFeedback.css @@ -0,0 +1,109 @@ +body, h1, h2, p { + margin: 0; + padding: 0; + font-family: 'Arial', sans-serif; + align-items: center; + text-align: center; +} + +.header-container h1 { + background-color: #66b5ff; + color: black; + text-align: center; + padding: 20px 0; + font-size: 2em; +} + +.header-container p { + background-color: #f9f9f9; + color: #333; + padding: 20px; + align-items: center; + border: 2px solid #65B5FF; + text-align: center; +} +.feedback-text{ + background-color: #f9f9f9; + color: black; + padding: 20px; + text-align: center; +} + +.content-container { + display: flex; + justify-content: space-between; + padding: 20px; +} + +.section { + width: 30%; + text-align: center; +} + + +.firstname{ + text-align: left; +} + +.lastname{ + text-align: center; +} +.email{ + text-align: right; +} + +.feedback{ + padding-left: 0; + margin-bottom: 0; +} + +.button { + border: none; + color: white; + padding: 10px 15px; + text-align: center; + text-decoration: none; + word-wrap: break-word; + display: inline-block; + font-size: 15px; + margin: 4px 2px; + transition-duration: 0.4s; + cursor: pointer; +} + +.button1 { + background-color: white; + color: black; + border: 2.5px solid #65B5FF; +} + +.button1:hover { + background-color: #65B5FF; + color: white; +} + +/* Feedback Button */ +.feedback-button{ + position: fixed; + bottom: 20px; + right: 20px; + background-color: white; + color: black; + padding: 10px 20px; + border-color: #65B5FF; + border-radius: 10px; + cursor: pointer; +} + + +/* Home button */ +.material-symbols-outlined{ + position: fixed; + bottom: 10px; + left: 10px; + color: #65B5FF; + border: none; + background: none; + padding: 10px 10px; + cursor: pointer; +} diff --git a/CAPSTONE/foodFeedback.html b/CAPSTONE/foodFeedback.html new file mode 100644 index 0000000..d038e86 --- /dev/null +++ b/CAPSTONE/foodFeedback.html @@ -0,0 +1,86 @@ + + + + + + + Food-Feedback + + + + + + + + +
+
+ + +
+

WE VALUE YOUR FEEDBACK

+
+ + +
+ +
+ +

+ + + +   +    + + +   +    + + +    + +

+

+

+

+ + + + +
+ \ No newline at end of file diff --git a/CAPSTONE/general-feedback.css b/CAPSTONE/general-feedback.css new file mode 100644 index 0000000..3572a47 --- /dev/null +++ b/CAPSTONE/general-feedback.css @@ -0,0 +1,90 @@ +body, h1, h2, p { + margin: 0; + padding: 0; + font-family: 'Arial', sans-serif; + align-items: center; + text-align: center; +} + +.header-container h1 { + background-color: #65B5FF; + color: black; + text-align: center; + padding: 20px 0; + font-size: 2em; +} +.header-container p { + background-color: #f9f9f9; + color: #333; + padding: 20px; + align-items: center; + border: 2px solid #65B5FF; + text-align: center; +} + +section { + display: inline-block; + width: 30%; + text-align: center; +} + + +.feedback-text { + background-color: #f9f9f9; + color: black; + padding: 20px; + text-align: center; +} + +.feedback-info { + font-weight: bold; + text-align: left; + padding: 20px; +} + +.feedback-form { + color: black; + padding: 20px; +} + +.button { + border: none; + color: white; + padding: 10px 15px; + text-align: center; + text-decoration: none; + word-wrap: break-word; + display: inline-block; + font-size: 15px; + margin: 4px 2px; + transition-duration: 0.4s; + cursor: pointer; +} + +.button1 { + background-color: white; + color: black; + border: 2.5px solid #65B5FF; +} + +.button1:hover { + background-color: #65B5FF; + color: white; +} + +.button-container { + text-align: center; +} + + +/* Home button */ +.material-symbols-outlined{ + position: fixed; + bottom: 10px; + left: 10px; + color: #65B5FF; + border: none; + background: none; + padding: 10px 10px; + cursor: pointer; +} diff --git a/CAPSTONE/general-feedback.html b/CAPSTONE/general-feedback.html new file mode 100644 index 0000000..35a7c18 --- /dev/null +++ b/CAPSTONE/general-feedback.html @@ -0,0 +1,111 @@ + + + + + + + General Feedback + + + + + + +
+

+ General Feedback +

+
+
+ + + +

+ + +   +    + + +   +    + + +    + + + +

+

+

+

+ + + + + +
+ +
+ + +
+ + + + +
+ + + + \ No newline at end of file diff --git a/CAPSTONE/index.html b/CAPSTONE/index.html new file mode 100644 index 0000000..6113eff --- /dev/null +++ b/CAPSTONE/index.html @@ -0,0 +1,45 @@ + + + + + + + Capstone project + + + + + +
+ + +
+ +
+ +
+ + + + \ No newline at end of file diff --git a/CAPSTONE/rating.css b/CAPSTONE/rating.css new file mode 100644 index 0000000..7868e8b --- /dev/null +++ b/CAPSTONE/rating.css @@ -0,0 +1,27 @@ +.rating{ + display: flex; + flex-direction: row-reverse; +} + +.rating-wrapper{ + display: inline-block; + margin-bottom: 20px; + padding: 0 10px; +} + +.rating span{ + cursor: pointer; + font-size: 50px; +} + +.rating span:hover{ + color: #65B5FF; +} + +.rating span[data-clicked]{ + color: #65B5FF; +} + +.rating span[data-clicked] ~ span{ + color: #65B5FF; +} \ No newline at end of file diff --git a/CAPSTONE/ratingscript.js b/CAPSTONE/ratingscript.js new file mode 100644 index 0000000..203ceaa --- /dev/null +++ b/CAPSTONE/ratingscript.js @@ -0,0 +1,82 @@ +// Access all span elements (such as the star) in a variable +let stars = document.querySelectorAll(".rating span"); + +// Access all div elements that have the class of ratings. + +let foods = document.querySelectorAll(".rating"); + +// creating an empty array ratings + +let ratings = []; + +// loop through the stars +for(let star of stars){ + star.addEventListener("click", function(){ + + + + //store all elements that involve the rating + let children = star.parentElement.children; + + // for every star clicked it turns false to prevent double rating + for(let child of children){ + if(child.getAttribute("data-clicked")){ + return false; + } + } + + // Redirect to the feedback page with the rating value + // Replace 'feedback_page_url' with the actual URL of your feedback page + window.location.href = `foodFeedback.html`; + + // Everytime we click on a star we make a data set and make it true when its clicked on. + this.setAttribute("data-clicked", "true"); + + // get the data rating value + + let rating = this.dataset.rating; + + // fetch the food id + + let foodId = this.parentElement.dataset.foodid; + + // fetch food name + let foodName = this.parentElement.dataset.foodname; + + console.log(rating, foodName, foodId); + + + // create a data table that will hold the rating number and the FoodItem Id + let data = { + "stars": rating, + "food-Id": foodId, + "food-Name": foodName + } + + // inserting the data object within the empty array + ratings.push(data); + + // storing it within local storage + localStorage.setItem("ratings", JSON.stringify(rating, foodName)) + }); +} + +// Fetch the ratings of the Food items +if(localStorage.getItem("rating")){ + ratings = JSON.parse(localStorage.getItem("rating")); + foodName = JSON.parse(localStorage.getItem("foodName")); + + // loop throught the ratings array + for (let rating of ratings){ + // loop through every food id in the page + for (let food of foods){ + if(ratings["food-Id"] == food.dataset.foodId){ + let reversedStars = Array.from(food.children).reverse(); + // fetch the number of stars given to the food item + let index = parseInt(rating["stars"]) - 1; + reversedStars[index].setAttribute("data-clicked", "true"); + } + } + } + +} \ No newline at end of file diff --git a/CAPSTONE/script.js b/CAPSTONE/script.js new file mode 100644 index 0000000..4f41699 --- /dev/null +++ b/CAPSTONE/script.js @@ -0,0 +1,32 @@ +var weekdayButton = document.getElementById("weekdayDropdown"); +var weekendButton = document.getElementById("weekendDropdown"); + +function toggleDropdown(dropdown) { + if (dropdown.style.display === "block") { + dropdown.style.display = "none"; + } else { + dropdown.style.display = "block"; + } +} + +document.querySelector('.navbar a[href="#weekday"]').addEventListener('click', function(event) { + event.preventDefault(); + toggleDropdown(weekdayButton); +}, false); + +document.querySelector('.navbar a[href="#weekend"]').addEventListener('click', function(event) { + event.preventDefault(); + toggleDropdown(weekendButton); +}, false); + +window.onclick = function(event) { + if (!event.target.matches('.dropbtn')) { + var dropdowns = document.getElementsByClassName("dropdown-content"); + for (var i = 0; i < dropdowns.length; i++) { + var openDropdown = dropdowns[i]; + if (openDropdown.style.display === "block") { + openDropdown.style.display = "none"; + } + } + } +} \ No newline at end of file diff --git a/CAPSTONE/style.css b/CAPSTONE/style.css new file mode 100644 index 0000000..68b57c9 --- /dev/null +++ b/CAPSTONE/style.css @@ -0,0 +1,115 @@ +html{ + margin: 0; + padding: 0; + height: 100; + width: 100; + box-sizing: border-box; +} + +.main{ + width: 100vw; + height: 100vh; + position: relative; + overflow: hidden; + /*background: #FFD465;*/ + background-image: url('https://www.rollins.edu/post-office/images/campus-center-entrance.jpg'); + background-size: cover; + background-position: center center; + background-repeat: no-repeat; + background-attachment: fixed; +} +nav{ + width: 100%; + position: sticky; + top: 0; + z-index: 1000; + background-color: #65B5FF; +} +.navbar { + display: flex; + justify-content: space-around; + align-items: center; + width: 100%; + padding: 10px 0; +} +.navbar a { + color: #333; + text-decoration: none; + padding: 14px 16px; + font-size: 17px; +} + +.dropdown { + position: relative; + display: inline-block; +} + +.dropbtn { + background-color: #65B5FF; + color: white; + padding: 14px; + font-size: 17px; + border: none; + cursor: pointer; +} + +.dropdown-content { + display: none; + position: absolute; + background-color: #f9f9f9; + min-width: 160px; + box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); + z-index: 1; +} + +.dropdown:hover .dropdown-content { + display: block; +} + + +.dropdown-content a { + color: black; + padding: 12px 16px; + text-decoration: none; + display: block; +} + +/* Feedback Button */ +.feedback-button{ + position: fixed; + bottom: 20px; + right: 20px; + background-color: white; + color: black; + padding: 10px 20px; + border-color: #65B5FF; + border-radius: 10px; + cursor: pointer; +} + +/* this is what I used for the title of the page for Lunch, Breakfeast, etc. +*/ +.title-text{ + text-align: center; + color: black; + margin-top: 20px; +} + +.header p{ + text-align: center; +} + + +/* Home button */ +.material-symbols-outlined{ + position: fixed; + bottom: 10px; + left: 10px; + color: #65B5FF; + border: none; + background: none; + padding: 10px 10px; + cursor: pointer; +} + +