Patterns and Origins: Sueetie Member Following

Modified on 2009/05/06 17:13 by daveburke Categorized as Patterns and Origins
Tags: no tags for this item
<div class="WikiTop">Sueetie supports Following Members through adding buttons and links to members associated with application content like blog post authors, commenters, forum threads originators, for reply members, media object contributors, and more.  This document will grow as the support for Member Following evolves.  See [PatternsFavorites|Sueetie Favorites] for information on the related functions of tagging content as Favorites.</div>

'''''Please note:'''At the time of this writing, Sueetie Member Following has not been released on [http://sueetie.codeplex.com|Codeplex], but you can find working examples of Following here on Sueetie.org.''


{toc}


==An Overview of Sueetie Member Following==

Below is an example of a Sueetie Follow button to follow the author of a BlogEngine.NET post.  The button is generated with JQuery and with Ajax calls a WCF Service to perform the data processing.  The Follow logic is akin to the Twitter model of following rather than Facebook, as no official request for friendship is performed.  Friend status is denoted by reciprocal following.

[image|Example of a Sueetie Following Button|/x/site/2009/sufollow0414a.jpg]


==Sueetie Member Following: Patterns==

Each application requires a slightly different approach to supporting Sueetie Member Following.  We will cover implementation of following at the application level after looking at the shared logic and data structure of Member Following.

===Data Logic===

Two Sueetie SQL tables are used to hold Following data, Sueetie_Followers and Sueetie_UserFollowCounts.

[image|Member Following Tables|/x/site/2009/sufollow0414b.jpg]


One point to raise at this point is that the data logic supporting Following and Favorites was designed with site analytic capabilities in mind.  We'll get more into that with [PatternsFavorites|Sueetie Favorites,] but one eye-to-analytics represented here is the ContentIDFollowed field in Sueetie_Followers.  This ID is keyed to the individual content item which may yield insights into what prompted the act of Following by other members.

When populated, Sueetie_Followers and Sueetie_UserFollowCounts appear as below.

[image|Following Table Data|/x/site/2009/sufollow0414c.jpg]


===WCF Service Logic===

Each of the applications' client-side JQuery scripts call /app_code/SueetieService.cs to populate the tables and calculate the updated totals in followers, following and friends.  (The calculations are performed in SQL Stored Procedures, Sueetie_Follower_Add and Sueetie_Follower_Remove.)

The logic of the WCF method is to retrieve an enhanced blog post object containing Sueetie User and Content data to populate the SueetieFollow data object.  SueetieFollow is then passed to the data provider in ''SueetieUsers.FollowUser(sueetieFollow);''

You'll notice that the user must be authenticated to follow a member (as Following buttons and links are displayed universally regardless of user status), and a user cannot following himself.


{{{{
[OperationContract]
public string BlogAuthorFollow(int userID, string postGuid)
{
	SueetieBlogPost sueetieBlogPost = SueetieBlogs.GetSueetieBlogPost(postGuid);

	if (userID > 0)
	{
		if (sueetieBlogPost.SueetiePostID > 0)
		{
			string result = "You are now following " + 
				sueetieBlogPost.DisplayName.ToString();
			SueetieFollow sueetieFollow = new SueetieFollow
			{
				FollowerUserID = userID,
				FollowingUserID = sueetieBlogPost.SueetieUserID,
				ContentIDFollowed = sueetieBlogPost.SueetiePostID
			};

			if (sueetieFollow.FollowerUserID == 
                sueetieFollow.FollowingUserID)
				result = "Sorry, you cannot follow yourself...";
			else
				SueetieUsers.FollowUser(sueetieFollow);

			return result;
		}
	}
	else
		return "Please login or become a member to follow this person.";
}
}}}}


===The JQuery Script===

Because each application yields author and content identification data differently, the JQuery is typically unique to that content, like BlogEngine.NET blog posts and comments.  The script below in /scripts/sueetie.js is used to call the WCF BlogAuthorFollow() method shown above.  The ASPNET AJAX ScriptManager control is used to perform the communications.

{{{{

function followPostAuthor(postGuid, blnMember, followDiv) {
    SueetieService.BlogAuthorFollow(postGuid, blnMember, 
        onFollowFaveSuccess, null, followDiv);
}

function onFollowFaveSuccess(result, followDiv) {
    $(followDiv).slideUp("fast", function() {
        $(this)
                .text(result)
                .slideDown("fast");
    });
    $(followDiv).click(function() {
    $(this).hide("fast");
        return false;
    });
}
}}}}

===The HTML===

We're at the page level now where we create the HTML to execute the JQuery to call the WCF Service.  In BlogEngine.NET we're going to create a custom Sueetie.Blog Class Library to add our Sueetie Follow and Favorite services.  

We'll be isolating the code from BlogEngine.NET's source code base by creating a custom Sueetie.Blog class library project from which we will reference BlogEngine.Core.

[image|Sueetie.Blog Class Library Project|/x/site/2009/sufollow0414e.jpg]


Here is the code used to enable the followPostAuthor() script.


[image|C# HTML Code|/x/site/2009/sufollow0414d.jpg]


==Sueetie Member Following: Origins==

Following is one of the first "add-on" features added to Sueetie.  It was important to support a Following and Friends function because communities are all about the people in them, and strong communities are all about the depth of communication between its members.  Spending a lot of time of Twitter (and very little on Facebook), the Following concept seemed more natural than a strict "Friends" approach.

As for the technical origins of Member Following, we looked at BlogEngine.NET comments source and YetAnotherForum.NET functions like "Watch this thread."  Both of these functions were fast and client-side requiring no postback, which was the top priority of the Following design.  This was an excellent opportunity to use JQuery in Sueetie, so this was the technology we chose.  Plan to see a lot of JQuery, AJAX and WCF in future Sueetie features. 

{BR}{BR}
{s:PatternsTOC}