Commit c637306d authored by Arthur Verschaeve's avatar Arthur Verschaeve

Merge pull request #1291 from tastejs/sjs/fix-marionette

Fix Marionette Issues
parents 1c2abb79 6e298ea5
......@@ -2,9 +2,3 @@
#todoapp.filter-completed #todo-list .active {
display: none;
}
#main,
#footer {
display: none;
}
......@@ -39,8 +39,8 @@ TodoMVC.module('Layout', function (Layout, App, Backbone) {
},
onInputKeypress: function (e) {
var ENTER_KEY = 13,
todoText = this.ui.input.val().trim();
var ENTER_KEY = 13;
var todoText = this.ui.input.val().trim();
if (e.which === ENTER_KEY && todoText) {
this.collection.create({
......@@ -72,7 +72,7 @@ TodoMVC.module('Layout', function (Layout, App, Backbone) {
},
collectionEvents: {
'all': 'render'
all: 'render'
},
templateHelpers: {
......
......@@ -10,6 +10,9 @@ TodoMVC.module('TodoList.Views', function (Views, App, Backbone, Marionette) {
Views.ItemView = Marionette.ItemView.extend({
tagName: 'li',
template: '#template-todoItemView',
className: function () {
return this.model.get('completed') ? 'completed' : 'active';
},
ui: {
edit: '.edit',
......@@ -27,17 +30,7 @@ TodoMVC.module('TodoList.Views', function (Views, App, Backbone, Marionette) {
},
modelEvents: {
'change': 'render'
},
onRender: function () {
this.$el.removeClass('active completed');
if (this.model.get('completed')) {
this.$el.addClass('completed');
} else {
this.$el.addClass('active');
}
change: 'render'
},
deleteModel: function () {
......@@ -65,7 +58,8 @@ TodoMVC.module('TodoList.Views', function (Views, App, Backbone, Marionette) {
},
onEditKeypress: function (e) {
var ENTER_KEY = 13, ESC_KEY = 27;
var ENTER_KEY = 13;
var ESC_KEY = 27;
if (e.which === ENTER_KEY) {
this.onEditFocusout();
......@@ -98,32 +92,25 @@ TodoMVC.module('TodoList.Views', function (Views, App, Backbone, Marionette) {
},
collectionEvents: {
'all': 'update'
'change:completed': 'render',
all: 'setCheckAllState'
},
initialize: function () {
this.listenTo(App.request('filterState'), 'change:filter', this.render, this);
},
addChild: function (child) {
filter: function (child) {
var filteredOn = App.request('filterState').get('filter');
if (child.matchesFilter(filteredOn)) {
Backbone.Marionette.CompositeView.prototype.addChild.apply(this, arguments);
}
return child.matchesFilter(filteredOn);
},
onRender: function () {
this.update();
},
update: function () {
setCheckAllState: function () {
function reduceCompleted(left, right) {
return left && right.get('completed');
}
var allCompleted = this.collection.reduce(reduceCompleted, true);
this.ui.toggle.prop('checked', allCompleted);
this.$el.parent().toggle(!!this.collection.length);
},
......@@ -132,7 +119,7 @@ TodoMVC.module('TodoList.Views', function (Views, App, Backbone, Marionette) {
var isChecked = e.currentTarget.checked;
this.collection.each(function (todo) {
todo.save({ 'completed': isChecked });
todo.save({ completed: isChecked });
});
}
});
......
......@@ -27,9 +27,14 @@ TodoMVC.module('TodoList', function (TodoList, App, Backbone, Marionette) {
this.showHeader(this.todoList);
this.showFooter(this.todoList);
this.showTodoList(this.todoList);
this.todoList.on('all', this.updateHiddenElements, this);
this.todoList.fetch();
},
updateHiddenElements: function () {
$('#main, #footer').toggle(!!this.todoList.length);
},
showHeader: function (todoList) {
var header = new App.Layout.Header({
collection: todoList
......
......@@ -4,7 +4,7 @@
// TodoMVC is global for developing in the console
// and functional testing.
var App = Backbone.Marionette.Application.extend({
setRootLayout: function() {
setRootLayout: function () {
this.root = new TodoMVC.Layout.Root();
}
});
......
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