Rapid Start

Rapid Start.js

steal('jquery/model', 
	  'jquery/dom/fixture',
	  'jquery/view/ejs',
	  'jquery/controller/route',function(){
	
	
	$.fixture("GET /services/todos.json", function(){
		return [200,"success",[
			{id: 1,
			 name: "wake up"},
			{id: 2,
			 name: "take out trash"},
			{id: 3,
			 name: "do dishes"}
		]]
	});
	
	$.fixture("GET /services/todos/{id}.json", function(settings){
		var todos = [
			{id: 1,
			 name: "wake up"},
			{id: 2,
			 name: "take out trash"},
			{id: 3,
			 name: "do dishes"}
		]
		return todos[parseInt(settings.data.id) - 1];
	});
	
	$.fixture("POST /services/todos/destroy/{id}",function(){
		return true;
	})
	
	
	$.Model('Todo',{
		findAll : "GET /services/todos.json",
		findOne : "GET /services/todos/{id}.json",
		destroy : "POST /services/todos/destroy/{id}",
		update : "POST /services/todos/update/{id}"
	},{});
	
	Todo.bind("destroyed", function(){
		console.log("foo")
	})


	$.Controller("Todos",{},{
		init : function(){
			this.element.html( "todos.ejs", Todo.findAll({}) )
		},
		"a.destroy click" : function(a, ev){
			var todo = a.closest('li').model()
			todo.destroy();
			ev.stopPropagation();
		},
		"{Todo} destroyed" : function(Todo, ev, destroyedTodo){
			destroyedTodo.elements(this.element).remove()
		},
		"li click" : function(li){
			li.trigger("selected", li.model() )
		},
		"{Todo} updated" : function(Todo, ev, updatedTodo){
			var li = updatedTodo.elements(this.element)
			li.replaceWith("todos.ejs",[updatedTodo])
		}
	});
	
	 // -> new Todos("#todos")


	$.Controller("Editor",{
		init : function(){
			this.element.val("")
		},
		setTodo : function(todo){
			this.todo = todo;
			this.element.val(todo.name)
		},
		"change" : function(){
			this.todo.name = this.element.val();
			this.todo.save();
		}
	})

	

	$.Controller("Route",{
		init : function(){
			$("#editor").editor()
			$('#todos').todos()
		},
		".todo selected" : function(el, ev, todo){
			window.location.hash = "#!todos/"+todo.id
		},
		"todos/:id route" : function(data){
			Todo.findOne({id: data.id}, function(todo){
				$("#editor").editor("setTodo",  todo)  
			})
		}
	})
	new Route(document.body)

})