text: /*global Thorax, _ */
  
  Thorax.View.extend({
  	name: 'stats',
  
  	events: {
  		'click #clear-completed': 'clearCompleted',
  		// The "rendered" event is triggered by Thorax each time render()
  		// is called and the result of the template has been appended
  		// to the View's $el
  		rendered: 'highlightFilter'
  	},
  
  	initialize: function () {
  		'use strict';
  		// Whenever the Todos collection changes re-render the stats
  		// render() needs to be called with no arguments, otherwise calling
  		// it with arguments will insert the arguments as content
  		this.listenTo(window.app.Todos, 'all', _.debounce(function () {
  			this.render();
  		}));
  	},
  
  	// Clear all completed todo items, destroying their models.
  	clearCompleted: function () {
  		'use strict';
  		_.each(window.app.Todos.completed(), function (todo) {
  			todo.destroy();
  		});
  
  		return false;
  	},
  
  	// Each time the stats view is rendered this function will
  	// be called to generate the context / scope that the template
  	// will be called with. "context" defaults to "return this"
  	context: function () {
  		'use strict';
  		var remaining = window.app.Todos.remaining().length;
  		return {
  			itemText: remaining === 1 ? 'item' : 'items',
  			completed: window.app.Todos.completed().length,
  			remaining: remaining
  		};
  	},
  
  	// Highlight which filter will appear to be active
  	highlightFilter: function () {
  		'use strict';
  		this.$('#filters li a')
  			.removeClass('selected')
  			.filter('[href="#/' + (window.app.TodoFilter || '') + '"]')
  			.addClass('selected');
  	}
  });
  