CGS4854 Assignment 6
Due Thursday, 12/4 Saturday, 12/5
If you had any errors in Homework 5, then fix them, so that you don't lose
points twice for the same mistake.
A summary of this assignment is
-
Create and use a style sheet that can be seen from Apache and Tomcat.
-
Add new layout elements (lists and tables) to your HW5 application.
-
Add radio, checkbox and select elments that can be initialized and saved
along with all the other data.
-
Limit access on two Apache directories.
Apache
Start your Apache server.
-
Create a subdirectory of
docRoot
named styles
.
-
Limit access to this directory to you and to me.
-
Create a file named
cgs4854.css
in the styles
directory.
-
Change the default style for the entire page.
-
Change the color of the text.
-
Change the color of the background.
-
Change the font-family. Use at least three possible fonts; the last font
in the list should be a generic font family. Do not include more than one
generic font family in the list.
-
Change the default style for the
em
tag.
-
Use a relative size to make the size of the text larger.
-
Use a different text color.
-
Change the default style for the
input
and select
tags.
-
Use a monospace font.
-
Use the
font-family
tag.
-
Choose at least one specific font.
-
The last option in the list of fonts should be for a generic monospace font.
-
Change the text color.
-
Change the background color.
-
Create a style named
error
that can only be used with
strong
tags.
-
Use a relative size to make the size of the text larger.
-
Use a different text color.
-
Change the default ordering that is used for
ol
tags.
-
Do not change the style for any
li
tags.
-
Do not create a named style.
-
Choose one of upper-roman, lower-roman, upper-alpha, lower-alpha.
-
Change the default ordering for nested
ol
tags
(ol
tags inside ol
tags).
-
Do not change the style for any
li
tags.
-
Do not create a named style.
-
Choose one of upper-roman, lower-roman, upper-alpha, lower-alpha, decimal.
-
Create a style named
indent
that can only be used with paragraphs.
-
Set the right margin. Use a relative measurement.
-
Set the left margin. Use a relative measurement.
-
Change the default styles for
h1
and h2
tags.
-
h1
and h2
headings should use a different font
than the body. Use the font-family attribute and specify a very specific
font, a more common font and a generic font.
-
h1
and h2
headings should have center alignment.
-
Make all
h1
headings use upper case letters.
-
Make all
h2
headings use capitalized first letters for each
word in the heading.
-
Change the default style for hypertext links.
-
Change the text color.
-
Change the background-color.
-
Change the default style for visited hypertext links.
-
Change the text color.
-
Change the background-color.
-
Turn off the underline.
-
Use the style sheet in all pages that can be accessed from Apache, including
all the files for your username web application on Tomcat (except the manager).
-
Modify the
index.html
file.
-
Add some headings.
-
Create one
h1
heading at the top of the page.
-
Use several
h2
headings in the page. Place one before each of
your paragraphs in the page.
-
Do not use a heading for an entire paragraph.
-
A heading should contain just a few words.
-
Use several
em
tags throughout the page.
-
Use the
indent
style on one of the paragraphs.
-
Create a folder in
docRoot
named private
.
-
Limit access to this directory to you and to me.
-
Add an
index.html
file to the private
folder.
-
Add some descriptive paragraphs to the
index.html
file in the
private directory.
-
Add some headings.
-
Create one
h1
heading at the top of the page.
-
Use several
h2
headings in the page. Place one before each of
your paragraphs in the page.
-
Use several
em
tags throughout the page.
-
Use the
indent
style on one of the paragraphs.
-
Modify the error pages.
-
Add one
h1
heading to each error page.
-
Use your style sheet.
Complex Persistent Controller
Create a new package for this assignment in your username web app.
-
Do not change the files that were used for assignment 5.
-
Assignment 5 should still be accessible from the web app.
-
You may copy files from assignment 5 into this new package.
-
You may import files from assignment 5, if they are unchanged.
-
Modify your application so that it can initialize and store complex form
elements. Review the steps in Tutorial 6.
-
Add all the necessary files to the
shared
package.
-
Note that
HellperBaseCh6
should be placed in the
shared
package.
-
Add all the necessary JAR files to the Libraries folder.
-
Controller
-
Modify your controller so that it can handle GET and POST requests.
-
Modify your controller so that it has the init method.
-
Bean
-
Place the bean in the same package as the controller.
-
Maintain all the properties that are already in the bean for your project.
-
From HW5, modify the property that could only match one of several words.
-
Use the mutator to store the string in lower case letters. For instance,
if one of the options is skiing and the user enters Skiing,
then store it as skiing.
-
Be sure your program does not crash if the property is null or the string
is of length zero.
-
You have a choice of new properties to add:
-
You may add a radio group and a multiple selection list.
-
You may add a checkbox group and a single selection list.
-
If you want to add even more properties, you may; however, you must implement
at least the two that I have specified in the choices above.
-
In addition to the annotations that you needed for HW 5:
-
Mark any properties that return arrays so that they can be saved to the database
in a separate table.
-
Add annotations for radio groups, checkbox groups and select lists so that
they can be initialized easily in a JSP.
-
The bean should implement required validation.
-
The name of the class should be different than the name for the bean in Tutorial
6 and Homework 5.
-
Continue to implement all the validations from HW5.
-
Validate that the radio group or single selection list has a valid option.
-
If the associated property in the bean is numeric, then use min and max to
validate the range of the value.
-
If the associated property in the bean is a string, then user a regular
expression to validate it. Validate that it matches one of the string values
in the associated form element in the JSP. You will also need to validate
that it is not null (size 0 is not the same as null).
-
Validate that at least two options from the checkbox group or multiple selection
list have been chosen.
-
Look at the
Hibernate
validations. There is one there that can help you.
-
Remember that these types of elements are nullable: if nothing is checked
or selected, then there will be nothing in the query string. You will also
need to validate that it is not null (size 0 is not the same as null).
-
Modify all the messages in your validation annotations.
-
If some of your validation annotations (like NotNull, Min, Max and Range)
use the default message, then define your own message in those, too.
-
For the message string, mark it up with the
strong
HTML tag.
-
Set the class of the tag to
error
. You will create a tag in
your style sheet that will modify how the error text appears.
-
Controller Helper
-
Use a unique name, other than "helper" and different from the name used in
HW5, to save the controller helper in the session.
-
Modify
jspLocation
so that it returns the correct path for JSPs.
-
Change the name of the accessor for the data to something other than
getData.
-
Write the current data to the database when the process button is clicked.
-
Show all the records from the database in the view page.
-
Treat GET requests as the start of a new transaction.
-
Always show the edit page when a GET request is made.
-
Do not read the old data from the session when a GET request is made.
-
Treat POST requests as the continuation of a transaction.
-
Show the appropriate page based on the button that was clicked.
-
Read the old data from the session and copy it into the bean.
-
JSPs
-
There should be no hidden fields in any of the JSPs.
-
Use the Apache style sheet for all your JSPs.
-
Set the
href
in the link
tag to
"/styles/cgs4854.css"
-
This is the same
href
that is used in all your Apache pages.
-
If your style is in a different directory or has a different name, then modify
the
href
accordingly.
-
The style will only work when you access your site from your student host.
-
The style will only work when the web app is referenced via Apache.
-
The
/
in the href
always means the root of the
current server.
-
For Apache the root is
docRoot
, so /
equates to
docRoot
.
-
Your style sheet should be in
docRoot/styles/cgs4854.css
-
From Apache, the URL
"/styles/cgs4854.css"
equates to the physical
path docRoot/styles/cgs4854.css
-
The JSPs should be in a hidden directory, but not in the same directory as
the controller. Move the JSPs to an appropriate subdirectory of WEB-INF (not
under classes).
-
Modify all the EL statements
-
they should refer to the new name that you used to store the helper in the
session.
-
they should use the new name that you used to redefine the accessor for the
data.
-
Edit page
-
Use a table to organize the input elements so that they appear in a column.
-
Be sure that your new input elements are initialized with the values from
the bean. This means that radio groups and check box groups should be checked
according to the values that are in the bean; the same is true for selection
lists.
-
Display error messages for all properties that are not valid. Place all error
messages inside a
strong
tag with the class set to
error
. The errors should stand out on the page, based on your
style sheet.
-
Confirm page
-
Use the
em
tag to display the values from the bean.
-
Use nested ordered lists to display all the data in the bean.
Those elements that return arrays will use the inner nested list to display
all its values.
-
Process page
-
Use the
em
tag to display the values from the bean.
-
Use nested ordered list to display all the data in the bean.
Those elements that return arrays will use the inner nested list to display
all its values.
-
Do not display all the data from the database on this page.
-
There should be a button that allows the user to return to the edit page
and edit the data that was just entered into the database.
-
View page
-
Use a table to display all the data from the database.
-
The first row in the database should use a
th
tag for
each column name.
-
Use an unordered list to display those elements that have multiple
values.
-
There should be a button that allows the user to return to the edit page
and enter new data into the database.
-
Here is an example of how the pages might look:
Example Pages.
-
Be sure there is a hypertext link in the
index.jsp
page
to the controller. Use a relative link.
-
The web app must use the secure web.xml file and should only allow
you and me to access your application:
Edit tomcat users
-
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
Submitting the Assignment
Clean and Build your web application. After doing this, navigate to
the WAR file in NetBeans and verify that the .java files are included:
View WAR File
-
Since you are using a log file that is in the web application, you will need
to shut down Tomcat before you can do a Clean and Build.
-
Open the Services (Runtime in 5.5) folder and open the
Servers folder.
-
Right-click the Tomcat server and select Stop.
-
Now you can do a Clean and Build.
In the operating system (not in NetBeans) navigate to the dist folder in
the NetBeans project.
Deploy the WAR file on ocelot:
Deploy a WAR
File
-
After deploying, open the
WEB-INF/logs
directory in winscp or
on ocelot.
-
Change the permission of the
error.log
file to 606. This will
allow Tomcat to write to the file.
-
Use the manager to stop your web application and then start it again. This
will force it to reread the
web.xml
file so that the logger
can be initialized.
-
Access your application and visit all the pages, then verify that some new
messages have been added to the log file.
To hand in the assignment, zip the following directories into one ZIP file
and upload it.
-
Please delete your old ZIP file that you used to submit homework.
rm username.zip
Replacing username with your user name.
-
Please zip the following. Issue a separate ZIP command for each. All the
files will be added to the same ZIP file.
-
Please use the following command to compress your
cgs4854/webapps/username folder.
zip -r username cgs4854/webapps/username -x \*.jar \*.zip \*.war \*.log \*.nfs\*
Replacing username with your user name. This will create a file named
username.zip. It contains the username web application.
-
Please use the following command to compress your cgs4854/serverRoot
folder.
zip -r username ~/cgs4854/serverRoot -x \*.jar \*.zip \*.war
Replacing username with your user name. This will create a file named
username.zip. It contains the username web application.
-
Please use the following command to compress your cgs4854/docRoot
folder.
zip -r username ~/cgs4854/docRoot -x \*.jar \*.zip \*.war
Replacing username with your user name. This will create a file named
username.zip. It contains the username web application.
-
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/cs/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.