sudoxreboot/habitica
1
0
Fork 0
mirror of https://github.com/sudoxnym/habitica.git synced 2026-08-05 12:02:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

begin adding toggle-header

Browse source
This commit is contained in:
Tyler Renelle 2013-03-15 16:47:48 -04:00
parent d8918790e5
commit 823f524d57
2 changed files with 47 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/app/character.coffee
View file

@ -89,6 +89,9 @@ module.exports.app = (appExports, model) ->
batch.set $(this).attr('data-for'), parseInt($(this).val() || 1)
batch.commit()
appExports.toggleHeader = (e, el) ->
user.set 'preferences.hideHeader', !user.get('preferences.hideHeader')
user.on 'set', 'flags.customizationsNotification', (captures, args) ->
return unless captures == true
$('.main-avatar').popover('destroy') #remove previous popovers

85
views/app/header.html
View file

@ -1,52 +1,55 @@
<header:>
<div class="row-fluid">
<div class='char-status {#if gt(_partyMembers.length,1)}span8 offset2 has-party{else}span6 offset3{/}'>
<a x-bind="click:toggleHeader">[toggle header]</a>
{#unless _user.preferences.hideHeader}
<div class="row-fluid">
<div class='char-status {#if gt(_partyMembers.length,1)}span8 offset2 has-party{else}span6 offset3{/}'>
<!-- avatar -->
<figure class="main-avatar-wrap">
<app:avatar:avatar profile={_user} main="true" />
</figure>
<!-- avatar -->
<figure class="main-avatar-wrap">
<app:avatar:avatar profile={_user} main="true" />
</figure>
<!-- party -->
{{#each _partyMembers as :member}}
{{#unless equal(:member.id, _userId)}}
<figure class="party-avatar-wrap" rel="popover" data-title="{{username(:member.auth)}}" data-placement="bottom" data-trigger="hover" data-html="true" data-content="
<div>
<div class='progress progress-danger' style='height:5px;'>
<div class='bar' style='height: 5px; width: {percent(:member.stats.hp, 50)}%;'></div>
<!-- party -->
{{#each _partyMembers as :member}}
{{#unless equal(:member.id, _userId)}}
<figure class="party-avatar-wrap" rel="popover" data-title="{{username(:member.auth)}}" data-placement="bottom" data-trigger="hover" data-html="true" data-content="
<div>
<div class='progress progress-danger' style='height:5px;'>
<div class='bar' style='height: 5px; width: {percent(:member.stats.hp, 50)}%;'></div>
</div>
<div class='progress progress-warning' style='height:5px;'>
<div class='bar' style='height: 5px; width: {percent(:member.stats.exp, tnl(:member.stats.lvl))}%;'></div>
</div>
<div>GP: {{floor(:member.stats.gp)}}</div>
</div>
<div class='progress progress-warning' style='height:5px;'>
<div class='bar' style='height: 5px; width: {percent(:member.stats.exp, tnl(:member.stats.lvl))}%;'></div>
</div>
<div>GP: {{floor(:member.stats.gp)}}</div>
</div>
">
<!-- Would be way cleaner as a Derby template `data-content="<app:party:member-stats profile={{:member}} />"`, but it was just printing HTML as text -->
">
<!-- Would be way cleaner as a Derby template `data-content="<app:party:member-stats profile={{:member}} />"`, but it was just printing HTML as text -->
<app:avatar:avatar profile={{:member}} party="true" />
</figure>
<app:avatar:avatar profile={{:member}} party="true" />
</figure>
{{/}}
{{/}}
{{/}}
<!-- progress bars -->
<div class="progress-bars">
<div class="progress progress-danger" rel=tooltip data-placement=bottom title="Health">
<div class="bar" style="width: {percent(_user.stats.hp, 50)}%;"></div>
<span class="progress-text"><i class=icon-heart></i> {ceil(_user.stats.hp)} / 50</span>
</div>
<!-- progress bars -->
<div class="progress-bars">
<div class="progress progress-danger" rel=tooltip data-placement=bottom title="Health">
<div class="bar" style="width: {percent(_user.stats.hp, 50)}%;"></div>
<span class="progress-text"><i class=icon-heart></i> {ceil(_user.stats.hp)} / 50</span>
</div>
<div class="progress progress-warning" rel=tooltip data-placement=bottom title="Experience">
<div class="bar" style="width: {percent(_user.stats.exp,tnl(_user.stats.lvl))}%;"></div>
<span class="progress-text">
{#if _user.history.exp}
<a x-bind=click:toggleChart data-toggle-id="exp-chart" data-history-path="_user.history.exp" rel=tooltip title="Progress"><i class=icon-signal></i></a>&nbsp;
{/}
<i class=icon-star></i> {floor(_user.stats.exp)} / {tnl(_user.stats.lvl)}
</span>
<div class="progress progress-warning" rel=tooltip data-placement=bottom title="Experience">
<div class="bar" style="width: {percent(_user.stats.exp,tnl(_user.stats.lvl))}%;"></div>
<span class="progress-text">
{#if _user.history.exp}
<a x-bind=click:toggleChart data-toggle-id="exp-chart" data-history-path="_user.history.exp" rel=tooltip title="Progress"><i class=icon-signal></i></a>&nbsp;
{/}
<i class=icon-star></i> {floor(_user.stats.exp)} / {tnl(_user.stats.lvl)}
</span>
</div>
<div id="exp-chart" style="display:none;"></div>
</div>
<div id="exp-chart" style="display:none;"></div>
<!-- end .char-status -->
</div>
<!-- end .char-status -->
<!-- end .row-fluid -->
</div>
<!-- end .row-fluid -->
</div>
{/}