star Phase 4 star

Sessions + Javascript

Due October 18th, 10:00pm

star Assignment star

For this assignment, you'll be extending the dynamic website with the mySQL backend you built for the third phase with sessions and client-side scrips. As before, the functionality from that assignment should be retained. It's okay to use JQuery for the javascript portion of this assignment.


Requirement Value
(15pt Total)
Sessions 10pt Total

User Login

Add a new user login page which takes a users credentials and, after validating them against the database, starts a session for that user. The session will keep track of when someone is logged in via the $_SESSION superglobal.

The behavior of the toolbar from Phase 1 should now change according to whether a user is currently logged in:

  • When a user is logged in, the "Home" button on the toolbar should take the user to their profile. The "Sign Out" button should log the user out by ending the session.
  • When no user is logged in, the "Home" button on the toolbar should take the user to the homepage of the photo gallery (index.php). The toolbar should have a "Sign In" button linking to the sign in page instead of the "Sign Out" button.

Since the toolbar is the same across the gallery, I would suggest abstracting the code generating it into a library function.


Message Board

You need to add a message board to users' profile pages, which will require a couple of different extensions:

  1. You'll need to add a new table to your mySQL database for holding messages. The table will need to have columns for the id of the user to which it was sent, the message, the id of the user that posted it, and the date it was posted.
  2. User's profiles should query the mySQL database to dynamically display a list of the messages written on their wall. Each message should be annotated with the date it was posted and the user that posted it.
  3. Each profile should have a form for posting new messages on the wall. This form doesn't need to be anything more than textarea and an submit button. The handler should use the session variable to check that a user is logged in. The handler should use the id of the logged in user when inserting the message in the database. If no one is logged in, the handler should warn the user to sign in first and not insert anything into the database.
Javascript 5pt Total

Dynamic Pictures

Picture detail pages should now use javascript to browse through album photos. The basic approach you'll use is to encode the metadata for all of an album's photos as a JSON array. The 'next' and 'previous' buttons on the photo detail pages will now call a javascript function which changes the image and title on the page to the next and/or previous photo in the album using the metadata in this array.

Again, you will not be generating a new page on the server side each time 'next' and 'previous' are clicked, instead you'll be using javascript to change the image and photo title on the client side.


star Submission Instructions star

As with all homeworks, you will submit this project in a two-step process: