Skip to content

Commit

Permalink
Merge pull request tastejs#552 from stephenplusplus/cujo_bower
Browse files Browse the repository at this point in the history
cujo updated to use bower.
  • Loading branch information
sindresorhus committed May 9, 2013
2 parents c08c83b + c9d80c1 commit ba32f91
Show file tree
Hide file tree
Showing 20 changed files with 580 additions and 116 deletions.
87 changes: 44 additions & 43 deletions labs/architecture-examples/cujo/app/controller.js
Original file line number Diff line number Diff line change
@@ -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 {
/**
Expand All @@ -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)) {
Expand All @@ -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);
});
Expand All @@ -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;
Expand All @@ -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;
}
}

});
2 changes: 1 addition & 1 deletion labs/architecture-examples/cujo/app/controls/strings.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/*global define */
define({
// TODO: Deal with singular vs. plural
itemsLeft: {
zero: '<strong></strong> items left',
one: '<strong></strong> item left',
Expand Down
21 changes: 12 additions & 9 deletions labs/architecture-examples/cujo/app/controls/structure.css
Original file line number Diff line number Diff line change
Expand Up @@ -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 */
13 changes: 0 additions & 13 deletions labs/architecture-examples/cujo/app/controls/template.html
Original file line number Diff line number Diff line change
@@ -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>
9 changes: 5 additions & 4 deletions labs/architecture-examples/cujo/app/create/cleanTodo.js
Original file line number Diff line number Diff line change
@@ -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;
}

};
});
32 changes: 17 additions & 15 deletions labs/architecture-examples/cujo/app/create/generateMetadata.js
Original file line number Diff line number Diff line change
@@ -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;
};
});
1 change: 1 addition & 0 deletions labs/architecture-examples/cujo/app/create/strings.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/*global define */
define({
title: 'todos',
todo: {
Expand Down
17 changes: 9 additions & 8 deletions labs/architecture-examples/cujo/app/create/validateTodo.js
Original file line number Diff line number Diff line change
@@ -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;
}

};
});
1 change: 1 addition & 0 deletions labs/architecture-examples/cujo/app/footer/strings.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/*global define */
define({
edit: 'Double-click to edit a todo',
templateBy: 'Template by',
Expand Down
7 changes: 4 additions & 3 deletions labs/architecture-examples/cujo/app/list/setCompletedClass.js
Original file line number Diff line number Diff line change
@@ -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' : '';
};

});
1 change: 1 addition & 0 deletions labs/architecture-examples/cujo/app/list/strings.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/*global define */
define({
markAll: 'Mark all as complete'
});
8 changes: 5 additions & 3 deletions labs/architecture-examples/cujo/app/list/structure.css
Original file line number Diff line number Diff line change
@@ -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;
}
4 changes: 2 additions & 2 deletions labs/architecture-examples/cujo/app/main.js
Original file line number Diff line number Diff line change
@@ -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' },
Expand Down Expand Up @@ -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' },
Expand Down
7 changes: 4 additions & 3 deletions labs/architecture-examples/cujo/app/run.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
(function( curl ) {
/*global curl */
(function (curl) {
'use strict';

var config = {
baseUrl: 'app',
Expand All @@ -17,5 +19,4 @@
};

curl(config, ['poly/string', 'poly/array']).next(['wire!main']);

})( curl );
})(curl);
Loading

0 comments on commit ba32f91

Please sign in to comment.