Backbone Gallery Notes

backbone_gallery.js

wl.ready(function() {
	// Backbone setup within scope
	var Image = Backbone.Model.extend({
		defaults: {
			'file_tn': 'undefined',
			'file_lg': 'undefined'
		},
		initialize: function() {
			this.on('all', function(e) { wl.log('Image event: ' + this.get('file_tn') + ': ' + e); });
		}
	});
	
	var Gallery = Backbone.Collection.extend({
		model: Image,
		url:   '/backbone-gallery/filterImages',
		initialize: function() {
			this.on('all', function(e) { wl.log('Gallery event: ' + e); });
		}
	});

	var GalleryContainer = Backbone.View.extend({
		events: {
			'change .filter': 'filterImages'
		},

		initialize:function () {
			this.on('all', function(e) { wl.log('GalleryView event: ' + e); });
			this.collection.on('reset', this.render, this);
		},

		filterImages: function(e) {
			e.preventDefault();
			this.collection.fetch({
				type: 'POST',
				data: {
					filters: {
						track:  $('#filters\\[track\\]').val(),
						team:   $('#filters\\[team\\]').val(),
						driver: $('#filters\\[driver\\]').val()
					}
				}
			});
		},

    render:function() {
    	this.$('#gallery_images').empty();
			_.each(this.collection.models, function (model) {
				this.$('#gallery_images').append(_.template($('#gallery_image_template').html(), { image:model.attributes }));
			}, this);
			return this;
    }
  });

	var gallery_images    = new Gallery();
	var gallery_container = new GalleryContainer({ el: $('#gallery_container'), collection: gallery_images });
});

Cool. I'll implement those mods and check out that link when I get some free time again. Thanks again for the great advice!