OpenLightGroup Blog

rss

Blogs from OpenLightGroup.net


DotNetNuke Silverlight Chat v2 – Gravatar Support

During a conversation with Michael, he mentioned that he would like to have Gravatar support in the DNNSilverlightChat module he created. I had recently worked on a project that included supporting the use of Gravatar images next to user comments. The synchronicity was too much for me to stand, and I volunteered to take on the mission. While working on the original project that supported Gravatar images, I had found that Gravatar.com provided an easy way to integrate a user’s Gravatar image into just about any application.

Like I said, the process used to interface with the Gravatar system is pretty simple. It basically comes down to creating the MD5 hash of the users email. Note: Be sure the email is all lowercase before creating the hash. However, there was a hidden roadblock that came into play that I will address shortly.

This process inside of a DotNetNuke module looks something like this:

 

        private static string GetImageUrl(int PortalID, int UserID)
        {
	   // get DotNetNuke User
            var dnnUser = DotNetNuke.Entities.Users.UserController.
                GetUser(PortalID, UserID, true);
 
	    // create base image URL
            string imageUrl = "http://www.gravatar.com/avatar/";
 
            if (!string.IsNullOrEmpty(dnnUser.Email))
            {
                // create MD5 hash for email address
                MD5CryptoServiceProvider md5 = new MD5CryptoServiceProvider();
 
                UTF8Encoding encoder = new UTF8Encoding();

MD5CryptoServiceProvider md5Hasher = new MD5CryptoServiceProvider();

 

 
                byte[] hashedBytes = md5Hasher.ComputeHash 
                    (encoder.GetBytes(dnnUser.Email.ToLower()));
 
                StringBuilder sb = new StringBuilder(hashedBytes.Length * 2);
                for (int i = 0; i < hashedBytes.Length; i++)
                {
                    sb.Append(hashedBytes[i].ToString("X2"));
                }
 
                // complete the image url
                imageUrl += sb.ToString().ToLower();

imageUrl += "?s=40"; // image size is 40x40

                imageUrl += "&d=wavatar"; // if use does not have a gravatar use a wavatar instead
             
            }        
            return imageUrl;
        }

 

Pretty simple stuff right? The only question is why didn’t I just return the email address from the web service and create the hash in Silverlight? Answer: Silverlight does not support the MD5 hashing algorithm. MD5 is no longer considered to be a strong hash. I would assume that this and the need to keep the framework small would explain why Microsoft decided not to include it in the framework.

I did find a few code samples that people have developed to do MD5 in Silverlight; however, each one of them had reported bugs and hashing is something you want to get right every time. Looking back, I am glad this situation came up because it lead me to an understanding about how to work around any gaps in the Silverlight framework. If there is a piece of the .Net library that you need to use and it is not included in the Silverlight library, you can simply wrap the functionality in a web service method. Obviously, there may be times that this could be less than ideal, but I think the strategy works as a general rule of thumb. The truly unfortunate aspect of this particular solution is this virtually eliminates the possibility of create a reusable Gravatar Image Silverlight control. I am hoping that the folks at Gravatar may add support for different hashing algorithms in the future that would make packaging such a control possible.

Now that I have the Gravatar image URL, adding it to the UI was even easier than getting the URL in the first place. Since the user list shown on the right side of the chat window was already setup for data binding, I simply added an image control and bound it to the new ImageUrl property I created on the DNNChatLoggedInUsers class.

    [Serializable]
    public class DNNChatLoggedInUsers
    {
        public string UserName { get; set; }
        public string ImageUrl { get; set; }
        
 
    }

 

Here is the updated user list XAML:

<ItemsControl x:Name="ItmcUserList" Background="{x:Null}" Height="Auto">
   <ItemsControl.ItemTemplate>
     <DataTemplate>                            
         <StackPanel x:Name="UserStackPanel" 
                     Orientation="Horizontal"
                     Margin="2">
             <Image Source="{Binding ImageUrl}" Width="40" Height="40"
		    HorizontalAlignment="Left" VerticalAlignment="Center" />
 
             <HyperlinkButton Content="{Binding UserName}"
                              Margin="0,0,0,0" 
                              HorizontalAlignment="Right" 
                              VerticalAlignment="Center" />
         StackPanel>
      DataTemplate>
    ItemsControl.ItemTemplate>
ItemsControl>

 

And here is what the user list output looks like now:

 

So what are the “take aways” from this experience?

  1. Adding Gravatar support to you application is generally pretty easy.
  2. Sometimes things are not as easy as they should be.
  3. Things that are missing from the Silverlight framework can usually be wrapped in a web service and then referenced in your Silverlight application.

 

I hope this has helped shed some light on how to use Gravatar images and how to work around some of the missing functionality in Silverlight (as opposed to the full .Net framework). Below are some resources related to these topics. Thanks for reading!

 

Resources:

  1. Live example, additional details and downloads for this module: http://dnnsilverlight.adefwebserver.com/Silverlight20/SilverlightChat/tabid/75/Default.aspx
  2. Gravatar URL construction guide: http://en.gravatar.com/site/implement/url
  3. A link to browse all of the code for the DotNetNuke Chat module: http://www.adefwebserver.com/DotNetNukeHELP/CodeDisplay/SilverlightFileUploader/CodeBrowser/default.aspx
  4. More information about using Silverlight with DotNetNuke: http://dnnsilverlight.adefwebserver.com/Home/tabid/36/Default.aspx




Comments are closed.
Showing 7 Comments
Avatar  Hot Chick 7 years ago

Thank you for your help - love sites like this.

Avatar  Ian T. Lackey 8 years ago

trasloco, &lt;br&gt;I would be glad to fill in some blanks. What questions do you have?

Avatar  trasloco milano 8 years ago

Do you have any more info on this? &lt;br&gt;

Avatar  Payday Loans 8 years ago

So good they added Gravatar support!

Avatar  film izle 8 years ago

thank you very much

Avatar  Tyres Dealer 8 years ago

Great post! I’ve been very interested in Gravatar Support for a long time.&lt;br&gt;

Avatar  Todd Ward 8 years ago

Wow, &lt;br&gt;This article sheds a lot of light on some problems I have been having from Silverlight not supporting the MD5 hashing algorithm. &lt;br&gt;Thanks a lot!&lt;br&gt;