diff --git a/dependency-examples/flight/app/js/app.js b/dependency-examples/flight/app/js/app.js index 8adf5b2d5d..e3ed21d75a 100644 --- a/dependency-examples/flight/app/js/app.js +++ b/dependency-examples/flight/app/js/app.js @@ -1,38 +1,26 @@ /*global define */ 'use strict'; -define( - [ - './data/todos', - './data/stats', - './ui/new_item', - './ui/todo_list', - './ui/stats', - './ui/main_selector', - './ui/toggle_all' - ], +define([ + './data/todos', + './data/stats', + './ui/new_item', + './ui/todo_list', + './ui/stats', + './ui/main_selector', + './ui/toggle_all' +], function (TodosData, StatsData, NewItemUI, TodoListUI, StatsUI, MainSelectorUI, ToggleAllUI) { + var initialize = function () { + StatsData.attachTo(document); + TodosData.attachTo(document); + NewItemUI.attachTo('#new-todo'); + MainSelectorUI.attachTo('#main'); + StatsUI.attachTo('#footer'); + ToggleAllUI.attachTo('#toggle-all'); + TodoListUI.attachTo('#todo-list'); + }; - function ( - TodosData, - StatsData, - NewItemUI, - TodoListUI, - StatsUI, - MainSelectorUI, - ToggleAllUI) { - - var initialize = function () { - StatsData.attachTo(document); - TodosData.attachTo(document); - NewItemUI.attachTo('#new-todo'); - MainSelectorUI.attachTo('#main'); - StatsUI.attachTo('#footer'); - ToggleAllUI.attachTo('#toggle-all'); - TodoListUI.attachTo('#todo-list'); - }; - - return { - initialize: initialize - }; - } -); + return { + initialize: initialize + }; +}); diff --git a/dependency-examples/flight/app/js/data/stats.js b/dependency-examples/flight/app/js/data/stats.js index f2fa4c19f0..129367cb45 100644 --- a/dependency-examples/flight/app/js/data/stats.js +++ b/dependency-examples/flight/app/js/data/stats.js @@ -1,39 +1,35 @@ /*global define */ 'use strict'; -define( - [ - 'flight/component', - '../store' - ], +define([ + 'flight/component', + '../store' +], function (defineComponent, dataStore) { + function stats() { + this.recount = function () { + var todos = dataStore.all(); + var all = todos.length; + var remaining = todos.reduce(function (memo, each) { + return memo += each.completed ? 0 : 1; + }, 0); - function (defineComponent, dataStore) { - return defineComponent(stats); + this.trigger('dataStatsCounted', { + all: all, + remaining: remaining, + completed: all - remaining, + filter: localStorage.getItem('filter') || '' + }); + }; - function stats() { - this.recount = function () { - var todos = dataStore.all(); - var all = todos.length; - var remaining = todos.reduce(function (memo, each) { - return memo += each.completed ? 0 : 1; - }, 0); + this.after('initialize', function () { + this.on(document, 'dataTodosLoaded', this.recount); + this.on(document, 'dataTodoAdded', this.recount); + this.on(document, 'dataTodoRemoved', this.recount); + this.on(document, 'dataTodoToggled', this.recount); + this.on(document, 'dataClearedCompleted', this.recount); + this.on(document, 'dataTodoToggledAll', this.recount); + }); + } - this.trigger('dataStatsCounted', { - all: all, - remaining: remaining, - completed: all - remaining, - filter: localStorage.getItem('filter') || '' - }); - }; - - this.after('initialize', function () { - this.on(document, 'dataTodosLoaded', this.recount); - this.on(document, 'dataTodoAdded', this.recount); - this.on(document, 'dataTodoRemoved', this.recount); - this.on(document, 'dataTodoToggled', this.recount); - this.on(document, 'dataClearedCompleted', this.recount); - this.on(document, 'dataTodoToggledAll', this.recount); - }); - } - } -); + return defineComponent(stats); +}); diff --git a/dependency-examples/flight/app/js/data/todos.js b/dependency-examples/flight/app/js/data/todos.js index 8eb7e2ad2f..5daf4d417f 100644 --- a/dependency-examples/flight/app/js/data/todos.js +++ b/dependency-examples/flight/app/js/data/todos.js @@ -1,105 +1,99 @@ /*global define */ 'use strict'; -define( - [ - 'flight/component', - '../store' - ], - - function (defineComponent, dataStore) { - return defineComponent(todos); - - function todos() { - var filter; - - this.add = function (e, data) { - var todo = dataStore.save({ - title: data.title, - completed: false - }); - - this.trigger('dataTodoAdded', { todo: todo, filter: filter }); - }; - - this.remove = function (e, data) { - var todo = dataStore.destroy(data.id); - - this.trigger('dataTodoRemoved', todo); - }; +define([ + 'flight/component', + '../store' +], function (defineComponent, dataStore) { + function todos() { + var filter; + + this.add = function (e, data) { + var todo = dataStore.save({ + title: data.title, + completed: false + }); - this.load = function (e, data) { - var todos; + this.trigger('dataTodoAdded', { todo: todo, filter: filter }); + }; - filter = localStorage.getItem('filter'); - todos = this.find(); - this.trigger('dataTodosLoaded', { todos: todos }); - }; + this.remove = function (e, data) { + var todo = dataStore.destroy(data.id); - this.update = function (e, data) { - dataStore.save(data); - }; + this.trigger('dataTodoRemoved', todo); + }; - this.toggleCompleted = function (e, data) { - var eventType; - var todo = dataStore.get(data.id); + this.load = function () { + var todos; - todo.completed = !todo.completed; - dataStore.save(todo); + filter = localStorage.getItem('filter'); + todos = this.find(); + this.trigger('dataTodosLoaded', { todos: todos }); + }; - eventType = filter ? 'dataTodoRemoved' : 'dataTodoToggled'; + this.update = function (e, data) { + dataStore.save(data); + }; - this.trigger(eventType, todo); - }; + this.toggleCompleted = function (e, data) { + var eventType; + var todo = dataStore.get(data.id); - this.toggleAllCompleted = function (e, data) { - dataStore.updateAll({ completed: data.completed }); - this.trigger('dataTodoToggledAll', { todos: this.find(filter) }); - }; + todo.completed = !todo.completed; + dataStore.save(todo); - this.filter = function (e, data) { - var todos; + eventType = filter ? 'dataTodoRemoved' : 'dataTodoToggled'; - localStorage.setItem('filter', data.filter); - filter = data.filter; - todos = this.find(); + this.trigger(eventType, todo); + }; - this.trigger('dataTodosFiltered', { todos: todos }); - }; + this.toggleAllCompleted = function (e, data) { + dataStore.updateAll({ completed: data.completed }); + this.trigger('dataTodoToggledAll', { todos: this.find(filter) }); + }; - this.find = function () { - var todos; + this.filter = function (e, data) { + var todos; - if (filter) { - todos = dataStore.find(function (each) { - return (typeof each[filter] !== 'undefined') ? each.completed : !each.completed; - }); - } - else { - todos = dataStore.all(); - } + localStorage.setItem('filter', data.filter); + filter = data.filter; + todos = this.find(); - return todos; - }; + this.trigger('dataTodosFiltered', { todos: todos }); + }; - this.clearCompleted = function () { - var todos; + this.find = function () { + var todos; - dataStore.destroyAll({ completed: true }); + if (filter) { + todos = dataStore.find(function (each) { + return (typeof each[filter] !== 'undefined') ? each.completed : !each.completed; + }); + } else { todos = dataStore.all(); - this.trigger('dataClearedCompleted', { todos: todos }); - }; - - this.after('initialize', function () { - this.on(document, 'uiAddRequested', this.add); - this.on(document, 'uiUpdateRequested', this.update); - this.on(document, 'uiRemoveRequested', this.remove); - this.on(document, 'uiLoadRequested', this.load); - this.on(document, 'uiToggleRequested', this.toggleCompleted); - this.on(document, 'uiToggleAllRequested', this.toggleAllCompleted); - this.on(document, 'uiClearRequested', this.clearCompleted); - this.on(document, 'uiFilterRequested', this.filter); - }); - } + } + + return todos; + }; + + this.clearCompleted = function () { + dataStore.destroyAll({ completed: true }); + + this.trigger('uiFilterRequested', { filter: filter }); + this.trigger('dataClearedCompleted'); + }; + + this.after('initialize', function () { + this.on(document, 'uiAddRequested', this.add); + this.on(document, 'uiUpdateRequested', this.update); + this.on(document, 'uiRemoveRequested', this.remove); + this.on(document, 'uiLoadRequested', this.load); + this.on(document, 'uiToggleRequested', this.toggleCompleted); + this.on(document, 'uiToggleAllRequested', this.toggleAllCompleted); + this.on(document, 'uiClearRequested', this.clearCompleted); + this.on(document, 'uiFilterRequested', this.filter); + }); } -); + + return defineComponent(todos); +}); diff --git a/dependency-examples/flight/app/js/store.js b/dependency-examples/flight/app/js/store.js index 20a93c2f6f..e9ab55ddae 100644 --- a/dependency-examples/flight/app/js/store.js +++ b/dependency-examples/flight/app/js/store.js @@ -1,11 +1,9 @@ -'use strict'; +/*global define */ -define( - [ - 'depot' - ], +'use strict'; - function (depot) { - return depot('todos', { idAttribute: 'id' }); - } -); +define([ + 'depot' +], function (depot) { + return depot('todos', { idAttribute: 'id' }); +}); diff --git a/dependency-examples/flight/app/js/ui/main_selector.js b/dependency-examples/flight/app/js/ui/main_selector.js index 6fd71b62c8..fd8d7927c9 100644 --- a/dependency-examples/flight/app/js/ui/main_selector.js +++ b/dependency-examples/flight/app/js/ui/main_selector.js @@ -1,24 +1,20 @@ /*global define */ 'use strict'; -define( - [ - 'flight/component' - ], +define([ + 'flight/component' +], function (defineComponent) { + function mainSelector() { + this.toggle = function (e, data) { + var toggle = data.all > 0; + this.$node.toggle(toggle); + }; - function (defineComponent) { - return defineComponent(mainSelector); - - function mainSelector() { - this.toggle = function (e, data) { - var toggle = data.all > 0; - this.$node.toggle(toggle); - }; - - this.after('initialize', function () { - this.$node.hide(); - this.on(document, 'dataStatsCounted', this.toggle); - }); - } + this.after('initialize', function () { + this.$node.hide(); + this.on(document, 'dataStatsCounted', this.toggle); + }); } -); + + return defineComponent(mainSelector); +}); diff --git a/dependency-examples/flight/app/js/ui/new_item.js b/dependency-examples/flight/app/js/ui/new_item.js index f4b71d7028..a86bb55ba5 100644 --- a/dependency-examples/flight/app/js/ui/new_item.js +++ b/dependency-examples/flight/app/js/ui/new_item.js @@ -1,33 +1,29 @@ /*global define */ 'use strict'; -define( - [ - 'flight/component' - ], +define([ + 'flight/component' +], function (defineComponent) { + function newItem() { + var ENTER_KEY = 13; - function (defineComponent) { - return defineComponent(newItem); + this.createOnEnter = function (e) { + if (e.which !== ENTER_KEY || + !this.$node.val().trim()) { + return; + } - function newItem() { - var ENTER_KEY = 13; - - this.createOnEnter = function (e) { - if (e.which !== ENTER_KEY || - !this.$node.val().trim()) { - return; - } - - this.trigger('uiAddRequested', { - title: this.$node.val().trim() - }); + this.trigger('uiAddRequested', { + title: this.$node.val().trim() + }); - this.$node.val(''); - }; + this.$node.val(''); + }; - this.after('initialize', function () { - this.on('keydown', this.createOnEnter); - }); - } + this.after('initialize', function () { + this.on('keydown', this.createOnEnter); + }); } -); + + return defineComponent(newItem); +}); diff --git a/dependency-examples/flight/app/js/ui/stats.js b/dependency-examples/flight/app/js/ui/stats.js index 9a91706ec7..e11db2c025 100644 --- a/dependency-examples/flight/app/js/ui/stats.js +++ b/dependency-examples/flight/app/js/ui/stats.js @@ -1,41 +1,37 @@ /*global define */ 'use strict'; -define( - [ - 'flight/component', - './with_filters', - 'text!app/templates/stats.html', - '../utils' - ], - - function (defineComponent, withFilters, statsTmpl, utils) { - return defineComponent(stats, withFilters); - - function stats() { - var template = utils.tmpl(statsTmpl); - - this.defaultAttrs({ - clearCompletedSelector: '#clear-completed' - }); - - this.render = function (e, data) { - var toggle = data.all > 0; - - this.$node.html(template(data)); - this.$node.toggle(toggle); - this.markSelected(data.filter); - }; - - this.clearCompleted = function (e, data) { - this.trigger('uiClearRequested'); - }; - - this.after('initialize', function () { - this.$node.hide(); - this.on(document, 'dataStatsCounted', this.render); - this.on('click', { 'clearCompletedSelector': this.clearCompleted }); - }); - } +define([ + 'flight/component', + './with_filters', + 'text!app/templates/stats.html', + '../utils' +], function (defineComponent, withFilters, statsTmpl, utils) { + function stats() { + var template = utils.tmpl(statsTmpl); + + this.defaultAttrs({ + clearCompletedSelector: '#clear-completed' + }); + + this.render = function (e, data) { + var toggle = data.all > 0; + + this.$node.html(template(data)); + this.$node.toggle(toggle); + this.markSelected(data.filter); + }; + + this.clearCompleted = function () { + this.trigger('uiClearRequested'); + }; + + this.after('initialize', function () { + this.$node.hide(); + this.on(document, 'dataStatsCounted', this.render); + this.on('click', { 'clearCompletedSelector': this.clearCompleted }); + }); } -); + + return defineComponent(stats, withFilters); +}); diff --git a/dependency-examples/flight/app/js/ui/todo_list.js b/dependency-examples/flight/app/js/ui/todo_list.js index 9b5588bd40..6e0f9fab57 100644 --- a/dependency-examples/flight/app/js/ui/todo_list.js +++ b/dependency-examples/flight/app/js/ui/todo_list.js @@ -1,113 +1,108 @@ -/*global define $ */ +/*global define, $ */ 'use strict'; -define( - [ - 'flight/component', - 'text!app/templates/todo.html', - '../utils' - ], - - function (defineComponent, todoTmpl, utils) { - return defineComponent(todoList); - - function todoList() { - var ENTER_KEY = 13; - var template = utils.tmpl(todoTmpl); - - this.defaultAttrs({ - destroySelector: 'button.destroy', - toggleSelector: 'input.toggle', - labelSelector: 'label', - editSelector: '.edit' - }); - - this.renderAll = function (e, data) { - this.$node.html(''); - data.todos.forEach(function (each) { - this.render(e, { todo: each }); - }, this); - }; - - this.render = function (e, data) { - if (e.type === 'dataTodoAdded' && data.filter === 'completed') { - return; - } - - this.$node.append(template(data.todo)); - }; - - this.edit = function (e, data) { - var $todoEl = $(data.el).parents('li'); - - $todoEl.addClass('editing'); - this.select('editSelector').focus(); - }; - - this.requestUpdate = function (e, data) { - var $inputEl = $(e.currentTarget); - var $todoEl = $inputEl.parents('li'); - var value = $inputEl.val().trim(); - var id = $todoEl.attr('id'); - - if (!$todoEl.hasClass('editing')) { - return; - } - - !$todoEl.removeClass('editing'); - - if (value) { - $todoEl.find('label').html(value); - this.trigger('uiUpdateRequested', { id: id, title: value }); - } else { - this.trigger('uiRemoveRequested', { id: id }); - } - }; - - this.requestUpdateOnEnter = function (e, data) { - if (e.which === ENTER_KEY) { - this.requestUpdate(e, data); - } - }; - - this.requestRemove = function (e, data) { - var id = $(data.el).attr('id').split('_')[1]; +define([ + 'flight/component', + 'text!app/templates/todo.html', + '../utils' +], function (defineComponent, todoTmpl, utils) { + function todoList() { + var ENTER_KEY = 13; + var template = utils.tmpl(todoTmpl); + + this.defaultAttrs({ + destroySelector: 'button.destroy', + toggleSelector: 'input.toggle', + labelSelector: 'label', + editSelector: '.edit' + }); + + this.renderAll = function (e, data) { + this.$node.html(''); + data.todos.forEach(function (each) { + this.render(e, { todo: each }); + }, this); + }; + + this.render = function (e, data) { + if (e.type === 'dataTodoAdded' && data.filter === 'completed') { + return; + } + + this.$node.append(template(data.todo)); + }; + + this.edit = function (e, data) { + var $todoEl = $(data.el).parents('li'); + + $todoEl.addClass('editing'); + this.select('editSelector').focus(); + }; + + this.requestUpdate = function (e) { + var $inputEl = $(e.currentTarget); + var $todoEl = $inputEl.parents('li'); + var value = $inputEl.val().trim(); + var id = $todoEl.attr('id'); + + if (!$todoEl.hasClass('editing')) { + return; + } + + $todoEl.removeClass('editing'); + + if (value) { + $todoEl.find('label').html(value); + this.trigger('uiUpdateRequested', { id: id, title: value }); + } else { this.trigger('uiRemoveRequested', { id: id }); - }; - - this.remove = function (e, data) { - var $todoEl = this.$node.find('#' + data.id); - $todoEl.remove(); - }; - - this.toggle = function (e, data) { - var $todoEl = $(data.el).parents('li'); - - $todoEl.toggleClass('completed'); - this.trigger('uiToggleRequested', { id: $todoEl.attr('id') }); - }; - - this.after('initialize', function () { - this.on(document, 'dataTodoAdded', this.render); - this.on(document, 'dataTodosLoaded', this.renderAll); - this.on(document, 'dataTodosFiltered', this.renderAll); - this.on(document, 'dataClearedCompleted', this.renderAll); - this.on(document, 'dataTodoToggledAll', this.renderAll); - this.on(document, 'dataTodoRemoved', this.remove); - - this.on('click', { 'destroySelector': this.requestRemove }); - this.on('click', { 'toggleSelector': this.toggle }); - this.on('dblclick', { 'labelSelector': this.edit }); - - this.$node.on('blur', '.edit', this.bind(this.requestUpdate)); - this.$node.on('keydown', '.edit', this.bind(this.requestUpdateOnEnter)); - - // these don't work - // this.on(this.attr.editSelector, 'blur', this.requestUpdate); - // this.on('blur', { 'editSelector': this.requestUpdate }); - - this.trigger('uiLoadRequested'); - }); - } + } + }; + + this.requestUpdateOnEnter = function (e, data) { + if (e.which === ENTER_KEY) { + this.requestUpdate(e, data); + } + }; + + this.requestRemove = function (e, data) { + var id = $(data.el).attr('id').split('_')[1]; + this.trigger('uiRemoveRequested', { id: id }); + }; + + this.remove = function (e, data) { + var $todoEl = this.$node.find('#' + data.id); + $todoEl.remove(); + }; + + this.toggle = function (e, data) { + var $todoEl = $(data.el).parents('li'); + + $todoEl.toggleClass('completed'); + this.trigger('uiToggleRequested', { id: $todoEl.attr('id') }); + }; + + this.after('initialize', function () { + this.on(document, 'dataTodoAdded', this.render); + this.on(document, 'dataTodosLoaded', this.renderAll); + this.on(document, 'dataTodosFiltered', this.renderAll); + this.on(document, 'dataTodoToggledAll', this.renderAll); + this.on(document, 'dataTodoRemoved', this.remove); + + this.on('click', { 'destroySelector': this.requestRemove }); + this.on('click', { 'toggleSelector': this.toggle }); + this.on('dblclick', { 'labelSelector': this.edit }); + + this.$node.on('blur', '.edit', this.bind(this.requestUpdate)); + this.$node.on('keydown', '.edit', this.bind(this.requestUpdateOnEnter)); + + // these don't work + // this.on(this.attr.editSelector, 'blur', this.requestUpdate); + // this.on('blur', { 'editSelector': this.requestUpdate }); + + this.trigger('uiLoadRequested'); + }); } -); + + return defineComponent(todoList); +}); diff --git a/dependency-examples/flight/app/js/ui/toggle_all.js b/dependency-examples/flight/app/js/ui/toggle_all.js index 927ce9c514..f4334dbaa0 100644 --- a/dependency-examples/flight/app/js/ui/toggle_all.js +++ b/dependency-examples/flight/app/js/ui/toggle_all.js @@ -1,29 +1,25 @@ /*global define */ 'use strict'; -define( - [ - 'flight/component' - ], - - function (defineComponent) { - return defineComponent(toggleAll); - - function toggleAll() { - this.toggleAllComplete = function () { - this.trigger('uiToggleAllRequested', { - completed: this.$node.is(':checked') - }); - }; +define([ + 'flight/component' +], function (defineComponent) { + function toggleAll() { + this.toggleAllComplete = function () { + this.trigger('uiToggleAllRequested', { + completed: this.$node.is(':checked') + }); + }; - this.toggleCheckbox = function (e, data) { - this.$node[0].checked = !data.remaining; - }; + this.toggleCheckbox = function (e, data) { + this.$node[0].checked = !data.remaining; + }; - this.after('initialize', function () { - this.on('click', this.toggleAllComplete); - this.on(document, 'dataStatsCounted', this.toggleCheckbox); - }); - } + this.after('initialize', function () { + this.on('click', this.toggleAllComplete); + this.on(document, 'dataStatsCounted', this.toggleCheckbox); + }); } -); + + return defineComponent(toggleAll); +}); diff --git a/dependency-examples/flight/app/js/ui/with_filters.js b/dependency-examples/flight/app/js/ui/with_filters.js index c6a4a949e0..ea7287b45c 100644 --- a/dependency-examples/flight/app/js/ui/with_filters.js +++ b/dependency-examples/flight/app/js/ui/with_filters.js @@ -1,28 +1,26 @@ -/*global define $ */ +/*global define, $ */ 'use strict'; -define( - function () { - return function withFilters() { - this.defaultAttrs({ - filterSelector: '#filters a' - }); +define(function () { + return function withFilters() { + this.defaultAttrs({ + filterSelector: '#filters a' + }); - this.chooseFilter = function (e, data) { - var filter = data.el.hash.slice(2); + this.chooseFilter = function (e, data) { + var filter = data.el.hash.slice(2); - this.select('filterSelector').removeClass('selected'); - $(data.el).addClass('selected'); - this.trigger('uiFilterRequested', { filter: filter }); - }; - - this.markSelected = function (filter) { - this.$node.find('[href="#/' + filter + '"]').addClass('selected'); - }; + this.select('filterSelector').removeClass('selected'); + $(data.el).addClass('selected'); + this.trigger('uiFilterRequested', { filter: filter }); + }; - this.after('initialize', function () { - this.on('click', { filterSelector: this.chooseFilter }); - }); + this.markSelected = function (filter) { + this.$node.find('[href="#/' + filter + '"]').addClass('selected'); }; - } -); + + this.after('initialize', function () { + this.on('click', { filterSelector: this.chooseFilter }); + }); + }; +}); diff --git a/dependency-examples/flight/app/js/utils.js b/dependency-examples/flight/app/js/utils.js index 89edf57731..ece412d4c8 100644 --- a/dependency-examples/flight/app/js/utils.js +++ b/dependency-examples/flight/app/js/utils.js @@ -4,7 +4,6 @@ // tmpl function scooped from underscore. // http://documentcloud.github.com/underscore/#template define(function () { - var _ = {}; // List of HTML entities for escaping. @@ -128,5 +127,7 @@ define(function () { return template; }; - return { tmpl: template }; + return { + tmpl: template + }; }); diff --git a/dependency-examples/flight/app/templates/stats.html b/dependency-examples/flight/app/templates/stats.html index 81dafe4357..c945aa54b6 100644 --- a/dependency-examples/flight/app/templates/stats.html +++ b/dependency-examples/flight/app/templates/stats.html @@ -1,4 +1,6 @@ -<%= remaining %> <%= remaining == 1 ? 'item' : 'items' %> left + + <%= remaining %> <%= remaining == 1 ? 'item' : 'items' %> left + <% if (completed) { %> - + <% } %>