Description - YazanHalawa/webApp GitHub Wiki

Description: Explain the purpose of the site and what functionality you implemented. Include a few relevant screenshots showing what the site can do, and write a short paragraph describing each one.

Purpose of the site:

Its that time of the year again and you need to get your friend a gift. You say to your self: "I don't know what he/she wants, and it is inconvenient to ask because I don't want him/her to know that I am getting him/her a present." Here is the answer to all your troubles. A webApp that tells you what they want and wish to have.

Disclaimer: App has problems working on Safari.

##Following is the functionality we implemented

Login Page

When we put in the website, we get the very first page - login page. Here the user if he is already existing in the database could log in with his credentials or he could sign up to the website.

SignUp Page

If the user clicks on Sign UP it redirects to the following page.

The page asks for the first and last name of the user. In addition it asks for an e-mail address (which becomes the username of the user), password, birth-date, 3 wishes, gender. When the user clicks on SignUp he gets directed to the login page.

Navigation Bar

When a user logs in he sees the navigation bar.

This bar allows him to go to his Profile, contains a drop-down menu that allows him to add friend, remove friend and view his friends. It also permits him to log out, deactivate his account should he choose to. On the top right it greets the user with his name e.g. "Hello Eunice".

Profile

The user views the following when he clicks on profile in the navigation bar.

In the profile the birthday is listed so that friends could reserve wishes on that day although reserving wishes is not necessarily limited to just the birthday. The profile also provides a picture so that friends are able to recognize and put an image to a name. The information provided is rudimentary but could be expanded to having a wall where friends could give birthday wishes.

Add Friend

When we click on add friend the following appears.

Here they are allowed to enter the e-mail address of the friend they would like to add. If the friend's information exists in the database (if he signed up and has an existing account) the friend is added and it indicates showing "Friend added!". Otherwise it lets the user know that "Friend already exists or is not in the database!"

Remove Friend

When we click on remove friend the following appears.

Here they are allowed to enter the e-mail address of the friend they would like to remove. If the friend's information exists in the database (if he signed up and has an existing account) the friend is removed and it indicates showing "Friend removed!".

View Friends

When we click on view friends the following appears.

Here they are allowed to view the friends they added with their picture and names next to the picture. Clicking on the name or picture (the whole general area) would direct them to the profile of the friend.

LogOut

When the user clicks on this button he is directed to the login page. He is exited from his profile.

Edit Wish List

When we click on Edit Wish List it directs to the following page.

Here the user can change/update his wish-list.

Reserve Wish

When we click on View Friends option and choose to view a friends profile, we get the following view.

Reserve Wish option allows a friend to reserve a particular wish for his/her friend.

##Following is the "ADDITIONAL" functionality we implemented

Color Scheme for the navigation bar

The following user chose a yellow color.

The user could choose to change his navigation bar look to the following colors: white, orange, yellow, black, blue, red, purple. He needs to log out and log back in for the changes to take effect.

Deactivate Account

When we click on de-activate account the following appears.

The user is asked to confirm his choice. When he confirms this his account is removed including all his reservations to the various wishes to his different friends.

Email notification for cancelled wish items

It looks like this.

Every time a user chooses to cancel a wishList that was reserved an email will be sent to the person who reserved the item.

Contact us Page

Contact us Page appears like the following.

This page allows a user to send us (the creators of the web-page) an e-mail with questions and queries etc.