batman updated to use bower. about time, batman.

labs/architecture-examples/batman/app.coffee

+class Alfred extends Batman.App
+	@root 'todos#all'
+	@route '/completed', 'todos#completed'
+	@route '/active', 'todos#active'
+
+class Alfred.TodosController extends Batman.Controller
+	constructor: ->
+		super
+		@set('newTodo', new Alfred.Todo(completed: false))
+
+	routingKey: 'todos'
+	currentTodoSet: 'all'
+
+	@accessor 'currentTodos', -> Alfred.Todo.get(@get('currentTodoSet'))
+
+	all: ->
+		@set('currentTodoSet', 'all')
+
+	completed: ->
+		@set 'currentTodoSet', 'completed'
+		@render(source: 'todos/all')
+
+	active: ->
+		@set 'currentTodoSet', 'active'
+		@render(source: 'todos/all')
+
+	createTodo: ->
+		@get('newTodo').save (err, todo) =>
+			if err
+				throw err unless err instanceof Batman.ErrorsSet
+			else
+				@set 'newTodo', new Alfred.Todo(completed: false, title: "")
+
+	todoDoneChanged: (node, event, context) ->
+		todo = context.get('todo')
+		todo.save (err) ->
+			throw err if err && !err instanceof Batman.ErrorsSet
+
+	destroyTodo: (node, event, context) ->
+		todo = context.get('todo')
+		todo.destroy (err) -> throw err if err
+
+	toggleAll: (node, context) ->
+		Alfred.Todo.get('all').forEach (todo) ->
+			todo.set('completed', !!node.checked)
+			todo.save (err) ->
+				throw err if err && !err instanceof Batman.ErrorsSet
+
+	clearCompleted: ->
+		Alfred.Todo.get('completed').forEach (todo) ->
+			todo.destroy (err) -> throw err if err
+
+	toggleEditing: (node, event, context) ->
+		todo = context.get('todo')
+		editing = todo.set('editing', !todo.get('editing'))
+		if editing
+			input = document.getElementById("todo-input-#{todo.get('id')}")
+			input.focus()
+		else
+			if todo.get('title')?.length > 0
+				todo.save (err, todo) ->
+					throw err if err && !err instanceof Batman.ErrorsSet
+			else
+				todo.destroy (err, todo) ->
+					throw err if err
+
+	disableEditingUponSubmit: (node, event, context) ->
+		node.blur() if Batman.DOM.events.isEnter(event)
+
+class Alfred.Todo extends Batman.Model
+	@encode 'title', 'completed'
+	@persist Batman.LocalStorage
+	@validate 'title', presence: true
+	@storageKey: 'todos-batman'
+
+	@classAccessor 'active', ->
+		@get('all').filter (todo) -> !todo.get('completed')
+
+	@classAccessor 'completed', ->
+		@get('all').filter (todo) -> todo.get('completed')
+
+	@wrapAccessor 'title', (core) ->
+		set: (key, value) -> core.set.call(@, key, value?.trim())
+
+window.Alfred = Alfred
+Alfred.run()

labs/architecture-examples/batman/app.js

+// Generated by CoffeeScript 1.6.2
+(function() {
+  var Alfred, _ref, _ref1,
+    __hasProp = {}.hasOwnProperty,
+    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
+
+  Alfred = (function(_super) {
+    __extends(Alfred, _super);
+
+    function Alfred() {
+      _ref = Alfred.__super__.constructor.apply(this, arguments);
+      return _ref;
+    }
+
+    Alfred.root('todos#all');
+
+    Alfred.route('/completed', 'todos#completed');
+
+    Alfred.route('/active', 'todos#active');
+
+    return Alfred;
+
+  })(Batman.App);
+
+  Alfred.TodosController = (function(_super) {
+    __extends(TodosController, _super);
+
+    function TodosController() {
+      TodosController.__super__.constructor.apply(this, arguments);
+      this.set('newTodo', new Alfred.Todo({
+        completed: false
+      }));
+    }
+
+    TodosController.prototype.routingKey = 'todos';
+
+    TodosController.prototype.currentTodoSet = 'all';
+
+    TodosController.accessor('currentTodos', function() {
+      return Alfred.Todo.get(this.get('currentTodoSet'));
+    });
+
+    TodosController.prototype.all = function() {
+      return this.set('currentTodoSet', 'all');
+    };
+
+    TodosController.prototype.completed = function() {
+      this.set('currentTodoSet', 'completed');
+      return this.render({
+        source: 'todos/all'
+      });
+    };
+
+    TodosController.prototype.active = function() {
+      this.set('currentTodoSet', 'active');
+      return this.render({
+        source: 'todos/all'
+      });
+    };
+
+    TodosController.prototype.createTodo = function() {
+      var _this = this;
+
+      return this.get('newTodo').save(function(err, todo) {
+        if (err) {
+          if (!(err instanceof Batman.ErrorsSet)) {
+            throw err;
+          }
+        } else {
+          return _this.set('newTodo', new Alfred.Todo({
+            completed: false,
+            title: ""
+          }));
+        }
+      });
+    };
+
+    TodosController.prototype.todoDoneChanged = function(node, event, context) {
+      var todo;
+
+      todo = context.get('todo');
+      return todo.save(function(err) {
+        if (err && !err instanceof Batman.ErrorsSet) {
+          throw err;
+        }
+      });
+    };
+
+    TodosController.prototype.destroyTodo = function(node, event, context) {
+      var todo;
+
+      todo = context.get('todo');
+      return todo.destroy(function(err) {
+        if (err) {
+          throw err;
+        }
+      });
+    };
+
+    TodosController.prototype.toggleAll = function(node, context) {
+      return Alfred.Todo.get('all').forEach(function(todo) {
+        todo.set('completed', !!node.checked);
+        return todo.save(function(err) {
+          if (err && !err instanceof Batman.ErrorsSet) {
+            throw err;
+          }
+        });
+      });
+    };
+
+    TodosController.prototype.clearCompleted = function() {
+      return Alfred.Todo.get('completed').forEach(function(todo) {
+        return todo.destroy(function(err) {
+          if (err) {
+            throw err;
+          }
+        });
+      });
+    };
+
+    TodosController.prototype.toggleEditing = function(node, event, context) {
+      var editing, input, todo, _ref1;
+
+      todo = context.get('todo');
+      editing = todo.set('editing', !todo.get('editing'));
+      if (editing) {
+        input = document.getElementById("todo-input-" + (todo.get('id')));
+        return input.focus();
+      } else {
+        if (((_ref1 = todo.get('title')) != null ? _ref1.length : void 0) > 0) {
+          return todo.save(function(err, todo) {
+            if (err && !err instanceof Batman.ErrorsSet) {
+              throw err;
+            }
+          });
+        } else {
+          return todo.destroy(function(err, todo) {
+            if (err) {
+              throw err;
+            }
+          });
+        }
+      }
+    };
+
+    TodosController.prototype.disableEditingUponSubmit = function(node, event, context) {
+      if (Batman.DOM.events.isEnter(event)) {
+        return node.blur();
+      }
+    };
+
+    return TodosController;
+
+  })(Batman.Controller);
+
+  Alfred.Todo = (function(_super) {
+    __extends(Todo, _super);
+
+    function Todo() {
+      _ref1 = Todo.__super__.constructor.apply(this, arguments);
+      return _ref1;
+    }
+
+    Todo.encode('title', 'completed');
+
+    Todo.persist(Batman.LocalStorage);
+
+    Todo.validate('title', {
+      presence: true
+    });
+
+    Todo.storageKey = 'todos-batman';
+
+    Todo.classAccessor('active', function() {
+      return this.get('all').filter(function(todo) {
+        return !todo.get('completed');
+      });
+    });
+
+    Todo.classAccessor('completed', function() {
+      return this.get('all').filter(function(todo) {
+        return todo.get('completed');
+      });
+    });
+
+    Todo.wrapAccessor('title', function(core) {
+      return {
+        set: function(key, value) {
+          return core.set.call(this, key, value != null ? value.trim() : void 0);
+        }
+      };
+    });
+
+    return Todo;
+
+  })(Batman.Model);
+
+  window.Alfred = Alfred;
+
+  Alfred.run();
+
+}).call(this);

labs/architecture-examples/batman/component.json

+{
+  "name": "todomvc-batman",
+  "version": "0.0.0",
+  "dependencies": {
+    "todomvc-common": "~0.1.4",
+    "batman": "~0.14.1"
+  }
+}

labs/architecture-examples/batman/components/todomvc-common/base.css

+html,
+body {
+	margin: 0;
+	padding: 0;
+}
+
+button {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	background: none;
+	font-size: 100%;
+	vertical-align: baseline;
+	font-family: inherit;
+	color: inherit;
+	-webkit-appearance: none;
+	/*-moz-appearance: none;*/
+	-ms-appearance: none;
+	-o-appearance: none;
+	appearance: none;
+}
+
+body {
+	font: 14px 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	line-height: 1.4em;
+	background: #eaeaea url('bg.png');
+	color: #4d4d4d;
+	width: 550px;
+	margin: 0 auto;
+	-webkit-font-smoothing: antialiased;
+	-moz-font-smoothing: antialiased;
+	-ms-font-smoothing: antialiased;
+	-o-font-smoothing: antialiased;
+	font-smoothing: antialiased;
+}
+
+#todoapp {
+	background: #fff;
+	background: rgba(255, 255, 255, 0.9);
+	margin: 130px 0 40px 0;
+	border: 1px solid #ccc;
+	position: relative;
+	border-top-left-radius: 2px;
+	border-top-right-radius: 2px;
+	box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.2),
+				0 25px 50px 0 rgba(0, 0, 0, 0.15);
+}
+
+#todoapp:before {
+	content: '';
+	border-left: 1px solid #f5d6d6;
+	border-right: 1px solid #f5d6d6;
+	width: 2px;
+	position: absolute;
+	top: 0;
+	left: 40px;
+	height: 100%;
+}
+
+#todoapp input::-webkit-input-placeholder {
+	font-style: italic;
+}
+
+#todoapp input:-moz-placeholder {
+	font-style: italic;
+	color: #a9a9a9;
+}
+
+#todoapp h1 {
+	position: absolute;
+	top: -120px;
+	width: 100%;
+	font-size: 70px;
+	font-weight: bold;
+	text-align: center;
+	color: #b3b3b3;
+	color: rgba(255, 255, 255, 0.3);
+	text-shadow: -1px -1px rgba(0, 0, 0, 0.2);
+	-webkit-text-rendering: optimizeLegibility;
+	-moz-text-rendering: optimizeLegibility;
+	-ms-text-rendering: optimizeLegibility;
+	-o-text-rendering: optimizeLegibility;
+	text-rendering: optimizeLegibility;
+}
+
+#header {
+	padding-top: 15px;
+	border-radius: inherit;
+}
+
+#header:before {
+	content: '';
+	position: absolute;
+	top: 0;
+	right: 0;
+	left: 0;
+	height: 15px;
+	z-index: 2;
+	border-bottom: 1px solid #6c615c;
+	background: #8d7d77;
+	background: -webkit-gradient(linear, left top, left bottom, from(rgba(132, 110, 100, 0.8)),to(rgba(101, 84, 76, 0.8)));
+	background: -webkit-linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
+	background: -moz-linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
+	background: -o-linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
+	background: -ms-linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
+	background: linear-gradient(top, rgba(132, 110, 100, 0.8), rgba(101, 84, 76, 0.8));
+	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#9d8b83', EndColorStr='#847670');
+	border-top-left-radius: 1px;
+	border-top-right-radius: 1px;
+}
+
+#new-todo,
+.edit {
+	position: relative;
+	margin: 0;
+	width: 100%;
+	font-size: 24px;
+	font-family: inherit;
+	line-height: 1.4em;
+	border: 0;
+	outline: none;
+	color: inherit;
+	padding: 6px;
+	border: 1px solid #999;
+	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	-ms-box-sizing: border-box;
+	-o-box-sizing: border-box;
+	box-sizing: border-box;
+	-webkit-font-smoothing: antialiased;
+	-moz-font-smoothing: antialiased;
+	-ms-font-smoothing: antialiased;
+	-o-font-smoothing: antialiased;
+	font-smoothing: antialiased;
+}
+
+#new-todo {
+	padding: 16px 16px 16px 60px;
+	border: none;
+	background: rgba(0, 0, 0, 0.02);
+	z-index: 2;
+	box-shadow: none;
+}
+
+#main {
+	position: relative;
+	z-index: 2;
+	border-top: 1px dotted #adadad;
+}
+
+label[for='toggle-all'] {
+	display: none;
+}
+
+#toggle-all {
+	position: absolute;
+	top: -42px;
+	left: -4px;
+	width: 40px;
+	text-align: center;
+	border: none; /* Mobile Safari */
+}
+
+#toggle-all:before {
+	content: '»';
+	font-size: 28px;
+	color: #d9d9d9;
+	padding: 0 25px 7px;
+}
+
+#toggle-all:checked:before {
+	color: #737373;
+}
+
+#todo-list {
+	margin: 0;
+	padding: 0;
+	list-style: none;
+}
+
+#todo-list li {
+	position: relative;
+	font-size: 24px;
+	border-bottom: 1px dotted #ccc;
+}
+
+#todo-list li:last-child {
+	border-bottom: none;
+}
+
+#todo-list li.editing {
+	border-bottom: none;
+	padding: 0;
+}
+
+#todo-list li.editing .edit {
+	display: block;
+	width: 506px;
+	padding: 13px 17px 12px 17px;
+	margin: 0 0 0 43px;
+}
+
+#todo-list li.editing .view {
+	display: none;
+}
+
+#todo-list li .toggle {
+	text-align: center;
+	width: 40px;
+	/* auto, since non-WebKit browsers doesn't support input styling */
+	height: auto;
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	margin: auto 0;
+	border: none; /* Mobile Safari */
+	-webkit-appearance: none;
+	/*-moz-appearance: none;*/
+	-ms-appearance: none;
+	-o-appearance: none;
+	appearance: none;
+}
+
+#todo-list li .toggle:after {
+	content: '✔';
+	line-height: 43px; /* 40 + a couple of pixels visual adjustment */
+	font-size: 20px;
+	color: #d9d9d9;
+	text-shadow: 0 -1px 0 #bfbfbf;
+}
+
+#todo-list li .toggle:checked:after {
+	color: #85ada7;
+	text-shadow: 0 1px 0 #669991;
+	bottom: 1px;
+	position: relative;
+}
+
+#todo-list li label {
+	word-break: break-word;
+	padding: 15px;
+	margin-left: 45px;
+	display: block;
+	line-height: 1.2;
+	-webkit-transition: color 0.4s;
+	-moz-transition: color 0.4s;
+	-ms-transition: color 0.4s;
+	-o-transition: color 0.4s;
+	transition: color 0.4s;
+}
+
+#todo-list li.completed label {
+	color: #a9a9a9;
+	text-decoration: line-through;
+}
+
+#todo-list li .destroy {
+	display: none;
+	position: absolute;
+	top: 0;
+	right: 10px;
+	bottom: 0;
+	width: 40px;
+	height: 40px;
+	margin: auto 0;
+	font-size: 22px;
+	color: #a88a8a;
+	-webkit-transition: all 0.2s;
+	-moz-transition: all 0.2s;
+	-ms-transition: all 0.2s;
+	-o-transition: all 0.2s;
+	transition: all 0.2s;
+}
+
+#todo-list li .destroy:hover {
+	text-shadow: 0 0 1px #000,
+				 0 0 10px rgba(199, 107, 107, 0.8);
+	-webkit-transform: scale(1.3);
+	-moz-transform: scale(1.3);
+	-ms-transform: scale(1.3);
+	-o-transform: scale(1.3);
+	transform: scale(1.3);
+}
+
+#todo-list li .destroy:after {
+	content: '✖';
+}
+
+#todo-list li:hover .destroy {
+	display: block;
+}
+
+#todo-list li .edit {
+	display: none;
+}
+
+#todo-list li.editing:last-child {
+	margin-bottom: -1px;
+}
+
+#footer {
+	color: #777;
+	padding: 0 15px;
+	position: absolute;
+	right: 0;
+	bottom: -31px;
+	left: 0;
+	height: 20px;
+	z-index: 1;
+	text-align: center;
+}
+
+#footer:before {
+	content: '';
+	position: absolute;
+	right: 0;
+	bottom: 31px;
+	left: 0;
+	height: 50px;
+	z-index: -1;
+	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3),
+				0 6px 0 -3px rgba(255, 255, 255, 0.8),
+				0 7px 1px -3px rgba(0, 0, 0, 0.3),
+				0 43px 0 -6px rgba(255, 255, 255, 0.8),
+				0 44px 2px -6px rgba(0, 0, 0, 0.2);
+}
+
+#todo-count {
+	float: left;
+	text-align: left;
+}
+
+#filters {
+	margin: 0;
+	padding: 0;
+	list-style: none;
+	position: absolute;
+	right: 0;
+	left: 0;
+}
+
+#filters li {
+	display: inline;
+}
+
+#filters li a {
+	color: #83756f;
+	margin: 2px;
+	text-decoration: none;
+}
+
+#filters li a.selected {
+	font-weight: bold;
+}
+
+#clear-completed {
+	float: right;
+	position: relative;
+	line-height: 20px;
+	text-decoration: none;
+	background: rgba(0, 0, 0, 0.1);
+	font-size: 11px;
+	padding: 0 10px;
+	border-radius: 3px;
+	box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.2);
+}
+
+#clear-completed:hover {
+	background: rgba(0, 0, 0, 0.15);
+	box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.3);
+}
+
+#info {
+	margin: 65px auto 0;
+	color: #a6a6a6;
+	font-size: 12px;
+	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
+	text-align: center;
+}
+
+#info a {
+	color: inherit;
+}
+
+/*
+	Hack to remove background from Mobile Safari.
+	Can't use it globally since it destroys checkboxes in Firefox and Opera
+*/
+@media screen and (-webkit-min-device-pixel-ratio:0) {
+	#toggle-all,
+	#todo-list li .toggle {
+		background: none;
+	}
+
+	#todo-list li .toggle {
+		height: 40px;
+	}
+
+	#toggle-all {
+		top: -56px;
+		left: -15px;
+		width: 65px;
+		height: 41px;
+		-webkit-transform: rotate(90deg);
+		transform: rotate(90deg);
+		-webkit-appearance: none;
+		appearance: none;
+	}
+}
+
+.hidden{
+	display:none;
+}

labs/architecture-examples/batman/components/todomvc-common/base.js

+(function () {
+	'use strict';
+
+	if (location.hostname === 'todomvc.com') {
+		window._gaq = [['_setAccount','UA-31081062-1'],['_trackPageview']];(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.src='//www.google-analytics.com/ga.js';s.parentNode.insertBefore(g,s)}(document,'script'));
+	}
+
+	function getSourcePath() {
+		// If accessed via addyosmani.github.io/todomvc/, strip the project path.
+		if (location.hostname.indexOf('github.io') > 0) {
+			return location.pathname.replace(/todomvc\//, '');
+		}
+		return location.pathname;
+	}
+
+	function appendSourceLink() {
+		var sourceLink = document.createElement('a');
+		var paragraph = document.createElement('p');
+		var footer = document.getElementById('info');
+		var urlBase = 'https://github.com/addyosmani/todomvc/tree/gh-pages';
+
+		if (footer) {
+			sourceLink.href = urlBase + getSourcePath();
+			sourceLink.appendChild(document.createTextNode('Check out the source'));
+			paragraph.appendChild(sourceLink);
+			footer.appendChild(paragraph);
+		}
+	}
+
+	function redirect() {
+		if (location.hostname === 'addyosmani.github.io') {
+			location.href = location.href.replace('addyosmani.github.io/todomvc', 'todomvc.com');
+		}
+	}
+
+	appendSourceLink();
+	redirect();
+})();

labs/architecture-examples/batman/index.html

@@ -4,10 +4,7 @@
 	<meta charset="utf-8">
 	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 	<title>Batman • TodoMVC</title>
-	<link rel="stylesheet" href="../../../assets/base.css">
-	<!--[if IE]>
-	<script src="../../../assets/ie.js"></script>
-	<![endif]-->
+	<link rel="stylesheet" href="components/todomvc-common/base.css">
 </head>
 <body>
 	<div data-yield="main"></div>
@@ -66,8 +63,8 @@
 			<p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
 		</footer>
 	</div>
-	<script src="../../../assets/base.js"></script>
-	<script src="js/lib/batman.min.js"></script>
-	<script src="js/app.js"></script>
+	<script src="components/todomvc-common/base.js"></script>
+	<script src="components/batman/lib/dist/batman.js"></script>
+	<script src="app.js"></script>
 </body>
 </html>

labs/architecture-examples/batman/js/app.coffee

-class Alfred extends Batman.App
-  @root 'todos#all'
-  @route '/completed', 'todos#completed'
-  @route '/active', 'todos#active'
-
-class Alfred.TodosController extends Batman.Controller
-  constructor: ->
-    super
-    @set('newTodo', new Alfred.Todo(completed: false))
-
-  routingKey: 'todos'
-  currentTodoSet: 'all'
-
-  @accessor 'currentTodos', -> Alfred.Todo.get(@get('currentTodoSet'))
-
-  all: ->
-    @set('currentTodoSet', 'all')
-
-  completed: ->
-    @set 'currentTodoSet', 'completed'
-    @render(source: 'todos/all')
-
-  active: ->
-    @set 'currentTodoSet', 'active'
-    @render(source: 'todos/all')
-
-  createTodo: ->
-    @get('newTodo').save (err, todo) =>
-      if err
-        throw err unless err instanceof Batman.ErrorsSet
-      else
-        @set 'newTodo', new Alfred.Todo(completed: false, title: "")
-
-  todoDoneChanged: (node, event, context) ->
-    todo = context.get('todo')
-    todo.save (err) ->
-      throw err if err && !err instanceof Batman.ErrorsSet
-
-  destroyTodo: (node, event, context) ->
-    todo = context.get('todo')
-    todo.destroy (err) -> throw err if err
-
-  toggleAll: (node, context) ->
-    Alfred.Todo.get('all').forEach (todo) ->
-      todo.set('completed', !!node.checked)
-      todo.save (err) ->
-        throw err if err && !err instanceof Batman.ErrorsSet
-
-  clearCompleted: ->
-    Alfred.Todo.get('completed').forEach (todo) ->
-      todo.destroy (err) -> throw err if err
-
-  toggleEditing: (node, event, context) ->
-    todo = context.get('todo')
-    editing = todo.set('editing', !todo.get('editing'))
-    if editing
-      input = document.getElementById("todo-input-#{todo.get('id')}")
-      input.focus()
-    else
-      if todo.get('title')?.length > 0
-        todo.save (err, todo) ->
-          throw err if err && !err instanceof Batman.ErrorsSet
-      else
-        todo.destroy (err, todo) ->
-          throw err if err
-
-  disableEditingUponSubmit: (node, event, context) ->
-    if Batman.DOM.events.isEnter(event)
-      @toggleEditing(node, event, context)
-
-class Alfred.Todo extends Batman.Model
-  @encode 'title', 'completed'
-  @persist Batman.LocalStorage
-  @validate 'title', presence: true
-  @storageKey: 'todos-batman'
-
-  @classAccessor 'active', ->
-    @get('all').filter (todo) -> !todo.get('completed')
-
-  @classAccessor 'completed', ->
-    @get('all').filter (todo) -> todo.get('completed')
-
-  @wrapAccessor 'title', (core) ->
-    set: (key, value) -> core.set.call(@, key, value?.trim())
-
-window.Alfred = Alfred
-Alfred.run()

labs/architecture-examples/batman/js/app.js

-var Alfred,
-  __hasProp = {}.hasOwnProperty,
-  __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
-
-Alfred = (function(_super) {
-
-  __extends(Alfred, _super);
-
-  function Alfred() {
-    return Alfred.__super__.constructor.apply(this, arguments);
-  }
-
-  Alfred.root('todos#all');
-
-  Alfred.route('/completed', 'todos#completed');
-
-  Alfred.route('/active', 'todos#active');
-
-  return Alfred;
-
-})(Batman.App);
-
-Alfred.TodosController = (function(_super) {
-
-  __extends(TodosController, _super);
-
-  function TodosController() {
-    TodosController.__super__.constructor.apply(this, arguments);
-    this.set('newTodo', new Alfred.Todo({
-      completed: false
-    }));
-  }
-
-  TodosController.prototype.routingKey = 'todos';
-
-  TodosController.prototype.currentTodoSet = 'all';
-
-  TodosController.accessor('currentTodos', function() {
-    return Alfred.Todo.get(this.get('currentTodoSet'));
-  });
-
-  TodosController.prototype.all = function() {
-    return this.set('currentTodoSet', 'all');
-  };
-
-  TodosController.prototype.completed = function() {
-    this.set('currentTodoSet', 'completed');
-    return this.render({
-      source: 'todos/all'
-    });
-  };
-
-  TodosController.prototype.active = function() {
-    this.set('currentTodoSet', 'active');
-    return this.render({
-      source: 'todos/all'
-    });
-  };
-
-  TodosController.prototype.createTodo = function() {
-    var _this = this;
-    return this.get('newTodo').save(function(err, todo) {
-      if (err) {
-        if (!(err instanceof Batman.ErrorsSet)) {
-          throw err;
-        }
-      } else {
-        return _this.set('newTodo', new Alfred.Todo({
-          completed: false,
-          title: ""
-        }));
-      }
-    });
-  };
-
-  TodosController.prototype.todoDoneChanged = function(node, event, context) {
-    var todo;
-    todo = context.get('todo');
-    return todo.save(function(err) {
-      if (err && !err instanceof Batman.ErrorsSet) {
-        throw err;
-      }
-    });
-  };
-
-  TodosController.prototype.destroyTodo = function(node, event, context) {
-    var todo;
-    todo = context.get('todo');
-    return todo.destroy(function(err) {
-      if (err) {
-        throw err;
-      }
-    });
-  };
-
-  TodosController.prototype.toggleAll = function(node, context) {
-    return Alfred.Todo.get('all').forEach(function(todo) {
-      todo.set('completed', !!node.checked);
-      return todo.save(function(err) {
-        if (err && !err instanceof Batman.ErrorsSet) {
-          throw err;
-        }
-      });
-    });
-  };
-
-  TodosController.prototype.clearCompleted = function() {
-    return Alfred.Todo.get('completed').forEach(function(todo) {
-      return todo.destroy(function(err) {
-        if (err) {
-          throw err;
-        }
-      });
-    });
-  };
-
-  TodosController.prototype.toggleEditing = function(node, event, context) {
-    var editing, input, todo, _ref;
-    todo = context.get('todo');
-    editing = todo.set('editing', !todo.get('editing'));
-    if (editing) {
-      input = document.getElementById("todo-input-" + (todo.get('id')));
-      return input.focus();
-    } else {
-      if (((_ref = todo.get('title')) != null ? _ref.length : void 0) > 0) {
-        return todo.save(function(err, todo) {
-          if (err && !err instanceof Batman.ErrorsSet) {
-            throw err;
-          }
-        });
-      } else {
-        return todo.destroy(function(err, todo) {
-          if (err) {
-            throw err;
-          }
-        });
-      }
-    }
-  };
-
-  TodosController.prototype.disableEditingUponSubmit = function(node, event, context) {
-    if (Batman.DOM.events.isEnter(event)) {
-      return this.toggleEditing(node, event, context);
-    }
-  };
-
-  return TodosController;
-
-})(Batman.Controller);
-
-Alfred.Todo = (function(_super) {
-
-  __extends(Todo, _super);
-
-  function Todo() {
-    return Todo.__super__.constructor.apply(this, arguments);
-  }
-
-  Todo.encode('title', 'completed');
-
-  Todo.persist(Batman.LocalStorage);
-
-  Todo.validate('title', {
-    presence: true
-  });
-
-  Todo.storageKey = 'todos-batman';
-
-  Todo.classAccessor('active', function() {
-    return this.get('all').filter(function(todo) {
-      return !todo.get('completed');
-    });
-  });
-
-  Todo.classAccessor('completed', function() {
-    return this.get('all').filter(function(todo) {
-      return todo.get('completed');
-    });
-  });
-
-  Todo.wrapAccessor('title', function(core) {
-    return {
-      set: function(key, value) {
-        return core.set.call(this, key, value != null ? value.trim() : void 0);
-      }
-    };
-  });
-
-  return Todo;
-
-})(Batman.Model);
-
-window.Alfred = Alfred;
-
-Alfred.run();

labs/architecture-examples/batman/package.json

+{
+  "name": "todomvc-batman",
+  "description": "TodoMVC todo app using batman.js",
+  "version": "0.0.0",
+  "dependencies": {},
+  "devDependencies": {
+    "coffee-script": "~1.6.2"
+  },
+  "scripts": {
+    "compile": "coffee -c app.coffee"
+  },
+  "private": true
+}

labs/architecture-examples/batman/readme.md

 # Batman TodoMVC app
 
-A todo app built using [Batman](http://batmanjs.org)
+> [Batman.js](http://batmanjs.org/) is a framework for building rich web applications with CoffeeScript.
 
 
-## Run
+## Persistence
 
-Spin up an HTTP server and visit http://localhost/labs/architecture-examples/batman/
+This app uses `Batman.LocalStorage` to persist the Todo records across page reloads. Batman's `localStorage` engine sticks each record under it's own key in `localStorage`, which is a departure from the TodoMVC application specification, which asks that all the records are stored under one key as a big blob. Batman stores records this way so that the whole set doesn't need to be parsed just to find one record or check if that record exists.
 
 
-## Persistence
+## Build
 
-A quick note: This app uses `Batman.LocalStorage` to persist the Todo records across page reloads. Batman's `localStorage` engine sticks each record under it's own key in `localStorage`, which is a departure from the TodoMVC application specification, which asks that all the records are stored under one key as a big blob. Batman stores records this way so that the whole set doesn't need to be parsed just to find one record or check if that record exists.
+This app is written in [CoffeeScript](http://coffeescript.org/). If you wish to make changes, follow these steps to re-compile the code.
 
+If you would like to install CoffeeScript globally:
 
-## Build
+	npm install -g coffee-script
+
+If you wish to install CoffeeScript just for the purposes of this app:
+
+	# from labs/architecture-examples/batman:
+	npm install
+
+Once CoffeeScript is installed:
 
-This app is written in CoffeeScript, so to make changes, please edit `js/app.coffee` and rebuild the JavaScript with the `coffee` compiler.
+	# from labs/architecture-examples/batman:
+	npm run-script compile