Lab 4
Using
the YUI
Introduction
This week you will adapt your existing website to use the YUI toolkit, then leverage YUI to add snazzy additional features.
Grading
75% - meeting the basic requirements
25% - creativity / difficulty. You can expect creative use of a complex element (or multiple simpler elements) to earn more points than a single YUI button added to your page.
Instructions:
2. Here is what you what you want to have when you are finished. Suggested plan of attach for getting there is below:
4. Ensure your page works with Firefox. Having it work on IE is encouraged but not required.
5. Ensure all your pages validate and that you have met all requirements.
NOTE: all HTML files must validate as XHTML without errors for full credit. The penalty for a file that does not validate is 10%.
1) All of your files for Lab04 should be in a folder called "Lab04" (without the quotes) on the Web drive.
2) Your main page for Lab04 should be called "index.html" (without the quotes) and placed inside the folder Lab01.
3) Your instructor will assume that your web pages are viewable at http://www.mXXXXXX.it452.cs.usna.edu/Lab04/index.html where XXXXXX is your alpha number. You should check that this URL is viewable and that everything works correctly from a computer where somebody else is logged in. If you've goofed and linked to a file on your X drive, this will help you catch it!
4) All files must be complete and saved to your Web drive before you submit the hardcopy of your assignment. Do NOT modify your files after you have submitted your assignment.
5) Turn in the following hardcopy on or before the due date, stapled together in the following order (coversheet on top):
a) A completed assignment coversheet. Your comments will help us improve the course.
b) The first page of the output of the W3C validator, as run on the final version of your Lab04/index.html. This should show that your document correctly validated, but turn it in anyway if you can’t get your page to validate.
c) A printout of the source to your Lab04/index.html file (not the rendered page that you normally see with Internet Explorer/Firefox). Truncated lines are not acceptable – use Crimson Editor vice Notepad if needed for printing. You could also paste into Microsoft Word etc. if needed.
d) Printouts of external JavaScript files, if any.
1) What URLs to use to get the YUI stuff? You can either use:
a) The copies direct from YUI, e.g, a URL like http://yui.yahooapis.com/2.8.0r4/build/menu/menu-min.js
b)
The local copy of the latest YUI CSS and Javascript files. This is a URL like http://www.usna.edu/Users/cs/lmcdowel/courses/it452/yui/event/event.js
Why would you want to use the local copies? Either will work, but the local copy is
necessary if you want to use the debug version of a JavaScript file.
To convert between the URLs given in the YUI documentation to a local URL,
delete everything up to and including the “build” part of the address, then
replace the beginning with “/Users/cs/lmcdowel/courses/it452/yui/”. For
example, the URL
http://yui.yahooapis.com/2.8.0r4/build/button/button-min.js
would turn into
http://www.usna.edu/Users/cs/lmcdowel/courses/it452/yui/button/button-min.js
and the debug version is
http://www.usna.edu/Users/cs/lmcdowel/courses/it452/yui/button/button-debug.js
2)
Very helpful CGI
module: Add the following to the top of your Perl programs, and all kinds
of errors will now appear in the browser instead of the browser replying just
“CGI error”:
use
CGI::Carp qw(fatalsToBrowser warningsToBrowser);
3)
Remember also that, for IT452, this is required for all
Perl scripts:
use
strict;