batman.js template

HTML

<button data-event-click="onClick">Click Me!</button>
<div data-showif="object" data-mixin="animation">
    The interpolated values disappear before this box.<br />
    The value of prop is '<span data-bind="object.prop"></span>'.<br />
    The value is '<span data-bind="object.value"></span>'.<br />
</div>



















































<!-- This enables us to run coffeescript below. --->
<script>(function(){var s="script",n='\n',d=document,b=d.getElementsByTagName(s);b=b[b.length-2].innerHTML.split(n); d.write('<'+s+' type="text/coffeescript">'+b.slice(2,b.length-2).join(n)+'</'+s+'>');})()</script>

CSS

body {
    background-color: #f0f0f0;
}

div {
    background-color: #FFF;  
}

div span {
    font-weight: bold;
    font-size: 20px;
}

h2 {
  clear: both;
}

JavaScript

# batman.js jsfiddle Template ©2011 CJ Lazell
class Hello extends Batman.App
  @global true
  @set 'object', null

  @onClick: ->
    if @get('object')
      @set 'object', null
    else
      @set 'object', new Batman.Object
        prop: 'name'
        value: 'somethingElse'

Hello.run()