<section id="todoapp" class="todoapp">
  <header id="header" class="header">
    <h1>todos</h1>
    <input type="text" id="new-todo" class="new-todo" onkeydown={{action 'createTodo'}} placeholder="What needs to be done?" autofocus>
  </header>
    {{outlet}}
    {{#if (gt model.length 0)}}
      <footer id="footer" class="footer">
        <span id="todo-count" class="todo-count"><strong>{{remaining.length}}</strong> {{pluralize 'item' remaining.length}} left</span>
        <ul id="filters" class="filters">
          <li>{{#link-to "index" activeClass="selected"}}All{{/link-to}}</li>
          <li>{{#link-to "active" activeClass="selected"}}Active{{/link-to}}</li>
          <li>{{#link-to "completed" activeClass="selected"}}Completed{{/link-to}}</li>
        </ul>
        {{#if completed.length}}
          <button id="clear-completed" class="clear-completed" onclick={{action 'clearCompleted'}}>Clear completed</button>
        {{/if}}
      </footer>
    {{/if}}
</section>
<footer id="info" class="info">
  <p>Double-click to edit a todo</p>
  <p>
    Created by
    <a href="http://github.com/cibernox">Miguel Camba</a>,
    <a href="http://github.com/addyosmani">Addy Osmani</a>
  </p>
  <p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</footer>