Benjamin Schaefer
Sep 12, 2017
  7972
(3 votes)

Getting started with Activity Streams: Part 1

Overview

This is the first post in a series that will provide deeper insight into the Episerver Social Activity Streams functionality. This post targets how Activity Streams has been implemented within Social Alloy. Upcoming posts will look specifically at best practices for working with the Activity Streams APIs and alternative use cases for where Activity Streams can add business value.

Introduction

The engagement of digital community members can take many forms. Reviewing a product, joining a group, adding a comment or friending another member, among many others. While each activity is unique, the ability to broadcast, and promote your community's engagement can be a powerful tool for any digital marketer.

Episerver Social Activity Streams provide the functionality to:

  • Easily publish activities related to your user’s actions.
  • Allow users to engage with these published activities through subscriptions.
  • Return related information for activities that were published to subscribed users.

Conveniently, the Episerver Social Alloy demo site has an implementation of a typical use case for Activity Streams. This post will look at how the CommentBlock, SubscriptionBlock and FeedBlock in Social Alloy tie into Activity Streams on the pre-populated Silver Resellers Group page. To follow along, I encourage you to investigate the Social Alloy GitHub repo found here:

https://github.com/episerver/SocialAlloy

And to experiment with this functionality take advantage of the demo account portal for Episerver Social. Sign up here:

https://social.episerver.net

Background

Before we jump into the implementation of Activity Streams it is useful to understand some of key terms that relate to this feature.

Activities: Activities signify an event or action occurring within your application. The Episerver Social platform allows for activities to be published within an application, resulting in the generation of corresponding feed items for subscribing users.

Subscriptions: Users may subscribe to resources or other users within your application. When that occurs, the system generates a record of activities related to those resources and users. That information can subsequently be filtered and retrieved in the form of a feed.

Feeds: A feed represents a record of activities occurring within the application. As an activity is added to the system, the platform generates feed items for users subscribed to the entity upon which the activity occurred.

Actor: A reference for the user or system that triggers an activity

Target: A reference for what was acted upon. The target can take many forms such as a page, a system event, or user action. 

With these terms in mind, we can begin to see the relationship between all of the components needed to implement a robust streaming activity system.

Implementation

The CommentBlock in Social Alloy can be configured for Activity Stream functionality. The CommentBlock can create an activity for each comment that is added to a page where the block resides. The block configuration code is here:

/// <summary>
/// Configures whether an activity should be sent to the Episerver Social Activity Streams system.
/// </summary>
[Display(
	GroupName = SystemTabNames.Content,
	Order = 1)]
public virtual bool SendActivity { get; set; }

/// <summary>
/// Sets the default configuration values.
/// </summary>
/// <param name="contentType">Type of the content.</param>
public override void SetDefaultValues(ContentType contentType)
{
	base.SetDefaultValues(contentType);
	ShowHeading = false;
	Heading = "Comments";
	CommentBoxRows = 5;
	CommentMaxLength = 500;
	CommentsDisplayMax = 10;
	SendActivity = true;
}

The CommentBlockController contains the logic for adding an activity to Social when a new comment has been added. SocialAlloy abstracts its interaction with Episerver Social into repository implementations. These repositories have knowledge of the application’s business logic and models, which they manage through Episerver Social. Adding an activity requires an actor, a target ,and extension data. For this implementation, the actor will be the user id of the comment author, the target will be the page id where the CommentBlock resides, and the extension data will be the additional relevant information for the event of a comment being added to the system. The only additional information needed in this scenario is the comment body. The activity creation code is here

private void AddCommentActivity(PageComment comment)
{
	try
	{
		var commentActivity = new PageCommentActivity { Body = comment.Body };

		this.activityRepository.Add(comment.AuthorId, comment.Target, commentActivity);
	}
	catch (SocialRepositoryException ex)
	{
		AddMessage(MessageKey, new MessageViewModel(ex.Message, ErrorMessage));
	}
}

An example of a CommentBlock directly tied to activity creation can be seen on the Silver Reseller Group page. Additionally, this page has a Subscription Block that contains functionality for a user to subscribe or unsubscribe to activities that occur on this page.

Silver Resellers Group

By clicking subscribe on the SubscriptionBlock, users can indicate that they want to be informed of all activities that occur on the SilverResellers Group page.  A user may have multiple subscriptions to different targets. In Social Alloy, there are three pre-configured Resellers Group pages with activity creation that users can subscribe to. The handling of adding or removing a subscription for a user on a page can be found in the SubscriptionBlockController.cs in the HandleAction method:

/// <summary>
/// Handle subscribe/unsubscribe actions.
/// </summary>
/// <param name="actionName">The action.</param>
/// <param name="formViewModel">The form view model.</param>
/// <returns>The action result.</returns>
private ActionResult HandleAction(string actionName, SubscriptionFormViewModel formViewModel)
{
var subscription = new PageSubscription
{
	Subscriber = this.userRepository.GetUserId(this.User),
	Target = this.pageRepository.GetPageId(formViewModel.CurrentPageLink),
}; 

try
{
	if (actionName == Action_Subscribe)
	{
		this.subscriptionRepository.Add(subscription);
	}
	else
	{
		this.subscriptionRepository.Remove(subscription);
	}
	AddMessage(MessageKey, new MessageViewModel(SubmitSuccessMessage, SuccessMessage));
}
catch (SocialRepositoryException ex)
{
	AddMessage(MessageKey, new MessageViewModel(ex.Message, ErrorMessage));
}

return Redirect(UrlResolver.Current.GetUrl(formViewModel.CurrentPageLink));
}

Note: The activity targets the page that the SubscriptionBlock is on. This is the same target as the activity that is generated by the CommentBlock when it has been configured for activity generation on comment submission. This relationship between activity target and subscription target helps to explain the creation of feed items for a subscribed user. If an activity has the same target as the target that a user is subscribed to, a feed item will be generated.

When a user has subscribed to the Silver Reseller Group page, a feed item will be generated for them every time a contributor on this page adds a comment. To see these feed items, a user can use the top level menu to navigate to their Profile page. This page will provide the user with a feed of information relating to the activities they have subscribed to. To display feed items, the Profile page uses the FeedBlock. Below shows the FeedBlock code for retrieving the feed items associated with the logged in user. 

/// <summary>
/// Gets the activity feed for the logged in user
/// </summary>
/// <param name="currentBlock">The current frontend block instance.</param>
/// <param name="blockViewModel">a reference to the FeedBlockViewModel to 
///populate with activity feed for the logged in user and errors, if any</param>
private void GetSocialActivityFeed(FeedBlock currentBlock, FeedBlockViewModel blockViewModel)
{
	try
	{
		var userId = userRepository.GetUserId(this.User);
		if (!String.IsNullOrWhiteSpace(userId))
		{
			blockViewModel.Feed =
				this.feedRepository.Get(new CommunityFeedFilter
				{
					Subscriber = userId,
					PageSize = currentBlock.FeedDisplayMax
				});
		}
		else
		{
			blockViewModel.Messages.Add(new MessageViewModel(ErrorGettingUserIdMessage, ErrorMessage));
		}
	}
	catch (SocialRepositoryException ex)
	{
		blockViewModel.Messages.Add(new MessageViewModel(ex.Message, ErrorMessage));
	}
}

As more comments are added to the page(s) that a user is subscribed to, more feed items will be retrieved by the Feed API and displayed in the FeedBlock. Within the Social Alloy demo, other blocks can also be configured to generate activities. If a user has subscribed to a page with those blocks in Social Alloy, the FeedBlock will display those related feed items as well.
Profile page highlighted

Note: A feed item will encapsulate the extension data of the activity that was originally added to the system. This allows developers tremendous flexibility for the information that can be conveyed within a user's feed. In the example above, an activity was added which contained the comment body as its extension data. The FeedBlock displays that content as well as the comment author (actor) and page where that comment was added (target). This information originated from the comment that was added using the CommentBlock on the SilverResellers Group page.

This implementation of activity creation, user subscription, and feed generation is rudimentary but should help to illustrate the power of the Activity Streams functionality within Episerver Social for building connected online communities. 

For more information regarding Activity Streams, please take a look at the developer documentation here:

http://world.episerver.com/documentation/developer-guides/social/activity-streams-introduction/

Sep 12, 2017

Comments

Alica Farthing
Alica Farthing Aug 30, 2018 05:04 AM

An activity stream is a list of recent activities performed by an individual, typically on a single website. For example, Facebook's News Feed is an activity stream. McDVOICE

Gal ken
Gal ken Sep 8, 2018 07:12 AM

Hy Guys! please checkout my first tribute page  color switch

Please login to comment.
Latest blogs
Increase timeout for long running SQL queries using SQL addon

Learn how to increase the timeout for long running SQL queries using the SQL addon.

Tomas Hensrud Gulla | Dec 20, 2024 | Syndicated blog

Overriding the help text for the Name property in Optimizely CMS

I recently received a question about how to override the Help text for the built-in Name property in Optimizely CMS, so I decided to document my...

Tomas Hensrud Gulla | Dec 20, 2024 | Syndicated blog

Resize Images on the Fly with Optimizely DXP's New CDN Feature

With the latest release, you can now resize images on demand using the Content Delivery Network (CDN). This means no more storing multiple versions...

Satata Satez | Dec 19, 2024

Simplify Optimizely CMS Configuration with JSON Schema

Optimizely CMS is a powerful and versatile platform for content management, offering extensive configuration options that allow developers to...

Hieu Nguyen | Dec 19, 2024