Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

3 Commits

Repository files navigation

node-tpl is an easy to use, fast, templating tool to template anything you want, from webpages to emails.

Basic usage

Add placeholder items

vartpl=require('tpl');tpl.assign("musketeers",{"Athos": {color: "red",age: "20"},"Aramis": {color: "green",age: "30"},"Porthos": {color: "blue",age: "12"},"D'Artagnan": {color: "black",age: "25"}});tpl.display("templates/myfile.tpl");

Create the html template

<!doctype><html><head><metahttp-equiv="Content-Type" content="text/html; charset=UTF-8" /><linkrel="stylesheet" href="/css/main.css"><title>Template Demo</title></head><body><p>
{if new Date().getHours() >= 12}
Good afternoon!
{else}
Good morning!
{/if}
</p><ul>
{for $row in $musketeers}
<li>
{$row}
<ul><li>Age: {$row.age}</li><li>Favorite Color: {$row.color}</li></ul></li>
{/for}
</ul></body></html>

API Documentation

Set the current directory

Files are loaded based on the current working directory (cwd). By default the cwd is set to __dirname. This can be changed by setting it with setcwd without a trailing /.

tpl.setcwd("/path/to/default");

Files that are included within the markup are also loaded based on the cwd.

Variables

Variables are items that link to a variable within the template markup, they are added by using the assign method.

Note: Assigning a variable 2 or more times will overwrite the previous variable.

tpl.assign("variable","My variable value");tpl.assign("variable",["Red","White","Blue"]);

Variables can hold an array of items, including (but not limited to):

  • strings
  • integers
  • objects
  • arrays

Fetch

Fetch allows you to fetch a template and replace its values; it then gets returned back to the script. With the value you can do anything you please, such as send it in an email.

tpl.assign("name",{first: "Billy",last: "Bob"});varbody=tpl.fetch("templates/email.tpl");console.log(body);

Display

Display allows you to fetch a template and it automatically gets displayed through process.stdout.write.

tpl.assign("name",{first: "Billy",last: "Bob"});tpl.display("templates/page1.tpl");

Markup Documentation

Variables

Variables are prefixed with a $ and are between { and }. To access an array/object item use . to get the value from array/object.

{$variable}
{$variable.array_item}
{for $var in $variable}
{if $var == $another_var}
{elseif $var == $another_var}

If statements

If statements are blocks that perform tests on a list of statements. Once one validates as true its contents will be displayed.

<p>
{if 1 == 2}
This should never be displayed.
{elseif '$color' == 'blue'}
This will show if color equals "blue".
{elseif new Date().getHours() >= 12}
Good afternoon!
{else}
If nothing worked then you are seeing this.
{/if}
</p>

If it is after hour 11, and $color does not equal blue, and well 1 never equals 2, we would then get this output:

<p>
Good afternoon!
</p>

For statements

For statements loop through a list of array items or an object and display them on a page.

<divclass="column">
{for $row in $store_items}
<divclass="row"><h2><ahref="/item/{$row.id}">{$row.title}</a></h2><p>{$row.description}</p><p><small>{$row.updated}</small></p></div>
{/for}
</div>

We might then get something like this as output:

<divclass="column"><divclass="row"><h2><ahref="/item/1">White Socks</a></h2><p>Cotton white socks</p><p><small>2015/01/01</small></p></div><divclass="row"><h2><ahref="/item/2">Blue Socks</a></h2><p>Cotton blue socks</p><p><small>2015/01/25</small></p></div><divclass="row"><h2><ahref="/item/3">Black Socks</a></h2><p>Silk black socks</p><p><small>2015/02/12</small></p></div></div>

Includes

Files can be included using the include command and included files can also include other files.

{include "templates/nav.tpl"}
{include "templates/$filename"}

Note: Any file that includes itself or a parent file will probably create an endless loop. Note: Currently a variable followed by a an extention such as $filename.tpl will break the code.

Literals

A literal is a way to force the engine not to replace markup, because sometimes you don't always want to replace blocks, such as JavaScript in a browser, because they can sometimes mean the same.

For example, take this template markup:

<script>$(".rows").each(function(){$(this).remove()});</script>

When the template markup is replaced, you will get this new javascript:

<script>$(".rows").each(function());</script>

Not only is it invalid JavaScript, but it isn't what you wanted.

We can fix that by placing {literal}'s around that block of code and it won't change like this:

{literal}
<script>$(".rows").each(function(){$(this).remove()});</script>
{/literal}

Now what gets output is exactly what we wanted because we told the engine not to replace it.

<script>$(".rows").each(function(){$(this).remove()});</script>

Changelog

  • 0.0.1 - 4/10/15
    • Initialization
  • 0.0.2 - 4/10/15
    • Documentation update
  • 0.0.3 - 4/11/15
    • Added support for if/elseif/else
  • 0.0.4 - 4/11/15
    • Documentation update
    • Enhancements
    • Added extra npm tags
  • 0.0.5 - 4/11/15
    • Added support for literal's
    • Added npm repository
  • 0.0.6 - 4/11/15
    • Added file include support
    • Documentation update

About

No description, website, or topics provided.

Resources

Stars

3 stars

Watchers

1 watching

Forks

Releases

Packages

Used by

Contributors

Languages