Project Introduction
SocialNetwork.com is a complete social networking website, where you can create your own page, request, bio, friends, pictures and then people can go online see your bio, request to be your friend.
Project Assignment Highlights
- Picture Albums.
- Photo Uploading.
- Like & Comment feature on photos/albums
- Image Editing.
- Image – Reordering.
Challenge
- Uploading multiple images by drag and drop.
- Image editing (crop, rotate, add text, invert colors, brightness, sharpness etc.)
- User can see the images in Popup from where user can navigate between album pictures, can add a new comment, like existing comment etc.
- Re-ordering of album images.
Technologies Used
C#, ASP.NET, SQL, JavaScript including AJAX, jQuery, Telerik controls, REST web services, GIT, Github, Mongo DB, Fogbugz, HTML, CSS, Regular Expressions, Visual Studio 2012, JustCode.
Solutions
- Used RadUpload control with j-Query to upload the multiple or single image(s) depending on the user’s choice by dragging and dropping directly to the browser window with validations in j-Query like to prevent user from uploading an image from its maximum allowed size and to prevent user from uploading a file with invalid format
- Used j-Query sortable plugin for reordering of images.
- Used RadImageEditor control with j-Query to edit images. With RadImageEditor a user can perform the following operations on a particular image
- Crop Image
- Add a text to image
- Invert colors
- Rotate image
- Change brightness/contrast
- Change the image color to black & white only.
- Flip image
Results
- Zoom Popup.
- User can create an album under a particular category (photography, animals, modeling, travel, technology etc.), and then existing users can search for a share that is related to a specific category.
- User can upload multiple pictures by just dragging and dropping it to the web-browser.
- User can set an image as a cover photo of album.
- User can give the title of album photo.
- User can re-order the images by dragging and dropping.
- User can set a particular picture as featured to display that picture on profile page under album section.