Template based code generation - Part 1 : introduction, SVG generation

Series index

Principle

The tdCodeFactory PowerShell module uses here-strings and code expansion mechanism to offer template based code generation features.

This module provides the Export-FileFromTemplate command, which receives as parameters:

• The template file path.
• A script block to initialize context and data.
• The generated file path.

The template and the script block must match. For example, the script block may define a variable used by the template. The variables must be defined with the Script scope. These variables are usually referencing .NET objects whose class can be defined in C#.

Next parts of this article assume that the tdCodeFactory module is installed and opérational.

SVG code generation example

SVG is a language for defining vector graphics scenes. It is supported by all recent browsers.

Our first example is to produce an SVG file that defines a rectangle with rounded corners. Fill and stroke are defined by a CSS style.

In the Github repository , the source code for this example is available in the Demo/1.ShapeFactory and Demo/CsCode folders.

Template and objects

The template (rect.svg.template file) expects from the script block the following variables:

• $shapeboard : workspace definition, instance of the ShapeboardData C# class.
• $shapeStyle : CSS style definition, instance of the ShapeStyleData C# class.
• $rect : rectangle definition, instance of the RectData C# class.

The corresponding C # classes are defined as follows (in reality they are distributed in different files, and may define additional members for the next examples):

namespace CodeFactory
{
  public class ShapeboardData
  {
    public string Name { get; set; }
    public int Width { get; set; }
    public int Height { get; set; }
  }
  public class ShapeStyleData
  {
    public string Name { get; set; }
    public string Target { get; set; }
    public string Fill { get; set; }
    public string Stroke { get; set; }
    public int StrokeThickness { get; set; }
  }
  public class RectData
  {
    public string Name { get; set; }
    public string StyleDataName { get; set; }
    public int X { get; set; }
    public int Y { get; set; }
    public int Width { get; set; }
    public int Height { get; set; }
    public int RadiusX { get; set; }
    public int RadiusY { get; set; }
  }
}

The template therefore uses the data from C# classes (which are instantiated by the script, as we will see below):

<svg xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 $($shapeboard.Width) $($shapeboard.Height)">
  <defs>
    <style type="text/css">
      <![CDATA[
        $($shapeStyle.Target).$($shapeStyle.Name){
          fill: $($shapeStyle.Fill);
          stroke: $($shapeStyle.Stroke);
          stroke-width: $($shapeStyle.StrokeThickness);
        }
      ]]>
    </style>
  </defs>
  <rect 
    x='0' 
    y='0' 
    width='$($shapeboard.Width)' 
    height='$($shapeboard.Height)'
    fill='#FFCC4D' />
  <rect 
    class='$($rect.StyleDataName)' 
    x='$($rect.X)'
    y='$($rect.Y)'
    width='$($rect.Width)'
    height='$($rect.Height)'
    rx='$($rect.RadiusX)'
    ry='$($rect.RadiusY)'/>
</svg>

The SVG scene viewBox is sized using data from the $shapeboard object. Also the first rectangle, which is used to show the workspace. The style is defined by the data of the $shapeStyle object. It is referenced by the second rectangle using the class attribute. Others characteristics are obtained from the $rect object.

The role of the script block given to the Export-FileFromTemplate command consists therefore in C# classes loading, instantiating and initializing.