Frank Valcarcel frankV

## handlebars_example1.html
<!DOCTYPE html>
<html>
<head>
  <title>Handelbars Example 1</title>
  <script src="js/handlebars.js"></script>

	<!-- notice this will not display until the data is populated -->
	<script id="result-template" type="text/x-handlebars-template">
	<h2>Your Bio</h2>
	<p>

## handlebars_example2.html
<!DOCTYPE html>
<html>
<head>
  <title>Handelbars Example 2</title>
	<script src="js/handlebars.js"></script>

	<!-- notice this will not display until the data is populated -->
	<script id="result-template" type="text/x-handlebars-template">
	<h2>Your Favorite Things</h2>


## handlebars_example3.html
<!DOCTYPE html>
<html>
<head>
  <title>Test 3</title>
	<script src="js/handlebars.js"></script>
	<script src="js/webtoolkit.md5.js"></script>

	<!-- notice this will not display until the data is populated -->
	<script id="result-template" type="text/x-handlebars-template">
	<h2>Your Gravatar</h2>

## app.js
// create an Ember App instance
App = Ember.Application.create();

App.Router.map(function() {
  // put your routes here
});

// return an elemtary model as a list
App.IndexRoute = Ember.Route.extend({
  model: function() {

## index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ember Starter Kit</title>
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/style.css">
</head>
<body>

## todo_template.js
<script type="text/x-handlebars" data-template-name="todos">
  	<section id="todoapp">
			<header id="header">
				<h1>todos</h1>
				{{view Ember.TextField id="new-todo" placeholder="What needs to be done?"
							 valueBinding="newTitle" action="createTodo"}}
			</header>
			{{#if length}}
				<section id="main">
					<ul id="todo-list">

## app.js
/*global Ember */
window.Todos = Ember.Application.create();

## router.js
/*global Todos Ember */
'use strict';

Todos.Router.map(function () {
  this.resource('todos', { path: '/' }, function () {
		this.route('active');
		this.route('completed');
	});
});

## models.js
/*global Todos DS Ember */
'use strict';

Todos.Todo = DS.Model.extend({
  title: DS.attr('string'),
	isCompleted: DS.attr('boolean'),

	todoDidChange: function () {
		Ember.run.once(this, function () {
			this.get('store').commit();

## views.js
/*global Todos Ember */
'use strict';

Todos.EditTodoView = Ember.TextField.extend({
  classNames: ['edit'],

	valueBinding: 'todo.title',

	change: function () {
		var value = this.get('value');
	<!DOCTYPE html>
	<html>
	<head>
	<title>Handelbars Example 1</title>
	<script src="js/handlebars.js"></script>

	<!-- notice this will not display until the data is populated -->
	<script id="result-template" type="text/x-handlebars-template">
	<h2>Your Bio</h2>
	<p>
	// create an Ember App instance
	App = Ember.Application.create();

	App.Router.map(function() {
	// put your routes here
	});

	// return an elemtary model as a list
	App.IndexRoute = Ember.Route.extend({
	model: function() {
	<script type="text/x-handlebars" data-template-name="todos">
	<section id="todoapp">
	<header id="header">
	<h1>todos</h1>
	{{view Ember.TextField id="new-todo" placeholder="What needs to be done?"
	valueBinding="newTitle" action="createTodo"}}
	</header>
	{{#if length}}
	<section id="main">
	<ul id="todo-list">
	/global Todos Ember /
	'use strict';

	Todos.Router.map(function () {
	this.resource('todos', { path: '/' }, function () {
	this.route('active');
	this.route('completed');
	});
	});
	/global Todos DS Ember /
	'use strict';

	Todos.Todo = DS.Model.extend({
	title: DS.attr('string'),
	isCompleted: DS.attr('boolean'),

	todoDidChange: function () {
	Ember.run.once(this, function () {
	this.get('store').commit();
	/global Todos Ember /
	'use strict';

	Todos.EditTodoView = Ember.TextField.extend({
	classNames: ['edit'],

	valueBinding: 'todo.title',

	change: function () {
	var value = this.get('value');