Tempest jQuery Templating Plugin
JavaScript
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
releases
tests
.gitignore
AUTHORS
LICENSE
README.md
changelog.txt
jquery.tempest.js

README.md

THIS PROJECT IS DEPRECATED

JQuery now has an officially sanctioned templating engine: http://blog.jquery.com/2010/10/04/new-official-jquery-plugins-provide-templating-data-linking-and-globalization/

Development on this project has now ceased.

Tempest jQuery Templating Plugin

Copyright (c) 2009 Nick Fitzgerald - http://fitzgeraldnick.com/ - MIT licensed

Note: All releases are minified, to get the latest development version grab a clone from http://github.com/fitzgen/tempest/tree/master

HELLO WORLD

var template = "<p>Hello, {{ name }}!</p>";
$(document).tempest(template, {
    name: "World"
});

PHILOSOPHY

I was not satisfied with the other templating plugins available, so I wrote my own. This templating system is very simple and enforces the seperation of form and function, or HTML and JS. This provides a great abstraction layer so that you can write a template ad then promptly remove the mental overhead of rendering js objects to HTML.

Other templating languages just build and execute function blocks with strings. Any type of js logic you could want is included and evaluated. For some people, this may be the freedom that they want.

On the other hand, Tempest will only fill in values and iterate over arrays for you. This forces you to remove any programming logic from the templates and separate form from function. This type of templating philosophy can also be seen in the Django templating language.

The other big thing, for me, is that iteration is handled seamlessly. Just pass an array of objects to tempest instead of a single object and it will return a jquery element array.

MAILING LIST

To get involved, ask questions, or recieve help with Tempest, you can email the Tempest mailing list: tempest@librelist.com

API

Note: The API is for the most current release only, there may be slight differences in older releases.

Saving & retrieving templates to and from $.tempest

Setter:

$.tempest("post", "<li><a href='{{ url }}'>{{ title }}</a></li>");
// returns string: "<li><a href='{{ url }}'>{{ title }}</a></li>"

Getter:

$.tempest("post");
// returns string: "<li><a href='{{ url }}'>{{ title }}</a></li>"

$.tempest will also find all elements with the class "tempest-template" and save them with their "title" attribute as the key they are indexed by once the $(document).ready() event fires.

For example, assuming this is in the html when $(document).ready() fires:

<textarea title="new-post" class="tempest-template" style="display:none">
    <li class='new'><a href='{{ url }}'>{{ title }}</a></li>
</textarea>

Then you could access that template just as you would access any other template that you manually created:

$.tempest("new-post");
// returns string: "<li class='new'><a href='{{ url }}'>{{ title }}</a></li>"

The two typical elements people use as embedded templates are textareas and scripts with wacky types (for example