Cupcake mini project
This assignment is to be carried out in groups. (If you work together in pairs on one computer, you have to take turns at the keyboard distributing time evenly). You must use github for your shared code repository and deploy the application on all of your linux servers (So that each member has a working application on their own server.)
Web shop
You are to develop a simple web-shop using MySql database, java servlets and jsp pages on the backend and html, css and javascript on the frontend.
The web shop sells cupcakes, but only as pick-up. Customers can use the web shop to place an order and then show up in person to pick up the cupcakes. Sending cupcakes in the mail has shown to be a bad idea as they turn up with bite marks if at all.
The bakery has a very fast cupcake-machine, so the instant the order is placed the cup cakes are ready for pickup.
The cupcakes have a bottom and a topping which can be combined in many ways, but a cup cake must always have both a bottom and a topping. Bottoms and toppings can be found in appendix A - The cupcakes.
Costumers each have an account with the shop and orders can only be placed if the account hold enough money to cover the price. Payment is handled by another system and as of now deposits will have to be handled manually in the database, but withdrawals happen when cupcakes are ordered.
In order to pay with their account the customers will have to use a username and a password to login before placing an order.
Let’s break the project down into steps:
1 Connect to database
Create a web application with a class which is responsible for the database connection. This class holds all the information needed to make a connection. You can use MySql server on your droplet on Digital Ocean to make the connection to. This will make it easier when you need to deploy the project and it means that all members of the group can connect to the same database.
2 Login
- Create a database and add a user table. A user has a username, a password and a balance fetched from the database.
- Create a class (a data mapper) that contains all methods that reads from and write to the database. In this class create a method, which takes a username sends a query to the database and then returns the corresponding user object if it exists or null if it does not.
- Create another method that can take email, username and password and create a new user.
3 Registration and login pages
- First make a JSP page called registration.jsp. In this page make a web form for the user to register information to the system.
- Now make a login page where the user can input a username and a password. Create a servlet that can handle the user input.
- Since the servlet handles both login and registration requests it should determine what to do based on the input parameter it receives. To make this easier let the 2 webforms send request parameters, that indicates what we want to do. E.g. “register” or “login”. This parameter can be send from the web form as a hidden input type (so the user never sees it). Now the servlet based on this ‘origin’ value can determine what to do (either call registration or login method). When a user is logged in he/she is forwarded to the shop page.
4 The shop
The shop shows who is logged in and the account balance of this user.
It also displays a list of all the cupcakes (bottoms and toppings) their prices and a button to order the cupcake and maybe an input where the user can write the desired number to order.
You will need to expand the database to hold cupcakes (see appendix A) – hint you might want to consider using more than one table.
A cupcake has a bottom, a top and a total price. (Unless you want to keep it very simple and just work with a list of Cupcakes. No toppings and buttons then just a list og cupcakes e.g. List
- You will need a Cupcake class to hold information about the cake, price etc.
- A data mapper class with methods to create top and buttom objects from the database. E.g.
List<Buttom> getAllButtoms();
- A servlet that can get the lists when requested from the products.jsp page.
- A products.jsp page that can show a list of buttoms and toppings with an Order button
5 The shopping cart
The shopping cart holds Line Items which has information of which cupcake (bottom and topping) and the quantity of cupcakes. The Line Item also has an invoice_id to prepare it for assignment 5.
- Create a ShoppingCart class that has a list of LineItems (create this class too)
- Create a servlet: ProductControl.java that can take information from the products.jsp (when a user clicks on a cupcake in the list) and create a LineItem with the cupcake and the desired number and add it to the ShoppingCart object (in the session)
- Create a JSP page: confirmation.jsp that we can send the user to when they have ordered cakes to tell them that we received the order and the total price of the order.
- In the products.jsp page add a button to send the order (when the shopping is done)
The shopping cart should be stored in the session (Why do you think?). When a cupcake is added, a new Line Item is created and added to the cart. If the user order the same cake twice we can add yet another LineItem (or the quantity of an already existing Line Item can be incremented).
- At the bottom of the products page add a list of all the LineItems in the shopping cart
- Add a Total price
6 The invoice
When cupcakes have been added to the cart the order can be finalized. This creates an invoice with an id and a customer(user). This invoice and all the Line Items in the shopping cart are stored in the database.
- Create the necessary tables in the database to persist the shopping cart
- Create a data mapper that can take the shoppingCart data and persist it to a final order in the DB with order date.
- Wrap the database inserts in a transaction to ensure that either the full order or no part of the order is persisted if something goes wrong.
- Create the necessary functionality in the ProductControl servlet so that we can receive message from the user that she wants to finalize her order.(when they click the checkout button on the products.jsp page.)
- You will need to calculate the total sum of the order and withdraw it from the users balance.
- If the user can’t afford it, the order is not saved and a message is returned to the user.
7 Customer page
- Create a page for the user who is logged in (has a session running). The page should show all the invoices for a particular user.
- On the top of the page show the name of the user that is logged in.
- If an invoice is clicked a new page invoiceDetails.jsp is sent to the user and it shows the invoice details for the chosen invoice
8 Admin page
The cake shop administrator needs to know which orders have been placed
- Extend the user table with 2 roles: customer and admin
- Make an admin page with a list of all the orders.
- When admin clicks on an order a new page is requested on the server containing the order details of that order.
9 Styling
- Style the user registration page (not using bootstrap) to have
- The form centered on the page
- The form inside a dark brown frame (hint: use div)
- Add a nice cupcake picture to the page
- Create a top menu with a logo and menu links to the pages
- Make the background color chocolate brown
- Make the font color: cream
- Implement the top menu in a way that it can be used on all the pages (hint jsp:include).
- Style the products page using bootstrap. Make it as attractive as you can. (hint: you can use a theme like on of these: https://startbootstrap.com/)
- Put the products inside an html table and style it with bootstrap so that it becomes zebra striped.
- Style the admin page with 2 bootstrap columns
- column 1 contains the list of orders
- column 2 contains the details of the order that was last clicked on
Appendix A - The cupcakes
The bottoms
Bottom | Price |
---|---|
Chocolate | 5.00 |
Vanilla | 5.00 |
Nutmeg | 5.00 |
Pistacio | 6.00 |
Almond | 7.00 |
The toppings
Topping | Price |
---|---|
Chocolate | 5.00 |
Blueberry | 5.00 |
Rasberry | 5.00 |
Crispy | 6.00 |
Strawberry | 6.00 |
Rum/Raisin | 7.00 |
Orange | 8.00 |
Lemon | 8.00 |
Blue cheese | 9.00 |