Template engine that converts Cirru to HTML
Cirru HTML
A template engine that converts Cirru to HTML.
Usage
npm install --save cirru-html{makeRender, render, setResolver} = require 'cirru-html'
code = 'span (= cirru code)'
data = {}
renderer = makeRender code, {}
renderer {} # pass in data # => 'cirru code'
render code, data # => 'cirru code'makeRender
template is a code string in Cirru,
or a JSON Object of parsed Cirru code (with cirruParser.pare).
renderer is a cached renderer that make it fast.
data is optional.
In Node, you need data['@filename'] to run @insert and @partial.
render
Shorthand for using renderer in one call:
exports.render = (template, data) ->
render = exports.makeRender template, data
render datasetResolver
Solution for reading file is taken out from the module.
For Node:
html = require 'cirru-html'
html.setResolver (basePath, child, scope) ->
dest = path.join (path.dirname basePath), child
scope?['@filename'] = dest
html = fs.readFileSync dest, 'utf8'For browsers, maybe from an element:
setResolver (basePath, child, scope) ->
match = child.match /(\w+)\.cirru/
element = q "##{match[1]} .file"
element.value or element.innerHTML
Demo of HTML
Here's a demo of HTML:
doctype
html
head
title "Cirru HTML"
meta $ :charset utf-8
link (:rel stylesheet) $ :href css/style.css
script (:defer) $ :src build/build.js
body
#entry
@repeat (@ names)
.test
:id (@ @value)
textarea.file
textarea.data
button.button " =>"
textarea.result
Notice: the compiled HTML is not prettified.
Template engine
@
@if
@block
@repeat
@with
@insert
@partial
Functions may also be passed into the renderer to apply on the data.
Architeture
Steps of rendering:
Cirru Code
-> Syntax Tree
-> Abstract Syntax Tree, based on Classes
-> Cached Tree, HTML data converted
-> Rendering
Classes for rendering HTML:
SingleTag
PairTag
TextTag
Classes for expressions
AtExpression
IfExpression
RepeatExpression &key, &value
WithExpression
InsertExpression
PartialExpression
BlockExpression
MethodsExpression
Filenames passed to @insert and @partial are only names.
data parameters contain at least @filename and @methods: [].
Changelog
0.2.2
Fixed double quote in some attributes
0.2.1
Fixed with
Since 0.2, renderer is removed
License
MIT
HomePage
Repository