live-tmpl

$3

It's great if one can genetate HTML quickly as normal data types.
Now with LiveScript, I find the pretty way to generate HTML.

$3

Install the module from NPM by:

``
npm install -g live-templ
`

And require the module in your code with:

`livescript
{tmpl} = require("../lib/tmpl")
`

$3

The online verison is placed at: http://jiyinyiyong.github.com/live-tmpl/page/
Read my code in src/ or page for details, here's also one:

`livescript
dowload-link = "http://jiyinyiyong.github.com/live-tmpl/page/tmpl.js"
page-link = "http://jiyinyiyong.github.com/live-tmpl/page/"
repo-link = "https://github.com/jiyinyiyong/live-tmpl/"

hope-words = '''
JSON is a build-in type in JavaScript. Hope everyone enjoys it.
More often, we need to deal with HTML in browsers.
For Example, the client templating in single-page apps.
So, why is it ugly and awful to generate HTML with JS?
Now I'm writting live-tmpl, trying to make it easy in LiveScript.
'''

hope-html = hope-words.split "\n" .map -> p: it.trim!

demo =
"/root.main name='top'":
* "h3": "Home page of Live-tmpl"
* ".list"
* ".line":
* "span.title": "Goal"
* ".list": hope-html
* ".line":
* span: "by"
* span: "Jiyin Yiyong"
* ".line":
* span: "in"
* span: "LiveScript"
* ".links":
* p: "Some links here:"
* ".line":
* "a href='#dowload-link'": "Download"
* "a href='#page-link'": "Demo Page"
* "a href='#repo-link'": "Github Repo"
`

Compiles to(after beautify):

`html


You may have noticed that, .clas means class, /id means id,
In LiveScript, #key` means interpolation in strings, just use it.
For some reason, attributes just follows after a white space.
If you write LiveScript, you may like it.

$3

If there's a better way found, I'd like to change the design.
I hate brackets, but this version indents too much...