Backbone app: Improve namespacing

architecture-examples/backbone/index.html

@@ -56,7 +56,6 @@ <h1>todos</h1>
 	<script src="js/lib/underscore-min.js"></script>
 	<script src="js/lib/backbone-min.js"></script>
 	<script src="js/lib/backbone-localstorage.js"></script>
-	<script src="js/init.js"></script>
 	<script src="js/models/todo.js"></script>
 	<script src="js/collections/todos.js"></script>
 	<script src="js/views/todos.js"></script>

architecture-examples/backbone/js/app.js

@@ -1,6 +1,9 @@
+var app = app || {};
+var ENTER_KEY = 13;
+
 $(function() {
 
 	// Kick things off by creating the **App**.
-	var App = new window.app.AppView;
+	new app.AppView();
 
 });

architecture-examples/backbone/js/collections/todos.js

@@ -1,3 +1,5 @@
+var app = app || {};
+
 (function() {
 	'use strict';
 
@@ -9,7 +11,7 @@
 	var TodoList = Backbone.Collection.extend({
 
 		// Reference to this collection's model.
-		model: window.app.Todo,
+		model: app.Todo,
 
 		// Save all of the todo items under the `"todos"` namespace.
 		localStorage: new Store('todos-backbone'),
@@ -42,6 +44,6 @@
 	});
 
 	// Create our global collection of **Todos**.
-	window.app.Todos = new TodoList;
+	app.Todos = new TodoList();
 
 }());

architecture-examples/backbone/js/models/todo.js

@@ -1,11 +1,13 @@
+var app = app || {};
+
 (function() {
 	'use strict';
 
 	// Todo Model
 	// ----------
 
 	// Our basic **Todo** model has `title`, `order`, and `completed` attributes.
-	window.app.Todo = Backbone.Model.extend({
+	app.Todo = Backbone.Model.extend({
 
 		// Default attributes for the todo
 		// and ensure that each todo created has `title` and `completed` keys.

architecture-examples/backbone/js/routers/router.js

@@ -1,3 +1,5 @@
+var app = app || {};
+
 (function() {
 	'use strict';
 
@@ -18,7 +20,7 @@
 		}
 	});
 
-	window.app.TodoRouter = new Workspace();
+	app.TodoRouter = new Workspace();
 	Backbone.history.start();
 
 }());

architecture-examples/backbone/js/views/app.js

@@ -1,11 +1,13 @@
+var app = app || {};
+
 $(function( $ ) {
 	'use strict';
 
 	// The Application
 	// ---------------
 
 	// Our overall **AppView** is the top-level piece of UI.
-	window.app.AppView = Backbone.View.extend({
+	app.AppView = Backbone.View.extend({
 
 		// Instead of generating a new element, bind to the existing skeleton of
 		// the App already present in the HTML.
@@ -36,16 +38,16 @@ $(function( $ ) {
 			this.$footer = this.$('#footer');
 			this.$main = this.$('#main');
 
-			window.app.Todos.fetch();
+			app.Todos.fetch();
 		},
 
 		// Re-rendering the App just means refreshing the statistics -- the rest
 		// of the app doesn't change.
 		render: function() {
-			var completed = window.app.Todos.completed().length;
-			var remaining = window.app.Todos.remaining().length;
+			var completed = app.Todos.completed().length;
+			var remaining = app.Todos.remaining().length;
 
-			if ( window.app.Todos.length ) {
+			if ( app.Todos.length ) {
 				this.$main.show();
 				this.$footer.show();
 
@@ -56,7 +58,7 @@ $(function( $ ) {
 
 				this.$('#filters li a')
 					.removeClass('selected')
-					.filter('[href="#/' + ( window.app.TodoFilter || '' ) + '"]')
+					.filter('[href="#/' + ( app.TodoFilter || '' ) + '"]')
 					.addClass('selected');
 			} else {
 				this.$main.hide();
@@ -69,23 +71,23 @@ $(function( $ ) {
 		// Add a single todo item to the list by creating a view for it, and
 		// appending its element to the `<ul>`.
 		addOne: function( todo ) {
-			var view = new window.app.TodoView({ model: todo });
+			var view = new app.TodoView({ model: todo });
 			$('#todo-list').append( view.render().el );
 		},
 
 		// Add all items in the **Todos** collection at once.
 		addAll: function() {
 			this.$('#todo-list').html('');
 
-			switch( window.app.TodoFilter ) {
+			switch( app.TodoFilter ) {
 				case 'active':
-					_.each( window.app.Todos.remaining(), this.addOne );
+					_.each( app.Todos.remaining(), this.addOne );
 					break;
 				case 'completed':
-					_.each( window.app.Todos.completed(), this.addOne );
+					_.each( app.Todos.completed(), this.addOne );
 					break;
 				default:
-					window.app.Todos.each( this.addOne, this );
+					app.Todos.each( this.addOne, this );
 					break;
 			}
 		},
@@ -94,7 +96,7 @@ $(function( $ ) {
 		newAttributes: function() {
 			return {
 				title: this.input.val().trim(),
-				order: window.app.Todos.nextOrder(),
+				order: app.Todos.nextOrder(),
 				completed: false
 			};
 		},
@@ -106,7 +108,7 @@ $(function( $ ) {
 				return;
 			}
 
-			window.app.Todos.create( this.newAttributes() );
+			app.Todos.create( this.newAttributes() );
 			this.input.val('');
 		},
 
@@ -122,7 +124,7 @@ $(function( $ ) {
 		toggleAllComplete: function() {
 			var completed = this.allCheckbox.checked;
 
-			window.app.Todos.each(function( todo ) {
+			app.Todos.each(function( todo ) {
 				todo.save({
 					'completed': completed
 				});

architecture-examples/backbone/js/views/todos.js

@@ -1,11 +1,13 @@
+var app = app || {};
+
 $(function() {
 	'use strict';
 
 	// Todo Item View
 	// --------------
 
 	// The DOM element for a todo item...
-	window.app.TodoView = Backbone.View.extend({
+	app.TodoView = Backbone.View.extend({
 
 		//... is a list tag.
 		tagName:  'li',