This is the second post in the Sueetie Going Mobile Series describing how it was possible to create a mobile version of the Sueetie Online Community and its applications. This post focuses on BlogEngine.NET, whose developers led the way with a mobile architecture that existed long before the iPhone came on to the scene and upon which the Sueetie Mobile architecture was based. The original source of this post is located in the Sueetie Wiki Patterns and Origins area.
_______________
BlogEngine.NET Leading the Way
The forward-thinking developers of the BlogEngine.NET Core Team have been thinking about mobile access for years, far earlier than devices like the iPhone made mobile offerings a requirement for any serious online application. The Sueetie mobile architecture was based on BlogEngine.NET's implementation which is described here.
Dynamic Theming and the Browser User Agent
To understand BlogEngine.NET's mobile architecture is to understand Sueetie's, since Sueetie is patterned after it. BlogEngine.NET does a Regex.IsMatch() on an app.config MobileDevices string against the browser User Agent. If there is a match, then BlogEngine's mobile theme (default "mobile") is used. If not, the currently selected browser. Here's the core of that logic in BlogEngine.Core.Utils.cs.
private static readonly Regex MOBILE_REGEX =
new Regex(ConfigurationManager.AppSettings.Get("BlogEngine.MobileDevices"),
RegexOptions.IgnoreCase | RegexOptions.Compiled);
....
public static bool IsMobile
{
get
{
....
if (!string.IsNullOrEmpty(request.UserAgent) &&
MOBILE_REGEX.IsMatch(request.UserAgent))
return true;
}
return false;
}
}
The BlogEngine.NET app.config MobileDevices property looks like this.
<add key="BlogEngine.MobileDevices"
value="(android|iphone|ipod|nokia|sonyericsson|blackberry|
samsung|sec\-|windows ce|motorola|mot\-|up.b|midp\-)"/>
So whenever the current theme is requested in BlogEngine.NET with BlogSettings.Instance.Theme, the BlogSettings Theme property inspects if the device is currently a mobile one and load the standard or mobile theme accordingly. Something to the effect of:
if (Utils.IsMobile && !string.IsNullOrEmpty(MobileTheme))
return MobileTheme;
else
return configuredTheme;
Mobile Theme a First Class Citizen
As you can see from the screenshot below, the BlogEngine.NET mobile theme (and Sueetie Chiclet mobile theme) are first class citizens in BlogEngine.NET, as the Chiclet mobile theme is in all Sueetie applications. BlogEngine.NET serves up its mobile theme as it would the current standard theme. Again, this is the same throughout Sueetie.
It Takes Two to Form a Mobile Village
It takes two themes to form a mobile online community (or village, as Hillary would say), and in BlogEngine.NET you select a mobile theme as one of the application's settings. So just like BlogEngine.NET has a standard and mobile theme administrative setting, so does Sueetie.
