08 Printouts - Handlebars

SRS supports the Handlebars templating engine. Template files should be stored in the /templates directory of the application.

Execute

To execute a Handlebars template, use the following API

/api/srs/{id}/{template-name}.hbs.html?id={id}

Creating a new template with basic helpers

/api/srs/{id}/_new.hbs.html

You can also use following extensions:

• .hbs.html - html
• .hbs.pdf - pdf
• .hbs.csv - csv
• .hbs.txt - txt
• .hbs.xml - xml
• .hbs.epp - epp
• .hbs.svg - svg

Example data object

{
    dataset0:   //object
          {
            "field0": "some test <b>test</b>",
            "field1": "some test2",
            "field2": "some test3",
          }
        ,
    dataset1: [ //array
          {
            "field0": "some text4",
            "field1": "some text5",
            "field2": "some text6",
          }
        ],
    dataset2: [] //empty array
} 

Handlebars FAQ

Built in functions

• isArray

{{#if (isArray this)}}
...

{{/if}}             

Iterate datasets

{{#each this}}
  <li>{{@key}}</li>
{{/each}}

IF in Handlebars

{{#if dataset2}}
 NOT VISIBLE - Array is empty
{{/if}}

{{#if dataset0}}
  VISIBLE -  object is not empty
{{/if}}

{{#unless isValid}}
{{/unless}}
Also keep in mind that you can insert an {{else}} in between an {{#if}} or {{#unless}}

raw text in Handlebars

raw: {{{dataset0.field0}}}
html-escaped: {{dataset0.field0}}

Includes (images)

There are two ways to include images in the Handlebars template:

Direct reference to storage

You can include images from any storage location using the [[ and ]] tags.

<img src="data:image/png;base64,[[/api/core/storage/get/www/images/logo.png]]" />

Srs data object

You can include images from the SRS data object using the tbase64 column type.

srs:

<srs>
  <itm model="column" type="tbase64" name="testimg" />
  <itm model="command" opts="dtsingle" name="settings">
    select  '33d52ff9-9914-923c-10bd-3251ea2db555.png' testimg
  </itm>
</srs>

hbs:

<img  src="data:image/png;base64,{{{settings.testimg}}}" />

Comment

{{! This comment will not show up in the output}}

Generic table horizontal

<table>
      <!--START Optional width -->
      <colgroup>
        <col style="width:20mm">
        <col style="width:40mm">
         <col style="width:60mm">
      </colgroup>
      <!--END Optional width -->
  <thead>
    <tr>
     {{#each dataset1.[0]}}
        <th>{{@key}}</th>
      {{/each}}
    </tr>
  </thead>
  <tbody>
    {{#each dataset1}}
      <tr> 
        {{#each this}}
          <td>{{this}}</td>
        {{/each}}
      </tr>
    {{/each}}
  </tbody>
</table>

Generic table vertical

    <table>
      <tbody>
        {{#each dataset1}}
         {{#each this}}
          <tr>
            <td>{{@key}}</td>
            <td><b>{{this}}</b></td>
          </tr>
           {{/each}}
        {{/each}}
      </tbody>
    </table>

Custom table

    <table>
  <thead>
    <tr>
     {{#each dataset1.[0]}}
        <th>{{@key}}</th>
      {{/each}}
    </tr>
  </thead>
  <tbody>
    {{#each dataset1}}
      <tr> 
        {{#each this}}
          <td>{{this}}</td>
        {{/each}}
      </tr>
    {{/each}}
  </tbody>
    </table>