Skip to content

T
todomvc
Commit 9c64c82b authored by Sindre Sorhus's avatar Sindre Sorhus
Browse files
Options

PureMVC app cleanup 

- Convert to tabs
- Trim trailing whitespace
- Improve readme
parent 2dfaa8b3
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 794 additions and 805 deletions
labs/architecture-examples/puremvc/README.md
View file @ 9c64c82b
## [PureMVC](http://puremvc.github.com/) [JavaScript](https://github.com/PureMVC/puremvc-js-multicore-framework/wiki) Demo - TodoMVC # PureMVC TodoMVC app
This demo is a PureMVC port of the [TodoMVC Project](http://todomvc.com), a JavaScript application framework comparison demo. Given a standard html template, css, and a plain vanilla JavaScript reference app (no framework), developers are challenged to produce implementations base upon their favorite framework.
This demo is a [PureMVC](http://puremvc.github.com/) port of the [TodoMVC Project](http://todomvc.com), a JavaScript application framework comparison demo. Given a standard html template, css, and a plain vanilla JavaScript reference app (no framework), developers are challenged to produce implementations base upon their favorite framework.
The pseudo-classes are written in PureMVC's optional built-in style. The pseudo-classes are written in PureMVC's optional built-in style.
* [Live Demo](http://darkstar.puremvc.org/content_header.html?url=http://puremvc.org/pages/demos/JS/Demo_JS_TodoMVC/&desc=PureMVC%20JavaScript%20Demo:%20TodoMVC) * [Live Demo](http://darkstar.puremvc.org/content_header.html?url=http://puremvc.org/pages/demos/JS/Demo_JS_TodoMVC/&desc=PureMVC%20JavaScript%20Demo:%20TodoMVC)
* [Discussion](http://forums.puremvc.org/index.php?topic=2049.0) * [Discussion](http://forums.puremvc.org/index.php?topic=2049.0)
## Screenshot
![PureMVC JavaScript Demo: TodoMVC](http://puremvc.org/pages/images/screenshots/PureMVC-Shot-JS-TodoMVC.png)
## Status ## Screenshot
Production - [Version 1.2](https://github.com/PureMVC/puremvc-js-demo-todomvc/blob/master/VERSION)
## Platforms / Technologies ![PureMVC JavaScript Demo: TodoMVC](http://puremvc.org/pages/images/screenshots/PureMVC-Shot-JS-TodoMVC.png)
* [JavaScript](http://en.wikipedia.org/wiki/JavaScript)
* [TodoMVC Project](http://todomvc.com)
## License
* Original TodoMVC Demo - Copyright (c) Addy Osmani & Sindre Sorhus
* TodoMVC port to PureMVC - Copyright (c) 2012 Mike Britton and Cliff Hall ## Status
* PureMVC Framework - Copyright(c) 2006-2012 [Futurescale, Inc](http://futurescale.com). Production - [Version 1.2](https://github.com/PureMVC/puremvc-js-demo-todomvc/blob/master/VERSION)
All rights reserved.
* Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer. ## Credits
* Neither the name of Futurescale, Inc., PureMVC.org, nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. TodoMVC port to PureMVC by Mike Britton and Cliff Hall
labs/architecture-examples/puremvc/index.html
View file @ 9c64c82b
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>PureMVC • TodoMVC</title> <title>PureMVC • TodoMVC</title>
<link rel="stylesheet" href="../../../assets/base.css"> <link rel="stylesheet" href="../../../assets/base.css">
<!--[if IE]> <!--[if IE]>
<script src="assets/ie.js"></script> <script src="assets/ie.js"></script>
<![endif]--> <![endif]-->
</head> </head>
<body> <body>
<section id="todoapp"> <section id="todoapp">
<header id="header"> <header id="header">
<h1>todos</h1> <h1>todos</h1>
<input id="new-todo" placeholder="What needs to be done?" autofocus> <input id="new-todo" placeholder="What needs to be done?" autofocus>
</header> </header>
<section id="main"> <section id="main">
<input id="toggle-all" type="checkbox"> <input id="toggle-all" type="checkbox">
<label for="toggle-all">Mark all as complete</label> <label for="toggle-all">Mark all as complete</label>
<ul id="todo-list"> <ul id="todo-list">
</ul> </ul>
</section> </section>
<footer id="footer"> <footer id="footer">
<span id="todo-count"><strong>1</strong> item left</span> <span id="todo-count"><strong>1</strong> item left</span>
<ul id="filters"> <ul id="filters">
<li> <li>
<a id="filterAll" class="selected" href="#/">All</a> <a id="filterAll" class="selected" href="#/">All</a>
</li> </li>
<li> <li>
<a id="filterActive" href="#/active">Active</a> <a id="filterActive" href="#/active">Active</a>
</li> </li>
<li> <li>
<a id="filterCompleted" href="#/completed">Completed</a> <a id="filterCompleted" href="#/completed">Completed</a>
</li> </li>
</ul> </ul>
<button id="clear-completed">Clear completed (1)</button> <button id="clear-completed">Clear completed (1)</button>
</footer> </footer>
</section> </section>
<footer id="info"> <footer id="info">
<p>Double-click to edit a todo</p> <p>Double-click to edit a todo</p>
<p>Created by <a href="http://puremvc.org">Mike Britton and Cliff Hall for the PureMVC Project</a></p> <p>Created by <a href="http://puremvc.org">Mike Britton and Cliff Hall for the PureMVC Project</a></p>
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p> <p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</footer> </footer>
<!-- TODOMVC PROJECT BASE -->
<script src="../../../assets/base.js"></script>
<!-- FLATIRION DIRECTOR ROUTING LIBRARY --> <!-- TODOMVC PROJECT BASE -->
<script src="../../../assets/director.min.js"></script> <script src="../../../assets/base.js"></script>
<!-- PUREMVC LIBRARY -->
<script src="js/lib/puremvc-1.0.1.min.js"></script>
<!-- APPLICATION CONSTANTS --> <!-- FLATIRION DIRECTOR ROUTING LIBRARY -->
<script src="js/AppConstants.js"></script> <script src="../../../assets/director.min.js"></script>
<!-- PROXIES --> <!-- PUREMVC LIBRARY -->
<script src="js/model/proxy/TodoProxy.js"></script> <script src="js/lib/puremvc.min.js"></script>
<!-- EVENTS -->
<script src="js/view/event/AppEvents.js"></script>
<!-- VIEW COMPONENTS -->
<script src="js/view/component/TodoForm.js"></script>
<!-- MEDIATORS -->
<script src="js/view/mediator/RoutesMediator.js"></script>
<script src="js/view/mediator/TodoFormMediator.js"></script>
<!-- COMMANDS --> <!-- APPLICATION CONSTANTS -->
<script src="js/controller/command/StartupCommand.js"></script> <script src="js/AppConstants.js"></script>
<script src="js/controller/command/PrepControllerCommand.js"></script>
<script src="js/controller/command/PrepModelCommand.js"></script> <!-- PROXIES -->
<script src="js/controller/command/PrepViewCommand.js"></script> <script src="js/model/proxy/TodoProxy.js"></script>
<script src="js/controller/command/TodoCommand.js"></script>
<!-- EVENTS -->
<!-- APPLICATION --> <script src="js/view/event/AppEvents.js"></script>
<script src="js/app.js"></script>
<!-- VIEW COMPONENTS -->
<!-- START THE APPLICATION --> <script src="js/view/component/TodoForm.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() <!-- MEDIATORS -->
{ <script src="js/view/mediator/RoutesMediator.js"></script>
var app = new todomvc.Application(); <script src="js/view/mediator/TodoFormMediator.js"></script>
});
</script> <!-- COMMANDS -->
</body> <script src="js/controller/command/StartupCommand.js"></script>
<script src="js/controller/command/PrepControllerCommand.js"></script>
<script src="js/controller/command/PrepModelCommand.js"></script>
<script src="js/controller/command/PrepViewCommand.js"></script>
<script src="js/controller/command/TodoCommand.js"></script>
<!-- APPLICATION -->
<script src="js/app.js"></script>
<!-- START THE APPLICATION -->
<script>
document.addEventListener('DOMContentLoaded', function() {
var app = new todomvc.Application();
});
</script>
</body>
</html> </html>
labs/architecture-examples/puremvc/js/AppConstants.js
View file @ 9c64c82b
...@@ -5,27 +5,26 @@ ...@@ -5,27 +5,26 @@
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
* *
* Define the core and notification constants. * Define the core and notification constants.
* *
* PureMVC JS is multi-core, meaning you may have multiple, * PureMVC JS is multi-core, meaning you may have multiple,
* named and isolated PureMVC cores. This app only has one. * named and isolated PureMVC cores. This app only has one.
*/ */
puremvc.define({ name: 'todomvc.AppConstants' },{}, { puremvc.define({ name: 'todomvc.AppConstants' }, {}, {
// The multiton key for this app's single core // The multiton key for this app's single core
CORE_NAME: 'TodoMVC', CORE_NAME: 'TodoMVC',
// Notifications // Notifications
STARTUP: 'startup', STARTUP: 'startup',
ADD_TODO: 'add_todo', ADD_TODO: 'add_todo',
DELETE_TODO: 'delete_todo', DELETE_TODO: 'delete_todo',
UPDATE_TODO: 'update_todo', UPDATE_TODO: 'update_todo',
TOGGLE_TODO_STATUS: 'toggle_todo_status', TOGGLE_TODO_STATUS: 'toggle_todo_status',
REMOVE_TODOS_COMPLETED: 'remove_todos_completed', REMOVE_TODOS_COMPLETED: 'remove_todos_completed',
FILTER_TODOS: 'filter_todos', FILTER_TODOS: 'filter_todos',
TODOS_FILTERED: 'todos_filtered', TODOS_FILTERED: 'todos_filtered',
// Filter routes // Filter routes
FILTER_ALL: 'all', FILTER_ALL: 'all',
FILTER_ACTIVE: 'active', FILTER_ACTIVE: 'active',
FILTER_COMPLETED: 'completed' FILTER_COMPLETED: 'completed'
} });
);
labs/architecture-examples/puremvc/js/app.js
View file @ 9c64c82b
...@@ -5,20 +5,20 @@ ...@@ -5,20 +5,20 @@
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define({ puremvc.define({
name: 'todomvc.Application', name: 'todomvc.Application',
constructor: function() { constructor: function() {
// register the startup command and trigger it. // register the startup command and trigger it.
this.facade.registerCommand( todomvc.AppConstants.STARTUP, todomvc.controller.command.StartupCommand ); this.facade.registerCommand( todomvc.AppConstants.STARTUP, todomvc.controller.command.StartupCommand );
this.facade.sendNotification( todomvc.AppConstants.STARTUP ); this.facade.sendNotification( todomvc.AppConstants.STARTUP );
} }
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
// Define the startup notification name // Define the startup notification name
STARTUP: 'startup', STARTUP: 'startup',
// Get an instance of the PureMVC Facade. This creates the Model, View, and Controller instances. // Get an instance of the PureMVC Facade. This creates the Model, View, and Controller instances.
facade: puremvc.Facade.getInstance( todomvc.AppConstants.CORE_NAME ) facade: puremvc.Facade.getInstance( todomvc.AppConstants.CORE_NAME )
} }
); );
labs/architecture-examples/puremvc/js/controller/command/PrepControllerCommand.js
View file @ 9c64c82b
/** /**
* @author Mike Britton, Cliff Hall * @author Mike Britton, Cliff Hall
* *
* @class PrepControllerCommand * @class PrepControllerCommand
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define({ puremvc.define({
name: 'todomvc.controller.command.PrepControllerCommand', name: 'todomvc.controller.command.PrepControllerCommand',
parent: puremvc.SimpleCommand parent: puremvc.SimpleCommand
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
/** /**
* Register Commands with the Controller * Register Commands with the Controller
* @override * @override
*/ */
execute: function (note) { execute: function (note) {
// This registers multiple notes to a single command which performs different logic based on the note name. // This registers multiple notes to a single command which performs different logic based on the note name.
// In a more complex app, we'd usually be registering a different command to each notification name. // In a more complex app, we'd usually be registering a different command to each notification name.
this.facade.registerCommand( todomvc.AppConstants.ADD_TODO, todomvc.controller.command.TodoCommand ); this.facade.registerCommand( todomvc.AppConstants.ADD_TODO, todomvc.controller.command.TodoCommand );
this.facade.registerCommand( todomvc.AppConstants.REMOVE_TODOS_COMPLETED, todomvc.controller.command.TodoCommand ); this.facade.registerCommand( todomvc.AppConstants.REMOVE_TODOS_COMPLETED, todomvc.controller.command.TodoCommand );
this.facade.registerCommand( todomvc.AppConstants.DELETE_TODO, todomvc.controller.command.TodoCommand ); this.facade.registerCommand( todomvc.AppConstants.DELETE_TODO, todomvc.controller.command.TodoCommand );
this.facade.registerCommand( todomvc.AppConstants.UPDATE_TODO, todomvc.controller.command.TodoCommand ); this.facade.registerCommand( todomvc.AppConstants.UPDATE_TODO, todomvc.controller.command.TodoCommand );
this.facade.registerCommand( todomvc.AppConstants.TOGGLE_TODO_STATUS, todomvc.controller.command.TodoCommand ); this.facade.registerCommand( todomvc.AppConstants.TOGGLE_TODO_STATUS, todomvc.controller.command.TodoCommand );
this.facade.registerCommand( todomvc.AppConstants.FILTER_TODOS, todomvc.controller.command.TodoCommand ); this.facade.registerCommand( todomvc.AppConstants.FILTER_TODOS, todomvc.controller.command.TodoCommand );
} }
} }
); );
labs/architecture-examples/puremvc/js/controller/command/PrepModelCommand.js
View file @ 9c64c82b
/** /**
* @author Mike Britton * @author Mike Britton
* *
* @class PrepModelCommand * @class PrepModelCommand
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define({ puremvc.define({
name: 'todomvc.controller.command.PrepModelCommand', name: 'todomvc.controller.command.PrepModelCommand',
parent: puremvc.SimpleCommand parent: puremvc.SimpleCommand
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
/** /**
* Register Proxies with the Model * Register Proxies with the Model
* @override * @override
*/ */
execute: function (note) { execute: function(note) {
this.facade.registerProxy( new todomvc.model.proxy.TodoProxy() ); this.facade.registerProxy( new todomvc.model.proxy.TodoProxy() );
} }
} }
); );
labs/architecture-examples/puremvc/js/controller/command/PrepViewCommand.js
View file @ 9c64c82b
/** /**
* @author Mike Britton * @author Mike Britton
* *
* @class PrepViewCommand * @class PrepViewCommand
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define ({ puremvc.define ({
name: 'todomvc.controller.command.PrepViewCommand', name: 'todomvc.controller.command.PrepViewCommand',
parent: puremvc.SimpleCommand parent: puremvc.SimpleCommand
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
/** /**
* Register Mediators with the View * Register Mediators with the View
* @override * @override
*/ */
execute: function (note) { execute: function (note) {
this.facade.registerMediator( new todomvc.view.mediator.TodoFormMediator() ); this.facade.registerMediator( new todomvc.view.mediator.TodoFormMediator() );
this.facade.registerMediator( new todomvc.view.mediator.RoutesMediator() ); this.facade.registerMediator( new todomvc.view.mediator.RoutesMediator() );
} }
} }
); );
labs/architecture-examples/puremvc/js/controller/command/StartupCommand.js
View file @ 9c64c82b
/** /**
* @author Mike Britton * @author Mike Britton
* *
* @class StartupCommand * @class StartupCommand
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define({ puremvc.define({
name: 'todomvc.controller.command.StartupCommand', name: 'todomvc.controller.command.StartupCommand',
parent: puremvc.MacroCommand parent: puremvc.MacroCommand
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
/** /**
* Add the sub-commands for this MacroCommand * Add the sub-commands for this MacroCommand
* @override * @override
*/ */
initializeMacroCommand: function () { initializeMacroCommand: function () {
this.addSubCommand( todomvc.controller.command.PrepControllerCommand ); this.addSubCommand( todomvc.controller.command.PrepControllerCommand );
this.addSubCommand( todomvc.controller.command.PrepModelCommand ); this.addSubCommand( todomvc.controller.command.PrepModelCommand );
this.addSubCommand( todomvc.controller.command.PrepViewCommand ); this.addSubCommand( todomvc.controller.command.PrepViewCommand );
} }
} }
); );
labs/architecture-examples/puremvc/js/controller/command/TodoCommand.js
View file @ 9c64c82b
/** /**
* @author Mike Britton, Cliff Hall * @author Mike Britton, Cliff Hall
* *
* @class TodoCommand * @class TodoCommand
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define ({ puremvc.define ({
name: 'todomvc.controller.command.TodoCommand', name: 'todomvc.controller.command.TodoCommand',
parent: puremvc.SimpleCommand parent: puremvc.SimpleCommand
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
/** /**
* Perform business logic (in this case, based on Notification name) * Perform business logic (in this case, based on Notification name)
* @override * @override
*/ */
execute: function ( note ) { execute: function ( note ) {
var proxy = this.facade.retrieveProxy( todomvc.model.proxy.TodoProxy.NAME ); var proxy = this.facade.retrieveProxy( todomvc.model.proxy.TodoProxy.NAME );
switch( note.getName() ) { switch( note.getName() ) {
case todomvc.AppConstants.ADD_TODO: case todomvc.AppConstants.ADD_TODO:
proxy.addTodo( note.getBody() ); proxy.addTodo( note.getBody() );
break; break;
case todomvc.AppConstants.DELETE_TODO: case todomvc.AppConstants.DELETE_TODO:
proxy.deleteTodo( note.getBody() ); proxy.deleteTodo( note.getBody() );
break; break;
case todomvc.AppConstants.UPDATE_TODO: case todomvc.AppConstants.UPDATE_TODO:
proxy.updateTodo( note.getBody() ); proxy.updateTodo( note.getBody() );
break; break;
case todomvc.AppConstants.TOGGLE_TODO_STATUS: case todomvc.AppConstants.TOGGLE_TODO_STATUS:
proxy.toggleCompleteStatus( note.getBody() ); proxy.toggleCompleteStatus( note.getBody() );
break; break;
case todomvc.AppConstants.REMOVE_TODOS_COMPLETED: case todomvc.AppConstants.REMOVE_TODOS_COMPLETED:
proxy.removeTodosCompleted(); proxy.removeTodosCompleted();
break; break;
case todomvc.AppConstants.FILTER_TODOS: case todomvc.AppConstants.FILTER_TODOS:
proxy.filterTodos( note.getBody() ); proxy.filterTodos( note.getBody() );
break; break;
default: default:
console.log('TodoCommand received an unsupported Notification'); console.log('TodoCommand received an unsupported Notification');
break; break;
} }
} }
} }
); );
labs/architecture-examples/puremvc/js/model/proxy/TodoProxy.js
View file @ 9c64c82b
...@@ -6,142 +6,142 @@ ...@@ -6,142 +6,142 @@
* *
*/ */
puremvc.define({ puremvc.define({
name: 'todomvc.model.proxy.TodoProxy', name: 'todomvc.model.proxy.TodoProxy',
parent: puremvc.Proxy parent: puremvc.Proxy
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
todos: [], todos: [],
stats: {}, stats: {},
filter: todomvc.AppConstants.FILTER_ALL, filter: todomvc.AppConstants.FILTER_ALL,
LOCAL_STORAGE: 'todos-puremvc', LOCAL_STORAGE: 'todos-puremvc',
onRegister: function() { onRegister: function() {
this.loadData(); this.loadData();
}, },
loadData: function() { loadData: function() {
var storageObject; var storageObject;
if ( !localStorage.getItem( this.LOCAL_STORAGE ) ) { if ( !localStorage.getItem( this.LOCAL_STORAGE ) ) {
this.saveData(); this.saveData();
} }
storageObject = JSON.parse( localStorage.getItem( this.LOCAL_STORAGE ) ); storageObject = JSON.parse( localStorage.getItem( this.LOCAL_STORAGE ) );
this.todos = storageObject.todos; this.todos = storageObject.todos;
this.filter = storageObject.filter; this.filter = storageObject.filter;
this.computeStats(); this.computeStats();
}, },
saveData: function() { saveData: function() {
var storageObject = { todos:this.todos, filter:this.filter }; var storageObject = { todos:this.todos, filter:this.filter };
localStorage.setItem( this.LOCAL_STORAGE, JSON.stringify( storageObject ) ); localStorage.setItem( this.LOCAL_STORAGE, JSON.stringify( storageObject ) );
}, },
computeStats: function() { computeStats: function() {
this.stats.totalTodo = this.todos.length; this.stats.totalTodo = this.todos.length;
this.stats.todoCompleted = this.getCompletedCount(); this.stats.todoCompleted = this.getCompletedCount();
this.stats.todoLeft = this.stats.totalTodo - this.stats.todoCompleted; this.stats.todoLeft = this.stats.totalTodo - this.stats.todoCompleted;
}, },
filterTodos: function ( filter ) { filterTodos: function ( filter ) {
var i; var i;
this.filter = filter; this.filter = filter;
this.saveData(); this.saveData();
i = this.todos.length, i = this.todos.length,
filtered = []; filtered = [];
while ( i-- ) { while ( i-- ) {
if ( filter === todomvc.AppConstants.FILTER_ALL ) { if ( filter === todomvc.AppConstants.FILTER_ALL ) {
filtered.push( this.todos[ i ] ); filtered.push( this.todos[ i ] );
} else if ( this.todos[i].completed === true && filter === todomvc.AppConstants.FILTER_COMPLETED ) { } else if ( this.todos[i].completed === true && filter === todomvc.AppConstants.FILTER_COMPLETED ) {
filtered.push( this.todos[ i ] ); filtered.push( this.todos[ i ] );
} else if ( this.todos[i].completed === false && filter === todomvc.AppConstants.FILTER_ACTIVE ) { } else if ( this.todos[i].completed === false && filter === todomvc.AppConstants.FILTER_ACTIVE ) {
filtered.push( this.todos[ i ] ); filtered.push( this.todos[ i ] );
} }
} }
this.sendNotification( todomvc.AppConstants.TODOS_FILTERED, { todos:filtered, stats:this.stats, filter:this.filter } ); this.sendNotification( todomvc.AppConstants.TODOS_FILTERED, { todos:filtered, stats:this.stats, filter:this.filter } );
}, },
todosModified: function() { todosModified: function() {
this.computeStats(); this.computeStats();
this.filterTodos( this.filter ); this.filterTodos( this.filter );
}, },
removeTodosCompleted: function() { removeTodosCompleted: function() {
var i = this.todos.length; var i = this.todos.length;
while ( i-- ) { while ( i-- ) {
if ( this.todos[ i ].completed ) { if ( this.todos[ i ].completed ) {
this.todos.splice( i, 1 ); this.todos.splice( i, 1 );
} }
} }
this.todosModified(); this.todosModified();
}, },
deleteTodo: function( id ) { deleteTodo: function( id ) {
var i = this.todos.length; var i = this.todos.length;
while ( i-- ) { while ( i-- ) {
if ( this.todos[i].id === id ) { if ( this.todos[i].id === id ) {
this.todos.splice(i, 1); this.todos.splice(i, 1);
} }
} }
this.todosModified(); this.todosModified();
}, },
toggleCompleteStatus: function( status ) { toggleCompleteStatus: function( status ) {
var i = this.todos.length; var i = this.todos.length;
while ( i-- ) { while ( i-- ) {
this.todos[ i ].completed = status; this.todos[ i ].completed = status;
} }
this.todosModified(); this.todosModified();
}, },
updateTodo: function( todo ) { updateTodo: function( todo ) {
var i = this.todos.length; var i = this.todos.length;
while ( i-- ) { while ( i-- ) {
if ( this.todos[ i ].id === todo.id ) { if ( this.todos[ i ].id === todo.id ) {
this.todos[ i ].title = todo.title; this.todos[ i ].title = todo.title;
this.todos[ i ].completed = todo.completed; this.todos[ i ].completed = todo.completed;
} }
} }
this.todosModified(); this.todosModified();
}, },
addTodo: function( newTodo ) { addTodo: function( newTodo ) {
newTodo.id = this.getUuid(); newTodo.id = this.getUuid();
this.todos.push( newTodo ); this.todos.push( newTodo );
this.todosModified(); this.todosModified();
}, },
getCompletedCount: function() { getCompletedCount: function() {
var i = this.todos.length, var i = this.todos.length,
completed = 0; completed = 0;
while ( i-- ) { while ( i-- ) {
if ( this.todos[ i ].completed ) { if ( this.todos[ i ].completed ) {
completed++; completed++;
} }
} }
return completed; return completed;
}, },
getUuid: function() { getUuid: function() {
var i, random, uuid = ''; var i, random, uuid = '';
for ( i = 0; i < 32; i++ ) { for ( i = 0; i < 32; i++ ) {
random = Math.random() * 16 | 0; random = Math.random() * 16 | 0;
if ( i === 8 || i === 12 || i === 16 || i === 20 ) { if ( i === 8 || i === 12 || i === 16 || i === 20 ) {
uuid += '-'; uuid += '-';
} }
uuid += ( i === 12 ? 4 : (i === 16 ? ( random & 3 | 8 ) : random) ).toString( 16 ); uuid += ( i === 12 ? 4 : (i === 16 ? ( random & 3 | 8 ) : random) ).toString( 16 );
} }
return uuid; return uuid;
} }
}, },
// CLASS MEMBERS // CLASS MEMBERS
{ {
NAME: 'TodoProxy' NAME: 'TodoProxy'
} }
); );
labs/architecture-examples/puremvc/js/view/event/AppEvents.js
View file @ 9c64c82b
...@@ -4,45 +4,45 @@ ...@@ -4,45 +4,45 @@
* @class AppEvents * @class AppEvents
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define({ name: 'todomvc.view.event.AppEvents' }, {}, puremvc.define({ name: 'todomvc.view.event.AppEvents' }, {},
// STATIC MEMBERS // STATIC MEMBERS
{ {
// Event name constants // Event name constants
TOGGLE_COMPLETE_ALL: 'toggle_complete_all', TOGGLE_COMPLETE_ALL: 'toggle_complete_all',
TOGGLE_COMPLETE: 'toggle_complete', TOGGLE_COMPLETE: 'toggle_complete',
CLEAR_COMPLETED: 'clear_completed', CLEAR_COMPLETED: 'clear_completed',
DELETE_ITEM: 'delete_item', DELETE_ITEM: 'delete_item',
UPDATE_ITEM: 'update_item', UPDATE_ITEM: 'update_item',
ADD_ITEM: 'add_item', ADD_ITEM: 'add_item',
// Create event (cross-browser) // Create event (cross-browser)
createEvent: function( eventName ) { createEvent: function( eventName ) {
var event; var event;
if( document.createEvent ) { if ( document.createEvent ) {
event = document.createEvent( 'Events' ); event = document.createEvent( 'Events' );
event.initEvent( eventName, false, false ); event.initEvent( eventName, false, false );
} else if ( document.createEventObject ) { } else if ( document.createEventObject ) {
event = document.createEventObject(); event = document.createEventObject();
} }
return event; return event;
}, },
// Add event listener (cross-browser) // Add event listener (cross-browser)
addEventListener: function( object, type, listener, useCapture ) { addEventListener: function( object, type, listener, useCapture ) {
if ( object.addEventListener ) { if ( object.addEventListener ) {
object.addEventListener( type, listener, useCapture ); object.addEventListener( type, listener, useCapture );
} else if ( object.attachEvent ) { } else if ( object.attachEvent ) {
object.attachEvent( type, listener ); object.attachEvent( type, listener );
} }
}, },
// Dispatch event (cross-browser) // Dispatch event (cross-browser)
dispatchEvent: function( object, event ) { dispatchEvent: function( object, event ) {
if ( object.dispatchEvent ) { if ( object.dispatchEvent ) {
object.dispatchEvent( event ); object.dispatchEvent( event );
} else if ( object.fireEvent ) { } else if ( object.fireEvent ) {
object.fireEvent( event.type, event ); object.fireEvent( event.type, event );
} }
}, },
} }
); );
labs/architecture-examples/puremvc/js/view/mediator/RoutesMediator.js
View file @ 9c64c82b
/** /**
* @author Cliff Hall * @author Cliff Hall
* *
* @class RoutesMediator * @class RoutesMediator
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define({ puremvc.define({
name: 'todomvc.view.mediator.RoutesMediator', name: 'todomvc.view.mediator.RoutesMediator',
parent: puremvc.Mediator parent: puremvc.Mediator
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
// the router (Flatirion Director) // the router (Flatirion Director)
router: null, router: null,
// setup the routes when mediator is registered // setup the routes when mediator is registered
onRegister: function() { onRegister: function() {
var todoProxy = this.facade.retrieveProxy( todomvc.model.proxy.TodoProxy.NAME ), var todoProxy = this.facade.retrieveProxy( todomvc.model.proxy.TodoProxy.NAME ),
defaultRoute = this.getRouteForFilter( todoProxy.filter ), defaultRoute = this.getRouteForFilter( todoProxy.filter ),
options = { resource:this, notfound:this.handleFilterAll }, options = { resource:this, notfound:this.handleFilterAll },
routes = { routes = {
'/': this.handleFilterAll, '/': this.handleFilterAll,
'/active': this.handleFilterActive, '/active': this.handleFilterActive,
'/completed': this.handleFilterCompleted '/completed': this.handleFilterCompleted
}; };
this.router = new Router( routes ).configure( options ); this.router = new Router( routes ).configure( options );
this.router.init( defaultRoute ); this.router.init( defaultRoute );
}, },
getRouteForFilter: function( filter ) { getRouteForFilter: function( filter ) {
var route; var route;
switch (filter) { switch (filter) {
case todomvc.AppConstants.FILTER_ALL: case todomvc.AppConstants.FILTER_ALL:
route = '/'; route = '/';
break; break;
case todomvc.AppConstants.FILTER_ACTIVE: case todomvc.AppConstants.FILTER_ACTIVE:
route = '/active'; route = '/active';
break; break;
case todomvc.AppConstants.FILTER_COMPLETED: case todomvc.AppConstants.FILTER_COMPLETED:
route = '/completed'; route = '/completed';
break; break;
} }
return route; return route;
}, },
// route handlers // route handlers
handleFilterAll: function () { handleFilterAll: function () {
this.resource.facade.sendNotification( todomvc.AppConstants.FILTER_TODOS, todomvc.AppConstants.FILTER_ALL ); this.resource.facade.sendNotification( todomvc.AppConstants.FILTER_TODOS, todomvc.AppConstants.FILTER_ALL );
}, },
handleFilterActive: function () { handleFilterActive: function () {
this.resource.facade.sendNotification( todomvc.AppConstants.FILTER_TODOS, todomvc.AppConstants.FILTER_ACTIVE ); this.resource.facade.sendNotification( todomvc.AppConstants.FILTER_TODOS, todomvc.AppConstants.FILTER_ACTIVE );
}, },
handleFilterCompleted: function () { handleFilterCompleted: function () {
this.resource.facade.sendNotification( todomvc.AppConstants.FILTER_TODOS, todomvc.AppConstants.FILTER_COMPLETED ); this.resource.facade.sendNotification( todomvc.AppConstants.FILTER_TODOS, todomvc.AppConstants.FILTER_COMPLETED );
}, },
}, },
// STATIC MEMBERS // STATIC MEMBERS
{ {
NAME: 'RoutesMediator' NAME: 'RoutesMediator'
} }
); );
labs/architecture-examples/puremvc/js/view/mediator/TodoFormMediator.js
View file @ 9c64c82b
/** /**
* @author Mike Britton * @author Mike Britton
* *
* @class TodoFormMediator * @class TodoFormMediator
* @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git * @link https://github.com/PureMVC/puremvc-js-demo-todomvc.git
*/ */
puremvc.define({ puremvc.define({
name: 'todomvc.view.mediator.TodoFormMediator', name: 'todomvc.view.mediator.TodoFormMediator',
parent: puremvc.Mediator parent: puremvc.Mediator
}, },
// INSTANCE MEMBERS // INSTANCE MEMBERS
{ {
// Notifications this mediator is interested in // Notifications this mediator is interested in
listNotificationInterests: function() { listNotificationInterests: function() {
return [ todomvc.AppConstants.TODOS_FILTERED ]; return [ todomvc.AppConstants.TODOS_FILTERED ];
}, },
// Code to be executed when the Mediator instance is registered with the View // Code to be executed when the Mediator instance is registered with the View
onRegister: function() { onRegister: function() {
this.setViewComponent( new todomvc.view.component.TodoForm ); this.setViewComponent( new todomvc.view.component.TodoForm );
this.viewComponent.addEventListener( todomvc.view.event.AppEvents.TOGGLE_COMPLETE, this ); this.viewComponent.addEventListener( todomvc.view.event.AppEvents.TOGGLE_COMPLETE, this );
this.viewComponent.addEventListener( todomvc.view.event.AppEvents.TOGGLE_COMPLETE_ALL, this ); this.viewComponent.addEventListener( todomvc.view.event.AppEvents.TOGGLE_COMPLETE_ALL, this );
this.viewComponent.addEventListener( todomvc.view.event.AppEvents.UPDATE_ITEM, this ); this.viewComponent.addEventListener( todomvc.view.event.AppEvents.UPDATE_ITEM, this );
this.viewComponent.addEventListener( todomvc.view.event.AppEvents.DELETE_ITEM, this ); this.viewComponent.addEventListener( todomvc.view.event.AppEvents.DELETE_ITEM, this );
this.viewComponent.addEventListener( todomvc.view.event.AppEvents.ADD_ITEM, this ); this.viewComponent.addEventListener( todomvc.view.event.AppEvents.ADD_ITEM, this );
this.viewComponent.addEventListener( todomvc.view.event.AppEvents.CLEAR_COMPLETED, this ); this.viewComponent.addEventListener( todomvc.view.event.AppEvents.CLEAR_COMPLETED, this );
}, },
// Handle events from the view component // Handle events from the view component
handleEvent: function ( event ) { handleEvent: function ( event ) {
switch( event.type ) { switch( event.type ) {
case todomvc.view.event.AppEvents.TOGGLE_COMPLETE_ALL: case todomvc.view.event.AppEvents.TOGGLE_COMPLETE_ALL:
this.sendNotification( todomvc.AppConstants.TOGGLE_TODO_STATUS, event.doToggleComplete ); this.sendNotification( todomvc.AppConstants.TOGGLE_TODO_STATUS, event.doToggleComplete );
break; break;
case todomvc.view.event.AppEvents.DELETE_ITEM: case todomvc.view.event.AppEvents.DELETE_ITEM:
this.sendNotification( todomvc.AppConstants.DELETE_TODO, event.todoId ); this.sendNotification( todomvc.AppConstants.DELETE_TODO, event.todoId );
break; break;
case todomvc.view.event.AppEvents.ADD_ITEM: case todomvc.view.event.AppEvents.ADD_ITEM:
this.sendNotification( todomvc.AppConstants.ADD_TODO, event.todo ); this.sendNotification( todomvc.AppConstants.ADD_TODO, event.todo );
break; break;
case todomvc.view.event.AppEvents.CLEAR_COMPLETED: case todomvc.view.event.AppEvents.CLEAR_COMPLETED:
this.sendNotification( todomvc.AppConstants.REMOVE_TODOS_COMPLETED ); this.sendNotification( todomvc.AppConstants.REMOVE_TODOS_COMPLETED );
break; break;
case todomvc.view.event.AppEvents.TOGGLE_COMPLETE: case todomvc.view.event.AppEvents.TOGGLE_COMPLETE:
case todomvc.view.event.AppEvents.UPDATE_ITEM: case todomvc.view.event.AppEvents.UPDATE_ITEM:
this.sendNotification( todomvc.AppConstants.UPDATE_TODO, event.todo ); this.sendNotification( todomvc.AppConstants.UPDATE_TODO, event.todo );
break; break;
} }
}, },
// Handle notifications from other PureMVC actors // Handle notifications from other PureMVC actors
handleNotification: function( note ) { handleNotification: function( note ) {
switch ( note.getName() ) { switch ( note.getName() ) {
case todomvc.AppConstants.TODOS_FILTERED: case todomvc.AppConstants.TODOS_FILTERED:
this.viewComponent.setFilteredTodoList( note.getBody() ); this.viewComponent.setFilteredTodoList( note.getBody() );
break; break;
} }
}, },
}, },
// STATIC MEMBERS // STATIC MEMBERS
{ {
NAME: 'TodoFormMediator' NAME: 'TodoFormMediator'
} }
); );
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