cujo updated to use bower.

labs/architecture-examples/cujo/app/controller.js

@@ -1,9 +1,26 @@
+/*global define */
 define(function () {
-	"use strict";
+	'use strict';
 
-	var updateRemainingCount, textProp;
+	var textProp;
 
-	updateRemainingCount = normalizeTextProp;
+	/**
+	 * Self-optimizing function to set the text of a node
+	 */
+	var updateRemainingCount = function () {
+		// sniff for proper textContent property
+		textProp = 'textContent' in document.documentElement ? 'textContent' : 'innerText';
+
+		// resume normally
+		updateRemainingCount = setTextProp;
+		updateRemainingCount(arguments);
+	};
+
+	var setTextProp = function (nodes, value) {
+		for (var i = 0; i < nodes.length; i++) {
+			nodes[i][textProp] = '' + value;
+		}
+	};
 
 	return {
 		/**
@@ -12,35 +29,35 @@ define(function () {
 		 * @param todo {Object} data used to create new todo
 		 * @param todo.text {String} text of the todo
 		 */
-		createTodo: function(todo) {},
+		createTodo: function () {},
 
 		/**
 		 * Remove an existing todo
 		 * @injected
 		 * @param todo {Object} existing todo, or object with same identifier, to remove
 		 */
-		removeTodo: function(todo) {},
+		removeTodo: function () {},
 
 		/**
 		 * Update an existing todo
 		 * @injected
 		 * @param todo {Object} updated todo
 		 */
-		updateTodo: function(todo) {},
+		updateTodo: function () {},
 
 		/**
 		 * Start inline editing a todo
 		 * @param node {Node} Dom node of the todo
 		 */
-		beginEditTodo: function(node) {
+		beginEditTodo: function (node) {
 			this.querySelector('.edit', node).focus();
 		},
 
 		/**
 		 * Finish editing a todo
 		 * @param todo {Object} todo to finish editing and save changes
 		 */
-		endEditTodo: function(todo) {
+		endEditTodo: function (todo) {
 			// As per application spec, todos edited to have empty
 			// text should be removed.
 			if (/\S/.test(todo.text)) {
@@ -53,24 +70,24 @@ define(function () {
 		/**
 		 * Remove all completed todos
 		 */
-		removeCompleted: function() {
+		removeCompleted: function () {
 			var todos = this.todos;
 
-			todos.forEach(function(todo) {
-				if(todo.complete) todos.remove(todo);
+			todos.forEach(function (todo) {
+				if (todo.complete) {
+					todos.remove(todo);
+				}
 			});
 		},
 
 		/**
 		 * Check/uncheck all todos
 		 */
-		toggleAll: function() {
-			var todos, complete;
-
-			todos = this.todos;
-			complete = this.masterCheckbox.checked;
+		toggleAll: function () {
+			var todos = this.todos;
+			var complete = this.masterCheckbox.checked;
 
-			todos.forEach(function(todo) {
+			todos.forEach(function (todo) {
 				todo.complete = complete;
 				todos.update(todo);
 			});
@@ -81,14 +98,16 @@ define(function () {
 		 * the check/uncheck all checkbox if all todos have become
 		 * checked or unchecked.
 		 */
-		updateCount: function() {
-			var total, checked;
+		updateCount: function () {
+			var total = 0;
+			var checked = 0;
 
-			total = checked = 0;
-
-			this.todos.forEach(function(todo) {
+			this.todos.forEach(function (todo) {
 				total++;
-				if(todo.complete) checked++;
+
+				if (todo.complete) {
+					checked++;
+				}
 			});
 
 			this.masterCheckbox.checked = total > 0 && checked === total;
@@ -99,32 +118,14 @@ define(function () {
 			this.updateRemainingCount(total - checked);
 		},
 
-		updateTotalCount: function(total) {},
+		updateTotalCount: function () {},
 
-		updateCompletedCount: function(completed) {
+		updateCompletedCount: function (completed) {
 			this.countNode.innerHTML = completed;
 		},
 
 		updateRemainingCount: function (remaining) {
 			updateRemainingCount(this.remainingNodes, remaining);
 		}
-
 	};
-
-	/**
-	 * Self-optimizing function to set the text of a node
-	 */
-	function normalizeTextProp () {
-		// sniff for proper textContent property
-		textProp = 'textContent' in document.documentElement ? 'textContent' : 'innerText';
-		// resume normally
-		(updateRemainingCount = setTextProp).apply(this, arguments);
-	}
-
-	function setTextProp (nodes, value) {
-		for (var i = 0; i < nodes.length; i++) {
-			nodes[i][textProp] = '' + value;
-		}
-	}
-
 });

labs/architecture-examples/cujo/app/controls/strings.js

@@ -1,5 +1,5 @@
+/*global define */
 define({
-	// TODO: Deal with singular vs. plural
 	itemsLeft: {
 		zero: '<strong></strong> items left',
 		one: '<strong></strong> item left',

labs/architecture-examples/cujo/app/controls/structure.css

@@ -19,20 +19,23 @@
 #clear-completed {
 	opacity: 1;
 }
-.completed-zero #clear-completed {
-    opacity: 0;
-}
 
-#footer {
-    display: none;
+.completed-zero #clear-completed {
+  opacity: 0;
 }
 
+.todos-one #main,
+.todos-many #main,
 .todos-one #footer,
 .todos-many #footer {
-    display: block;
+  display: block;
 }
 
-/* TODO: Reinstate once we add routing */
-#filters {
-    display: none;
+#main,
+#footer,
+.todos-zero #main,
+.todos-zero #footer {
+  display: none;
 }
+
+/* TODO: Reinstate once we add routing */

labs/architecture-examples/cujo/app/controls/template.html

@@ -1,21 +1,8 @@
 <footer id="footer">
-	<!-- This should be `0 items left` by default -->
 	<span id="todo-count">
 		<span class="remaining-count-zero">${itemsLeft.zero}</span>
 		<span class="remaining-count-one">${itemsLeft.one}</span>
 		<span class="remaining-count-many">${itemsLeft.many}</span>
 	</span>
-	<!-- Remove this if you don't implement routing -->
-	<ul id="filters">
-		<li>
-			<a class="selected" href="#/">${filter.all}</a>
-		</li>
-		<li>
-			<a href="#/active">${filter.active}</a>
-		</li>
-		<li>
-			<a href="#/completed">${filter.completed}</a>
-		</li>
-	</ul>
 	<button id="clear-completed">${clearCompleted} (<span class="count">1</span>)</button>
 </footer>

labs/architecture-examples/cujo/app/create/cleanTodo.js

@@ -1,10 +1,11 @@
-define(function() {
+/*global define */
+define(function () {
+	'use strict';
 
-	return function(todo) {
+	return function (todo) {
 		todo.text = todo.text && todo.text.trim() || '';
 		todo.complete = !!todo.complete;
 
 		return todo;
-	}
-
+	};
 });

labs/architecture-examples/cujo/app/create/generateMetadata.js

@@ -1,25 +1,27 @@
-define(function() {
-
-	/**
-	 * Since we're using a datastore (localStorage) that doesn't generate ids and such
-	 * for us, this transform generates a GUID id and a dateCreated.  It can be
-	 * injected into a pipeline for creating new todos.
-	 */
-	return function generateMetadata(item) {
-		item.id = guidLike();
-		item.dateCreated = new Date().getTime();
-
-		return item;
-	};
+/*global define */
+/*jshint bitwise:false */
+define(function () {
+	'use strict';
 
 	// GUID-like generation, not actually a GUID, tho, from:
 	// http://stackoverflow.com/questions/7940616/what-makes-this-pseudo-guid-generator-better-than-math-random
 	function s4() {
-		return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
+		return (((1 + Math.random()) * 0x10000)|0).toString(16).substring(1);
 	}
 
 	function guidLike() {
-		return (s4()+s4()+"-"+s4()+"-"+s4()+"-"+s4()+"-"+s4()+s4()+s4());
+		return (s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4());
 	}
 
+	/**
+	 * Since we're using a datastore (localStorage) that doesn't generate ids and
+	 * such for us, this transform generates a GUID id and a dateCreated.  It can
+	 * be injected into a pipeline for creating new todos.
+	 */
+	return function generateMetadata(item) {
+		item.id = guidLike();
+		item.dateCreated = new Date().getTime();
+
+		return item;
+	};
 });

labs/architecture-examples/cujo/app/create/strings.js

@@ -1,3 +1,4 @@
+/*global define */
 define({
 	title: 'todos',
 	todo: {

labs/architecture-examples/cujo/app/create/validateTodo.js

@@ -1,18 +1,19 @@
-define(function() {
+/*global define */
+define(function () {
+	'use strict';
 
 	/**
 	 * Validate a todo
 	 */
 	return function validateTodo(todo) {
-		var valid, result;
-
 		// Must be a valid object, and have a text property that is non-empty
-		valid = todo && 'text' in todo && todo.text.trim();
-		result = { valid: !!valid };
+		var valid = todo && 'text' in todo && todo.text.trim();
+		var result = { valid: !!valid };
 
-		if(!valid) result.errors = [{ property: 'text', message: 'missing' }];
+		if (!valid) {
+			result.errors = [{ property: 'text', message: 'missing' }];
+		}
 
 		return result;
-	}
-
+	};
 });

labs/architecture-examples/cujo/app/footer/strings.js

@@ -1,3 +1,4 @@
+/*global define */
 define({
 	edit: 'Double-click to edit a todo',
 	templateBy: 'Template by',

labs/architecture-examples/cujo/app/list/setCompletedClass.js

@@ -1,14 +1,15 @@
-define(function() {
+/*global define */
+define(function () {
+	'use strict';
 
 	/**
 	 * Custom data linking handler for setting the "completed" class.
 	 * The intent here is just to show that you can implement custom
 	 * handlers for data/dom linking to do anything that isn't provided
 	 * by default.
 	 */
-	return function(node, data, info) {
+	return function (node, data, info) {
 		// Simple-minded implementation just to show custom data linking handler
 		node.className = data[info.prop] ? 'completed' : '';
 	};
-
 });

labs/architecture-examples/cujo/app/list/strings.js

@@ -1,3 +1,4 @@
+/*global define */
 define({
 	markAll: 'Mark all as complete'
 });

labs/architecture-examples/cujo/app/list/structure.css

@@ -1,6 +1,8 @@
 #toggle-all {
-    display: none;
+	display: none;
 }
-.todos-one #toggle-all, .todos-many #toggle-all {
-    display: block;
+
+.todos-one #toggle-all,
+.todos-many #toggle-all {
+	display: block;
 }

labs/architecture-examples/cujo/app/main.js

@@ -1,5 +1,5 @@
+/*global define */
 define({
-
 	// Cujo uses OOCSS principles and thus separates theme (skin)
 	// from structure CSS.
 	theme: { module: 'css!theme/base.css' },
@@ -174,7 +174,7 @@ define({
 	},
 
 	plugins: [
-//		{ module: 'wire/debug', trace: true },
+		// { module: 'wire/debug', trace: true },
 		{ module: 'wire/dom' },
 		{ module: 'wire/dom/render' },
 		{ module: 'wire/on' },

labs/architecture-examples/cujo/app/run.js

@@ -1,4 +1,6 @@
-(function( curl ) {
+/*global curl */
+(function (curl) {
+	'use strict';
 
 	var config = {
 		baseUrl: 'app',
@@ -17,5 +19,4 @@
 	};
 
 	curl(config, ['poly/string', 'poly/array']).next(['wire!main']);
-
-})( curl );
+})(curl);