Announcing Sueetie Notifications

Sueetie Notifications are the latest feature coming in Sueetie v3.3 Addon Pack. Sueetie Notifications keep you in touch with what’s going on in your community while you work without requiring you to load any pages or view your site UserLog Activity List. UserLog Activity Notifications poll your site activity logs at an interval you define and display a popup message with the new activity in your browser window. Here’s an example.

Image

A description of the activity along with the member’s avatar and links to the new content is displayed in the popup so you can go immediately to where the action is.

Activities Displayed

The activity types displayed in the popup notifications are those which are defined for public display in Sueetie Administration. Also, only the activity of other community members are displayed. You won’t see notifications of your own activity.

Popup Notification Options

UserLog Popup Notifications are configured on the Sueetie AddonPack Settings page as shown below. The options are to 1) Enable Popup Notifications, 2) Set Popups as sticky or temporary, 3) Activity notification interval, and 4) Display Popups to Anonymous Users or to Registered Users only. In a future release we plan to support user-configurable Popup Notification Options as well.

Image

How it Works

Notifications are designed no differently than the Sueetie Tag Control and Calendar Control. UserLog Notifications consists of an ASPNET Control which is dropped onto a Master page. Like the Tag and Calendar Controls, it also has a supporting .JS file.

Here’s a screenshot of the Notification ASPNET Control added to /themes/THEME/masters/Sueetie.Master.

Image

Sueetie Notifications use a customized version of the Gritter jQuery Plugin. That .JS is located in the site /scripts folder and is loaded in the child .master page’s "cphHeader" ASP:Content area for non-application pages, or elsewhere based on the application. In BlogEngine.NET, for instance, it is loaded with all /blog/scripts in BlogBasePage.OnLoad(). Apart from adding gritter-min.js to your /blog/scripts folder you’ll also want to make sure your gritter-min.js is located in your /wiki/JS folder.  Otherwise the /scripts/gritter-min.js is used.

Here’s the javascript file loaded in the Home.Master page.

Image

The v3.3 upgrade package will contain the .JS and .Master updates in the Lollipop theme to use as a guide. The popup’s CSS classes are located in your theme’s Shared.css stylesheet.

An additional word on styling, the ASPNET Control has a NotifyPopupCssClass property which you can use to modify the popup style. The default class name is "userlogNotifyPopup" which you’ll see in use in your shared.css, or which you can modify and replace with NotifyPopupCssClass.

Product Keys and Feature Freedom

UserLog Popup Notifications are enabled for sites using both Free and Sueetie Supporter Product Keys. The only difference is that the Member Avatar does not display for Free Product Key Holders and the text is not html-enabled. Here’s an example of the Free Product Key Notification.

Image

Sueetie Supporter Product Keys are available in the Sueetie Marketplace.

Article written by

A long time developer, I was an early adopter of Linux in the mid-90's for a few years until I entered corporate environments and worked with Microsoft technologies like ASP, then .NET. In 2008 I released Sueetie, an Online Community Platform built in .NET. In late 2012 I returned to my Linux roots and locked in on Java development. Much of my work is available on GitHub.