Skip to content

T
todomvc
Commit 48e183af authored by Pascal Hartig's avatar Pascal Hartig
Browse files
Options

olives: jshint style

parent ed62c2fa
Hide whitespace changes
Inline Side-by-side
Showing with 71 additions and 60 deletions
labs/architecture-examples/olives/js/app.js
View file @ 48e183af
(function( window ) {
/*jshint newcap:false*/
/*global require*/
(function () {
'use strict';
// These are the UIs that compose the Todo application
require([ 'Todos/Input', 'Todos/List', 'Todos/Controls', 'Olives/LocalStore', 'Store' ],
require(['Todos/Input', 'Todos/List', 'Todos/Controls', 'Olives/LocalStore', 'Store'],
// The application
function Todos( Input, List, Controls, LocalStore, Store ) {
function Todos(Input, List, Controls, LocalStore, Store) {
// The tasks Store is told to init on an array
// so tasks are indexed by a number
// This store is shared among several UIs of this application
......@@ -24,14 +27,14 @@
tasks.sync('todos-olives');
// Initialize Input UI by giving it a view and a model.
Input(document.querySelector('#header input'), tasks );
Input(document.querySelector('#header input'), tasks);
// Init the List UI the same way, pass it the stats store too
List(document.querySelector('#main'), tasks, stats );
List(document.querySelector('#main'), tasks, stats);
// Same goes for the control UI
Controls(document.querySelector('#footer'), tasks, stats );
Controls(document.querySelector('#footer'), tasks, stats);
});
})( window );
}());
labs/architecture-examples/olives/js/uis/Controls.js
View file @ 48e183af
define( 'Todos/Controls',
/*global define*/
[ 'Olives/OObject', 'Olives/Event-plugin', 'Olives/Model-plugin', 'Olives/LocalStore', 'Todos/Tools' ],
define('Todos/Controls',
['Olives/OObject', 'Olives/Event-plugin', 'Olives/Model-plugin', 'Olives/LocalStore', 'Todos/Tools'],
// The Controls UI
function Controls( OObject, EventPlugin, ModelPlugin, Store, Tools ) {
function Controls(OObject, EventPlugin, ModelPlugin, Store, Tools) {
'use strict';
return function ControlsInit( view, model, stats ) {
return function ControlsInit(view, model, stats) {
// The OObject (the controller) inits with a default model which is a simple store
// But it can be init'ed with any other store, like the LocalStore
var controls = new OObject(model),
......@@ -13,8 +16,8 @@ function Controls( OObject, EventPlugin, ModelPlugin, Store, Tools ) {
// A function to get the completed tasks
getCompleted = function () {
var completed = [];
model.loop(function ( value, id ) {
if ( value.completed ) {
model.loop(function (value, id) {
if (value.completed) {
completed.push(id);
}
});
......@@ -25,32 +28,32 @@ function Controls( OObject, EventPlugin, ModelPlugin, Store, Tools ) {
updateStats = function () {
var nbCompleted = getCompleted().length;
stats.set( 'nbItems', model.getNbItems() );
stats.set( 'nbLeft', stats.get('nbItems') - nbCompleted );
stats.set( 'nbCompleted', nbCompleted );
stats.set( 'plural', stats.get('nbLeft') === 1 ? 'item' : 'items' );
stats.set('nbItems', model.getNbItems());
stats.set('nbLeft', stats.get('nbItems') - nbCompleted);
stats.set('nbCompleted', nbCompleted);
stats.set('plural', stats.get('nbLeft') === 1 ? 'item' : 'items');
};
// Add plugins to the UI.
controls.plugins.addAll({
'event': new EventPlugin( controls ),
'stats': new ModelPlugin( stats, {
'event': new EventPlugin(controls),
'stats': new ModelPlugin(stats, {
'toggleClass': Tools.toggleClass
})
});
// Alive applies the plugins to the HTML view
controls.alive( view );
controls.alive(view);
// Delete all tasks
controls.delAll = function () {
model.delAll( getCompleted() );
model.delAll(getCompleted());
};
// Update stats when the tasks list is modified
model.watch( 'added', updateStats );
model.watch( 'deleted', updateStats );
model.watch( 'updated', updateStats );
model.watch('added', updateStats);
model.watch('deleted', updateStats);
model.watch('updated', updateStats);
// I could either update stats at init or save them in a localStore
updateStats();
......
labs/architecture-examples/olives/js/uis/Input.js
View file @ 48e183af
/*global define*/
// It's going to be called Input
define( 'Todos/Input',
define('Todos/Input',
// It uses the Olives' OObject and the Event Plugin to listen to dom events and connect them to methods
[ 'Olives/OObject', 'Olives/Event-plugin' ],
['Olives/OObject', 'Olives/Event-plugin'],
// The Input UI
function Input( OObject, EventPlugin ) {
function Input(OObject, EventPlugin) {
'use strict';
// It returns an init function
return function InputInit( view, model ) {
return function InputInit(view, model) {
// The OObject (the controller) inits with a default model which is a simple store
// But it can be init'ed with any other store, like the LocalStore
var input = new OObject( model ),
var input = new OObject(model),
ENTER_KEY = 13;
// The event plugin that is added to the OObject
// We have to tell it where to find the methods
input.plugins.add( 'event', new EventPlugin(input) );
input.plugins.add('event', new EventPlugin(input));
// The method to add a new taks
input.addTask = function addTask( event, node ) {
if ( event.keyCode === ENTER_KEY && node.value.trim() ) {
model.alter( 'push', {
input.addTask = function addTask(event, node) {
if (event.keyCode === ENTER_KEY && node.value.trim()) {
model.alter('push', {
title: node.value.trim(),
completed: false
});
......@@ -31,6 +34,6 @@ function Input( OObject, EventPlugin ) {
};
// Alive applies the plugins to the HTML view
input.alive( view );
input.alive(view);
};
});
labs/architecture-examples/olives/js/uis/List.js
View file @ 48e183af
define( 'Todos/List',
/*global define*/
define('Todos/List',
[ 'Olives/OObject', 'Olives/Event-plugin', 'Olives/Model-plugin', 'Todos/Tools' ],
['Olives/OObject', 'Olives/Event-plugin', 'Olives/Model-plugin', 'Todos/Tools'],
// The List UI
function List( OObject, EventPlugin, ModelPlugin, Tools ) {
function List(OObject, EventPlugin, ModelPlugin, Tools) {
'use strict';
return function ListInit( view, model, stats ) {
return function ListInit(view, model, stats) {
// The OObject (the controller) inits with a default model which is a simple store
// But it can be init'ed with any other store, like the LocalStore
var list = new OObject( model ),
var list = new OObject(model),
ENTER_KEY = 13;
// The plugins
list.plugins.addAll({
'event': new EventPlugin( list ),
'model': new ModelPlugin( model, {
'event': new EventPlugin(list),
'model': new ModelPlugin(model, {
'toggleClass': Tools.toggleClass
}),
'stats': new ModelPlugin( stats, {
'stats': new ModelPlugin(stats, {
'toggleClass': Tools.toggleClass,
'toggleCheck': function ( value ) {
'toggleCheck': function (value) {
this.checked = model.getNbItems() === value ? 'on' : '';
}
})
});
// Remove the completed task
list.remove = function remove( event, node ) {
model.del( node.getAttribute('data-model_id') );
list.remove = function remove(event, node) {
model.del(node.getAttribute('data-model_id'));
};
// Un/check all tasks
list.toggleAll = function toggleAll( event, node ) {
list.toggleAll = function toggleAll(event, node) {
var checked = !!node.checked;
model.loop( function ( value, idx ) {
this.update( idx, 'completed', checked );
model.loop(function (value, idx) {
this.update(idx, 'completed', checked);
}, model);
};
// Enter edit mode
list.startEdit = function ( event, node ) {
list.startEdit = function (event, node) {
var taskId = node.getAttribute('data-model_id');
Tools.toggleClass.call( view.querySelector('li[data-model_id="' + taskId + '"]'), true, 'editing' );
Tools.toggleClass.call(view.querySelector('li[data-model_id="' + taskId + '"]'), true, 'editing');
view.querySelector('input.edit[data-model_id="' + taskId + '"]').focus();
};
// Leave edit mode
list.stopEdit = function ( event, node ) {
list.stopEdit = function (event, node) {
var taskId = node.getAttribute('data-model_id'),
value;
if ( event.keyCode === ENTER_KEY ) {
if (event.keyCode === ENTER_KEY) {
value = node.value.trim();
if ( value ) {
model.update( taskId, 'title', value );
if (value) {
model.update(taskId, 'title', value);
} else {
model.del( taskId );
model.del(taskId);
}
// When task #n is removed, #n+1 becomes #n, the dom node is updated to the new value, so editing mode should exit anyway
if ( model.has( taskId ) ) {
Tools.toggleClass.call( view.querySelector('li[data-model_id="' + taskId + '"]'), false, 'editing' );
if (model.has(taskId)) {
Tools.toggleClass.call(view.querySelector('li[data-model_id="' + taskId + '"]'), false, 'editing');
}
} else if ( event.type === 'blur' ) {
Tools.toggleClass.call( view.querySelector('li[data-model_id="' + taskId + '"]'), false, 'editing' );
} else if (event.type === 'blur') {
Tools.toggleClass.call(view.querySelector('li[data-model_id="' + taskId + '"]'), false, 'editing');
}
};
// Alive applies the plugins to the HTML view
list.alive( view );
list.alive(view);
};
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7