With gravatars now becoming ubiquitous in blogs and forums, I have developed an ASP.NET Control that encapsulates their functionality in a simple, reusable component. It’s so easy to use, you can download and be using it on your ASP.NET sites within minutes.

I introduced the control in February of 2008, and updated the functionality in March of 2008.

I’ve since had a lot of interest in the source code for the control, and so this post describes how the control works, as well as providing a download containing the control, as well as the full control source and example website that uses the control.

OK, let me download it already!

Download the Control and get started. Note that the demo projects included in the ZIP were written in Visual Studio 2005, so if you’re using Visual Studio 2008, you’ll need to convert the solution. If you’ve not done a conversion before, just follow the instructions that Visual Studio provides. Please also note that the solution will not open in Express Editions, since they do not support control projects. However, you can still use the control that’s included in the ZIP file.

Unzip the .zip download, and you’ll have the following folder structure:

The root contains a small readme file, Visual Studio solution, FreshClickmedia.dll - the gravatar control assembly, Freshclickmedia.Web control project and GravatarSite website, which contains a few control examples.

Opening the solution in visual studio will give you this solution structure:

Fire up the website, and you should see something like this:

Examining the Code

    <h1>Gravatar Examples</h1>

    <h2>My email address, size of 80 pixels:</h2>
        <fcm:Gravatar ID="Gravatar1" runat="server" Email="youremailaddress@domain.com"
             OutputGravatarSiteLink="true" Size="80" />

    <h2>No email address, with default image (absolute url) specified:</h2>
        <fcm:Gravatar ID="Gravatar2" runat="server" Size="80" DefaultImage="http://farm3.static.flickr.com/2375/2552064340_192825f989_o.jpg" />

    <h2>Email address not associated with Gravatar, with no default image:</h2>
        <fcm:Gravatar ID="Gravatar3" runat="server" Email="thisemaildoesnotexist@freshclickmedia.com" Size="80"  />

The control requires an email address:

<fcm:Gravatar ID='Gravatar1' runat='server' Email='username@domain.com' />

For my email address, I get the following generated HTML:

And if we look at the generated source:

<a id="Gravatar1" href="http://www.gravatar.com" title="Get your avatar"><img width="80" height="80" src="http://www.gravatar.com/avatar.php?gravatar_id=ccf3b8c638f15d005e5d070aeb1a3923&rating=G&size=80" alt="Gravatar" /></a>

The default produces a hyperlink off to the Gravatar site with a title “Get your avatar”. The image contains the MD5 email hash, a rating of “G” (suitable for all audience types), and a size of 80.

Customisation

The control supports a number of properties supporting the customisation of its output.

Size

The size property of the control can be in the range 1 to 80. If it is outside this range, a default of 80 will be used.

MaxAllowedRating

The ‘highest’ allowed rating of image.

• A G rated gravatar is suitable for display on all websites with any audience type.
• PG rated gravatars contain may contain rude gestures, provocatively dressed individuals, the lesser swear words, or mild violence.
• R rated gravatars may contain such things as harsh profanity, intense violence, nudity, or hard drug use.
• X rated gravatars may contain hardcore sexual imagery or extremely disturbing violence.

OutputGravatarSiteLink

True by default, determines whether a hyperlink linking to the gravatar website will be output around the image.

LinkTitle

“Get your avatar” by default, allows the customisation of the ‘title’ attribute of the link (obviously doesn’t apply if OutputGravatarSiteLink property is set to false.)

DefaultImage

URL encoded URL, protocol included, of a GIF, JPEG, or PNG image that should be returned if either the requested email address has no associated gravatar, or that gravatar has a rating higher than is allowed by the “MaxAllowedRating” property.

The code snippet below shows the associated properties.

<fcm:Gravatar ID="Gravatar1" runat="server"
    Email="username@domain.com"
    DefaultImage="http://www.site.com/default.jpg"
    OutputGravatarSiteLink="true" Size="40" />

Examining the control code

The Gravatar control derives from System.Web.UI.WebControls.WebControl and overrides the Render method.

The various properties such as Email are all implemented as simple C# properties, with various attributes depending on the property.

[Bindable(true), Category("Appearance"), DefaultValue("80")]
public short Size
{
	get
	{
		return _size;
	}
	set
	{
		_size = value;
	}
}

These properties are then used in the Render method to write out HTML using the method’s HtmlTextWriter parameter.

The Render method begins by adding the default attributes to the render, ensuring that the size is within the valid range of 1 to 512, and initialises the gravatar URL:

AddAttributesToRender(output);

// if the size property has been specified, ensure it is a short, and in the range
// 1..512:
try
{
    // if it's not in the allowed range, throw an exception:
    if (Size < 1 || Size > 512)
        throw new ArgumentOutOfRangeException();
}
catch
{
    Size = 80;
}

// default the image url:
string imageUrl = "http://www.gravatar.com/avatar.php?";

If an Email address has been supplied, the MD5CryptoServiceProvider hashes the email and a StringBuilder converts this to the required format:

if( !string.IsNullOrEmpty( Email))
{
    // build up image url, including MD5 hash for supplied email:
    MD5CryptoServiceProvider md5 = new MD5CryptoServiceProvider();

    UTF8Encoding encoder = new UTF8Encoding();
    MD5CryptoServiceProvider md5Hasher = new MD5CryptoServiceProvider();

    byte[] hashedBytes = md5Hasher.ComputeHash(encoder.GetBytes(Email));

    StringBuilder sb = new StringBuilder(hashedBytes.Length * 2);
    for (int i = 0; i < hashedBytes.Length; i++)
    {
        sb.Append(hashedBytes[i].ToString("X2"));
    }

    // output parameters:
    imageUrl += "gravatar_id=" + sb.ToString().ToLower();
    imageUrl += "&rating=" + MaxAllowedRating.ToString();
    imageUrl += "&size=" + Size.ToString();
}

The final part of the method assigns a default image, if one has been specified, outputs the site ink, if required, outputs the required attributes and tags.

// output default parameter if specified
if (!string.IsNullOrEmpty(DefaultImage))
{
    imageUrl += "&default=" + HttpUtility.UrlEncode(DefaultImage);
}

// if we need to output the site link:
if (OutputGravatarSiteLink)
{
    output.AddAttribute(HtmlTextWriterAttribute.Href, "http://www.gravatar.com");
    output.AddAttribute(HtmlTextWriterAttribute.Title, LinkTitle);
    output.RenderBeginTag(HtmlTextWriterTag.A);
}

// output required attributes/img tag:
output.AddAttribute(HtmlTextWriterAttribute.Width, Size.ToString());
output.AddAttribute(HtmlTextWriterAttribute.Height, Size.ToString());
output.AddAttribute(HtmlTextWriterAttribute.Src, imageUrl);
output.AddAttribute(HtmlTextWriterAttribute.Alt, "Gravatar");
output.RenderBeginTag("img");
output.RenderEndTag();

// if we need to output the site link:
if (OutputGravatarSiteLink)
{
    output.RenderEndTag();
}

Using the control on your own projects

As previously mentioned, the download solution will not open properly in Express versions of Visual Studio, since it does not support control projects, but the control, included in the download is supported by all versions of Visual Studio, 2005 and later.

The easiest way to use the control is to add the control to the toolbox. To do this, ensure that you are in design mode (looking at a web page), and right click on the ‘Standard’ group header of the Toolbox. From the context menu, select “Choose Items” and browse to the assembly (Freshclickmedia.Web.dll), and click “OK” to add.

Once you’ve added the assembly, you should see the following:

From there, you can drag the control onto your page and start having fun!

I was extremely excited about the Worldwide Developer Conference (WWDC) 2008, and so headed off to macrumors.com for a live feed of Steve Jobs’ keynote.

After a rather slow build-up, the almost inevitable announcement from Jobs that the 3G iteration of the iPhone was made. And so, there must follow an end to the enormous amount of speculation in blogs and forums about the features of the second generation iPhone.

As I saw the updates on macrumors.com, I was pleased, but not particularly surprised to see the following features:

• 3G speed. No great revelation - many of us Europeans saw the lack of 3G in first geneation as a serious drawback;
• GPS. Once again, this is now becoming standard on high-end mobiles such as Nokia’s N95, so there was almost an expectation that this would feature.
• App Store. I welcome the addition of an app store - extending the functionality of the device is most useful, and it’s an additional revenue stream for apple.
• ‘iPhone in Enterprise’. Push e-mail and integration with Microsoft Exchange ActiveSync is a big plus for business users. Should Blackberry be worried?
• Now available in white. No doubt there will be a pink version soon. I’ll stick with black, thanks.

The App Store interests me - particularly the iPhone version of Super Monkey Ball. The built-in accelerometer suits the game very well, and I look forward to playing some games on a mobile platform.

What struck me more than anything, and something that was lacking from much speculation was the price. Although it’s somewhat irksome, considering I paid over £200 for my phone, I was shocked at the price of the new iPhone. $199 for the 8Gb version, and $299 for the 16Gb version is quite amazing, but let’s wait a little to see what carriers charge for a contract, and how long the minimum contract term will be.

Shortly after the announcement, Apple’s UK site was updated with the 3G iPhone details, and UK iPhone carrier O₂’s followed with a ‘come back tomorrow’ teaser.

Well, I reckon that the 8Gb price will be £129 in the UK with an 18 month or perhaps even a 24 month contract. How much an upgrade will cost is anybody’s guess, but hopefully, as the O₂ website states, all will be revealed tomorrow.

So, much of the speculation was correct, and although the price point is certainly attactive, I’m surprised about the camera remaining at its current specs of 2 megapixel. Whilst I think that this is ok, it doesn’t deal with any kind of movement at all well, and the delay is not acceptable. Perhaps a flash would have been too large a drain on battery life; increasing the megapixels, but not including a flash would have been an even stranger position than doing nothing at all. Perhaps we’ll see that in the third generation, along with the pink colour scheme.

I had an 80s flashback today as I fired up image editing freebie Paint.NET and accidentally discovered the Mandelbrot Fractal render effect. It took me back to the days of waiting for each row of pixels to be generated on my Atari ST. I began to experiment with a few images.

To invoke the effect, you just need to select the “Mandelbrot Fractal” from the Render effects menu item.

So, let’s take this image:

Applying the effect gives us:

And to a second image:

gives us:

There a number of effect options such as zoom factor, quality and angle, but I thought it was quite fun that some images of my youth could be reproduced very easily with a variety of source images.

The reduction of £100 to £169 for the 8Gb version is a ‘limited’ offer that runs until June 1, but I suspect that alongside the low stocks and zero-replenishment of iPhones, that a new 3G version is on the cards. Industry speculation continues to put a release date as early as June or July of this year.

I have also seen various reports that there will a refund of £100 for customers who’ve bought their 8Gb iPhone in the last 30 days. This pleased me - I had bought mine in that period, so I was covered. However, having gone into a local O₂ shop, I was shown an e-mail received by an employee that detailed the refund period as only 14 days. So - I’m confused as to whether I will get any kind of refund. An O2 forum post is positive, but I’ll have to give them a call and find out.

Technological advance is both exciting and risky - buying the latest kit will incur a financial penalty, but price-cuts are a certainty as new product-lines are released. I’m happy with my iPhone, and although I’ve got an 18-month contract, I look forward to the next iteration.

Since that post was written, O₂ have increased the basic, £35 ($70) tariff to include 600 minutes and 500 texts, but most of the other points are well made. I had been spoilt with a very good camera on my Sony Ericsson K800i, and truth be told, the iPhone’s camera is vastly inferior, but in so many other areas, it trounces over it wholeheartedly.

For me, the relatively poor camera and lack of 3G were (and still are) issues, but everything else is so well-designed, feels so right, that you forgive it’s drawbacks. The iPhone is a fantastic device, and I’m very happy that I’ve purchased one.

I was thinking of waiting for an improved second-generation device. Perhaps it will feature an improved camera, with flash, with video recording, and 3G support.

Obviously, I couldn’t wait, and went straight ahead and bought one, but you know what? Now that I have, you can bet that a second-generation model is going to be released real soon.

An updated version of this post, containing full source for the control and explanation is available here.

Original Post

The guys over at Gravatar.com have been hard at work updating their service, and I’ve updated the ASP.NET control I developed to reflect the changes.

The maximum size of Gravatars has now been increased from 80 to 512, so there’s a code change in the Render method:

// if the size property has been specified, and in the range
// 1..512:
try
{
    // if it's not in the allowed range, throw an exception:
    if (Size < 1 || Size > 512)
        throw new ArgumentOutOfRangeException();
}
catch
{
    Size = 80;
}

So, a default of 80 will still be used if the value specified is not within the 1 to 512 range, or it is not specified, but allows for a larger size.

The avatar.php URL serving the images now supports abbreviation, but the code in the control has not been changed.

The image shows the Design time view of the control, with the width set at the default value of 80. I’ve checked the control at 512 pixels, but my Gravatar doesn’t look too good expanded out to that size, so I’ve decided to stick at size 80 for the screenshot!

An updated version of this post, containing full source for the control and explanation is available here.

Original Post

I just got myself a freshclickmedia.com Gravatar over at gravatar.com. A Gravatar is a little avatar associated with an email address, and quite a few blogs use them to decorate post comments. Signing up is easy - all you need to do is supply an email address, and image, and give your image a content rating.

The source of the gravatar image tag points to gravatar.com’s image generator and includes an MD5 hash of the email address to prevent email harvesting. A ‘max rating’ parameter prevents the display of unsavoury content.

There are a wide number of blogging gravatar plugins, so I decided to write an ASP.NET custom control to do the job. Here I present the control and its features.

Using the Control

To get up and running, the control requires an email address:

<fcm:Gravatar ID='Gravatar1' runat='server' Email='username@domain.com' />

For my email address, I get the following:

And if we look at the generated source:

<a id="Gravatar1" href="http://www.gravatar.com" title="Get your avatar"><img width="80" height="80" src="http://www.gravatar.com/avatar.php?gravatar_id=ccf3b8c638f15d005e5d070aeb1a3923&rating=G&size=80" alt="Gravatar" /></a>

The default produces a hyperlink off to the Gravatar site with a title “Get your avatar”. The image contains the MD5 email hash, a rating of “G” (suitable for all audience types), and a size of 80.

Customisation

The control supports a number of properties supporting the customisation of its output.

Size

The size property of the control can be in the range 1 to 80. If it is outside this range, a default of 80 will be used.

MaxAllowedRating

The ‘highest’ allowed rating of image.

• A G rated gravatar is suitable for display on all websites with any audience type.
• PG rated gravatars contain may contain rude gestures, provocatively dressed individuals, the lesser swear words, or mild violence.
• R rated gravatars may contain such things as harsh profanity, intense violence, nudity, or hard drug use.
• X rated gravatars may contain hardcore sexual imagery or extremely disturbing violence.

OutputGravatarSiteLink

True by default, determines whether a hyperlink linking to the gravatar website will be output around the image.

LinkTitle

“Get your avatar” by default, allows the customisation of the ‘title’ attribute of the link (obviously doesn’t apply if OutputGravatarSiteLink property is set to false.)

DefaultImage

URL encoded URL, protocol included, of a GIF, JPEG, or PNG image that should be returned if either the requested email address has no associated gravatar, or that gravatar has a rating higher than is allowed by the “MaxAllowedRating” property.

The code snippet below shows the associated properties.

<fcm:Gravatar ID="Gravatar1" runat="server"
    Email="username@domain.com"
    DefaultImage="http://www.site.com/default.jpg"
    OutputGravatarSiteLink="true" Size="40" />

Download and Get Started

You can download the Gravatar Custom Control here. Once you’ve extracted the assembly from the ZIP file, add to the Visual Studio toolbox by right clicking on the toolbox and selecting “Choose Items” from the context menu. Browse to the assembly (Freshclickmedia.Web.dll), and click “OK” to add.

I picked up a paperback version and here I present my thoughts.

Until a couple of weeks ago, had someone mentioned Lulu, I’d have thought of the Scottish singer (pictured), but a post over at Zeldman.com introduced me to self-publishing site Lulu.com, where anyone can publish their content for a worldwide market. Cool - I thought, but didn’t expect to be purchasing something from the site any time soon. A couple of days later, and a visit to FreelanceSwitch revealed their new book about Freelancing, How to Be a Rockstar Freelancer was published on Lulu.

Having always loved books, I ignored the PDF version, and plumped straight for the ‘hard’ copy, perhaps ignoring the rather steep price of £19.29 for 216 pages. I’d banked on the book’s website heritage to produce something that could justify me spending that amount of money. I did have some reservations about the quality of the book itself, and I did draw some parallels with tip-style books that sometimes appear on gaming magazines.

Payment on the Lulu site was seamless, and within a few days, I received my copy of the book.

Initial impressions were good - although not ‘full-size’ when compared to traditional technical books I’m used to, it felt pleasing in the hand.

I approached the book from a beginner’s standpoint - I was hungry for knowledge and reassurance about my new freelancing lifestyle - and not surprisingly, I found the book’s writing style and content to be very similar to that of the website. I have seen some other reviews of the book that give the book criticism because it is a little too close to the website’s content, and that the book is merely a collation of the articles presented on the site. Although this might be a downside for some, I consider that good content is good content, and hey - I still like books.

A testimonial on the book says that freelancers of all experience will gain something from the book, but I feel that it is mostly suited to those with a minimal amount of experience. Freelancers who’ve been around for a while may feel cheated by the book’s price.

A positive point is that the book clearly explains not only how to succeed as a freelancer, but how to make the change from full-time job. Other areas of note include:

• Branding
• Choosing a place of work
• Getting off the ground by securing projects
• Project scope and timing
• Pricing your work
• Tracking hours and milestones
• Working with clients and dealing with disputes and problem clients
• Invoicing and getting paid
• Marketing your services as a freelancer
• Expanding your business

A preview of the book can be found on the Lulu website.

Overall, I feel that it is a worthwhile read and gave me lots of tips and confidence with my freelance ‘plan’.

Good points

• Friendly, informative writing style
• Good coverage of a wide range of topics
• Best suited for beginners

Bad points

• Price is too high for many
• Experienced freelancers may not gain much

Many years ago, I spent 6 months in India. For the first three months, I was staying at a rural polytechnic in Uttar Pradesh, and I tried to learn some Hindi for my own interest, and because I felt it would help me settle in and go some way to befriending the mainly non English-speaking people in the area. Some of my fellow travellers felt no need to make an effort, and insisted on saying English words more loudly and slowly. Funnily enough, this doesn’t really work.

I make this comparison to people who bring coding style and standards from previous languages. I’ve recently been working on C# code that screams of work from a former VB programmer. There are prefixes to all the variable names to indicate their type, constants are capitalised, method parameters are prefixed with additional information as to whether they are passed by reference, and members are prefixed with ‘m’.

public const string cstrDataGridXml = "DataGridDetails.xml";

public EditableTable(string p_strTableName,string p_strTableDesc, bool p_bExtended)
{
	mstrTableName = p_strTableName;
	mstrTableDescription = p_strTableDesc;
	mbExtended = p_bExtended;
}

I find this type of thing mildly infuriating - it’s like going to India and shouting English. To bring this old coding style to a new language blurs the distinction of coding standards between languages, the very coding standards which are established because of language features. To mix the styles blurs this distinction, and reduces the clarity and purpose of those coding standards.

I come from a C++ background, and although I don’t touch the stuff these days, you can bet that if I returned, I’d be coding as I did back in the year 2000. Now I’m doing C#, I use those the standards defined by Microsoft, who, to be fair, should know a thing or two about C#.

Having started Ruby and Ruby on Rails, I code Ruby like a Ruby programmer - so you won’t find any m_ prefixes for member variables or such like. Perhaps one day, another Ruby programmer will look at my code. If it’s styled like Ruby, their understanding and comfort in reading my code will be maximised.

This naming also extends to control prefixes in ASP.NET and WinForms. Drop a TextBox onto a web form and by default, you’ll get TextBox1. So why change the prefix to txtBox?

I think it’s important for developers to respect the language they’re programming in, and code accordingly - although the exact content of a coding standard for language ‘X’ promotes contention, a mishmash surely doesn’t have any advantages.

Here I present a list of books, in a particular order, that I recommend to anybody learning RoR.

I hope this list is of some use to other budding RoR developers.