Permalink
Browse files

Create a TodoApp class

  • Loading branch information...
1 parent e5580f3 commit 352129a3c018f7301fb74d3e56c2f39b31407ae2 @MathieuLorber committed Oct 20, 2012
@@ -0,0 +1,94 @@
+part of todomvc;
+
+class TodoApp {
+ List<TodoElement> todoElements = new List();
+ Element todoListElement = query('#todo-list');
+ Element mainElement = query('#main');
+ InputElement checkAllCheckboxElement = query('#toggle-all');
+ Element footerElement = query('#footer');
+ Element countElement = query('#todo-count');
+ Element clearCompletedElement = query('#clear-completed');
+
+ TodoApp() {
+ InputElement newTodoElement = query('#new-todo');
+
+ newTodoElement.on.keyPress.add((KeyboardEvent e) {
+ if(e.keyIdentifier == KeyName.ENTER) {
+ String title = newTodoElement.value.trim();
+ if(title != '') {
+ addTodo(title);
+ newTodoElement.value = '';
+ updateFooterDisplay();
+ }
+ }
+ });
+
+ checkAllCheckboxElement.on.click.add((Event e) {
+ InputElement target = e.srcElement;
+ todoElements.forEach((TodoElement todoElement) {
+ if(todoElement.todo.completed != target.checked) {
+ todoElement.toggle();
+ }
+ });
+ updateFooterDisplay();
+ });
+
+ clearCompletedElement.on.click.add((MouseEvent e) {
+ List<TodoElement> newList = new List<TodoElement>();
+ todoElements.forEach((TodoElement todoElement) {
+ if(todoElement.todo.completed) {
+ todoElement.element.remove();
+ } else {
+ newList.add(todoElement);
+ }
+ });
+ todoElements = newList;
+ updateFooterDisplay();
+ });
+
+ updateFooterDisplay();
+ }
+
+ void addTodo(String title, [bool completed = false]) {
+ Todo todo = new Todo(title, completed);
+
+ TodoElement todoElement = new TodoElement(this, todo);
+ todoElements.add(todoElement);
+ todoListElement.nodes.add(todoElement.createElement());
+ }
+
+ void updateFooterDisplay() {
+ if(todoElements.length == 0) {
+ checkAllCheckboxElement.style.display = 'none';
+ mainElement.style.display = 'none';
+ footerElement.style.display = 'none';
+ } else {
+ checkAllCheckboxElement.style.display = 'block';
+ mainElement.style.display = 'block';
+ footerElement.style.display = 'block';
+ }
+ updateCounts();
+ }
+
+ void updateCounts() {
+ int complete = 0;
+ todoElements.forEach((TodoElement todoElement) {
+ if(todoElement.todo.completed) {
+ complete++;
+ }
+ });
+ checkAllCheckboxElement.checked = (complete == todoElements.length);
+ int left = todoElements.length - complete;
+ countElement.innerHTML = '${left} item${left != 1 ? 's' : ''} left';
+ if(complete == 0) {
+ clearCompletedElement.style.display = 'none';
+ } else {
+ clearCompletedElement.style.display = 'block';
+ clearCompletedElement.innerHTML = 'Clear completed (${complete})';
+ }
+ }
+
+ void removeTodo(TodoElement todoElement) {
+ todoElements.removeAt(todoElements.indexOf(todoElement));
+ }
+}
@@ -1,11 +1,12 @@
-part of todoApp;
+part of todomvc;
class TodoElement {
+ TodoApp todoApp;
Todo todo;
Element element;
InputElement toggleElement;
- TodoElement(this.todo) {
+ TodoElement(this.todoApp, this.todo) {
}
Element createElement() {
@@ -26,7 +27,7 @@ class TodoElement {
toggleElement.on.click.add((MouseEvent e) {
toggle();
- updateCounts();
+ todoApp.updateCounts();
});
contentElement.on.doubleClick.add((MouseEvent e) {
element.classes.add('editing');
@@ -36,8 +37,8 @@ class TodoElement {
void removeTodo() {
element.remove();
- todoElements.removeAt(todoElements.indexOf(this));
- updateFooterDisplay();
+ todoApp.removeTodo(this);
+ todoApp.updateFooterDisplay();
}
element.query('.destroy').on.click.add((MouseEvent e) {
@@ -1,99 +1,17 @@
-library todoApp;
+library todomvc;
import 'dart:html';
part 'TodoElement.dart';
+part 'TodoApp.dart';
-List<TodoElement> todoElements = new List();
-Element todoListElement = query('#todo-list');
-Element mainElement = query('#main');
-InputElement checkAllCheckboxElement = query('#toggle-all');
-Element footerElement = query('#footer');
-Element countElement = query('#todo-count');
-Element clearCompletedElement = query('#clear-completed');
+void main() {
+ new TodoApp();
+}
class Todo {
int id;
String title;
bool completed;
Todo(this.title, this.completed);
}
-
-void main() {
- InputElement newTodoElement = query('#new-todo');
-
- newTodoElement.on.keyPress.add((KeyboardEvent e) {
- if(e.keyIdentifier == KeyName.ENTER) {
- String title = newTodoElement.value.trim();
- if(title != '') {
- addTodo(title);
- newTodoElement.value = '';
- updateFooterDisplay();
- }
- }
- });
-
- checkAllCheckboxElement.on.click.add((Event e) {
- InputElement target = e.srcElement;
- todoElements.forEach((TodoElement todoElement) {
- if(todoElement.todo.completed != target.checked) {
- todoElement.toggle();
- }
- });
- updateFooterDisplay();
- });
-
- clearCompletedElement.on.click.add((MouseEvent e) {
- List<TodoElement> newList = new List<TodoElement>();
- todoElements.forEach((TodoElement todoElement) {
- if(todoElement.todo.completed) {
- todoElement.element.remove();
- } else {
- newList.add(todoElement);
- }
- });
- todoElements = newList;
- updateFooterDisplay();
- });
-
- updateFooterDisplay();
-}
-
-void addTodo(String title, [bool completed = false]) {
- Todo todo = new Todo(title, completed);
-
- TodoElement todoElement = new TodoElement(todo);
- todoElements.add(todoElement);
- todoListElement.nodes.add(todoElement.createElement());
-}
-
-void updateFooterDisplay() {
- if(todoElements.length == 0) {
- checkAllCheckboxElement.style.display = 'none';
- mainElement.style.display = 'none';
- footerElement.style.display = 'none';
- } else {
- checkAllCheckboxElement.style.display = 'block';
- mainElement.style.display = 'block';
- footerElement.style.display = 'block';
- }
- updateCounts();
-}
-
-void updateCounts() {
- int complete = 0;
- todoElements.forEach((TodoElement todoElement) {
- if(todoElement.todo.completed) {
- complete++;
- }
- });
- checkAllCheckboxElement.checked = (complete == todoElements.length);
- int left = todoElements.length - complete;
- countElement.innerHTML = '${left} item${left != 1 ? 's' : ''} left';
- if(complete == 0) {
- clearCompletedElement.style.display = 'none';
- } else {
- clearCompletedElement.style.display = 'block';
- clearCompletedElement.innerHTML = 'Clear completed (${complete})';
- }
-}

0 comments on commit 352129a

Please sign in to comment.