Introduction
Web的裸写大作业，做一个Cinemas，包括Image Gallery，Movies Selection，Movies Reservation，Shopping Cart等等功能页面，简单粗暴耗时，做了整整两天。30个得分点，每个一分，再加上bonus那滋味真是酸爽。
Requirement
1. PHP Conversion, Modularisation and SESSION
You were recommended to use fragments for Assignment 1, but this is now compulsory. Please make sure you have implemented fragments for Assignment 2.
All of your main pages must be converted to PHP and each page must be broken up into modules using functions such as include_once() ( or include() , require() , require_once() ).
You may elect to move common (ie repeated) sections of the website, such as the header, navigation, footer and even sidebar into a separate file.
The session must be running (ie available) on every page, ie session_start() should be near the top.
Note: At this stage you may not know what a Session is?- but this will become clearer as we proceed ahead and study more PHP.
2. jQuery Image Gallery on Home Page
Add an animated image gallery on the home page (index.php). The image gallery must be implemented using jQuery. The images featured in the image gallery should be contextual. Several implementations ( in terms of code and style ) exist on the Internet, please read about these and then implement one on the home page. An example will be covered during week 7’s collaborate chat.
3. Movies Selection Page
The client has selected set movies for the website. Your page should include content using jQuery OR Ajax to get the title, movie poster, movie trailer, plot summary, description, ratings information and times playing. Ideally, there should be Read More button next to each movie. When the user clicks on this button , a movie trailer and showtimes should be displayed.
Design hint: you may choose to list your movies in a few different methods. They may be in a row or column to make it responsive. Below is an example of what happens when you click the ‘Read More’ button for a certain movie, It will use use JavaScript / jQuery to show (.show()) further information about the movie. Another advanced idea would be to direct users to another page to see the further information, and use parameters in the url to get the movie ID.
4. Movies Reservation Page or Facility
Some of you may wish to build this facility into a modal window or another page. It is up to you how you implement this part. You will not lose marks if this is not a separate page.
It is recommended that you design this page or facility to process the MovieID, day and time of the movie from the movie service page (ie do not allow customers to pick the movie, day and time here a it will lead to logical complications).
A customer should be able to add reservations to their cart as follows:
- Multiple screenings (restrict to next 7 days no need for actual dates)
- Multiple seat types (ie adult, child, first class, bean bag types etc…)
- Multiple seats (you can restrict this to reasonable numbers, eg less than 10)
All reservation information should be stored in the SESSION array until the customer is ready to complete their order and “checkout” (more information in Section 5).
HINT: Use an associative array called ‘cart’ to store reservation information inside the SESSION. Look at Section 5 for an example of a good associative array structure.
5. Shopping Cart Page or Facility
Some of you may wish to build this facility into a modal window or another page. It is up to you how you implement this part. You will not lose marks if this is not a separate page.
The cart page must display a list of all the tickets that have been reserved, along with the quantity, pricing information, and with subtotals and total prices. Ideally, the client should be able to add seats and/or delete their reservations before finalising their bookings.
The total price for the cart must be calculated on the server side (ie using PHP) and the total price must be displayed on the cart page. This will ensure that the client can’t hack the price and give themselves cheap tickets or free tickets if the ticket price is calculated clientside.
At this stage, online purchasing is not required. The customers are only reserving the tickets, they must pay for them over the counter when they come to the cinema. There is also no need to check whether there are seats available in each session.
OPTIONAL: There are a number of extra marks available if you develop a seat reservation system that allows customers to pick their seats (row and number), or design a more sophisticated GUI system that makes sure that there are seats available for each session and stops customers from double reservation seats.
6. Meal and Movie Deal Voucher
The client has teamed up with a local restaurant for a meal & movie deal. Vouchers have already been printed and will be delivered to all the people in the town. Voucher codes are in the format:
12345 - 67890 - Z I ← These 2 letters are a “checksum” for each group of 5 digits
When a correct code is entered into a single reservation, a 20% discount is applied to applied to all reservations. All prices must be updated, eg on the cart page.
When an incorrect code is entered, no discount is applied and an error message is displayed. The client would like the the code to be checked clientside
for the correct format of digits, dashes and letters (using regular expression either by the HTML5’s input pattern, or by javascript / jQuery); but for security reasons would like the full validation checked serverside (ie away from the view of the public) according to the following algorithm:
CHK = ((1 x 2 + 3) x 4 + 5) % 26 = 25 [1st letter is ‘Z’]
CHK = ((6 x 7 + 8) x 9 + 0) % 26 = 8 [2nd letter is ‘I’]
Recommendation: Write both PHP function that takes a voucher code and returns true or false on the server side, and a regular expression that can check on the client’s side.
7. Customer Details
Before the customer can complete the reservation process, they are required to fill out their personal information in text and email inputs. The customer must provide their name in a text field (ie the field cannot be blank), an australian mobile phone number in a text field (use the regular expression you were discussed in TuteLab 7) and a valid email address in an email field.
All information must include client side validation, either via HTML5 Input Patterns or using Javascript / jQuery.
You can use different different HTML5’s input types and attributes such as pattern, required etc to achieve client side validation.
Server side validation of these fields is not a requirement for this assignment.
As a guide, a name should contain only azAZ characters with spaces, and the odd punctuation character for those Irish O’Really names etc. Australian mobile numbers begin with +614 or (04) or just 04 and may have spaces as well as numbers. Email addresses … just get the input type right!
8. Checkout and Reservation Completion
Once the seat reservation has been completed and the customer has entered their details, the following information must be stored in a flat text file, JSON or XML File.
Information that must be stored per reservation must include:
- Customer information (Name, Email and Phone Number)
- Each Screening Information (Movie Code, Day, Time)
- Seat information (Ticket Type, Price, Seat Number* for xFactor only ) for each session
- Total price per screening and the grand total for the reservation
- Voucher code if it is valid
- Barcode or unique ID are optional
Once tickets are booked, the customer should be presented with a confirmation message and printable tickets (can be DIVs displayed as part of a responsive page on a phone).
The first ticket for each session should contain the user details and the reservation summary information, the remaining tickets for each session should look like actual cinema tickets (a basic example can be found on next page).
Once the tickets are displayed, the user’s cart should be emptied so they can’t double book seats by mistake.
There is an extra mark available for designers, if your ticket design is of a very high standard, using different sized fonts, business logos, nice colours and backgrounds etc.
9 and 10. BONUS and xFactor Activities
View Ticket
Once a customer has finished the checkout process, they are given a unique ID (this can be a randomly generated number, at least 5 digits long and hard to guess) to view their tickets. For the users to view their tickets, they need to use their email address AND the randomly generated number to gain access to their tickets.
It is up to yourself how you want to build this system, but one idea is to use a GET request, where the URL parameters include the email and a token that is a 5 digit random number.
This also allows the user to bookmark the page for future use.
Reservation System
The concept of the seating reservation system is that a customer can reserve / allocate seats of their choosing (based upon the type of seats they have purchased). Once that seat for that allocated movie has been reserved, no one else can book it.
You can use a database (or something similar if you like).
You will also get extra mark for the design and another extra mark if the system remembers previously booked seats. Please refer to the marking allocation guide for further information.