Commit dbe7faa2 authored by Sindre Sorhus's avatar Sindre Sorhus

Backbone app: Improve namespacing

parent fdcac4ed
...@@ -56,7 +56,6 @@ ...@@ -56,7 +56,6 @@
<script src="js/lib/underscore-min.js"></script> <script src="js/lib/underscore-min.js"></script>
<script src="js/lib/backbone-min.js"></script> <script src="js/lib/backbone-min.js"></script>
<script src="js/lib/backbone-localstorage.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/models/todo.js"></script>
<script src="js/collections/todos.js"></script> <script src="js/collections/todos.js"></script>
<script src="js/views/todos.js"></script> <script src="js/views/todos.js"></script>
......
var app = app || {};
var ENTER_KEY = 13;
$(function() { $(function() {
// Kick things off by creating the **App**. // Kick things off by creating the **App**.
var App = new window.app.AppView; new app.AppView();
}); });
var app = app || {};
(function() { (function() {
'use strict'; 'use strict';
...@@ -9,7 +11,7 @@ ...@@ -9,7 +11,7 @@
var TodoList = Backbone.Collection.extend({ var TodoList = Backbone.Collection.extend({
// Reference to this collection's model. // Reference to this collection's model.
model: window.app.Todo, model: app.Todo,
// Save all of the todo items under the `"todos"` namespace. // Save all of the todo items under the `"todos"` namespace.
localStorage: new Store('todos-backbone'), localStorage: new Store('todos-backbone'),
...@@ -42,6 +44,6 @@ ...@@ -42,6 +44,6 @@
}); });
// Create our global collection of **Todos**. // Create our global collection of **Todos**.
window.app.Todos = new TodoList; app.Todos = new TodoList();
}()); }());
// Constants
var ENTER_KEY = 13;
// Setup namespace for the app
window.app = window.app || {};
var app = app || {};
(function() { (function() {
'use strict'; 'use strict';
...@@ -5,7 +7,7 @@ ...@@ -5,7 +7,7 @@
// ---------- // ----------
// Our basic **Todo** model has `title`, `order`, and `completed` attributes. // 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 // Default attributes for the todo
// and ensure that each todo created has `title` and `completed` keys. // and ensure that each todo created has `title` and `completed` keys.
......
var app = app || {};
(function() { (function() {
'use strict'; 'use strict';
...@@ -18,7 +20,7 @@ ...@@ -18,7 +20,7 @@
} }
}); });
window.app.TodoRouter = new Workspace(); app.TodoRouter = new Workspace();
Backbone.history.start(); Backbone.history.start();
}()); }());
var app = app || {};
$(function( $ ) { $(function( $ ) {
'use strict'; 'use strict';
...@@ -5,7 +7,7 @@ $(function( $ ) { ...@@ -5,7 +7,7 @@ $(function( $ ) {
// --------------- // ---------------
// Our overall **AppView** is the top-level piece of UI. // 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 // Instead of generating a new element, bind to the existing skeleton of
// the App already present in the HTML. // the App already present in the HTML.
...@@ -36,16 +38,16 @@ $(function( $ ) { ...@@ -36,16 +38,16 @@ $(function( $ ) {
this.$footer = this.$('#footer'); this.$footer = this.$('#footer');
this.$main = this.$('#main'); this.$main = this.$('#main');
window.app.Todos.fetch(); app.Todos.fetch();
}, },
// Re-rendering the App just means refreshing the statistics -- the rest // Re-rendering the App just means refreshing the statistics -- the rest
// of the app doesn't change. // of the app doesn't change.
render: function() { render: function() {
var completed = window.app.Todos.completed().length; var completed = app.Todos.completed().length;
var remaining = window.app.Todos.remaining().length; var remaining = app.Todos.remaining().length;
if ( window.app.Todos.length ) { if ( app.Todos.length ) {
this.$main.show(); this.$main.show();
this.$footer.show(); this.$footer.show();
...@@ -56,7 +58,7 @@ $(function( $ ) { ...@@ -56,7 +58,7 @@ $(function( $ ) {
this.$('#filters li a') this.$('#filters li a')
.removeClass('selected') .removeClass('selected')
.filter('[href="#/' + ( window.app.TodoFilter || '' ) + '"]') .filter('[href="#/' + ( app.TodoFilter || '' ) + '"]')
.addClass('selected'); .addClass('selected');
} else { } else {
this.$main.hide(); this.$main.hide();
...@@ -69,7 +71,7 @@ $(function( $ ) { ...@@ -69,7 +71,7 @@ $(function( $ ) {
// Add a single todo item to the list by creating a view for it, and // Add a single todo item to the list by creating a view for it, and
// appending its element to the `<ul>`. // appending its element to the `<ul>`.
addOne: function( todo ) { addOne: function( todo ) {
var view = new window.app.TodoView({ model: todo }); var view = new app.TodoView({ model: todo });
$('#todo-list').append( view.render().el ); $('#todo-list').append( view.render().el );
}, },
...@@ -77,15 +79,15 @@ $(function( $ ) { ...@@ -77,15 +79,15 @@ $(function( $ ) {
addAll: function() { addAll: function() {
this.$('#todo-list').html(''); this.$('#todo-list').html('');
switch( window.app.TodoFilter ) { switch( app.TodoFilter ) {
case 'active': case 'active':
_.each( window.app.Todos.remaining(), this.addOne ); _.each( app.Todos.remaining(), this.addOne );
break; break;
case 'completed': case 'completed':
_.each( window.app.Todos.completed(), this.addOne ); _.each( app.Todos.completed(), this.addOne );
break; break;
default: default:
window.app.Todos.each( this.addOne, this ); app.Todos.each( this.addOne, this );
break; break;
} }
}, },
...@@ -94,7 +96,7 @@ $(function( $ ) { ...@@ -94,7 +96,7 @@ $(function( $ ) {
newAttributes: function() { newAttributes: function() {
return { return {
title: this.input.val().trim(), title: this.input.val().trim(),
order: window.app.Todos.nextOrder(), order: app.Todos.nextOrder(),
completed: false completed: false
}; };
}, },
...@@ -106,7 +108,7 @@ $(function( $ ) { ...@@ -106,7 +108,7 @@ $(function( $ ) {
return; return;
} }
window.app.Todos.create( this.newAttributes() ); app.Todos.create( this.newAttributes() );
this.input.val(''); this.input.val('');
}, },
...@@ -122,7 +124,7 @@ $(function( $ ) { ...@@ -122,7 +124,7 @@ $(function( $ ) {
toggleAllComplete: function() { toggleAllComplete: function() {
var completed = this.allCheckbox.checked; var completed = this.allCheckbox.checked;
window.app.Todos.each(function( todo ) { app.Todos.each(function( todo ) {
todo.save({ todo.save({
'completed': completed 'completed': completed
}); });
......
var app = app || {};
$(function() { $(function() {
'use strict'; 'use strict';
...@@ -5,7 +7,7 @@ $(function() { ...@@ -5,7 +7,7 @@ $(function() {
// -------------- // --------------
// The DOM element for a todo item... // The DOM element for a todo item...
window.app.TodoView = Backbone.View.extend({ app.TodoView = Backbone.View.extend({
//... is a list tag. //... is a list tag.
tagName: 'li', tagName: 'li',
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment