User Friend List User Control in a Social Networking website using asp.net csharp

1. Friend List is very important part of any social networking project then it may be facebook or twitter or google plus the names may be different facebook calls it friend list,twitter calls it followers and google plus calls it cirlces, but the functionlity is similar. 
2. We have also created Friendlist on HeartBeat to show the Friends of User.
3. For this we have created a different user control and named it as Friends

Friends.ascx Code:

1. Open Friends.ascx User Control Which You have created in Controls Folder.
2.  In the Source of Friends.ascx user control you can add the following piece of code given below.
3. On the User control we have dragged dropped one datalist and inside the item template we have created a tabular structure to show the Friends Photo and Name.
4. As we have stored user images inside our database and not in any folder.
5. We have converted our profile pictures into bytes and stored in database field of datatype image.
6. So to retrive it and showing it in a datalist we have made use of ImageHandler and by passing the RegisterId we are fetching the profile picture and binding it to datalist

 <%@ Control Language="C#" AutoEventWireup="true" CodeFile="Friends.ascx.cs" Inherits="Controls_Friends" %>
<style type="text/css">
    .styleFriends
    {
        width: 100%;
    }
    .friendsTD
    {
        width: 20%;
        text-align: center;
    }
</style>
<asp:DataList ID="dlFriends" runat="server" Width="100%">
    <ItemTemplate>
        <table cellpadding="2" class="styleFriends" style="border: 1px ridge #CCCCCC">
            <tr>
                <td class="friendsTD" rowspan="2">
                    <asp:ImageButton ID="imgbtnYou" runat="server" Height="84px" Width="84px" 
                    ImageUrl='<%# "ImageHandler.ashx?RegisterId="+ Eval("RegisterId") %>'
                    BorderColor="#CCCCCC" BorderStyle="Ridge" BorderWidth="1px" OnClick="imgbtnYou_Click"
                    CommandArgument='<%#Bind("RegisterId") %>' />
                </td>
                <td align="left">
                    <asp:Label ID="lblFriendName" runat="server" Font-Bold="False" Font-Names="Franklin Gothic Medium"
                        Text='<%# Bind("Name") %>'></asp:Label>
                </td>
            </tr>
            <tr>
                <td>
                     
                </td>
            </tr>
        </table>
    </ItemTemplate>
</asp:DataList>

    
 

Friends.ascx.cs C# Code:

1. Now Open the Code behind file of Friends User Control. In Friends.ascx.cs file you can add the following piece of code given below.
2. If you see the below code from the Page load method we are calling a function MyFriends() which is responsible finding the friends of the current profile which is being viewed.
3. If it is your profile it will show your friends and if it is other profile it will his her friends.
4. We have written a query to get those friends whose Friendhsip status is Accepted and not Pending or Rejected.
5. To achieve this we have made a join and union between Register table and Friends Table.Finally we are checking whether the query has returned any records or not.
6. If records are there then we are binding it to datalist.Once the User Control is ready we are dragging and dropping it from the Solution Explorer onto the page where we want it to be.
7. In this way the usercontrol we will be registred on to that page.we can also call the control by manually wrting the aspx tags

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

public partial class Controls_Friends : System.Web.UI.UserControl
{
    DataTable dt = new DataTable();
    protected void Page_Load(object sender, EventArgs e)
    {
            MyFriends();
    }

    private void MyFriends()
    {

        string getFriendQuery = "Select * FROM [Register] where RegisterId IN (SELECT MyId  FROM Friends WHERE FriendId='" + Session["CurrentProfileId"] + "' AND Status=1 UNION SELECT FriendId  FROM Friends WHERE MyId='" + Session["CurrentProfileId"] + "' AND Status=1) ";
        dt = Database.GetData(getFriendQuery);
        if (dt.Rows.Count > 0)
        {
            dlFriends.DataSource = dt;
            dlFriends.DataBind();
        }

    }
    protected void imgbtnYou_Click(object sender, ImageClickEventArgs e)
    {
        Session["CurrentProfileId"]=(((ImageButton)sender).CommandArgument).ToString();
        Response.Redirect("Main.aspx");
    }
}

Friends.aspx Code:

1. Once the Friends.ascx user control is ready we have to add it to Friends.aspx page as shown below code snippet.
2. Here we have done nothing but dragged dropped the user control on the Friends.aspx page

   <%@ Page Title="" Language="C#" MasterPageFile="~/ProfileMaster.master" 
   AutoEventWireup="true" CodeFile="Friends.aspx.cs" Inherits="Friends" 
   EnableEventValidation="false" %>

<%@ Register src="Controls/Friends.ascx" tagname="Friends" tagprefix="uc1" %>
<%@ Register src="Controls/FriendRequests.ascx" tagname="FriendRequests" tagprefix="uc2" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <table cellpadding="3" cellspacing="3" style="width: 100%">
        <tr>
            <td>
                <uc2:FriendRequests ID="FriendRequests1" runat="server" />
            </td>
        </tr>
        <tr>
            <td align="center">
                <asp:Label ID="Label1" runat="server" Text="Your Friends Your HeartBeats" 
                    Font-Names="Franklin Gothic Medium"></asp:Label>
                <br />
                <hr />
            </td>
        </tr>
        <tr>
            <td>
                <uc1:Friends ID="Friends1" runat="server" />
            </td>
        </tr>
        <tr>
            <td>
                 </td>
        </tr>
    </table>
</asp:Content>