A Backbone Relational playground

A simple playground for learning backbone.js (and Relational) without having to install or configure anything yourself.

by mmacaula

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone-relational/0.8.5/backbone-relational.min.js"></script>

JavaScript

var models = {}
models.ModelB = Backbone.RelationalModel.extend({
    urlRoot: 'someUrl'
});
models.CollectionB = Backbone.Collection.extend({
    model: models.ModelB
});

// Join table
models.ABJoin = Backbone.RelationalModel.extend({
    relations: [
        {
            type: Backbone.HasOne,
            key: 'b',
            relatedModel: models.ModelB,
            reverseRelation: {
                key: 'abJoins',
                includeInJSON: false
            }
        }
    ],
 
    toJSON: function () {
        return this.get('b').id;
    }
});
 
models.ABJoinCollection = Backbone.Collection.extend({
    model: models.ABJoin
});

models.ModelA = Backbone.RelationalModel.extend({
    url: 'someUrl',
    relations: [
        {
            type: Backbone.HasMany,
            key: 'abJoins',
            relatedModel: models.ABJoin,
            collectionType: models.ABJoinCollection,
            keyDestination: 'bs',
            autoFetch: false,
            reverseRelation: {
                key: 'a',
                includeInJSON: true
            }
        }
    ],
    parse: function (response) {
        // plural of 'b'
        var bs = response.bs;
        if (bs) {
            response.abJoins = _.map(bs, function (b) {
                return {b: b};
            });
            delete response.bs;
        }
 
        return response;
    }
});