Simple tiles
Illustrates conversion from aspx with a masterpage to tiles

This tutorial illustrates a direct conversion from .aspx pages to SharpTiles. It stays close to the .aspx structure. Some tiles may seem a bit awkward. Please read the clean tiles examples too. It cleans up the tiles build in this tutorial.

Highlights

Register the SharpTiles view engine in global.asax.cs

protected void Application_Start()
{
  RegisterRoutes(RouteTable.Routes);
  ViewEngines.Engines.Clear();
  ViewEngines.Engines.Add(new TilesViewEngine().Init());
}

Convert the master page to a tile
.asxp
<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head runat="server">
  <title>
   <asp:ContentPlaceHolder ID="TitleContent" runat="server" />1
  </title>
  <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
  <div class="page">
   <div id="header">
    <div id="title">
     <h1>My MVC Application</h1>
    </div>
    <div id="logindisplay">
     <% Html.RenderPartial("LogOnUserControl"); %>2
    </div>
    <div id="menucontainer">
     <ul id="menu">
      <li><%= Html.ActionLink("Home", "Index", "Home")%></li>
      <li><%= Html.ActionLink("About", "About", "Home")%></li>
     </ul>3

    </div>
   </div>
   <div id="main">
    <asp:ContentPlaceHolder ID="MainContent" runat="server" />4
    <div id="footer"></div>
   </div>
  </div>
 </body>
</html>
Converted to SharpTiles
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <meta http-equiv="Content-Type" content="text/html;
        charset=iso-8859-1" />
  <title><tiles:insert name="title"/>1</title>
  <link href="<c:url value='~/Content/Site.css'/>"
        rel="stylesheet" type="text/css" />
 </head>
 <body>
  <div class="page">
   <div id="header">
    <div id="title">
     <h1>SharpTiles Plain Tiles tutorial</h1>
    </div>
    <div id="logindisplay">
     <tiles:insert name="logon"/>2
    </div>
    <div id="menucontainer">
     <tiles:insert name="menu"/>3
    </div>
   </div>
   <div id="main">
    <div id="content">
     <tiles:insert name="body"/>4
    </div>
    <div id="footer">
     <p>
      My Sample MVC Application WITH TILES © Copyright 2008
     </p>
    </div>
   </div>
  </div>
 </body>
</html>
Extracted menu
<ul id="menu">
  <li>
    <a id="menu_to_index" href="<c:url value='~/Home/Index'/>">Index</a>
  </li>
  <li>
    <a id="menu_to_about" href="<c:url value='~/Home/About'/>">About</a>
  </li>
</ul>3
tiles.xml
<?xml version="1.0" encoding="utf-16"?>
<tiles xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
 <definitions>
  <tile name="Default.Page.Layout"
        path="Views.Shared.Layout.tile"
  >
   <attribute name="logon" value="Views.Shared.Logon.tile"/>2
   <attribute name="menu" value="Views.Shared.Menu.tile"/>3
  </tile>

  ...

 </definitions>
</tiles>

  1. Changed the content place holder, <asp:ContentPlaceHolder/>, with tiles insert tag, <tiles:insert />.
  2. Changed the content place holder, <% Html.RenderPartial %>, with tiles insert tag, <tiles:insert />. It is always the same so it is added to the definition of the Default.Page.Layout in the tiles.xml
  3. Extract the menu &l;tul id="menu" /> into a tile. It is always the same so it is added to the definition of the Default.Page.Layout in the tiles.xml
  4. Changed the content place holder, <asp:ContentPlaceHolder/>, with tiles insert tag, <tiles:insert />.

The master page is now translated to a tile with tile definition. Now we will translate the View/Home/Index.aspx to a tile.

View/Home/Index.aspx <%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>
<asp:Content ID="indexTitle"1
          ContentPlaceHolderID="TitleContent"
          runat="server">
  Home Page
</asp:Content>
<asp:Content ID="indexContent"2
          ContentPlaceHolderID="MainContent"
          runat="server">
  <h2><%= Html.Encode(ViewData["Message"]) %></h2>
  <p>
    To learn more about ASP.NET MVC visit ...
  </p>
</asp:Content>

Converted to View/Home/Index/title.tile1
Home Page
Converted to View/Home/Index/body.tile2
<h2>
  ${Message}
</h2>
<p>
  To learn more about ASP.NET MVC visit ...
</p>
tiles.xml
<?xml version="1.0" encoding="utf-16"?>
<tiles xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
 <definitions>
  <tile name="Default.Page.Layout"
        path="Views.Shared.Layout.tile"
  >
   <attribute name="logon" value="Views.Shared.Logon.tile"/>
   <attribute name="menu" value="Views.Shared.Menu.tile"/>
  </tile>

  <tile name="Home.Index" extends="Default.Page.Layout">
  <attribute name="title" value="Views.Home.Index.title.tile"/>1
    <attribute name="body" value="Views.Home.Index.body.tile"/>2
  </tile>
  ...

 </definitions>
</tiles>

  1. Define the View/Home/Index/title.tile a content for the title tile
  2. Define the View/Home/Index/body.tile a content for the body tile

Now we have defined a view named Home.Index This view is the default view of the Index() method in the HomeController().

The rest is more of the same. See the project for end result.

Contact form fixed

I regret reporting that the contact form was broken for the last week. All mails send to us were corrupted(empty). So reported bugs in the last week are not received. I'm aware that the timing with regards to the monorail release isn't very handy. The contact form is fixed now. I apologize.

4 February, 2010

Monorail released M5

Monorail is released. The release also contains some minor fixes.

23 January, 2010

Monorail almost finished

Maikel Willemse is coding a Monorail view engine. It's available in the nightly release. A tutorial and a new release will be available shortly.

2 January, 2010

No more tiles.xml
(if you like)

A NSTL view engine is now available. You can do SharpTiles without having a tiles.xml. You will lose the power of dependency injection. If you are interested check out the tutorial page.

21 July, 2009

Developer M3 released

Fixed a couple of parse bugs. Cleaned up refreshing of resources, resource locations and registration of the TilesViewEngine. Wrote some tutorials
Ronald Dehuysser contributed the <tiles:insertTemplate/> and <tiles:putAttribute/> tag.

8 June, 2009

HtmlHelper wrapped II

Updated tag reference documentation.

5 April, 2009

Ready for MVC RC 2

SharpTiles is now ready to use with MVC RC 2.

6 March, 2009

HtmlHelper wrapped

The MVC HtmlHelper is now wrapped and can be used. For it's only available in the nightly build. When the documentation and new Tutorials are made a new release will be made.

22 December, 2008

Ready for Beta 1

SharpTiles is now ready to use with MVC Beta 1. The tutorial page will be updated soon.

3 November, 2008

We've got Tiles

It took me a bit longer than expected but Milestone 1 is reached. Tiles are now available.

23 July, 2008

First release

Finally, after some hard work my pet project is ready for its initial release. Here it is! Please give it some thoughts and feel free to add comments.

23 May, 2008

SID: PopUp 0