Released: RelativeTime

Ruby has a nifty little function called time_ago_in_words. You pass it an arbitrary number of seconds and it gives you back something friendly like “about 2 weeks ago”.

Today, I implemented a similar routine for .NET.

relativetime.codeplex.com

nuget.org/List/Packages/relativetime

To use it, just include the namespace, then call ToHumanTime() on a TimeSpan object.

If you want more of an idea of what it generates, take a look at the test suite.

Released: Crockford Base32 Encoder

Now, doesn’t that just sound sexy? No, not really. I hear you.

Alas, I went and built it anyway.

crockfordbase32.codeplex.com

nuget.org/List/Packages/crockford-base32

Crockford Base32 lets you encode a number into an alphanumeric string, and back again.

Where it shines is in the character set it uses.

It’s resilient to humans:

  • No crazy characters or keyboard gymnastics
  • Totally case insensitive
  • 0, O and o all decode to the same thing
  • 1, I, i, L and l all decode to the same thing
  • Doesn’t use U, so a number like 519,571 encodes to FVCK instead
  • Optional check digit on the end

It’s great for URLs:

  • No funky characters that require special encoding
  • No plus, slash or equals symbols like base 64

It handles really big numbers. (Well, my implementation is limited to 18,446,744,073,709,551,615 but you could extend the algorithm even further just by changing the data type from ulong to something even bigger.)

Number Encoded Encoded with optional check digit
1 1 11
194 62 629
456,789 1CKE 1CKEM
398,373 C515 C515Z
3,838,385,658,376,483 3D2ZQ6TVC93 3D2ZQ6TVC935
18,446,744,073,709,551,615 FZZZZZZZZZZZZ FZZZZZZZZZZZZB

 

Don’t have too much fun now.

Making Internet Explorer Better for Developers

Here’s what my Start Bar looks like:

Screenshot of my start bar: Outlook, IE9, IE6, Firefox, Chrome, Safari, Opera, Visual Studio, Photoshop, Excel, MetroTwit, Communciator, Skype, Live Messenger

Specifically, you’ll notice that I have all the major browsers there as first class citizens. When I want to launch a browser, I just randomly move my mouse towards the bottom left of my screen and click which ever browser I hit first. As I write this post, I’m using four of them to browse the web. LastPass deals with my passwords and I don’t use bookmarks anyway.

I do this to maintain my knowledge of all the browsers, to help me be a better web developer.

For day-to-day browsing, this works fine. For development though, I find myself actively switching to Firefox just so I can use Firebug. On paper, Internet Explorer’s developer tools do everything Firebug does. In practice, I’ve just never liked them as much. Even with the current progress on consistent rendering, we need good development tools in all the browsers.

Over the last few days, I’ve been exclusively using the Internet Explorer 9 developer tools. I’ve noted each feature that I think needs work. Now, I want to add your feedback so that we can build a cohesive set of requests for the IE team. None of these suggestions will make it into the IE9 release, but now is a good time to get our feedback in before they commence planning for IE10.

General Browser

  • JS error dialog is annoying as hell – would be good to say “stop showing error dialogs” after the first one, and route the rest of the text to the console
  • Would be nice to be able to view JSON responses in the browser instead of getting a download prompt, just like XML

Console tab

HTML tab

  • Minor, but the HTML should really get renamed to DOM. It feels a bit silly telling people to go to the HTML tab when they want to see how an SVG is structured
  • Selecting an element in the DOM should outline it on the page
  • Can’t delete an element
  • Adding CSS properties in dev tools (should be able to do it from trace styles, not via attributes)
  • "Edit" button in DOM always seems to edit the wrong node
  • Typing style=" to add an attribute results in style="" which works against the habit
  • Rename "Trace Styles" to "Applied Styles" and make it the default
  • Rename "Style" to “Trace Styles” and make it second
  • Layout pane is too chunky – always have to make the dev tools bigger just to see it
  • With an active node in the DOM, need a way to get into the attribute editing via the keyboard only F2

Script tab

  • Whenever I hit “Start Debugging”, the dev tools undock and docking gets disabled. Seems unrelated and certainly annoying.

CSS tab

  • "This stylesheet cannot be viewed because its source is in a different domain than the page."

General dev tools

  • Why is there a "Clear Browser Cache" button in the HTML + CSS tabs? It’s already in the menu.
  • Why is Disable > Script not available? (It’s there, but greyed out.)
  • Consolas over Courier please.

What are you suggestions? Comment on this post.

I’m on the Microsoft campus in Seattle this week so I’ll be championing as many of these issues with the IE team as I can.

Talk Resources – Internet Explorer 9 for Developers

At REMIX10, TechEd AU 2010 and TechEd NZ 2010 I’ve been showing some of what’s new in Internet Explorer 9 for developers.

Here are the slides and code: http://db.tt/JvEUu3o

The recording from TechEd New Zealand (the third and best version!) is available here: http://www.msteched.com/2010/NewZealand/WEB304

IE9NZ

The recording from TechEd Australia (version 2 of the talk) is available here: http://www.msteched.com/2010/Australia/WEB204

IE9AU

And finally, here’s a recording from REMIX10 Australia (version 1 of the talk): http://www.microsoft.com/australia/remix/videos/default.aspx

IERemix

If you’ve attended any of these talks, thank you for your feedback! The session evals at conferences are like crack for speakers. We read every single one, and then we read them again.

— Tats

Talk Resources – Riding the Geolocation Wave

At both the REMIX10 conference in Melbourne, Australia and more recently TechEd New Zealand I presented on geolocation for developers.

This was the abstract:

It’s pretty obvious by now that geolocation is a heavy player in the next wave of applications and APIs. Now is the time to learn how to take advantage of this information and add context to your own applications. In this session we’ll look at geolocation at every layer of the stack – from open protocols to operating system APIs, from the browser to Windows Phone 7. Building a compelling geo-enabled experience takes more than simple coordinates. In this session Tatham will introduce the basics of determining a user’s location and then delve into some of the opportunities and restrictions that are specific to mobile devices and their interfaces.

The talk was filmed at TechEd New Zealand, and is available for download here: http://www.msteched.com/2010/NewZealand/WEB205

(Note: this version has a Windows Phone 7 demo in it too.)

GeoNZScreenshot

The first version of the talk was also filmed at REMIX10, and is available for download here: http://www.microsoft.com/australia/remix/videos/default.aspx

GeolocationScreenshot

Here are some links to the code and resources (but you really want to watch the talk first):

(Post last updated 7th Sep 2010 with new links and videos)

Web Forms Model-View-Presenter on Hanselminutes

Over the last few months Damian Edwards and myself have been spending quite a bit of time building out a Model-View-Presenter framework for ASP.NET Web Forms.

Until now we’ve been pretty quiet about it all on our blogs because we were busy polishing off v1 and trying to get all the documentation in order. Nevertheless, the word has definitely started to spread as Scott Hanselman interviewed me about the library on this week’s Hanselminutes episode.

Listen to the podcast

Learn more about the library

Video: Building Fast, Public Websites

Following up from my last post about the ASP.NET MVC vs ASP.NET WebForms debate, we’ve had a second TechTalk posted, also from TechEd Australia. In this video, Michael Kordahi, Damian Edwards and I sat down to discuss building fast, public websites. It was a bit of a teaser for our breakout session at the conference, which will be available online as a screencast in the next week or two.

If you’re interested in learning more about building large public websites on ASP.NET, remember that the full video from our recent REMIX session is still available online too.

Building Fast, Public Websites

Watch Online or Download

Video: ASP.NET MVC vs ASP.NET WebForms – Will WebForms be replaced by MVC?

At the recent TechEd Australia conference, Paul Glavich, Damian Edwards and myself sat down to discuss what we thought about the current MVC vs WebForms debate. Our TechTalk has now been posted on the TechEd Online site, and available for anyone to watch.

Check it out, and feel free to continue the debate with any of us. 🙂

ASP.NET MVC vs ASP.NET WebForms – Will WebForms be replaced by MVC? 

Watch Online or Download

Accessing ASP.NET Page Controls During PreInit

If you’ve read my previous post explaining a common pitfall with view state, I’d hope you’re preparing all your controls in the Init event of the page/control lifecycle.

Even if I’m not reusing them through my application much, I like to factor elements like a drop down list of countries into their own control. This centralizes their logic and allows us to write clear, succinct markup like this:

<tat:CountriesDropDownList ID="AddressCountry" runat="server" />

The code for a control like this is quite simple:

[ToolboxData("<{0}:CountriesDropDownList runat=\"server\" />")]
public class CountriesDropDownList : DropDownList
{
    protected override void OnInit(EventArgs e)
    {
        DataSource = Countries;
        DataBind();

        base.OnInit(e);
    }
}

The Problem

Once you start using this encapsulation technique, it won’t be long until you want to pass in a parameter that affects the data you load. Before we do, we need to be aware that the Init event is fired in reverse order. That is, the child controls have their Init event fired before that event is fired at the parent. As such, the Page.Init event is too late for us to set any properties on the controls.

The natural solution is to try and use the Page.PreInit event, however when you do you’ll often find that your control references are all null. This happens when your page is implemented using a master page, and it relates to how master pages are implemented. The <asp:ContentPlaceHolder /> controls in a master page use the ITemplate interface to build their contents. This content (child controls) is not usually prepared until the Init event is called, which means the control references are not available. For us, this represents a problem.

The Solution

The fix is remarkably simple; all we need to do is touch the Master property on our Page and it will cause the controls to become available. If we are using nested master pages, we need to touch each master page in the chain.

I often create a file called PageExtensions.cs in my web project and add this code:

public static class PageExtensions
{
    /// <summary>
    /// Can be called during the Page.PreInit stage to make child controls available.
    /// Needed when a master page is applied.
    /// </summary>
    /// <remarks>
    /// This is needed to fire the getter on the top level Master property, which in turn
    /// causes the ITemplates to be instantiated for the content placeholders, which
    /// in turn makes our controls accessible so that we can make the calls below.
    /// </remarks>
    public static void PrepareChildControlsDuringPreInit(this Page page)
    {
        // Walk up the master page chain and tickle the getter on each one
        MasterPage master = page.Master;
        while (master != null) master = master.Master;
    }
}

This adds an extension method to the Page class, which then allows us to write code like the following:

protected override void OnPreInit(EventArgs e)
{
    this.PrepareChildControlsDuringPreInit();

    MyCustomDropDown.MyProperty = "my value";

    base.OnPreInit(e);
}

Without the call to the extension method, we would have received a NullReferenceException when trying to set the property value on the MyCustomDropDown control.

You now have one less excuse for preparing your controls during the Load event. 🙂