Backbone.Marionette - code style

c07b9e2a · Sindre Sorhus · 6f25047d · c07b9e2a · c07b9e2a · c07b9e2a
Commit c07b9e2a authored Mar 09, 2013 by Sindre Sorhus
5 changed files
--- a/labs/architecture-examples/backbone_marionette/index.html
+++ b/labs/architecture-examples/backbone_marionette/index.html
@@ -6,6 +6,22 @@
 		<title>Marionette • TodoMVC</title>
 		<link rel="stylesheet" href="components/todomvc-common/base.css">
 		<link rel="stylesheet" href="css/app.css">
+	</head>
+	<body>
+		<section id="todoapp">
+			<header id="header"></header>
+			<section id="main"></section>
+			<footer id="footer"></footer>
+		</section>
+		<footer id="info">
+			<p>Double-click to edit a todo</p>
+			<p>
+				Created by <a href="http://github.com/jsoverson">Jarrod Overson</a>
+				and <a href="http://github.com/derickbailey">Derick Bailey</a>
+				using <a href="http://marionettejs.com">Backbone.Marionette</a>
+			</p>
+			<p>Further variations on the Backbone.Marionette app are also <a href="https://github.com/marionettejs/backbone.marionette/wiki/Projects-and-websites-using-marionette">available</a>.</p>
+		</footer>
 		<script type="text/html" id="template-footer">
 			<span id="todo-count"><strong></strong><span></span></span>
 			<ul id="filters">
@@ -38,22 +54,6 @@
 			<label for="toggle-all">Mark all as complete</label>
 			<ul id="todo-list"></ul>
 		</script>
-	</head>
-	<body>
-		<section id="todoapp">
-			<header id="header"></header>
-			<section id="main"></section>
-			<footer id="footer"></footer>
-		</section>
-		<footer id="info">
-			<p>Double-click to edit a todo</p>
-			<p>
-				Created by <a href="http://github.com/jsoverson">Jarrod Overson</a>
-				and <a href="http://github.com/derickbailey">Derick Bailey</a>
-				using <a href="http://marionettejs.com">Backbone.Marionette</a>
-			</p>
-			<p>Further variations on the Backbone.Marionette app are also <a href="https://github.com/marionettejs/backbone.marionette/wiki/Projects-and-websites-using-marionette">available</a>.</p>
-		</footer>
 		<!-- vendor libraries -->
 		<script src="components/todomvc-common/base.js"></script>
 		<script src="components/jquery/jquery.js"></script>
@@ -68,8 +68,8 @@
 		<script src="js/TodoMVC.TodoList.Views.js"></script>
 		<script src="js/TodoMVC.TodoList.js"></script>
 		<script>
-			$(function(){
-				// Start the TodoMVC app (defined in js/TodoMVC.js)
+			$(function () {
+				// start the TodoMVC app (defined in js/TodoMVC.js)
 				TodoMVC.start();
 			});
 		</script>

--- a/labs/architecture-examples/backbone_marionette/js/TodoMVC.Layout.js
+++ b/labs/architecture-examples/backbone_marionette/js/TodoMVC.Layout.js
@@ -2,10 +2,8 @@
 'use strict';

 TodoMVC.module('Layout', function (Layout, App, Backbone) {
-
 	// Layout Header View
 	// ------------------
-
 	Layout.Header = Backbone.Marionette.ItemView.extend({
 		template: '#template-header',

@@ -34,7 +32,6 @@ TodoMVC.module('Layout', function (Layout, App, Backbone) {

 	// Layout Footer View
 	// ------------------
-
 	Layout.Footer = Backbone.Marionette.Layout.extend({
 		template: '#template-footer',

@@ -61,12 +58,12 @@ TodoMVC.module('Layout', function (Layout, App, Backbone) {
 		},

 		updateCount: function () {
-			var count = this.collection.getActive().length,
-				length = this.collection.length,
-				completed = length - count;
+			var count = this.collection.getActive().length;
+			var length = this.collection.length;
+			var completed = length - count;
+
 			this.ui.count.html(count);
 			this.ui.itemsString.html(' ' + (count === 1 ? 'item' : 'items') + ' left');
-
 			this.$el.parent().toggle(length > 0);

 			if (completed > 0) {
@@ -87,10 +84,9 @@ TodoMVC.module('Layout', function (Layout, App, Backbone) {

 		onClearClick: function () {
 			var completed = this.collection.getCompleted();
-			completed.forEach(function destroy(todo) {
+			completed.forEach(function (todo) {
 				todo.destroy();
 			});
 		}
 	});
-
 });
--- a/labs/architecture-examples/backbone_marionette/js/TodoMVC.TodoList.Views.js
+++ b/labs/architecture-examples/backbone_marionette/js/TodoMVC.TodoList.Views.js
@@ -2,13 +2,11 @@
 'use strict';

 TodoMVC.module('TodoList.Views', function (Views, App, Backbone, Marionette, $) {
-
 	// Todo List Item View
 	// -------------------
 	//
 	// Display an individual todo item, and respond to changes
 	// that are made to the item, including marking completed.
-
 	Views.ItemView = Marionette.ItemView.extend({
 		tagName: 'li',
 		template: '#template-todoItemView',
@@ -82,7 +80,6 @@ TodoMVC.module('TodoList.Views', function (Views, App, Backbone, Marionette, $)
 	//
 	// Controls the rendering of the list of items, including the
 	// filtering of activs vs completed items for display.
-
 	Views.ListView = Backbone.Marionette.CompositeView.extend({
 		template: '#template-todoListCompositeView',
 		itemView: Views.ItemView,
@@ -129,10 +126,8 @@ TodoMVC.module('TodoList.Views', function (Views, App, Backbone, Marionette, $)
 	//
 	// Handler for filtering the list of items by showing and
 	// hiding through the use of various CSS classes
-
 	App.vent.on('todoList:filter', function (filter) {
 		filter = filter || 'all';
 		$('#todoapp').attr('class', 'filter-' + filter);
 	});
-
 });
--- a/labs/architecture-examples/backbone_marionette/js/TodoMVC.TodoList.js
+++ b/labs/architecture-examples/backbone_marionette/js/TodoMVC.TodoList.js
@@ -2,12 +2,10 @@
 'use strict';

 TodoMVC.module('TodoList', function (TodoList, App, Backbone, Marionette, $, _) {
-
 	// TodoList Router
 	// ---------------
 	//
 	// Handle routes to show the active vs complete todo items
-
 	TodoList.Router = Marionette.AppRouter.extend({
 		appRoutes: {
 			'*filter': 'filterItems'
@@ -19,20 +17,17 @@ TodoMVC.module('TodoList', function (TodoList, App, Backbone, Marionette, $, _)
 	//
 	// Control the workflow and logic that exists at the application
 	// level, above the implementation detail of views and models
-
 	TodoList.Controller = function () {
 		this.todoList = new App.Todos.TodoList();
 	};

 	_.extend(TodoList.Controller.prototype, {
-
 		// Start the app by showing the appropriate views
 		// and fetching the list of todo items, if there are any
 		start: function () {
 			this.showHeader(this.todoList);
 			this.showFooter(this.todoList);
 			this.showTodoList(this.todoList);
-
 			this.todoList.fetch();
 		},

@@ -68,7 +63,6 @@ TodoMVC.module('TodoList', function (TodoList, App, Backbone, Marionette, $, _)
 	// Get the TodoList up and running by initializing the mediator
 	// when the the application is started, pulling in all of the
 	// existing Todo items and displaying them.
-
 	TodoList.addInitializer(function () {
 		var controller = new TodoList.Controller();
 		controller.router = new TodoList.Router({
@@ -77,5 +71,4 @@ TodoMVC.module('TodoList', function (TodoList, App, Backbone, Marionette, $, _)

 		controller.start();
 	});
-
 });
--- a/labs/architecture-examples/backbone_marionette/js/TodoMVC.Todos.js
+++ b/labs/architecture-examples/backbone_marionette/js/TodoMVC.Todos.js
@@ -2,12 +2,9 @@
 'use strict';

 TodoMVC.module('Todos', function (Todos, App, Backbone) {
-
 	// Todo Model
 	// ----------
-
 	Todos.Todo = Backbone.Model.extend({
-
 		defaults: {
 			title: '',
 			completed: false,
@@ -31,7 +28,6 @@ TodoMVC.module('Todos', function (Todos, App, Backbone) {

 	// Todo Collection
 	// ---------------
-
 	Todos.TodoList = Backbone.Collection.extend({
 		model: Todos.Todo,

@@ -53,5 +49,4 @@ TodoMVC.module('Todos', function (Todos, App, Backbone) {
 			return todo.isCompleted();
 		}
 	});
-
 });