Simple, inline, functional html templating.
Simple, Tiny, Fast (enough)
Example usage (in CoffeeScript):
blam->htmlheadtitle "Hello"script src:"/my-script.js"bodyarticle id:"main"sectioncontentp"Loading..."asidesidebar "Nav here"
Clocks in at ~1K minified and gzipped.
Unit tests can be found at: darthapo.github.com/blam.js/test
Please let me know if any of the tests break in your browser!
If the first argument to a tag block is an object literal then its key/value pairs are used as tag attributes.
blam ->div id:"posts"'data-role':"post"p"content here..."# => '<div id="posts" data-role="post"><p>content here...</p></div>'
Blam will pass initial arguments on to the markup block:
blam name:'Matt'div id:'user-block'p"Hello "username
Markup blocks can be "compiled" into an executable function (good for often repeated bits of code):
template= blamcompilediv id:'user-block'p"Hello "usernamehtml+= templateuser for user in all_users
For array elements you can use the
template= blamcompilediv id:'user-block'eachusersp"Hello "usernamehtml+= templateall_users
You can create partials/custom tags:
blamdefine 'layout'->articlecontainerheader h1 "My App"sectionbody __argumentsfooter p"© me!"
You can then use it like a tag:
blam @postslayoutdivpostseachpostsdiventry postbody
You can turn off the fancy auto css class support:
blamfancyno# You have to use the attributes hash to add classnames now:blam ->div class:'my-class'"Content"
You can add a single object to a markup block's scope when pre-compiling templates:
data=name: 'He'age: 'Old Enough'template= blamscopedatacompile ->div name" is "agehtml= template#=> "<div>He is Old Enough</div>"
@template: blamcompiledivtweetimgavatarsrc: tweetprofile_image_urlalt: tweetfrom_user_namedivstatustweetstatusdivfooter"@"tweetfrom_user" said on "tweetcreated_at: ->@$elhtml TweetViewtemplate @modeltoJSON
Blam is available as an npm package as well. To install:
npm install blam
Or, use the
-g option to install it globally:
npm install blam -g
require it as per usual in node:
var blam= blam;blam
Need to cleanup this ReadMe and create some proper docs.
Would like to support all the modern browsers and possibly as far back as IE8?
Need to test AMD support.
Extract and expose tag building helpers.
No! They're just misunderstood. Blam.js is a good example of why they are useful as language features. They allow excellent DSL generation.
That having been said, it is a good rule of thumb that if you don't know when is best to use them; don't.