First thing I want to say is that Spark is a very very nice ViewEngine. After the resulting unpleasantness of using the WebForms ViewEngine and the horrible flashbacks to my ASP days, I decided that I was going to do my best to avoid using it. I mean c'mon, its 2008, we've progressed beyond having to create spaghetti code and not have to resort to ASP.NET WebControls
I'm gonna go over a few of the things I really like about Spark that I've came across so far.
Application.spark
Spark uses a file called Applicartion.spark as the default master template.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<use namespace="System"/>
<use namespace="System.Web.Mvc"/>
<use namespace="MvcContrib"/>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<global Title='"Some Company Intranet"' type='string' />
<title>${Title}</title>
<macro name="PageTitle" caption="string">
<set Title='string.Format("{0} - {1}", Title, caption)'/>
</macro>
<link href="~/Static/Css/Site.css" rel="stylesheet" type="text/css" />
<use content="head" />
<use content="css" />
</head>
<body>
<div class="page">
<div id="header">
<p id="logo">
<a href="~/">Home</a>
</p>
<navigation />
</div>
<div id="main">
<div id="content">
<use content="view" />
</div>
<footer />
</div>
</div>
<use content="js" />
</body>
</html>
I don't know about you, but I think that's a joy to look at.
Strange Tag #1 - <macro>
Macro's are awesome, they allow you to create a basic helper method that returns a string. Yeah, I lifted that straight from the documentation, but there isn't really much else to say. The above Macro takes a string and uses it to set the page title. Using it from a view is as simple as this:
${PageTitle("Certificate of Postage")}
Strange Tag #2 - <use>
This is one of the many ways to include a file and I guess it comparable to WebForms ContentPlaceHolder. Using the head/css/js sections is as simple as this:
<content name="js">
<script src="~/Static/JS/jquery.simplemodal.js" type="text/javascript"></script>
<script src="~/Static/JS/jquery.simplemodal.basic.js" type="text/javascript"></script>
</content>
<content name="css">
<link href="~/Static/Css/jquery.simplemodal.basic.css" rel="stylesheet" type="text/css" />
</content>
Very sexy! What about the view? Well, Spark will automatically include the view into the <use content="view" /> tag.
What I like about this is the amount of code you don't have to write. I'm lazy, and anything that means less code to write and maintain is a good thing.
Strange Tag #3 - <navigation /> <footer />
If you followed my link to the many way to include a file, you will know this is how you include a partial file. A partial file, for this of you that didn't look, are basically chunks of reusable code that are defined with a file name like: _footer.spark. I find this leaves code a lot cleaner. For example, I'm using a lot of jQuery plugins, and I've seperated each out as a partial file. To make use of these, I would do something like the following:
<jquery />
<modal />
<autocomplete />
<tooltip />
Each of those partial files will setup the correct JS file and css. The above example for <use /> is what is present in the modal partial. The _tooltip.spark file contains:
<content name="js">
<script src="~/Static/JS/jquery.tooltip.js" type="text/javascript"></script>
</content>
<content name="css">
<link href="~/Static/Css/jquery.tooltip.css" rel="stylesheet" type="text/css" />
</content>