diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 00000000..01625912 Binary files /dev/null and b/.DS_Store differ diff --git a/README.md b/README.md index 33c7e601..c9667972 100644 --- a/README.md +++ b/README.md @@ -1,11 +1,39 @@ -# Project Name +# JavaScript Pizzeria & Café Order System +This project is a hands-on exercise to practice handling user input, control structures, and basic order management in JavaScript. It implements a dynamic ordering system for a pizzeria and café using JavaScript. It allows users to choose from a range of food and drink options, while incorporating basic control flow techniques such as if, else, and switch statements. -Replace this readme with your own information about your project. Start by briefly describing the assignment in a sentence or two. Keep it short and to the point. +# Key Features +User Input: Collects the user’s name, food and drink preferences, and age to customize the order. -## The problem +Control Flow: Utilizes both if/else if and switch methods to handle different types of orders for food and drinks. -Describe how you approached to problem, and what tools and techniques you used to solve it. How did you plan? What technologies did you use? If you had more time, what would be next? +Age-based Size: Suggests meal sizes based on the user’s age (e.g., regular or kids' sizes). -## View it live +Flexible Options: Users can select from multiple food options (Pizza, Pasta, Salad) and drinks (Coffee, Lemonade, Juice). + +# How it works: +Start: The program begins by greeting the user and prompting them for their name. + +Food Ordering: The user chooses from a list of food items (Pizza, Pasta, Salad). Depending on their choice, they are asked to select the specific type of food. + +Age Input: Based on the user’s age, the program determines the appropriate size for their order (e.g., small for kids). + +Drink Ordering: Users can also choose a drink from Coffee, Lemonade, or Juice, with additional selection options. + +Confirmation: After selecting both food and drink, the user receives a confirmation of their order with size based on age. + +# Technical Details +Control Flow: The project showcases both if/else and switch control flow methods to handle multiple user inputs. -Have you deployed your project somewhere? Be sure to include the link to the deployed project so that the viewer can click around and see what it's all about +Comments & Flexibility: By commenting and uncommenting specific sections of code (such as the if/else or switch statements), the program can run in different configurations, showcasing flexibility between two methods of handling logic. + +# Files +index.html: The main HTML file containing the structure of the web page. + +style.css: The CSS file for basic styling. + +script.js: JavaScript code using if/else for order flow. + +switch.js: JavaScript code using switch statements for order flow. + +## View it live +https://pizza-pasta-salad.netlify.app/ diff --git a/code/.DS_Store b/code/.DS_Store new file mode 100644 index 00000000..f2711a3a Binary files /dev/null and b/code/.DS_Store differ diff --git a/code/assets/pizzeria.jpg b/code/assets/pizzeria.jpg new file mode 100644 index 00000000..fbbfdf18 Binary files /dev/null and b/code/assets/pizzeria.jpg differ diff --git a/code/index.html b/code/index.html index f7844d6b..eabd8748 100644 --- a/code/index.html +++ b/code/index.html @@ -1,18 +1,24 @@ - - - - Javascript Pizzeria - - - - -

Javascript Pizzeria

-

Logic is executed automatically

- - - + + + + + Javascript Pizzeria + + + + + +

Javascript Pizzeria

+

Logic is executed automatically

+ + + + + + + + \ No newline at end of file diff --git a/code/script.js b/code/script.js index 34ca0f34..f0f7f2e6 100644 --- a/code/script.js +++ b/code/script.js @@ -1,19 +1,132 @@ -// Start here - -// Step 1 - Welcome and introduction -// Your code goes here +// Welcome alert( `Welcome to our Javascript Pizzeria. Ready to Start? - Click 'OK' to begin.` ) -// Step 2 - Food choice -// Your code goes here +//Ask for the name +const name = prompt(`Please enter your name:`) + +//Introduction +alert( + `Hallo, ${name}! Are you ready to order? - Click 'OK'.` +) + +// Submit food choice +let firstOrder = '' +while (firstOrder !== '1' && firstOrder !== '2' && firstOrder !== '3') { + firstOrder = prompt(`What would you like to order? Please enter the number: + 1 - Pizza + 2 - Pasta + 3 - Salad`) + if (firstOrder !== '1' && firstOrder !== '2' && firstOrder !== '3') { + alert(`Please enter a valid number: 1, 2, or 3`) + } +} + +//The first order confirmation +if (firstOrder === '1') { + firstOrder = 'Pizza' +} +else if (firstOrder === '2') { + firstOrder = 'Pasta' +} +else if (firstOrder === '3') { + firstOrder = 'Salad' +} +alert( + `You would like to have ${firstOrder}. Is that correct?` +) + +// The second order +//Pizza Type +secondOrder = '' +if (firstOrder === 'Pizza') { + while (secondOrder !== '1' && secondOrder !== '2' && secondOrder !== '3') { + secondOrder = prompt(`What type of Pizza would you like to order? Please write the number: + 1 - Pizza Margherita + 2 - Pizza Pepperoni + 3 - Pizza Hawaiian`) + if (secondOrder !== '1' && secondOrder !== '2' && secondOrder !== '3') { + alert(`Pease enter a valid number: 1, 2, or 3`) + } + } -// Step 3 - Subtype choice -// Your code goes here + if (secondOrder === '1') { + secondOrder = 'Pizza Margherita' + } + else if (secondOrder === '2') { + secondOrder = 'Pizza Pepperoni' + } + else if (secondOrder === '3') { + secondOrder = 'Pizza Hawaiian' + } +} + +// Pasta Type +else if (firstOrder === 'Pasta') { + while (secondOrder !== '1' && secondOrder !== '2' && secondOrder !== '3') { + secondOrder = prompt(`What kind of Pasta would you like to order today? Please write the number: + 1 - Spaghetti + 2 - Carbonara + 3 - Lasagna`) + if (secondOrder !== '1' && secondOrder !== '2' && secondOrder !== '3') { + alert(`Please enter a valid number: 1, 2, or 3!`) + } + } + + if (secondOrder === '1') { + secondOrder = 'Spaghetti' + } + else if (secondOrder === '2') { + secondOrder = 'Carbonara' + } + else if (secondOrder === '3') { + secondOrder = 'Lasagna' + } +} + +// Salad Type +else if (firstOrder === 'Salad') { + while (secondOrder !== '1' && secondOrder !== '2' && secondOrder !== '3') { + secondOrder = prompt(`What kind of Salad would you love to order today? Please write the number: + 1 - Greek Salad + 2 - Fish Salad + 3 - Chicken Salad`) + if (secondOrder !== '1' && secondOrder !== '2' && secondOrder !== '3') { + alert(`Please enter a valid number: 1, 2, or 3!`) + } + } + + if (secondOrder === '1') { + secondOrder = 'Greek Salad' + } + else if (secondOrder === '2') { + secondOrder = 'Fish Salad' + } + else if (secondOrder === '3') { + secondOrder = 'Chicken Salad' + } +} + +alert( + `${secondOrder}, great choice!` +) // Step 4 - Age -// Your code goes here +let age = prompt(`To help us suggest the perfect meal size for you, could you please tell us your age, ${name}?`) + +// Check if age is not a number +while (isNaN(age)) { + alert(`Please enter a valid number`) + age = prompt(`Enter your age:`) +} +//Order +if (age >= 13) { + alert(`Thank you! You like to order ${secondOrder} regular size. Click 'Ok' to order.`) +} +else if (age < 13) { + alert(`Thank you.You like to order a kid's ${secondOrder}. Click 'ok' to order`) +} -// Step 5 - Order confirmation -// Your code goes here +// Order confirmation +alert(`Thank you for your order!`) diff --git a/code/style.css b/code/style.css index d384d122..2e5dd308 100644 --- a/code/style.css +++ b/code/style.css @@ -6,7 +6,8 @@ body { font-family: "Montserrat", sans-serif; - background: #0026ff; + background: black; + background-color: rgb(67, 55, 26); color: white; display: flex; justify-content: center; @@ -17,4 +18,4 @@ body { p { font-size: 1.5em; -} +} \ No newline at end of file diff --git a/code/switch.js b/code/switch.js new file mode 100644 index 00000000..08575095 --- /dev/null +++ b/code/switch.js @@ -0,0 +1,64 @@ +// Start +alert(`Please click 'ok' to start your order.`) + +// Getting the name +let name = prompt(`Please enter you name:`) + +// First order +let firstOrder = prompt(`Hi ${name}, welcome to the Café. Let's start with your order! What would you like to drink? + 1 - Coffee + 2 - Limonade + 3 - Juice + Please enter the number!`) + +// Second order +switch (firstOrder) { + case '1': + secondOrder = prompt(`You have selected Coffee. Please select the Coffee by writing the assigned number: + 1 - Café Latte Macchiato + 2 - Espresso + 3 - Cappuccino`) + break + case '2': + secondOrder = prompt(`You have selected Limonade. Please select the Limonade by typing 1, 2 or 3: + 1 - Coke + 2 - Fanta + 3 - Sprite`) + break + case '3': + secondOrder = prompt(`You have selected Juice. Please select the Juice: + 1 - Apple Juice + 2 - Tomato Juice + 3 - Orange Juice`) + break + + default: + alert(`Sorry, something went wrong. Please refresh and try again`) + break +} + +let age = prompt(`How old are you?`) + +// Order confirmation +let orderConfirmation = '' +if (firstOrder === '1') { + if (secondOrder === '1') orderConfirmation = 'Café Latte Macciato' + else if (secondOrder === '2') orderConfirmation = 'Espresso' + else if (secondOrder === '3') orderConfirmation = 'Cappuccino' +} else if (firstOrder === '2') { + if (secondOrder === '1') orderConfirmation = 'Coke' + else if (secondOrder === '2') orderConfirmation = 'Fanta' + else if (secondOrder === '3') orderConfirmation = 'Sprite' +} else if (firstOrder === '3') { + if (secondOrder === '1') orderConfirmation = 'Apple Juice' + else if (secondOrder === '2') orderConfirmation = 'Tomato Juice' + else if (secondOrder === '3') orderConfirmation = 'Orange Juice' +} + +// Ask for age of the user & send out confirmation of order +if (age <= 13) { + alert(`You like to order a small ${orderConfirmation}. Click 'ok' to confirm your order!`) +} else { + alert(`You like to order a big ${orderConfirmation}. Click 'ok' to confirm your order`) +} +alert(`Thank you for your order!`) \ No newline at end of file