Walrus

A bolder kind of mustache.

View this readme on documentup.

About

Walrus is a templating library inspired by [mustache][mustache], [handlebars][handlebars], [ejs][ejs] and friends, but with a couple of important differences in philosophy and style:

• View logic is different than business logic (and that's okay!). In modern web apps, there's often a good amount of presentation logic involved. This logic doesn't belong in your application code, your backbone models, or anywhere else but the presentation layer. The templating language is a good place to put this.

• Reusable view helpers are super fun and helpful. Rails had the right idea by shipping a bunch of view helpers with ActionView. Having commonly used view helpers come bundled with the framework keeps developers from spending time writing them (and testing them, or even worse, not testing them) again and again.

• Keep the core library light. While walrus ships with a bunch of filters and helpers you can use out-of-the-box, only the essentials are included in the core. This keeps client-side code as small as it can be, letting you opt-in to extras only as often as you need them. To extend walrus with new filters and helpers, just include the javascript you want and you're done, son.

• Stop hashing and slashing. Maybe it's just me, but opening and closing blocks with "hash-something" "slash-something" feels super redundant. Walrus uses do/end for its blocks, which should look a lot more familiar to ruby types.

The walrus parser is written in [jison][jison] and the rest in [coffeescript][coffeescript], and everything is tested with [mocha][mocha]. Walrus has no runtime dependencies.

Since walrus is still pretty young, expect changes in the API, especially for filters and helpers.

The /test/examples directory is filled with plenty of self-documenting examples that comprise over half of the test suite, so give those a once-over if you have a question that isn't answered in the readme.

Core

The walrus core contains the walrus parser/compiler, several common helpers and filters, and a few internal utility methods.

Usage in JavaScript

Like other [jison][jison]-based parsers, templating with walrus is a two-step process.

First, grab your template and parse it:

var template = Walrus.Parser.parse( $( '#my-template' ).html( ) );

template is a JavaScript object ready to accept a view object and kick out some text.

var htmlGoodness = template.compile( { data : 'foo bar baz' } );

Paths

Like some of the other templating solutions out there, Walrus will let you reference members using object paths.

If your view object is:

{
	"hello" :
	{
		"walrus" : "sweeet."
	}
}

Then {{hello.walrus}} will resolve to sweeet..

Root References (all day erryday)

With Walrus, you can always reference the root view object as a path context by using the @ symbol before your path. Use this even if you're dereferenced, iterating, or even within the arguments to a method.

So if you've got a view object like:

{
	"team" : "Detroit Red Wings",
	"players" :
	[
		{
			"name" : "Pavel Datsyuk"
		},
		{
			"name" : "Nicklas Lidström"
		},
		{
			"name" : "Darren Helm"
		}
	]
}

You can create your badass hockey roster like:

<ul>
	{{:each players do}}
	<li>{{name}} plays for the {{@team}}</li>
	{{end}}
</ul>

(Un-)Escaping

Like many other mustache-like languages, walrus escapes string members by default in an attempt to get rid of HTML-unsafe characters.

If you want these characters included, use an equals sign before your expression, like: {{=html}}.

Methods

One of the main focuses of Walrus is to treat methods on your view object like first-class citizens. You can call your methods with any number of arguments from the view object or (most) javascript literals.

With a view object like:

{
	"captitalize" : function( str ){ return str.charAt( 0 ).toUpperCase( ) + str.slice( 1 ); },
	"city" : "detroit"
}

It's as easy as {{capitalize( city )}}.

Note that since both of these members are at the root of the view object, you could also reference them like {{@capitalize( @city )}}, or any combination of local or root references.

Core Blocks/Helpers

In Walrus, blocks don't look like the #member//member hash/slash pairs we've seen elsewhere. Walrus looks a lot more like ruby and uses a simpler do/end idiom.

Each block has a helper, preceded by :, that tells you what the block does. Walrus ships with a basic set of these built in.

:if and :unless

Conditionals can be represented by :if and :unless blocks. Both of these test the expression for truthiness or falsiness respectively.

{{:if @loggedIn do}}
<p>Welcome back, {{@username}}!</p>
{{end}}

{{:unless @loggedIn do}}
<p>I don't believe we've met!</p>
{{end}}

:each

:each can be used to iterate over a collection.

{{:each @player do}}
<li>{{name}}</li>
{{end}}

While in an :each block, you can use the following special variables:

$index provides the index of the current item in the collection

$length provides the length of the collection

$parent provides access to the parent object of the collection

Like several other templating solutions, you can implicitly iterate over a collection of values, like strings, and template in the current value with {{.}}.

:with

:with can be used to force a change in context if you don't want to use tons of object paths.

{{:with @team.captain do}}
<p>Captain: {{name}}</p>
{{end}}

While in a :with block, you can use the following special variables:

$parent provides access to the parent object of the context

Core Filters

Walrus also supports the concept of filters, which look a lot like filters you might have used in [liquid][liquid] or [ejs][ejs] templates.

Filters also are preceded by :, but come after the main expression separated by a pipe, like {{name | :upcase}}.

Filters can be chained together, separated by whitespace. Filters can be used with block helpers or in a standalone expression.

:equals

:equals tests the expression for strict equality. This is most useful with the conditional block helpers.

{{:if status | :equals( 'pending' ) do}}
<p>We're still working on it.</p>
{{end}}

:if

Returns the expression if condition is truthy, or nothing if condition is falsy.

Parameters:

condition - the condition to test against

Usage:

{{ 'active' | :if( true ) }} <!-- "active" -->

:unless

Returns the expression if condition is falsy, or nothing if condition is truthy.

Parameters:

condition - the condition to test against

Usage:

{{ 'active' | :unless( true ) }} <!-- "" -->

:or

:or can be used to provide a default or fallback value if a member doesn't exist on your view object.

<h2>{{price | :or( 'N/A' )}}</h2>

:log

:log is a helper method for developers that simply passes its argument to the console.

You can log a {{@member | :log}} of the view object,
while {{. | :log}} will log the whole thing,
and {{"arbitrary literals" | :log}} can be logged, too!

:as

Decorates a view object or collection of view objects with custom domain methods.

Parameters:

name - The key for the object on `Walrus.Domain` to decorate with

Usage:

First, define some custom domain methods:

Walrus.Domain.person = { fullName : function( ){ return this.firstName + ' ' + this.lastName; } };

Then, selectively apply those to your view object at template-time:

<ul>
	{{:each employee | :as( 'person' ) do}}
	<li>{{fullName}}</li>
	{{do}}
</ul>

Walrus.Collections

walrus.collections contains helpers and filters that are useful when working with arrays.

:first

Selects the first count items of the array. Defaults to only the first item.

Parameters:

count - Optional: how many items to include

Usage:

{{ :each numbers | :first do }}
	<!-- 1 -->
{{ end }}

{{ :each numbers | :first( 5 ) do }}
	<!-- 1 2 3 4 5 -->
{{ end }}

:last

Selects the last count items of the array. Defaults to only the last item.

Parameters:

count - Optional: how many items to include

Usage:

{{ :each numbers | :last do }}
	<!-- 10 -->
{{ end }}

{{ :each numbers | :last( 5 ) do }}
	<!-- 6 7 8 9 10 -->
{{ end }}

:after

Selects all of the items in the array except for the first count.

Parameters:

count - how many items to omit from the beginning

Usage:

{{ :each numbers | :after( 3 ) do }}
	<!-- 4 5 6 7 8 9 10 -->
{{ end }}

:before

Selects all of the items in the array except for the last count.

Parameters:

count - how many items to omit from the end

Usage:

{{ :each numbers | :before( 3 ) do }}
	<!-- 1 2 3 4 5 6 7 -->
{{ end }}

:count

Returns the length of the given array.

Parameters: none

Usage:

var numbers = [ 1, 2, 3, 4, 5 ];

{{ numbers | :count }} <!-- 5 -->

:any

Returns true if the array is not empty. Opposite of :empty.

Parameters: none

Usage:

var numbers = [ 1, 2, 3, 4, 5 ];

{{ numbers | :any }} <!-- true -->

:empty

Returns true of the array is empty. Opposite of :any.

Parameters: none

Usage:

var numbers = [ 1, 2, 3, 4, 5 ];

{{ numbers | :empty }} <!-- false -->

:in_groups_of

Splits the given array into sub-arrays with at most count items apiece

Parameters:

count - the number of items to be placed in each group

Usage:

var numbers = [ 1, 2, 3, 4, 5 ];

{{ :each numbers | :in_groups_of( 3 ) }}  <!-- [ [ 1, 2, 3 ], [ 4, 5 ] ] -->

Walrus.Currencies