Organizing Content

Table of Contents

  1. Spark Documentation
    1. Basic markup
    2. Samples
    3. Misc added - needs documentation
  1. Expressions
    1. Simple csharp expressions
    2. Using Mvc Helpers
    3. Conditional expression elements
    4. Conditional expression attributes
    5. Looping and iteration
    6. Iteration with the each attribute
    7. Using namespace
  1. Variables
    1. Declaring local variables
    2. Declaring global variables
    3. Setting local and global values
    4. Using view data
    5. Using view data with a typed model
  1. Organizing Content
    1. Master-View relationship
    2. Named content sections
    3. Parsing and rendering partial files
    4. Implicit partial rendering

Master-View relationship

The view contents are rendered first, followed by the master contents. The master template includes the view at the appropriate location with $Content["view"]; or <use content="view"/>. 

<html>
  <head>
    <title>$Title;</title>
  </head>
  <body>
    <div id="header">dot dot dot</div>
    <div id="pageContent">$Content["view"];</div>
    <div id="footer">dot dot dot</div>
  </body>
</html>

Named content sections

Defining additional number of content sections or modules is one way you can create extensible blocks or regions in your layout. It's also a convenient way to enable a view to include additional css and js references in the head section.

This example shows a master layout which provides the ability for the views to add script and style to the head element, and add sections to a sidebar container.

Making named content appear in output 

<html>
  <head>
    <title>$Title;</title>
    <use content="head"/>
  </head>
  <body>
    <div id="header">dot dot dot</div>
    <div id="sidebar"><use content="sidebar"/></div>
    <div id="pageContent"><use content="view"/></div>
    <div id="footer">dot dot dot</div>
  </body>
</html>

Adding information to named content locations 

<p>this goes in the pageContent</p>

<content name="sidebar">
  <h3>Search</h3>
  <p>This is added to the sidebar</p>
<content>

<content name="head">
  <script type="text/javascript" src="yadda/file.js"></script>
<content>

<content name="sidebar">
  <h3>See also</h3>
  <p>This is also added to the sidebar</p>
<content>

The implementation details of this are very straightforward. The generated class is appending values to the current stringbuilder. When a <content name="foo"> element is encountered it changes which stringbuilder is current. Later when a <use content="foo/> or $Content["foo"]; is encountered the accumulated text in the named stringbuilder is written to the current one. The two intrinsic content blocks are "view" and "master".

Parsing and rendering partial files

You can include and render a partial file at a particular location with the following syntax:

viewfile 

<use file="mypartial"/>

This will look for a mypartial.xml file in the same directory as the view or in the Shared directory.

You can also declare local variables as attributes of the "use" element. Those variables, and anything else that was in context, can be used within the scope of the partial as local variables.

viewfile 

<use file="mypartial" caption="product.Name"/>

mypartial.xml 

<div>
<h3>$caption;</h3>
</div>

Implicit partial rendering

Finally, if your partial file starts with an underscore character the rest of the file name can be used as a new special element. This is nothing more than <specialname/> being used as a shortcut for <use file="_specialname"/> but it sure looks cool.

viewfile 

<var styles='new[] {"even", "odd"}' i='0'>
  <for each='var product in Products' i='i+1'>
    <ProductSummary cssclass="styles[i%2]" number="i"/>
  </for>
</var>

_ProductSummary.xml 

<div class="$cssclass;">
<p>$number;) $product.Name;</p>
</div>

Partial files starting with an underscore will be used from the view directory of the controller and from the "Shared" view directory.