CGS4854, Homework 1

Due Tuesday, 10/8 (late 6am, 10/9)

You are to create a service oriented web site. You will be adding features throughout the semester. The type of service that you provide is your choice. For example, the site that was developed in the book kept track of a user's hobby and aversion. Try to be creative in picking your site. There are already enough book sellers on the web and one site that keeps track of hobbies is enough.

Choose a service that interests you. Later in the course, you will be adding additional fields to this site. Choose a theme that supports

• an integer
• a floating point number
• a calculation using these numbers

On each page of the application, add interesting information about your site. Each page must have different information about the site. The information must not be about how to navigate to the next page.

You will deploy your application to the Tomcat server and access it from the Apache server

Apache

Set up and start your Apache server.

• Request a port and start your server.
• Configure your server.
• Add JkMount directives to the httpd.conf file for the following.
  • All paths that start with /manager/*
  • All paths that start with /username/*
  • The path /username
  • All JSPs.
  • If you have one, add a JkMount for your extra credit web app.
  • Remove the JkMount for examples.
• Add a folder named styles in the docRoot folder. You may modify the style sheet from extra credit 4.
  • Add a stylesheet to the folder.
  • In the stylesheet, set the default background color and text color.
  • Use contrasting colors so the text can be read easily.
  • Define a different background color and text color for h1 tags.
  • Set a default font using the font-family style. Choose at least three options for the font. The last option should be one of the generic fonts. All the fonts should share the same generic quality.
• Add an index.html (not .jsp) page to the docRoot directory. The file is HTML not a JSP.
  • Include all the standard tags.
  • Include a heading in an h1 tag.
  • Include a paragraph with at least 25 words, explaining your web site. This is a general explanation, it should not contain any information about the homework assignment.
  • Include a relative link to the root of your web application for homework.
  • Incude a relative link to the root of your web application for extra credit, if you created one.
  • Include a relative link to manager/html.
  • Include a relative link to the style sheet.
  • Use the stylesheet for this page.
  • Validate the page.
  • Validate the style sheet.

ROOT Web Application on ocelot

If you have not received your Tomcat host number, please create your webapps on ocelot and request a host number.

After you have created the ROOT and manager web apps on ocelot, you will need to create an index. jsp file in the ROOT web app. This will be the welcome page for your host on ocelot. It should have links to the manager web app, the username web app and your Apache server. If you have done the extra credit, then also include a link to the extra credit web app.

Be sure you have the following links in the ROOT/index.jsp file on ocelot.

• Relative link to manager/html.
• Relative link to the root of your web application for homework.
• Relative link to the root of your web application for extra credit (if you have one).
• Add an absolute link to your student host using your Apache port.

Create a Web Application using NetBeans

Create a web application in NetBeans, named your-username (replace your-username with your user name).

• If there is not a web.xml file in the WEB-INF folder, then select New File -> Web -> Standard Deployment Descriptor (web.xml) from the NetBeans menu.
• Use the secure web.xml file.
• Restrict access to this web site to you and me (this is controlled by the secure web.xml file)
• Edit the tomcat users file so that you can access your app in your local NetBeans.
• Modify the index.jsp that is in the root of the web app. Be sure it uses the HTML 5 DOCTYPE and Meta tags.
  • Add a paragraph of at least 50 words that describes the service that you are providing. This paragraph must be different from the sentences in the index.html file in the docRoot.
  • Validate the JSP at http://www.w3c.org.
  • Use a relative reference to the Apache stylesheet on each page in the web app. The reference will not work when run from Tomcat. The stylesheet only needs to work when the page is accessed from Apache.
  • Add a link to the controller for this assignment.

Reorganised Controller

Implement a servlet controller for your application. The controller should behave like the reorganised controller from Chapter 3 of the book.

• All the JSPs in the application should use the stylesheet. The stylesheet only needs to work when the pages are accessed from Apache. This is different from extra credit 3: the stylesheet is in the Apache root, not in your web application. Since the style sheet is located in the root of the server, it is good to use a relative reference that is relative to the root, instead of one that is relative to the current location.
• Modify Edit.jsp. Instead of the Hobby property that is used in the book, use three properties of your choice. These properties should be useful in the web site that you are developing.
  • Do not use first name and last name. Be creative.
  • Think of a web site that you would like to create and pick three properties that are specific to that type of service.
  • Later in the course, you will be adding additional fields to this site for an integer, a floating point number and a calculation using these numbers. Think of a site that will be able to be expanded in this way.
  • Add default validation to at least one field.
  • Do not use a default value like "No Hobby" or "No Aversion". Choose a valid default value that makes sense in your site. You must test for more than null and empty.
  • The user will enter data into the fields in the Edit page. Initialize the input elements with the corresponding data from the bean.
• In addition to the Edit, Confirm and Process pages, create another JSP that will also display the data that is sent to it.
  • Name the page WishList.jsp.
  • The wish list page will display the data from the fields that are sent to it, but will not let the user edit them. Eventually, this is a page where users will be able to store information, without purchasing it.
  • Add an appropriate description to this page for your web application. If you do not have a good description, then you will lose points.
  • Add buttons to the wish list page that can send the user's data back to the edit page or to the confirm page. Do not add a button for the process page.
  • Add a button to the confirm page that can send the user's data to the wish list page. This is a new button, in addition to the edit and process buttons.
• Each JSP should have a different paragraph of 25 words, explaining something about your site. The words should not explain how to navigate to a new page or how to enter data. Add information about the advantages, features, benefits of your site. Each page must have a different paragraph.
• Each page must have a heading in an h1 tag.
• Bean
  • Place the bean in the same package as the controller.
  • Create a bean that has properties for the fields in your web application.
  • Add default validation for at least one field. You do not need default validation for all the fields, but you may validate all fields.
  • Add an accessor to the bean that returns a string containing for all the values from the properties in the bean in a complete sentence. Do not add a variable for this method. It is only a helper method.
  • Use this new accessor to echo the value of the fields in the Confirm, Process and WishList JSPs.
• Create a controller helper for the web application.
  • Place it in the same directory as the controller.
  • Modify the controller helper so that it can process all four of your pages.
  • Modify the controller helper so that it uses your bean and initializes your bean with the data in the query string.
  • Change the name that is used to store the helper in the session (do not use "helper"). This will change how you access your data in the JSPs.
  • Change the name of the getData method in the controller helper. This will change how you access your data in the JSPs.
• Place the helper base file in the same directory as the controller. Do not make any changes to the helper base file.
• Rewrite the controller so that it uses a controller helper.
• Place your JSPs in a visible subdirectory. Modify the pages so that they use the helper in the session to access the bean and its properties.
• Validate all the pages at w3.org.
• The web app must use the secure web.xml file and should only allow you and me to access your application: Edit tomcat users
• Create a servlet definition and servlet mapping in the web.xml file for the servlet. Do not use the WebServlet annotation.
• Be sure to modify the project so that the .java files are placed in the WAR file: Configuring WAR File
• After the app is running in NetBeans, upload it and run it on ocelot: Uploading a WAR file

Hand In Assignment

To hand in the assignment, zip the cgs4854 directory and upload it.

• Please use the following command to compress your cgs4854 folder.
  zip -r username ~/cgs4854 -x \*.jar \*.zip \*.war
  Replacing username with your user name. This will create a file named username.zip. It contains the ROOT, manager and username web applications.
• Check the size of the ZIP file, it should be less than 3 MB. If it is not, then you probably have another ZIP file stored in the ZIP archive. Delete it and re-zip.
• You then have a choice for submitting the file.
  • If you are logged onto ocelot, use my uploading program to upload the file. Enter this command at the command prompt:
    ~downeyt/public/webftp/webftp.pl
  • If you are using winscp, then download the zip file to your computer; then, upload the file to me: Submitting homework on-line via the Web.
• Upload the file as binary.

Be sure that all your files and subdirectories are included in the zip file.
After uploading, do not modify your files on ocelot until after your assignment has been graded.