habitica/views/app/index.html

<Title:>
  Todos

<Header:>
  <app:alert>

<Body:>
  <div id=overlay></div>
  <form id=head x-bind=submit:add>
    <h1>Todos <span>{_remaining} remaining</span></h1>
    <div id=add>
      <div id=add-input><input id=new-todo value={_newTodo}></div>
      <input id=add-button type=submit value=Add>
    </div>
  </form>
  <div id=dragbox></div>
  <div id=content><ul id=todos>{#each _todoList}<app:todo>{/}</ul></div>

<todo:>
  <li data-id={{id}} class="{#if .completed}completed{/}">
    <table width=100%>
      <tr>
        <td class=handle width=0></td>
        <td width=100%>
          <div class=todo>
            <label><input type=checkbox checked={.completed}><i></i></label>
            <div x-bind=keydown:shortcuts contenteditable>{unescaped .text}</div>
          </div>
        </td>
        <td width=0><button class=delete x-bind=click:del>Delete</button></td>
      </tr>
    </table>
  </li>

<alert:>
  <div id=alert>
    {#unless connected}
      <p>
        {#if canConnect}
          Offline {#if _showReconnect}&ndash; <a x-bind=click:connect>Reconnect</a>{/}
        {else}
          Unable to reconnect &ndash; <a x-bind=click:reload>Reload</a>
        {/}
      </p>
    {/}
  </div>

<Scripts:>
  <script src=https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js></script>
  <script src=https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js></script>