diff --git a/todos/index.html b/todos/index.html index 0a75d4a..5f57d49 100755 --- a/todos/index.html +++ b/todos/index.html @@ -11,6 +11,9 @@ .input-group { margin-bottom: 15px; } + .clear-complete { + margin-bottom: 15px; + } diff --git a/todos/src/app.jsx b/todos/src/app.jsx index c0ecd1b..62c8552 100755 --- a/todos/src/app.jsx +++ b/todos/src/app.jsx @@ -14,9 +14,9 @@ var App = React.createClass({ } }, componentWillMount: function() { - fb = new Firebase(rootUrl + 'items/'); - this.bindAsObject(fb, 'items'); - fb.on('value', this.handleDataLoaded); + this.fb = new Firebase(rootUrl + 'items/'); + this.bindAsObject(this.fb, 'items'); + this.fb.on('value', this.handleDataLoaded); }, render: function() { return
@@ -28,10 +28,33 @@ var App = React.createClass({
+ {this.deleteButton()}
}, + deleteButton: function() { + if(!this.state.loaded) { + return + } else { + return
+
+ +
+ } + }, + onDeleteDoneClick: function() { + for(var key in this.state.items) { + if(this.state.items[key].done === true) { + this.fb.child(key).remove(); + } + } + }, handleDataLoaded: function(){ this.setState({loaded: true}); } diff --git a/todos/src/list.jsx b/todos/src/list.jsx index 2484026..3ba84db 100644 --- a/todos/src/list.jsx +++ b/todos/src/list.jsx @@ -8,7 +8,7 @@ module.exports = React.createClass({ }, renderList: function() { - if(this.props.items && Object.keys(this.props.items).length === 0) { + if(!this.props.items) { return

Add a todo to get started.