Tag: Spark

Spark View Engine, ASP.Net MVC, and You

So one of the things I was forced to use, semi kicking and screaming, at one point in my illustrious career was the Spark View Engine for ASP.Net MVC. Actually that’s not totally true. I only kicked for a bit then skipped the screaming once I noticed what it did: It took all the ugly <% %> junk out of the html… my beautiful html… and made things like for loops much nicer. Mind you, this is mererly the tip of the ice pick… eh berg I meant berg… there’s a lot more to it. It handles things like Master Pages and Partial Controls pretty darn well as well as caching javascript files on the go. Sounds good? Well it should and if it doesn’t, I don’t think we can be friends.

First off, I just wanted to quickly write something up on how to get it all going and because I’m such a nice guy I even have a project that is ready to go for common use. The catch is that I made it in 2010 so if you don’t have that yet, you could be screwed. Then again I could type out a lot of the steps too. You just don’t know.

First off you can either get the assemblies from my hosted project, or you can go here and get it. Either way, I don’t care. No really, I don’t. Not just sayin’. The care cup had run dry.

The two assemblies you need to reference in your project are:

  spark.dll
  spark.mvc

Next add this line to the Application_Start method in the Global.asax.cs file:

  ViewEngines.Engines.Add(new SparkViewFactory());

After that, you’ll have to add a little somethin’ somethin’ to your web.config. I know, I know. This is all so very hard. Live strong like Lance.

  <configuration>
    ...
    <configSections>
      <section name="spark" type="Spark.Configuration.SparkSectionHandler, Spark"/>
    </configSections>
    ...
    <spark>
      <compilation debug="true" defaultLanguage="CSharp">
        <assemblies>
          <add assembly="PhotoShare.UI" /> //Whatever the actual UI project is
        </assemblies>
      </compilation>
      <pages automaticEncoding="false"> //If you want it to auto HTML encode post/get stuff
        <namespaces>
          <add namespace="System"/>
          <add namespace="System.Collections.Generic"/>
          <add namespace="System.Linq"/>
          <add namespace="System.Web.Mvc"/>
        </namespaces>
      </pages>
    </spark>

Ok so the web config is ready. Now what?

Well now you are going to create a master page. That’s right you are. Don’t fight me on this. I’m way cooler than you.

There is a little directory structure hard coding going on since by default you have to have things in certain places for Spark. Oh well. All Master Pages go in a directory named “Layouts” in the “Views” directory. So something like:

  Views/Layouts/Application.spark

D— it. Forgot about that little tid bit too. Spark files have to be named .spark. Well actually I think there’s a way to call them whatever you want, but lets just go with defaults for now smarty pants.

And for the hard part, the html for the master page.

  <html>
    <head>
    </head>
    <body>
      <div>
        <use content="Middle" />
          aasdfasdfa
      </div>
    </body>
  </html>

HOLY HECK THAT’S HARD! Now there needs to be a controller. So just create one in the controllers folder. In my project it’s called this:

  Controllers/SparkTestController.cs

And then go ahead and create a view for index. Once you’ve done that, rename the extension from aspx to spark. Now for the html:

  <use master="Application"/>

  <div>
    <content name="Middle">
        hi there
    </content>
  </div>

And that’s it really. As you can see, the placeholder on the master page (use content=”Middle”) is referred to on the child page.

To make testing this page easy, I would suggest changing the routing in the Global.asax.cs file to:

  routes.MapRoute(
          "Default",
          "{controller}/{action}",
          new { controller = "SparkTest", action = "Index"}

And you should see something like:

  hi there aasdfasdfa

Proving that both the master page and the child page are printing stuff out.

You might be wondering why you should do all of this? If you aren’t, you are one hell of a lemming. And not the cool kind like those little guys that blow themselves up for the betterment of the lemming collective.  You’re that stupid one the just sits there with its hand out shaking its head.

A quick example:

  <%
    if(something.IsTrue)
    {
  %>
       <div> hihihihih </div>
  <%
    }
  %>

Compared to:

  <div if="something.IsTrue"> hihihihih </div>

Small example, but I think its pretty obvious why the second is so much better. And this is just scratching the surface on what spark does really.  I’d suggest looking here for more. I’d also suggest a new hair cut because… just wow.