Now that we have the models more or less in place, we're ready to start writing the actual views. Let's start with something simple: the tokens. We start with the TokensView class:
var TokensView = Backbone.View.extend({
render: function () {
this.collection.tokens()
.shuffle().forEach(this.addToken, this);
return this;
},
addToken: function (token) {
this.el.appendChild(new TokenView({
model: token
}).render().el);
}
});Writing this class is very simple. We get the collection of tokens from the game, call the built-in shuffle method to shuffle the tokens, and then render them each with the addToken method. This method renders a TokenView instance and appends it to the element. So that's the next stop—the TokenView class:
var TokenView = Backbone.View.extend({
className: 'token',
events: {
'click': 'choose'
},
render: function () {
this.model.view = this;
this.el.innerHTML = this.model.get('text');
return...