Backbone Template

by jscheel

HTML

<script src="https://raw.github.com/appendto/jquery-mockjax/master/jquery.mockjax.js"></script>
<script src="http://underscorejs.org/underscore-min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css">
<script src="http://code.jquery.com/qunit/qunit-git.js"></script>
<script src="http://backbonejs.org/backbone.js"></script>
<h1 id="qunit-header">Unit Tests</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"></div>

CoffeeScript

mockData = [
    {id: 0, title: 'asset 1', region: 1}
    {id: 1, title: 'asset 2', region: 1}
    {id: 2, title: 'asset 3', region: 2}
]
        
$.mockjax (settings) ->
    settings.url == '/restful/assets'
    id = settings.url.match(///
        /restful/assets/(.*)$
    ///)
    if id?[1]?
        asset = _.find mockData, (asset) ->
            asset.id == parseInt id[1]
        return {responseText: asset}
    return {responseText: mockData}
                

        
class AssetsView extends Backbone.View
    _subCollections: {}
    _subCollectionViews: {}
    initialize: ->
        @.collection.on 'reset', @addAll, @
        @.collection.on 'add', @addOne
        #@.collection.on 'remove', @removeOne
    
    addAll: ->
        @collection.each (asset) =>
            @addOne asset
    
    addOne: (asset, collection, options = {}) =>
        region = asset.get('region')
        if not @_subCollections[region]?
            @_subCollections[region] = new Backbone.Collection
            @_subCollectionViews[region] = new RegionView(collection: @_subCollections[region])
        @_subCollections[region].add asset, {silent: true}


        
        
        
class RegionView extends Backbone.View
    initialize: ->
        @.collection.on 'reset', @addAll, @
        @.collection.on 'add', @addOne
        #@.collection.on 'remove', @removeOne
    
    addAll: ->
        @collection.each (asset) =>
            @addOne asset
    
    addOne: (asset, collection, options = {}) =>
        console.log 'region asset', asset

        
        

col = new Backbone.Collection
col.url = '/restful/assets'
col.model = Backbone.Model
av = new AssetsView(collection: col)
window.av = av
col.fetch success: =>
    test 'Main collection is populated properly', ->
        same(col.pluck('region'), [1, 1, 2])
    
    test 'Sub-collections are created', ->
        collections = _.toArray(av._subCollections)
        equal(collections.length, 2)
    
    test 'Sub-collections are...