Create a simple todo js with agilityjs and firebase

main.js

	//Enter firebase URL
        var firebaseUrl = "";

	var dataref = new Firebase(firebaseUrl);
	var item = $$({}, '<li><span data-bind="content"/> <button>x</button></li>', '& span { cursor:pointer; }', {

		'change':function(){
			dataref.push({content:this.model.get('content'), index:this.model.get('index')});
		},
	  
		'click span': function(){
			var input = prompt('Edit to-do item:', this.model.get('content'));
			if (!input) return;
			this.model.set({content:input}); 
		},
		'click button': function(){
			var name = this.model.get('name');
			var todoItem = new Firebase(firebaseUrl);
			todoItem.remove();
		}
	});

	//
	// List of items
	//
	var list = $$({}, '<div> <button id="new">New item</button> <ul></ul> </div>', {
		'click #new': function(){
			var content = prompt("Enter to-do item:");
			var newItem = $$(item, {content:content});
			dataref.push( {content:content} );
			
			
		}
	});

	dataref.on('value',function(snapshot){
		
		list.each(function(){
			this.destroy();
		});
		snapshot.forEach(function(childSnapShot){
			
			var newItem = $$(item, {name:childSnapShot.name(), content:childSnapShot.val().content});
			list.append(newItem,'ul');
		});
		
	});



	$$.document.append(list);