JSFiddle - React, Tailwind, and code Playground

by zhuqling

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<div id="test"></div>

CoffeeScript

class Panel extends Backbone.View
    el: $('#test')
    events:
        'click #superZone': 'clickMyZone'
    initialize: ->
        $("#test").append '<span id="superZone">Panel initialized</span>, '
        @foo = 'bar'
    render: ->
        $("#test").append 'super render'
        @
    clickMyZone: ->
        alert 'click super zone'

class PanelAdvanced extends Panel
    #el: $('#test')
    events: ->
        _.extend {}, Panel.prototype.events || {},
            #'click #superZone': 'clickMyZone'
            'click #childZone': 'clickZone'
    initialize: ->
        super
        $("#test").append '<span id="childZone">PanelAdvanced initialized</span>, '
        $("#test").append @foo
    render: -> 
        super
        $("#test").append 'child render'
        @
    clickZone: ->
        #@clickMyZone()
        alert 'click child zone'
        
p = new PanelAdvanced()
p.render()