Tab authoring in Glimpse CTP1 - Introduction - Part 1

Source http://kristofferahl.tumblr.com/post/31996623630/tab-authoring-in-glimpse-1-part2

A while back I started working on a Glimpse plugin for FluentSecurity. Back then Glimpse was still in beta (0.86) and while the team had done an awesome job enabling us to write custom plugins, I found it hard to keep track of all the object arrays. It was also quite hard to test the plugin, which was something I felt I needed to do to get things right.

Being a big fan of fluent api’s I set out to create a set of fluent helpers for tab authoring. Recently Glimpse CTP1 was released and they were kind enough to accept my pull request for the fluent helpers I had created. In this post I’ll describe how you can leverage them to help you create your own plugin/tab for Glimpse.

I know you’re already saying “show me the codez” so here’s a sample plugin using the new helpers:

public class Modules : AspNetTab
{
    public override object GetData(ITabContext context)
    {
        var plugin = Plugin.Create("Order", "Name", "Type");
        var count = 0;

        var requestContext = context.GetRequestContext<HttpContextBase>();
        foreach (var moduleKey in requestContext.ApplicationInstance.Modules.AllKeys)
        {
            var httpModule = requestContext.ApplicationInstance.Modules[moduleKey];

            plugin.AddRow()
                .Column(count++)
                .Column(moduleKey).Strong()
                .Column(httpModule.GetType().FullName)
                .SelectedIf(moduleKey == "Glimpse");
        }

        return plugin;
    }

    public override string Name
    {
        get { return "Modules"; }
    }
}

I’ll do my best at explaing what’s going on here. But first, here’s the output created by Glimpse.

Glimpse Modules tab result

As you can see we have managed to list all the modules loaded in the application. Now let’s look at things in more detail.

Step by step

First we create a tab passing in the headers we want for each column.

var plugin = Plugin.Create("Order", "Name", "Type");

This will return a TabSection which is the root of our tab/plugin. A TabSection can be seen as simple table that contains rows (TabRow) and columns (TabColumn). Next we get all the module keys and start itterating.

For each key we add a row to the TabSection by calling plugin.AddRow().

Next we need to add some data to the row and we do this using method chaining.

plugin.AddRow().Column("Some value goes here. Any object will do!");

In the case of the Modules tab we have 3 headers so we need to add 3 columns.

plugin.AddRow()
    .Column(count++)
    .Column(moduleKey)
    .Column(httpModule.GetType().FullName);

In the first column we want to display the order of the module. In the second column we display the key (name of the module). Lastly we display the full type name of the module. Simple enough.

Column styles

Next we want to use the built in support for styling our data. Again we use method chaining to do this. After each call to .Column() we can choose to format that column in various ways. Glimpse currently supports Strong, Emphasis, Underline along with a few other useful styling options.

In our example we want to make the “Name” column stand out so we use .Column(moduleKey).Strong() to do this.

Row styles

As if this wasn’t enough there is also support for “row”-styles. I decided we should highlight the Glimpse module so it will be easier to see if it was loaded by our application. This is done by chaining .SelectedIf(moduleKey == "Glimpse") on to the last column. These types of “row”-styles must be applied last. There’s support for Warn, Error, Quiet and a few more.

After we are done itterating over each module we simply return the plugin (TabSection). That’s it, we now have a working Glimpse tab/plugin!

What’s next

I’ll go in to more details in upcoming blog posts on the fluent api for Tab authoring but for now this will have to do.

Please leave any feedback you have on the fluent api in the Glimpse google group.

Enjoy!

Posts in this series