<!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]--> 
<!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]--> 
<!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]--> 
<!--[if IE 9 ]>    <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

  <title>ember.js</title>
  <meta name="description" content="">
  <meta name="author" content="">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <link rel="shortcut icon" href="/favicon.ico">
  <link rel="apple-touch-icon" href="/apple-touch-icon.png">
  <link rel="stylesheet" href="css/style.css?v=2">
  <link rel="stylesheet" href="css/todos.css">

  <!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
</head>
<body>
  
  <div id="todoapp">
	<div class="title">
		<h1>Todos</h1>
	</div>
  
  <div class="content">
  
  <script type="text/x-handlebars">

{{#view id="create-todo"}}
  {{view Todos.CreateTodoView id="new-todo" placeholder="What needs to be done?"}}
{{/view}}

{{#view id="stats-area"}}
  {{view Ember.Checkbox class="mark-all-done"
    title="Mark all as complete"
    valueBinding="Todos.todosController.allAreDone"}}

{{#view id="todos"}}
  {{#collection id="todo-list" contentBinding="Todos.todosController" tagName="ul" itemClassBinding="content.isDone"}}
    {{view Ember.Checkbox titleBinding="content.title" valueBinding="content.isDone"}}
  {{/collection}}
{{/view}}
  
    <!-- Insert this after the CreateTodoView and before the collection. -->
  {{#view Todos.StatsView id="todo-stats" content=this}}
    {{#view Ember.Button target="Todos.todosController" action="clearCompletedTodos" classNameBindings="Todos.todosController.completeClass" content=this}}
      Clear {{content.completedString}} 
    {{/view}}
    {{remainingString}} left
  {{/view}}

  {{/view}}
  
  </script>
    </div>
  </div>

	    <div id="credits">
			Credits:
	        <br />
	        Tom Dale, Addy Osmani
	    </div>

	            
  <script src="js/libs/jquery-1.7.1.min.js"></script>
  <script src="js/libs/ember-0.9.min.js"></script>
  <script src="js/app.js"></script>
</body>
</html>