Old Colby Seal
CS 325: Web Programming
(Spring 2014)

Syllabus

Teachers

Assignments
Assignments


Other Pages

Project 4:
Persistent Changes and Auto-Updating


Assigned: Thu Apr 17 2014
Due: 10:59:00 AM on Fri May 09 2014
Team Size: 3 or 4
Language: HTML + CSS + PHP + JavaScript + Ajax + SQL
Out of: 200 points


In this project, you will use JavaScript to make server requests to fetch new information that has been submitted since the page was loaded.

Part 0, 20 points: Add a new page where users can add comments or questions or some other new content. You will want other users to be able to comment on this new content, so choose something appropriate for your page.

Part 1, 20 points: Make the update to the new content persistent: users should see their content even after a page refresh.

Part 2, 20 points: Add the ability for (other?) users to comment on the new comment. These comments should also be persistent.

Part 3, 40 points: Automatically update pages with the new comments! Set up your page(s) so that new comments from other users are automatically added to the current user's page. I recommend using the window.setInterval function to update the page every 10 seconds or so. I highly recommend testing this by having one person leave a comment on their computer and have someone else on another machine leave a new comment. The new comment should load on the first person's machine.

Part 4, 0 points: Personal Part: Change the comments on the comment board to automatically refresh.

Part 5, 50 points:

Include another page in your project which uses interactive graphics. Users should be able to do at least one of the following things:
  • Select and deselect graphical elements, which changes their visual characteristics. A fixed maximum number of elements must be selectable.
  • Add and/or Remove graphical elements.
  • Modify graphical elements in some other visual way that is more complicated than either of the other two options (please clear it with me first!)
All interaction should be done with the mouse, not with other input fields. Bonus points will be awarded for doing multiple of these things. You may use either a canvas or svg elements (or something else, if you like).

Part 6, 50 points: Record user info using SQL tables. This can be done to keep track of high scores, IP addresses, or contact information. You should have at least two tables that can be joined over one or more properties.

Part 7, 0 points: Personal Part: Keep track of the comments via an SQL table. A separate table should include user information, including the length of time they've been your friend. Use a join to calculate the number of comments they've left overall on your site and report that number near their name whenever they leave a comment.

Part 8, 0 points: Make sure your code doesn't have any: unbalanced or deprecated tags, multi-used IDs, obtrusive JS or CSS, or deprecated attributes or properties. I'll deduct points for each instance of these I find!

Submitting your Project:

Upload your code to our webserver (cslamp). Then one person should reply to the email I sent out. In that reply:

  • CC all members of your team.
  • include your team name.
  • include the URL where I can view your project on cslamp in a web browser.
After that email has been sent, all members of the team should forward that email back to me, and give percentages of how much they think each team member contributed towards this project.

Reminder: I won't open these emails until I grade the projects. If you ask a question in the email, I won't get to it until after the project due date.