Subject Computer Science Web Development (HTML, XML, PHP, JavaScript, Adobe, Flash, etc.)

Question

Lab Exercise 5

Reminder: All programming and Web page development assignments for this course must be done using an ordinary ASCII text editor such as pico or vi. You may not use word processors, HTML, or wysiwyg editors.

Part 1; a simple slide show: Create a Web document called l5p1.html that displays one of the tool images in approximately the center of the page. Below the image, place three button elements labeled with the names of tools. (One of them must be the name of the tool you chose to display.) Pressing a button should change the displayed image to that of the tool named on the button. (Hint: There are at least two ways to do this that are discussed in the book. Think about the zIndex: and the visibility: property.) There is also a way that we discussed in class that's not in the book. You may use any of these three approaches, but please think about all three. Create a link to this document from your index page.

In no more than a couple of paragraphs, explain which of the possible techniques you chose and why you chose it. Place your write-up below the buttons, on the same page.

Part 2; slide show as sequence: Create a new document, l5p2.html by copying the document from Part 1 and change it so that there's only one button labelled "Next". Each time the button is pressed, the next image must replace the current one. Pressing the button while the last image is displayed should return the display to the first image and start the cycle over. (Hint: You already have 90% of this done when you completed Part 1; do not make this hard. Your want to count 0, 1, 2, 0, 1, 2, ... The modulus operator is your friend.) Create a link to this document from your index page.

Think of and describe at least two practical uses for displaying a sequence of images. Write no more than three or four paragraphs in HTML. Place your write-up below the "Next" button.

Part 3; validating form data: Create a new document called l5p3.html. It should have a form with a text input box for an email address and a Submit button. Submitting the form (either by clicking the button or pressing enter when the button has focus) should call a function that validates the email address. The function should use a regular expression to validate the email address and return true if valid, or use alert() to display an error message and return false if not.

If the function returns false, the form should not be submitted. Otherwise, submit the form to http://.../formtest.php.

Your regular expression should test for exactly this:

    One or more word characters
    Exactly one at-sign
    One or more word characters
    Exactly one period
    Two or more characters that are a-z, A-Z, 0-9, period, or hyphen

Note: Be sure you write the regular expression yourself. If you do a Google search for "regular expression email address" and copy someone elses regular expression, what you get will not meet the criteria above because real email addresses are much more complex than that. You are also quite likely to end up with a penalty grade for cheating.

Lab Exercise 6

Reminder: All programming and Web page development assignments for this course must be done using an ordinary ASCII text editor such as nano, pico or vi. You may not use HTML or wysiwyg editors.

Part 1, Learning about DTDs: Create a DTD for courses in a university. Each course element should have child elements department, course_name, course_number, instructor, course_type, time, and room. The course_type element must have attributes lab and lecture, each of which may have values true or false. Don't forget that you will need a declaration for your root element, too. You could name your root element something like "catalog" or "schedule." Name your DTD l6p1.dtd.

Validate your DTD using the DTD validator here: http://www.validome.org/grammar/ You will need to click the DTD radio button before clicking the "validate" button. The URL for your DTD will look something like .... Correct any errors in your DTD.

Part 2, How DTDs and XML documents go together: Create an XML document named l6p2.xml with at least three instances of the "course" element defined in the DTD of Part 1. At least one of the courses must have a lab component.

Put a DOCTYPE header in your XML file referring to your DTD. Assuming that your XML root element is named <courses>, the first three lines of your XML file will now look something like this:

    <?xml version="1.0" encoding="UTF-8" ?>
    <!DOCTYPE courses SYSTEM "" >
    <courses>

(Of course, you must put your user ID instead of mine in the link to the DTD, right?)

Validate your document using the Validome validator at http://www.validome.org/xml/validate/. You will be validating by URL. Correct any errors.

Display your document using the Firefox browser.

The Validome validator displays a link right under the "Document is valid" box. Place that link, with the text "L6P2" on your index document. I will use the link for testing.

Part 3, How XML Schemas are different from DTDs: Create an XML Schemas definition for your course structure. Put reasonable constraints on the various values. Name your schema l6p3.xsd and put it on the server.

Validate your schema using http://www.validome.org/grammar/ and correct any errors. Do not try to link your schema to your XML document. If you do that, I won't be able to test your DTD. Instead, use the Validome link (as in part 2) and put it on your index document as "L6P3."

Solution Preview

This material may consist of step-by-step explanations on how to solve a problem or examples of proper writing, including the use of citations, references, bibliographies, and formatting. This material is made available for the sole purpose of studying and learning - misuse is strictly forbidden.

<?xml version="1.0" encoding="utf-8"?>


<!ELEMENT course (department, course_name, course_number, instructor, course_type, time, room) >
<!ELEMENT department (#PCDATA) >
<!ELEMENT course_name (#PCDATA)>
<!ELEMENT course_number (#PCDATA)>
<!ELEMENT instructor (#PCDATA)>...

This is only a preview of the solution. Please use the purchase button to see the entire solution

Assisting Tutor

Related Homework Solutions

Get help from a qualified tutor
Live Chats