habitica/views/app/tasks.html
2013-06-02 10:07:15 -04:00

357 lines
18 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<modals:>
<app:modals:modal modalId='streak-achievement-modal' header="Achievement!">
<p>
<div class='achievement achievement-thermometer'></div>You have stacked your "Streaker" Achievement! Every 21 days of streak, you gain 1 achievement point here.
</p>
<@footer>
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</@footer>
</app:modals:modal>
<task-lists:>
<!--helpTitle & helpContent moved to tour -->
<!-- Habits Column -->
<div class="module">
<div class="task-column habits">
<app:tasks:task-list
header="habits"
type="habit"
inputValue={_newHabit}
placeHolder="New Habit"
list={@habits}
main={{@main}}
editable={@editable}
>
<@ads><a href="http://www.amazon.com/gp/product/1400069289/ref=as_li_tf_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1400069289&linkCode=as2&tag=ha0d2-20">The Power of Habit: Why We Do What We Do in Life and Business</a><img src="//www.assoc-amazon.com/e/ir?t=ha0d2-20&l=as2&o=1&a=1400069289" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /></@ads>
</app:tasks:task-list>
</div>
</div>
<!-- Dailys Column -->
<div class="module">
<div class="task-column dailys">
<app:tasks:task-list
header="dailies"
type="daily"
inputValue={_newDaily}
placeHolder="New Daily"
list={@dailys}
main={{@main}}
editable={@editable}
>
<@ads><a href="http://www.amazon.com/gp/product/0142000280/ref=as_li_tf_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=0142000280&linkCode=as2&tag=ha0d2-20">Getting Things Done: The Art of Stress-Free Productivity</a><img src="//www.assoc-amazon.com/e/ir?t=ha0d2-20&l=as2&o=1&a=0142000280" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /></@ads>
</app:tasks:task-list>
</div>
</div>
<!-- Todos Column -->
<div class="module">
<div class="task-column todos tabbable tabs-below">
{{#if @main}}
<!-- todo export/graph options -->
<span class='option-box pull-right'>
{#if _user.history.todos}
<a class="option-action" x-bind=click:toggleChart data-id="todos" rel=tooltip title="Progress"><i class=icon-signal></i></a>
{/}
<a class="option-action" href="/v1/users/{{_user.id}}/calendar.ics?apiToken={{_user.apiToken}}" rel=tooltip title="iCal"><i class=icon-calendar></i></a>
<!-- <a href="https://www.google.com/calendar/render?cid={{encodeiCalLink(_user.id, _user.apiToken)}}" rel=tooltip title="Google Calendar"><i class=icon-calendar></i></a> -->
</span>
{{/}}
<app:tasks:task-list
header="todos"
type="todo"
inputValue="{_newTodo}"
placeHolder="New Todo"
list={@todos}
main={{@main}}
editable={@editable}
>
<@ads><a href="http://www.amazon.com/gp/product/0312430000/ref=as_li_tf_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=0312430000&linkCode=as2&tag=ha0d2-20">The Checklist Manifesto: How to Get Things Right</a><img src="//www.assoc-amazon.com/e/ir?t=ha0d2-20&l=as2&o=1&a=0312430000" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /></@ads>
</app:tasks:task-list>
<button class='task-action-btn tile spacious bright {#unless _showCompleted}hidden{/}' x-bind=click:clearCompleted>Clear Completed</button>
<!-- remaining/completed tabs -->
<ul class="nav nav-tabs">
<li class="{#unless _showCompleted}active{/}"><a x-bind="click:todosShowRemaining">Remaining</a></li>
<li class="{#if _showCompleted}active{/}"><a x-bind="click:todosShowCompleted">Complete</a></li>
</ul>
</div>
</div>
<!-- Rewards Column -->
<div class="module rewards-module">
<div class="task-column rewards">
{{#if @main}}
<!-- cash or gems -->
<span class='option-box pull-right wallet'>
<div class="money">
{gold(floor(_user.stats.gp))}
<span class='shop_gold' rel='tooltip' title='Gold'></span>
</div>
<div class="money">
{silver(_user.stats.gp)}
<span class='shop_silver' rel='tooltip' title='Silver'></span>
</div>
</span>
{{/}}
<app:tasks:task-list
header="rewards"
type="reward"
inputValue="{_newReward}"
placeHolder="New Reward"
list={@rewards}
main={{@main}}
editable={@editable}
>
<@extra>
{{#if @main}}
<!-- Static Rewards -->
<ul class='items {#unless _user.flags.itemsEnabled}hidden{/}'>
<app:rewards:item item={_items.next.weapon} />
<app:rewards:item item={_items.next.armor} />
<app:rewards:item item={_items.next.head} />
<app:rewards:item item={_items.next.shield} />
<app:rewards:item item={{_items.potion}} />
<app:rewards:item item={{_items.reroll}} />
</ul>
{{/}}
</@extra>
<@ads><a href="http://www.amazon.com/gp/product/1594484805/ref=as_li_tf_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1594484805&linkCode=as2&tag=ha0d2-20">Drive: The Surprising Truth About What Motivates Us</a><img src="//www.assoc-amazon.com/e/ir?t=ha0d2-20&l=as2&o=1&a=1594484805" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /></@ads>
</app:tasks:task-list>
</div>
</div>
<!-- Templates -->
<task-list: nonvoid>
<h2 class="task-column_title">{{t(@header)}}</h2>
{{#if equal(@type,'todo')}}<div class="todos-chart" style='display:none;'></div>{{/}}
{#if @editable}
<!-- need {#with} so we can reference model.at() in the submit handler -->
<!-- NOTE: static binding {{}} seems to be required, otherwise things get weird - e.at() is _habitList first time, _habitList.0 second time, etc -->
{{#with @list}}
<form class="addtask-form form-inline new-task-form {#if and(_showCompleted,equal(@type,'todo'))}hidden{/}" data-task-type="{{@type}}" x-bind="submit:addTask">
<span class="addtask-field"><input value="{@inputValue}" type="text" placeholder="{{@placeHolder}}"/></span>
<input class="addtask-btn" type="submit" value="">
</form>
{{/}}
<hr>
{/}
<ul class="{{@type}}s {#unless @list}hidden{/}">
{#each @list as :task}<app:tasks:task main={{@main}} />{/}
</ul>
{{@extra}}
<br/>
<!-- ads -->
{{#if and( _loggedIn, notEqual(_user.flags.ads,'hide'), @main )}}
<span class='pull-right'>
<a x-bind="click:showStripe" rel='tooltip' title='Remove Ads'><i class='icon-remove'></i></a><br/>
<a href="#" data-target="#why-ads-modal" data-toggle="modal" rel='tooltip' title='Why Ads?'><i class='icon-question-sign'></i></a>
</span>
{{@ads}}
{{/}}
<!-- all the parts of a single task -->
<task:>
<li data-id={{:task.id}} class="task {taskClasses(:task, users[_userId].filters, _user.preferences.dayStart, _user.lastCron, _showCompleted, @main)}">
<!-- right-hand side control buttons -->
<div class="task-meta-controls">
<!-- Streak -->
<span class='{#unless :task.streak}hide{/}'>
{:task.streak}<span rel='tooltip' title='Streak Counter'><i class='icon-forward'></i></span>
</span>
<app:filters:applied-filters />
<!-- edit -->
<a x-bind=click:toggleTaskEdit rel=tooltip title="Edit"><i class="icon-pencil"></i></a>
<!-- challenges -->
{{#if :task.challenge}}
{{#if brokenChallengeLink(:task)}}
<i class='icon-bullhorn' style='background-color:red;' x-bind=click:toggleTaskEdit rel=tooltip title="Broken Challenge Link"></i>
{{else}}
<i class='icon-bullhorn' rel=tooltip title="Challenge Task"></i>
{{/}}
{{else}}
<!-- delete -->
<a x-bind=click:del rel=tooltip title="Delete"><i class="icon-trash"></i></a>
{{/}}
<!-- chart -->
{#if :task.history}
<a x-bind=click:toggleChart data-id="{{:task.id}}" rel="tooltip" title="Progress"><i class="icon-signal"></i></a>
{/}
<!-- notes -->
{#if :task.notes}
<span rel="popover" data-trigger="hover" data-placement="left" data-content="{:task.notes}" data-original-title="{:task.text}" class='task-notes'><i class="icon-comment"></i></span>
{/}
</div>
<!-- left-hand side checkbox -->
<div class="task-controls task-primary">
<!-- Habits -->
{{#if equal(:task.type,'habit')}}
{{#if @main}} <!-- only allow scoring on main tasks, not when viewing others' public tasks or when creating challenges -->
{#if :task.up}<a class="task-action-btn" data-direction=up x-bind=click:score></a>{/}
{#if :task.down}<a class="task-action-btn" data-direction=down x-bind=click:score></a>{/}
{{else}}
{#if :task.up}<span class="task-action-btn"></span>{/}
{#if :task.down}<span class="task-action-btn"></span>{/}
{{/}}
<!-- Rewards -->
{{else if equal(:task.type,'reward')}}
{{#if @main}} <!-- only allow scoring on main tasks, not when viewing others' public tasks or when creating challenges -->
<a class="money btn-buy" x-bind=click:score data-direction=down>
<span class="reward-cost">{:task.value}</span>
<span class='shop_gold'></span>
</a>
{{else}}
<span class="money btn-buy">
<span class="reward-cost">{:task.value}</span>
<span class='shop_gold'></span>
</span>
{{/}}
<!-- Daily & Todos -->
{{else}}
<span class="task-checker action-yesno">
{{#if @main}} <!-- only allow scoring on main tasks, not when viewing others' public tasks or when creating challenges -->
<input type=checkbox id="box-{{:task.id}}" class="visuallyhidden focusable" checked="{:task.completed}">
<label for="box-{{:task.id}}"></label>
{{else}}
<input type=checkbox id="box-{{:task.id}}-static" class="visuallyhidden focusable" checked="false">
<label for="box-{{:task.id}}-static"></label>
{{/}}
</span>
{{/}}
</div>
<!-- main content -->
<p class="task-text">
{{#if taskInChallenge(:task)}}
{{taskAttrFromChallenge(:task,'text')}}
{{else}}
{:task.text}
{{/}}
</p>
<!-- edit/options dialog -->
<app:tasks:taskMeta main={{@main}} />
</li>
<!-- task edit/options -->
<taskMeta:>
<div class="{#unless _tasks.editing[:task.id]}visuallyhidden{/} task-options">
{{#if brokenChallengeLink(:task)}}
<div class='well'>
<p>Broken Challenge Link: this task was part of a challenge, but (a) challenge (or containing group) has been deleted, or (b) the task was deleted from the challenge.</p>
<p><a>Keep</a> | <a>Keep all from challenge</a> | <a>Delete</a> | <a>Delete all from challenge</a></p>
</div>
{{/}}
<form x-bind="submit:toggleTaskEdit" >
<!-- text & notes -->
<fieldset class="option-group">
{{#unless taskInChallenge(:task)}}
<label class="option-title">Text</label><input class="option-content" type=text value={:task.text}>
{{/}}
<label class="option-title">Extra Notes</label>
{{#if taskInChallenge(:task)}}
<textarea class="option-content" rows=3 disabled>{{taskAttrFromChallenge(:task,'notes')}}</textarea>
{{else}}
<textarea class="option-content" rows=3>{:task.notes}</textarea>
{{/}}
</fieldset>
<!-- if Habit, plus/minus command options -->
{#if equal(:task.type, 'habit')}
{#unless taskInChallenge(:task)}
<fieldset class="option-group">
<legend class="option-title">Direction/Actions</legend>
<span class="task-checker action-plusminus select-toggle">
<input class="visuallyhidden focusable" type=checkbox id="{{:task.id}}-option-plus" checked={:task.up}>
<label for="{{:task.id}}-option-plus"></label>
</span>
<span class="task-checker action-plusminus select-toggle">
<input class="visuallyhidden focusable" type=checkbox id="{{:task.id}}-option-minus" checked={:task.down}>
<label for="{{:task.id}}-option-minus"></label>
</span>
</fieldset>
{/}
<!-- if Daily, calendar -->
{else if equal(:task.type, 'daily')}
<fieldset class="option-group">
<legend class="option-title">Repeat</legend>
<div class="task-controls tile-group repeat-days">
<!-- note, does not use data-toggle="buttons-checkbox" - it would interfere with our own click binding -->
<button type="button" class="task-action-btn tile {#if :task.repeat.su}active{/}" data-day='su' x-bind=click:toggleDay>Su</button>
<button type="button" class="task-action-btn tile {#if :task.repeat.m}active{/}" data-day='m' x-bind=click:toggleDay>M</button>
<button type="button" class="task-action-btn tile {#if :task.repeat.t}active{/}" data-day='t' x-bind=click:toggleDay>T</button>
<button type="button" class="task-action-btn tile {#if :task.repeat.w}active{/}" data-day='w' x-bind=click:toggleDay>W</button>
<button type="button" class="task-action-btn tile {#if :task.repeat.th}active{/}" data-day='th' x-bind=click:toggleDay>Th</button>
<button type="button" class="task-action-btn tile {#if :task.repeat.f}active{/}" data-day='f' x-bind=click:toggleDay>F</button>
<button type="button" class="task-action-btn tile {#if :task.repeat.s}active{/}" data-day='s' x-bind=click:toggleDay>S</button>
</div>
</fieldset>
<!-- if Reward, pricing -->
{else if equal(:task.type, 'reward')}
<fieldset class="option-group option-short">
<legend class="option-title">Price</legend>
<input class="option-content" size="16" type="number" min="0" value={:task.value}>
<div class="money input-suffix"><span class='shop_gold'></span></div>
</fieldset>
<!-- if Todo, the due date -->
{else if equal(:task.type, 'todo')}
<fieldset class="option-group">
<legend class="option-title">Due Date</legend>
<input class="option-content datepicker" type="text" value="{:task.date}" data-date-format="mm/dd/yyyy">
</fieldset>
{/}
{{#if @main}}<app:filters:filter-fieldgroup />{{/}}
<!-- Advanced Options -->
{#unless equal(:task.type, 'reward')}
<p x-bind="click:tasksToggleAdvanced" class="option-title mega">Advanced Options</p>
<fieldset class="option-group advanced-option visuallyhidden">
<legend class="option-title"><a class='priority-multiplier-help' href="https://trello.com/card/priority-multiplier/50e5d3684fe3a7266b0036d6/17" target="_blank"><i class='icon-question-sign'></i></a> Difficulty</legend>
{{#if taskInChallenge(:task)}}
<button disabled type="button" class="task-action-btn tile active">
{{taskAttrFromChallenge(:task,'priority')}}
</button>
{{else}}
<div class="task-controls tile-group priority-multiplier" data-id="{{:task.id}}">
<button type="button" class="task-action-btn tile {#if or(equal(:task.priority,'!'),not(:task.priority))}active{/}" data-priority='!' x-bind=click:tasksSetPriority>Easy</button>
<button type="button" class="task-action-btn tile {#if equal(:task.priority,'!!')}active{/}" data-priority='!!' x-bind=click:tasksSetPriority>Medium</button>
<button type="button" class="task-action-btn tile {#if equal(:task.priority,'!!!')}active{/}" data-priority='!!!' x-bind=click:tasksSetPriority>Hard</button>
</div>
{{/}}
{{#if equal(:task.type,'daily')}}
<legend class="option-title">Restore Streak</legend>
<input class='option-content' type=number value="{int(:task.streak)}" />
{{/}}
</fieldset>
{/}
<button type=submit class="task-action-btn tile spacious" x-bind="click:tasksSaveAndClose">Save & Close</button>
</form>
</div>
<div style="display:none;" class={{:task.id}}-chart></div>