Skip to content

Instantly share code, notes, and snippets.

Created June 20, 2013 02:21
Show Gist options
  • Save chenglou/5819861 to your computer and use it in GitHub Desktop.
Save chenglou/5819861 to your computer and use it in GitHub Desktop.
It actually works perfectly, can you believe it? Inspired by coffeekup.
# 21 lines, gutter at 80, for a fully functional coffeescript templater.
global.compiledHTML = ''
makeTagFunc = (tagName, isSelfClosing) ->
(args...) ->
selfEndingTag = if isSelfClosing then ' /' else ''
attrs = args.filter((i) -> typeof i is 'object').reduce(((i, j) ->
i + ("#{key}='#{val}'" for key, val of j).join ' '), '')
inner = args.filter((i) ->
typeof i != 'function' and typeof i != 'object').map((i) -> i).join ' '
global.compiledHTML += "<#{(tagName + ' ' + attrs).trim()}#{selfEndingTag}>"
args.filter((i) -> typeof i is 'function').forEach (i) -> i()
if !selfEndingTag then global.compiledHTML += "#{inner}</#{tagName}>"
'a abbr address area/ article aside audio b base/ bdi bdo blockquote body br/
button canvas caption cite code col colgroup command data datagrid datalist dd
del details dfn div dl dt em embed eventsource fieldset figcaption figure
footer form h1 h2 h3 h4 h5 h6 head header hgroup hr/ html i iframe img/ input/
ins kbd keygen label legend li link/ mark map menu meta/ meter nav noscript
object ol optgroup option output p param pre progress q ruby rp rt s samp
script section select small source span strong style sub summary sup table
tbody td textarea tfoot th thead time title tr track u ul var video wbr'
.split(' ').forEach (i) ->
global[i.replace '/', ''] = makeTagFunc i.replace('/', ''), !!~i.indexOf '/'
# test time!
desc = 'hello'
path = '/asd'
user =
role: 'vip'
max = 5
random = 'ok go'
shoutify = (word) -> "Yo! #{word}"
html ->
head ->
meta charset: 'utf-8'
title "#{user.role or 'Untitled'} | My awesome website"
meta name: 'description', content: desc if desc?
link rel: 'stylesheet', href: '/stylesheets/app.css'
style '''
body {font-family: sans-serif}
header, nav, section, footer {display: block}
script src: '/javascripts/jquery.js'
body ->
header ->
h1 random or 'Untitled', 'hahaha'
nav ->
ul ->
(li -> a href: '/', 'Home') unless path is '/'
li ->
a href: '/chunky', 'Bacon!'
switch user.role
when 'owner', 'admin'
li -> a href: '/admin', 'Secret Stuff'
when 'vip'
li -> a href: '/vip', 'Exclusive Stuff'
li -> a href: '/commoners', 'Just Stuff'
section ->
h2 "Let's count to #{max}:"
for i in [1..max]
p i
footer ->
p shoutify('bye')
console.log global.compiledHTML
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment