![Oracle Drags Its Feet in the JavaScript Trademark Dispute](https://cdn.sanity.io/images/cgdhsj6q/production/919c3b22c24f93884c548d60cbb338e819ff2435-1024x1024.webp?w=400&fit=max&auto=format)
Security News
Oracle Drags Its Feet in the JavaScript Trademark Dispute
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.
The Ltl template language (pronounced "little") uses a clean Jade-like syntax to generate HTML at doT-like speeds.
If you love tight code and fast rendering, you're right at home.
Install
$ npm install ltl
Use
var ltl = require('ltl');
var template = ltl.compile('#hi Hello #{name}!');
var result = template({name: 'World'});
// result: '<div id="hi">Hello World!</div>'
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]
space
causes HTML to be indented, using space
as indentation.name
is the name of a compiler option.value
is the default value you'd like to set it to.The following compiler options are available:
outputVar
is the name of the variable that Ltl concatenates to. (Default: "o")contextVar
is the name of the argument that passes context into a template. (Default: "c")partsVar
is the name of the argument that a Ltl template receives from callers. (Default: "p")tabWidth
is the number of spaces that tabs are converted to before compilation. (Default: 4)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>
<!DOCTYPE html>
is automagically inserted before an <html>
tag. If you would like to specify a custom doctype, you can use the shorthand doctype
or !
syntax.
!(svg)
<!DOCTYPE svg>
Nesting can also be done with one-liners using >
.
div>span Boo!
<div><span>Boo!</span></div>
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 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.
If you want to insert a line of text without wrapping it in a tag, just start the line with a minus.
h1
img(src="/logo.png")
- Hello!
<h1><img src="/logo.png">Hello!</h1>
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>
Ltl comments are added by using //
as a tag, and they do not output any
HTML. The //
tag can be used on one line or as a block.
h1 Comments
// No one will see this.
p Hello from http://lighter.io/ltl
//
This won't be shown.
Neither will this.
<h1>Comments</h1><p>Hello from http://lighter.io/ltl</p>
HTML comments are add by using -
as a tag.
- Begin page
p Hello
- End page
-
p Delete me
<!--Begin page--><p>Hello</p><!--End page--><!--<p>Delete me</p>-->
You can output the value of a context property with ${..}
,
and special HTML characters will be escaped for you to
prevent silly little XSS attacks.
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 raw HTML tags rather
than safely escaped text), use ={..}
.
Context: {unsafe: "<script>alert('Gotcha!')</script>"}
. ={unsafe}
<div><script>alert('Gotcha!')</script></div>
If you want to show ${..}
or ={..}
blocks in your output,
you can escape with a backslash.
code \${escaped} or \={raw}
<code>${escaped} or ={raw}
Use for..in
to iterate over an array inside the 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>
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 JavaScript objects and whatnot.
if Math.random() > 0.5
p This has a 50/50 chance of showing.
A template can call another template with call
. To accomplish
this, you must compile your templates with options.name
, and
they will be stored in ltl.cache
. The template that's being
called can access the data context.
var temp = ltl.compile('p\n call bold', {name: 'temp'});
var bold = ltl.compile('b #{text}', {name: 'bold'});
ltl.cache.temp({text: 'Hi!'});
<p><b>Hi!</b></p>
With set
and get
, a template can get content from a
template that calls it. The calling template declares what
it will pass using set
blocks, and the called template
reads data with get
blocks.
var layout = ltl.compile('#nav\n get nav\n#content\n get content', {name: 'layout'});
var page = ltl.compile('call 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>
Clone the repository.
$ git clone https://github.com/zerious/ltl.git
Install dependencies.
$ npm install
Run all tests.
$ npm test
Run tests an rerun them after changes are made.
$ npm run retest
Run individual test files.
$ mocha test/api
$ mocha test/blocks
$ mocha test/control
$ mocha test/interpolation
...
Test coverage (100% required).
$ npm run cover
View coverage report in a browser (uses Mac OS-friendly open
).
$ npm run report
FAQs
Lean Template Language for JavaScript and HTML
We found that ltl demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
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.
Security News
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.
Security News
The Linux Foundation is warning open source developers that compliance with global sanctions is mandatory, highlighting legal risks and restrictions on contributions.
Security News
Maven Central now validates Sigstore signatures, making it easier for developers to verify the provenance of Java packages.