We have developed a basic version of Social networking site in MVC3 Razor.
This application covers following explained features.
1. Register and Login Form:
The user can register to Connect. The register form is simple to fill form. After registering to connect, user can login to the application.
The user can login using login page after registering. The login form accepts username and password. The basic login form validations are implemented.
2. Profile Picture:
When user login for the first time the profile picture is blank as shown below :
The home page looks as above when user login for the first time. The user has to click on Upload Image link inside orange section. This will open a dialog box where user can upload his profile picture.
Using the above dialog box, the user can upload profile picture.
The Home page has a textbox at top of the page, which searches users registered for the application. The textbox shows the result depending on the input provided. The textbox has autocomplete functionality implemented.
4. Friend Request:
The logged in user can search any other user using search box. The user can select the searched user, after selecting the selected user view is as below :
The above is the user view. If the selected user is not your friend, then Add as friend button is displayed which allows you to send friend request to that selected user.
The square button showing 1 is notification for friend request. On clicking the button, a dialog box is displayed.
The user can accept or reject the friend request.
The friendlist for user is shown using a dialog box. The friend count is shown on the home page. On click of the count the dialog box is diaplayed with the users for whom the friend request was accepted by the logged in user.
The user can post text using the textarea provided below the search box.
The user enters the text in the textarea and on click of the Post button the text is posted and the post is visible to all the friends. The post posted is displayed as below :
7. Comment :
The post has Comment link. On clicking the comment, a dialog box is displayed using which user can post comment for the post.
On entering the text and clicking the post button, the comment will be posted for the post. The comment count is maintained next to the link with an message image and a count link. On click of the count link, all the comments posted will be shown in dialog box.
8. Like :
The user can like a post using the like link shown below the post text. The like count is maintained next to the link with thumbs up image. On hovering the count, tooltip shows the users who liked the post.
The above are the features currently implemented. We are working further on Connect to involve more functionalities and features.