Make t4mvc a little bit better

I really like T4MVC. Using it for links and css is a bit painful though. Luckily you can solve this with HTML helpers.

If you haven't used T4MVC it is a T4 template that gives you a way to get strongly typed links in you ASP.NET MVC application. To read more visit the codeplex site.

There is one thing that has bothered me for some time but not so much that I did anything about it untill now. When you have static content like links, images or css and try to use the T4MVC you won't get any intellisense inside the html attribute. For exampel:

<script src="<%= Links.Scripts.jquery_treeview_min_js %>" type="text/javascript"></script>

NOTE: With Razor you actually get some intellisense inside the html attributes. unfortunately it doesn't work perfect. It seems to collide with the HTML src completion sometimes. You can get around this by writing the @ so that you have "@"  move the cursor out of the attribute and then back in. Works for me most of the time

Beside the fact that intellisense is having a hard time to help you it is plain boring to write that string each time. Luckily it is dead simple to create Html helpers for this. This class gives you helpers for CSS, Script and images using T4MVC links.

namespace System.Web.Mvc
{
    public static class StaticContentHelpers
    {

        public static MvcHtmlString Script(this HtmlHelper helper, string url)
        {
            return MvcHtmlString.Create("<script type=\"text/javascript\" src=\"" + url + "\"></script>");
        }

        public static MvcHtmlString CSS(this HtmlHelper helper, string url)
        {
            return MvcHtmlString.Create("<link href=\"" + url + "\" rel=\"stylesheet\" type=\"text/css\" />");
        }

        public static MvcHtmlString Image(this HtmlHelper helper, string url, string alt)
        {
            return Image(helper, url, alt, null);
        }

        public static MvcHtmlString Image(this HtmlHelper helper, string url, string alt, string cssClass)
        {
            var img = new TagBuilder("img");
            img.MergeAttribute("src", url);
            img.MergeAttribute("alt", alt);

            if (!string.IsNullOrWhiteSpace(cssClass))
            {
                img.AddCssClass(cssClass);
            }

            return MvcHtmlString.Create(img.ToString(TagRenderMode.SelfClosing));
        }

    }
}

With that in place we can write the links like this instead:

<%: Html.Script(Links.Scripts.jquery_treeview_min_js %>

Thats much more pleasant to work with. Using Razor it looks event better. If I wanted I could use a Func<Scripts, string> as argument to avoid typing the Links.Scripts part each time and instead get to write s => s.jquery_treeview_min_js. But I'll leave that to you if you feel the need.