Homework 4

Due April 8th, 11:59pm

Submission Instructions

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

Make sure your name, email address, and eid are in a comment at the top of each file you submit.


For this assignment, you'll be adding AJAX to your social network to build webpages that can seamlessly interact with the server. You'll also be implementing your choice of functionalities to build a more robust and realistic website. Once again, this submission needs to retain the functionality of the previous one.

The first half of this assignment has you adding AJAX to your website to handle some of the communication with the server.

  1. Using AJAX to get tag data
  2. Each photo page should have a next and previous button used to navigate between photos. Instead of generating a new page each time, you will use javascript to update the next picture, use AJAX to retrieve the tag data associated with that picute, and use javascript to update the list of friends in the photo. This is similar to the AJAX musicmap example which cycles through the event posters.

  3. Using AJAX to post messages
  4. Instead of posting messages to a users profile page by submitting a form, the profile page should now use AJAX to update the database. When the post message button is clicked, the page will send an HTTP POST request to a script that will update the database. You need some visual cue to initially indicate to the user that the message is being posted, and a corresponding cue to indicate that the message has been successfully added to the database. If there was an error, you need to communicate that to the user as well. An example of these visual clues would be displaying a transparent version of the message upon sending the request, and making it fully opaque after the insertion is successful. Again, see the AJAX musicmap for an example of this behavior.

  5. Adding features to your website.
  6. For this half of the assignment, you need to add a selection of new features to your website. The specific features are up to you, but the total number of points needs to add up to four. (Note that some features are worth two points.)

    • Old Bonus Points

      Complete the bonus points for any one of the previous assignments that you have not already done. I.e. add CSS to your website if you have not already done so. (You can only count one of these for points.) (1 pt)
    • Picture Uploading

      Allow users to upload their own photos to the server. These photos need to appear on their picture page. To do this, you'll need to read about some basics of file manipulation in PHP as well as how the file input element works. (2 pts)
    • Friend Requests

      The "Add Friend" button on a profile page should now send a request to a user that they must confirm to establish the friendship. The toolbar should now have link to a page that allows users to review and either confirm or deny pending requests. The link to this page on the toolbar needs to visually communicate to the user if there are any pending requests through either a change in font style or with some chunk of text (Pending, Needs review, etc.). (2 pts)
    • Batch Messaging

      Design a page that allows you to post a message on all your friends message boards at once. You should also be able to select a subset of your friends to group mesage. (1 pt)
    • Social Groups

      Add support for groups to your social network. Each group needs a page with some basic info about the group, a message board, a list of members, and a button for the currently logged in member to join the group. Users should be able to search for groups, and create new groups. (1 pt)
    • mySQL Security

      Add proper security to all of your mySQL queries- You need to prevent both SQL injection and HTML injection. You should also take steps to salt passwords. (1 pt)
    • You Decide!

      Come up with your own feature to add! Propose your idea on the message board, and if I okay it, implement it for (2 pts). You can also implement someone else's approved feature for (1 pt).

Bonus Points

Add an extra feature.