var ltl = require('ltl');
var template = ltl.compile('#hi Hello #{name}!');
var result = template({name: 'World'});
// result: '<div id="hi">Hello World!</div>'

API

ltl.compile(code, [options])

code is a string of ltl code.
options is an object with any of the following properties:
name will cause the template to cache at ltl.templates[name]

ltl.setTabWidth(numberOfSpaces)

numberOfSpaces is the default number of spaces to convert a tab to for mixed tab/space leniency. (Default: 4)

ltl.setOutputVar(name)

name is the name of the variable that ltl concatenates to inside template functions. (Default: o)

ltl.setContextVar(name)

name is the name of the argument that passes the data context into a template. (Default: c)

ltl.setPartsVar(name)

name is the name of the argument that an ltl template receives from a template that uses it as an abstract template. (Default: p)

Language

Nesting

Tag nesting is done with whitespace. You can use tabs or spaces, and ltl can detect the number of spaces you're using.

html
  head
    title Hello World!
  body
    div Here is some content.

<!DOCTYPE html>
<html>
  <head>
    <title>Hello World!</title>
  </head>
  <body>
    <div>Here is some content.</div>
  </body>
</html>

Note: <!DOCTYPE html> is automagically inserted before an <html> tag.

Nesting can also be done with one-liners using >.

div>span Boo!

<div><span>Boo!</span></div>

IDs and Classes

HTML id and class attributes are done with # and .

div#myId.myClass.myOtherClass Hello

<div id="myId" class="myClass myOtherClass">Hello</div>

When there is no tag name, div is assumed

.hi Hello

<div class="hi">Hello</div>

Attributes

Attributes are contained in parentheses, and treated like they would be inside an HTML tag.

(style="display:none" data-something="peek-a-boo") Hide me

<div style="display:none;" data-something="peek-a-boo">Hide me</div>

Note: Unlike Jade, ltl does not use commas between attributes.

Blocks

You can output blocks of content using :.

#blah:
  Bob Loblaw's Law Blog asks, "Why should YOU go
  to jail for a crime someone else noticed?

<div id="blah">
  Bob Loblaw's Law Blog asks "Why should YOU go
  to jail for a crime someone else noticed?
</div>

Blocks can be passed through filters, such as markdown.

:markdown
    # ltl
    It's a recursive acronym for "ltl template language".

<h1>ltl</h1><p>It's a recursive acronym for "ltl template language".</p>

Interpolation

You can output the value of a context property with #{..}.

var code = '. Hello #{name}!';
var template = ltl.compile(code)
template({name: 'Sam'});

<div>Hello Sam!</div>

If you'd like your content to skip HTML encoding (because you want your expression to output HTML tags rather than text, use ={..}.

Context: {unsafe: "<script>alert('Gotcha!')</script>"}

. ={unsafe}

<div><script>alert('Gotcha!')</script></div>

Control

Use for..in to iterate over an array inside the context.

Context: {list: ['IPA', 'Porter', 'Stout']}

ul
  for item in list
    li #{item}

<ul><li>IPA</li><li>Porter</li><li>Stout</li></ul>

Use for..of to iterate over an object's keys.

ul
  for field, value of data
    li #{field}: #{value}

<ul><li>IPA</li><li>Porter</li><li>Stout</li></ul>

Conditionals

Use if, else or else if to render conditionally. The control statement's inline content gets evaluated as JavaScript.

if username == 'root'
  . Do as you please.
else if username
  . Do as you can.
else
  . Don't.

You can use builtin objects and whatnot.

if Math.random() > 0.5
    p This has a 50/50 chance of showing.

Using templates within templates

A template can use another template with use. To accomplish this, you must compile your templates with options.name, and they will be stored in ltl.cache. The template that's being used can access the data context.

var temp = ltl.compile('p\n use bold', {name: 'temp'});
var bold = ltl.compile('b #{text}', {name: 'bold'});
ltl.cache.temp({text: 'Hi!'});

<p><b>Hi!</b></p>

With get, a template can get content from a template that has used it with use. Content that is passed into get blocks is declared with set.

var layout = ltl.compile('#nav\n get nav\n#content\n get content', {name: 'layout'});
var page = ltl.compile('use layout\n set nav\n  . Nav\n set content\n  . Content', {name: 'page'});
ltl.cache.page();

<div id="nav">Nav</div><div id="content">Content</div>

Contributing

Clone the repository

$ git clone https://github.com/zerious/ltl.git

Install dependencies

$ npm install

Testing

Run all tests

$ mocha

Watch for changes

$ mocha -w

Run individual tests

$ mocha test/api
$ mocha test/blocks
$ mocha test/control
$ mocha test/interpolation
...

Test coverage (100% required)

$ npm test --coverage

View coverage report

$ npm run view-coverage

Write something awesome and submit a pull request!

Keywords

FAQs

What is ltl?

Is ltl popular?

Is ltl well maintained?

Package last updated on 16 Mar 2014

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

ltl

ltl

Getting Started

API