habitica/views/app/index.html

<Title:>
  Todos

<Header:>
  <app:alert>
  
<dragList: nonvoid>
  

<Body:>
  <div id=overlay></div>
  <div id=head>
    Money: {_user.money}<br/>
    Exp: {_user.exp}<br/>
    Lvl: {_user.lvl}<br/>
  </div>
  
  <div id=content>
    
    <div class=habits>
      <h1>Habits</h1>
      <div class=dragbox></div>
      <div class=content>
        <ul>
        {#each _habitList}
          <li data-id={{id}} class="habit">
            <table width=100%>
              <tr>
                <td class=handle width=0></td>
                <td width=100%>
                  <div class=todo>
                    <label>+ -<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>
        {/}
        </ul>
      </div>
      <form x-bind=submit:addHabit>
        <input class=new value={_newHabit}>
        <input type=submit value=Add>
      </form>
    </div>
    
    <div class=dailys>
      <h1>Dailies</h1>
      <div class=dragbox></div>
      <div class=content>
        <ul>
        {#each _dailyList}
          <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>
        {/}
        </ul>
      </div>
      <form x-bind=submit:addDaily>
        <input class=new value={_newDaily}>
        <input type=submit value=Add>
      </form>
    </div>

    <div class=todos>
      <h1>Todos</h1>
      <div class=dragbox></div>
      <div class=content>
        <ul>
        {#each _todoList}
          <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>
        {/}
        </ul>
      </div>
      <form x-bind=submit:addTodo>
        <input class=new value={_newTodo}>
        <input type=submit value=Add>
      </form>
    </div>

    <div class=rewards>
      <h1>Rewards</h1>
      <div class=dragbox></div>
      <div class=content>
        <ul>
        {#each _rewardList}
          <li data-id={{id}} class="reward">
            <table width=100%>
              <tr>
                <td class=handle width=0></td>
                <td width=100%>
                  <div class=todo>
                    <label>${.price}<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>
        {/}
        </ul>
      </div>
      <form x-bind=submit:addReward>
        <input class=new value={_newReward}>
        <input type=submit value=Add>
      </form>
    </div>
  
  </div>
  
<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>