Figure 10-1. The winestore application architecture
The main or home page of the online winestore is shown in Figures 10-1 and 10-2 and is labeled cart.1. This page allows the user to add bottles and cases of the three selected "hot new wines" to his shopping cart; this functionality is shown by the double-ended arrow to the add to cart script labeled cart.3. The cart.3 script is shown as a dashed rectangle in Figure 10-1, indicating that it's a one-component query module that has no output and instead redirects to the calling page.
The front page also allows the user to view his shopping cart by clicking on the cart icon or the View Cart button at the base of the page. View-the-cart functionality is provided by the cart.2 script introduced later in this section. Four other actions are also possible from the front page:
Searching the wines using the script search.1
Becoming a member or changing customer details using the customer.2 script
Emptying the cart using the cart.4 script
Logging in or logging out using the scripts order.1 and order.2, respectively
The customer management process is provided by five scripts. The customer.1, customer.2, and customer.3 scripts provide the become-a-member and change details features. The script customer.2 presents an empty customer
<form> to new customers. The
<form> allows entry of all customer details, including an email address that is used as the login name of the user and a password for future visits to the site. The customer.1 script validates customer data and, on success, writes to the database and redirects to the customer receipt script customer.3. On validation failure, customer.1 redirects to customer.2, where the validation errors are reported interleaved with the
For customers who are amending their details, the password and email
<input> widgets are omitted from the customer
<form>. For compactness, we have omitted password-change functionality from the online site. Other possible extensions to the password module include emailing password reminders to the user and emailing account activation details.
The remaining two customer scripts are shown in Figure 10-2. The login and logout scripts are shown, along with the three scripts from Figure 10-1 that interact with these scripts. The login script interacts with the user, while the logout script doesn't produce output but instead redirects to the home page.
Figure 10-2. More winestore application architecture
The script order.1 allows a user to provide his username and password credentials. On successful processing of credentials, the user is logged in. A logged-in user can then log out using the order.2 script. The order.2 logout script is a one-component script that always redirects the browser to the front page after the logout action.
The view cart script cart.2 shows the user the contents of his shopping cart. If the cart contains items, the quantities are presented in a
<form> environment that allows the user to make changes to quantities. Changing a quantity to zero deletes the item. To update changes in quantities, the cart.6 script is requested by clicking the Update Quantities button; this script redirects to cart.2, and either shows the user the correctly updated quantities or reports an error describing why the update failed. The user can also empty his cart completely by clicking on a button that requests the cart.4 script.
When logged in, orders are placed by clicking on the Make Purchase button in the view cart screen. When the button is clicked, the script order.3 is requested and the complex database processing used to finalize an order is performed; an overview of the purchasing process is presented in Chapter 3, and we outline the script in Chapter 12. If the ordering process fails, order.3 redirects to cart.2, where errors are reported. If the ordering process succeeds, order.3 redirects to shipping.1. The shipping.1 script sends the user an email confirmation of his order and redirects to shipping.2 which shows the user the same receipt as an HTML page. From shipping.2, the user can return to the home page.
The view cart script cart.2 also allows the user to return to the home page, search, log in, log out, or use the customer module.
The search.1 script allows the user to browse wines that are in stock. The user can also choose to browse a specific wine type-such as Red or White-and a specific region such as Margaret River. Bottles or cases of wine can be added to the shopping cart by clicking on a link that requests and passes parameters to the cart.3 script. As on the other main pages, the user can also click on buttons to view his cart, empty his cart, return to the home page, become a member, log in, log out, or update his membership details.
At the beginning of this section we stated that one important script was omitted from Figure 10-1 and Figure 10-2. This script is cart.5. This script is requested when a button is pressed on all pages that have more than one button, and it's responsible for redirecting the browser to the correct script. Each button is an
<input> element of type
submit, and all are elements of one
<form>. As there is only one
<form>, only one script can be specified as the
action attribute, and this script is cart.5. The script processes requests, identifies which button was clicked by inspecting the
name attribute of the
<input> element, and then redirects the browser to the appropriate script. Therefore, in practice, many arrows shown in Figure 10-1 and Figure 10-2 should actually pass via cart.5.
An alternative approach to redirection via cart.5 is to include multiple
<form> elements in a script or use embedded links instead of buttons. Both alternatives work well, but all approaches have drawbacks. The advantage of our approach is that buttons are intuitive for the user and the HTML is kept simple. The disadvantage is the extra HTTP response and request required for each redirection.
The winestore application can be used at either the web site or on your local server, if you have followed the instructions to install the examples in next tutorial.