CoffeeMugg
CoffeeMugg is a templating engine for node.js and browsers that lets you to write your HTML templates in 100% pure CoffeeScript.
CoffeeMugg is a branch of CoffeeKup. The main difference is that instead of local tag functions, tag functions are bound to this
.
Why CoffeeMugg?
- No magic compilation step: the template code runs as you would expect.
- Local variables obey original Javascript/Coffeescript rules.
- If you want to create a template dynamically using function closures, you can!
- This makes it easier to create libraries of view-helper routines, in the manner of RoR ActionView.
Sample
Basic example:
cm = require 'coffeemugg'
cm.render ->
@div ->
@p "I am a paragraph"
@raw "<p> This is unescaped, raw HTML </p>"
@text "<< This will be escaped ! >>"
Custom TAG functions (subroutines)
You can add custom @TAG functions to CoffeeMugg with 'plugins'.
# Install custom tags! In this case, just the tag '@showFruits'
cm.install_plugin ->
# The tag 'showFruits' will become available everywhere.
# It is a regular function, so it can take arguments too, like 'fruits'
@showFruits = (fruits) ->
@ul ->
for fruit in fruits
@li fruit
# Here is the main template function.
# Notice that the main template function can also take javascript arguments.
template = (fruits) ->
@div ->
# Pass in 'fruits' to our custom '@showFruits' tag
@showFruits fruits
# Options to CoffeeMugg
# autoescape: The "text" values are automatically HTML escaped.
# You can still use the '@raw' tag for unescaped text.
# Default: yes
# format: The output HTML will be formatted all pretty.
# Default: yes
options = {
autoescape: yes
format: yes
}
fruits = ['Apple', 'Banana', 'Raisin', 'Rice Crispies', 'Mickey Mouse']
cm.render template, options, fruits
Sample plugins
Sample plugins are in the 'plugins' directory. The best way to use them is to copy them
into your project (which manages your dependencies), and install them via 'install_plugin':
cm = require 'coffeemugg'
# Use the 'marked' markdown language.
# Your project needs to have 'marked' as a dependency.
# Note, './plugins' is a folder in _your_ project.
cm.install_plugin require('./plugins/marked')
# Use the 'partials' system for templating ease.
# Note, './templates' is a folder in your project.
cm.install_plugin require('./plugins/partials')(require, './templates')
template = ->
@p ->
@marked "This is using __markdown__"
@partial '_mypartial', 'myarg'
Installation
npm install coffeemugg
Cli
Create static html files in CoffeeMugg syntax. It's adapted from coffeecup.
coffeemugg -h
Usage:
coffeemugg [options] path/to/template.coffee
-w, --watch watch templates for changes, and recompile
-o, --output set the directory for compiled html
-p, --print print the compiled html to stdout, don't write file
-f, --format apply line breaks and indentation to html output
-v, --version display coffeemugg version
-h, --help display this help message
More
Please take a look at the excellent CoffeeScript documentation for more information.
Special thanks