mirror of
https://github.com/sudoxnym/habitica.git
synced 2026-08-01 15:31:16 +00:00
203 lines
9.5 KiB
HTML
203 lines
9.5 KiB
HTML
<modals:>
|
|
{{#each _partyMembers as :profile}}
|
|
<app:modals:modal modalId="avatar-modal-{{:profile.id}}">
|
|
<app:avatar:profile profile={{:profile}} />
|
|
<@footer>
|
|
<button data-dismiss="modal" class="btn btn-success">Ok</button>
|
|
</@footer>
|
|
</app:modals:modal>
|
|
{{/}}
|
|
|
|
<avatar:>
|
|
<figure class="herobox"
|
|
data-name="{username(@profile.auth, @profile.profile.name)}"
|
|
data-level="{@profile.stats.lvl}"
|
|
data-checkpet="{#if @profile.items.pet}hasPet{/}"
|
|
data-checkuser="{{#if @main}}isUser{{/}}"
|
|
data-uid="{{@profile.id}}" x-bind="click:clickAvatar"
|
|
rel="popover" 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(@profile.stats.hp, 50)}%;'></div>
|
|
</div>
|
|
<div class='progress progress-warning' style='height:5px;'>
|
|
<div class='bar' style='height: 5px; width: {percent(@profile.stats.exp, tnl(@profile.stats.lvl))}%;'></div>
|
|
</div>
|
|
<div>Level: {@profile.stats.lvl}</div>
|
|
<div>GP: {floor(@profile.stats.gp)}</div>
|
|
<div>{count(@profile.items.pets)} / 90 Pets Found</div>
|
|
</div>
|
|
">
|
|
<div class='character-sprites'>
|
|
{#with @profile.preferences as :p}
|
|
<span class='{:p.gender}_skin_{:p.skin}'></span>
|
|
<span class='{:p.gender}_hair_{:p.hair}'></span>
|
|
<span class="{equipped(@profile, 'armor')}"></span>
|
|
{#if :p.showHelm}
|
|
<span class="{equipped(@profile, 'head')}"></span>
|
|
{else}
|
|
<span class="{:p.gender}_head_0"></span>
|
|
{/}
|
|
<span class='{:p.gender}_shield_{@profile.items.shield}'></span>
|
|
<span class='{:p.gender}_weapon_{@profile.items.weapon}'></span>
|
|
{/}
|
|
{#if and(@profile.items.currentPet, not(@minimal))}
|
|
<span class="Pet-{@profile.items.currentPet.name}-{@profile.items.currentPet.modifier} current-pet" ></span>
|
|
{/}
|
|
</div>
|
|
</figure>
|
|
|
|
<customize:>
|
|
|
|
<!-- customization options -->
|
|
{#with _user.preferences as :p}
|
|
<menu type="list">
|
|
<!-- gender -->
|
|
<li class="customize-menu">
|
|
<menu label="Head">
|
|
<button type="button" class="m_head_0 customize-option" data-value="m" x-bind="click:customizeGender"></button>
|
|
<button type="button" class="f_head_0 customize-option" data-value="f" x-bind="click:customizeGender"></button>
|
|
</menu>
|
|
<label class="checkbox">
|
|
<input type=checkbox checked="{_user.preferences.showHelm}" /> Show Helm
|
|
</label>
|
|
|
|
</li>
|
|
|
|
<!-- hair -->
|
|
<li class="customize-menu">
|
|
<menu label="Hair">
|
|
<button type="button" class="{:p.gender}_hair_blond customize-option" data-value="blond" x-bind="click:customizeHair"></button>
|
|
<button type="button" class="{:p.gender}_hair_black customize-option" data-value="black" x-bind="click:customizeHair"></button>
|
|
<button type="button" class="{:p.gender}_hair_brown customize-option" data-value="brown" x-bind="click:customizeHair"></button>
|
|
<button type="button" class="{:p.gender}_hair_white customize-option" data-value="white" x-bind="click:customizeHair"></button>
|
|
</menu>
|
|
</li>
|
|
|
|
<!-- skin -->
|
|
<li class="customize-menu">
|
|
<menu label="Skin">
|
|
<button type="button" class='{:p.gender}_skin_dead customize-option' data-value="dead" x-bind="click:customizeSkin"></button>
|
|
<button type="button" class='{:p.gender}_skin_orc customize-option' data-value="orc" x-bind="click:customizeSkin"></button>
|
|
<button type="button" class='{:p.gender}_skin_asian customize-option' data-value="asian" x-bind="click:customizeSkin"></button>
|
|
<button type="button" class='{:p.gender}_skin_black customize-option' data-value="black" x-bind="click:customizeSkin"></button>
|
|
<button type="button" class='{:p.gender}_skin_white customize-option' data-value="white" x-bind="click:customizeSkin"></button>
|
|
</menu>
|
|
</li>
|
|
</menu>
|
|
|
|
{#if equal(_user.preferences.gender, 'f')} <!-- Sorry boys -->
|
|
<menu type="list">
|
|
<li class="customize-menu">
|
|
<menu label="Clothing">
|
|
<button type="button" class="f_armor_0_v1 customize-option" data-value="v1" x-bind="click:customizeArmorSet"></button>
|
|
<button type="button" class="f_armor_0_v2 customize-option" data-value="v2" x-bind="click:customizeArmorSet"></button>
|
|
</menu>
|
|
</li>
|
|
</menu>
|
|
{/}
|
|
{/}
|
|
|
|
<profile-edit:>
|
|
<!--<a class='btn btn-success' x-bind="click:profileSave">Save</a>-->
|
|
<!-- TODO use photo-upload instead: https://groups.google.com/forum/?fromgroups=#!topic/derbyjs/xMmADvxBOak -->
|
|
<img class='pull-right' src="{_user.profile.imageUrl}" />
|
|
<div class="control-group">
|
|
<label class="control-label" for="profileImageUrl">Photo Url</label>
|
|
<div class="controls">
|
|
<input type="url" id="profileImageUrl" value="{_user.profile.imageUrl}" placeholder="Image Url"/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="control-group">
|
|
<label class="control-label" for="profileFullName">Full Name</label>
|
|
<div class="controls">
|
|
<input type="text" id="profileFullName" placeholder="Full Name" value="{_user.profile.name}" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="control-group">
|
|
<label class="control-label" for="profileBlurb">Blurb</label>
|
|
<div class="controls">
|
|
<textarea id="profileBlurb" placeholder="Blurb" >{_user.profile.blurb}</textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="control-group">
|
|
<label class="control-label" for="profileWebsite">Websites</label>
|
|
<div class="controls">
|
|
<form x-bind="submit:profileAddWebsite">
|
|
<input type="url" id="profileWebsite" value="{_newProfileWebsite}" placeholder="Add Website"/>
|
|
</form>
|
|
</div>
|
|
<ul>
|
|
<!-- would prefer if there were and index in #each, instead using data-website to search with indexOf -->
|
|
{#each _user.profile.websites as :website}
|
|
<li>{:website} <a data-website="{:website}" x-bind="click:profileRemoveWebsite"><i class='icon-remove'></i></a></li>
|
|
{/}
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
<profile:>
|
|
<div class='row-fluid'>
|
|
<div class='span6'>
|
|
<h3>{{username(@profile.auth, @profile.profile.name)}}</h3>
|
|
{{#if @profile.profile.imageUrl}}
|
|
<img src="{{@profile.profile.imageUrl}}" />
|
|
{{/}}
|
|
{{#if @profile.profile.blurb}}
|
|
<p>{{@profile.profile.blurb}}</p>
|
|
{{/}}
|
|
{{#if @profile.profile.websites}}
|
|
<ul>
|
|
{{#each @profile.profile.websites as :website}}
|
|
<li>{{:website}}</li>
|
|
{{/}}
|
|
</ul>
|
|
{{/}}
|
|
</div>
|
|
<div class='span6'>
|
|
<h3>Achievements</h3>
|
|
<app:avatar:achievements profile={{@profile}} />
|
|
</div>
|
|
</div>
|
|
|
|
<achievements:>
|
|
<div class='achievements-container'>
|
|
<!--<div class='achievement achievement-sword'></div>-->
|
|
<!--<div class='achievement achievement-tree'></div>-->
|
|
<!--<div class='achievement achievement-comment'></div>-->
|
|
<!--<div class='achievement achievement-armor'></div>-->
|
|
<!--<div class='achievement achievement-cave'></div>-->
|
|
<!--<div class='achievement achievement-sun'></div>-->
|
|
<!--<div class='achievement achievement-boot'></div>-->
|
|
<!--<div class='achievement achievement-coffin'></div>-->
|
|
<!--<div class='achievement achievement-alien'></div>-->
|
|
<!--<div class='achievement achievement-ninja'></div>-->
|
|
<!--<div class='achievement achievement-cactus'></div>-->
|
|
<!--<div class='achievement achievement-bow'></div>-->
|
|
<!--<div class='achievement achievement-heart'></div>-->
|
|
<!--<div class='achievement achievement-shield'></div>-->
|
|
<!--<div class='achievement achievement-thermometer'></div>-->
|
|
<!--<div class='achievement achievement-firefox'></div>-->
|
|
<!--<div class='achievement achievement-karaoke'></div>-->
|
|
{#if @profile.achievements.originalUser}
|
|
<div class='achievement achievement-cake'></div>Original User
|
|
<hr/>
|
|
{/}
|
|
{#if @profile.achievements.beastMaster}
|
|
<div class='achievement achievement-rat'></div>Beast Master
|
|
<hr/>
|
|
{/}
|
|
{#if @profile.achievements.ultimateGear}
|
|
<div class='achievement achievement-helm'></div>Ultimate Gear
|
|
<hr/>
|
|
{/}
|
|
|
|
</div>
|
|
|
|
<inventory:>
|
|
<!-- we'll have other inventory here later too, like enchantments, quest scrolls, etc -->
|
|
<app:pets:inventory/>
|
|
|