JsRender - allowCode - access - fadeIn()

JsRender, jQuery

by johnpapa

HTML

<script src="http://borismoore.github.com/jsrender/jsrender.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<div id="output"></div>

<script id="peopleTemplate" type="text/x-jsrender">
    {{* 
    var $myDiv = $('#output'); 
    $myDiv.fadeIn(2000); 
    }}
    
    {{* myNumber = 99; }}
    <ul>
    {{for people}}
        <li>
        {{:#index}} {{:firstName}} {{:lastName}}
            <ul>
                <li>
                    {{* 
                    someNumber++
                    if(someNumber === 1) { }}
                        First 
                    {{* } else { }}
                        Not First
                    {{* } }}                    
                    ///////////////////////////
                    {{* if(myNumber >= 100) { }}
                    {{:myNumber}} >= to 100
                    {{* } else { }}
                    {{:myNumber}} < than 100
                    {{* } }}
                    {{* myNumber++; }}
                </li>
        </ul>
        </li>
    {{/for}}
    </ul>
</script>

JavaScript

$('#output').hide();

//this wont work
//var someNumber = 0;
//this works
someNumber = 0;
//this works
//window.someNumber = 0;


var today = new Date(),
    someValue = 'something';

var data = {
    'people': [
        {
        'firstName': 'John',
        'lastName': 'Papa',
        'shirt': 'black'},
    {
        'firstName': 'Scott',
        'lastName': 'Guthrie',
        'shirt': 'red'},
    {
        'firstName': 'Dan',
        'lastName': 'Wahlin',
        'shirt': 'white'}
    ]
};

$.templates("peopleTmpl", {
    markup: "#peopleTemplate",
    allowCode: true
});

$("#output").html(
$.render.peopleTmpl(data));