CSS and Javascript

With this assignment we will end our work the client-side/browser-oriented aspects of the lab material. You will take this HTML file and write a CSS and JavaScript file for it. You are forbidden from modifying the HTML in any way.

Styling

With respect to styling, the expected result is that the web page will look like this.

In order to make the row of time slots at the beginning of every hour the same color you may need to look into the CSS Level 3 Attribute Selectors and use a suffix partial value selector.

JavaScript

Using what you learn from this tutorial, write the JavaScript file for this HTML document, allowing a user to add a new event to the calendar using the input fields and the button at the bottom of the page. The user should have total control over the name, day, time and duration of the event.
All your Javascript will have to be in an external JavaScript file, and no JavaScript should execute until the window.onload event has fired.

Marks

• Submission of the CSS file and the JS file (5%)
• Three column Layout: Getting the three column layout as shown in the image will be worth 10% (10%)
• Otherwise, the rest of the styling will be worth 15% (15%)
• Commenting and indentation will be worth 10%, so comment your work well or you will be marked poorly.(10%)
• In your readme file, explain why you have to define a window.onload event in the JavaScript source file. (10%)
• The Add New Event feature will be worth 40%. You are forbidden from using innerHTML property in this assignment. Use of innerHTML will result in a 20% penalty. (40%)
• Feedback: Your readme file should include information on concepts you stuggled with while writing this assignment. (5%)
• Demonstrating an understanding of the concepts behind HTML, CSS and Javascript (%5)

What to Submit

Submit an archive file which contains:

1. A readme.txt file
2. The JS file
3. The CSS file

You must submit a readme.txt file, which should include your name, your ENCS username, and your student ID number. If you don't you will be penalized by up to %20 in addition to losing marks for any missing work which would have been in the readme file.