script(id='partials/options.profile.avatar.html', type='text/ng-template') .row-fluid .span4 h3 Body small. 2 / locked h5 Size .btn-group button.btn.btn-small(ng-class='{active: user.preferences.size=="slim"}', ng-click='set({"preferences.size":"slim"})') Slim button.btn.btn-small(ng-class='{active: user.preferences.size=="broad"}', ng-click='set({"preferences.size":"broad"})') Broad menu(type='list') li.customize-menu menu(label='Shirts') each shirt in ['black', 'blue', 'green', 'pink', 'white', 'yellow'] button.customize-option(class='{{user.preferences.size}}_shirt_'+shirt, type='button', ng-click='set({"preferences.shirt":"'+shirt+'"})') menu(label='Special Shirts') each shirt in ['convict', 'cross', 'fire', 'horizon', 'ocean', 'purple', 'rainbow', 'redblue', 'thunder', 'tropical', 'zombie'] button.customize-option(type='button', class='{{user.preferences.size}}_shirt_'+shirt, ng-class='{locked: !user.purchased.shirt.'+shirt+'}', ng-click='unlock("shirt.'+shirt+'")') menu button.btn.btn-small.btn-primary(ng-hide="user.purchased.shirt.convict && user.purchased.shirt.cross && user.purchased.shirt.fire && user.purchased.shirt.horizon && user.purchased.shirt.ocean && user.purchased.shirt.purple && user.purchased.shirt.rainbow && user.purchased.shirt.redblue && user.purchased.shirt.thunder && user.purchased.shirt.tropical && user.purchased.shirt.zombie", ng-click='unlock("shirt.convict,shirt.cross,shirt.fire,shirt.horizon,shirt.ocean,shirt.purple,shirt.rainbow,shirt.redblue,shirt.thunder,shirt.tropical,shirt.zombie")') Unlock Set - 5 .span4 h3 Head small. 2 / locked menu(type='list') // Color li.customize-menu menu(label='Color') button(type='button', class='customize-option', style='width: 40px; height: 40px; background-color:#c8c8c8;', ng-click='set({"preferences.hair.color": "white"})') button(type='button', class='customize-option', style='width: 40px; height: 40px; background-color:#903a00;', ng-click='set({"preferences.hair.color": "brown"})') button(type='button', class='customize-option', style='width: 40px; height: 40px; background-color:#cfb853;', ng-click='set({"preferences.hair.color": "blond"})') button(type='button', class='customize-option', style='width: 40px; height: 40px; background-color:#ec720f;', ng-click='set({"preferences.hair.color": "red" })') button(type='button', class='customize-option', style='width: 40px; height: 40px; background-color:#2e2e2e;', ng-click='set({"preferences.hair.color": "black"})') // Special Events li.customize-menu.well.limited-edition .label.label-info.pull-right(popover='Available for purchase until January 31st (but permanently in your options if purchased).', popover-title='Limited Edition', popover-placement='right', popover-trigger='mouseenter') | Limited Edition  i.icon.icon-question-sign menu(label='Winter Colors') each color in ['candycane','frost','winternight','holly'] button(type='button', ng-class='{locked: !user.purchased.hair.color.#{color}}', class='customize-option hair_bangs_1_#{color}', style='width: 40px; height: 40px;', ng-click='unlock("hair.color.#{color}")') button.btn.btn-small.btn-primary(ng-hide='user.purchased.hair.color.candycane && user.purchased.hair.color.frost && user.purchased.hair.color.winternight && user.purchased.hair.color.holly', ng-click='unlock("hair.color.candycane,hair.color.frost,hair.color.winternight,hair.color.holly")') Unlock Set - 5 h5 Hair // Bangs li.customize-menu menu(label='Bangs') button(class='head_0 customize-option', type='button', ng-click='set({"preferences.hair.bangs":0})') button(class='hair_bangs_1_{{user.preferences.hair.color}} customize-option', type='button', ng-click='set({"preferences.hair.bangs":1})') button(class='hair_bangs_2_{{user.preferences.hair.color}} customize-option', type='button', ng-click='set({"preferences.hair.bangs":2})') button(class='hair_bangs_3_{{user.preferences.hair.color}} customize-option', type='button', ng-click='set({"preferences.hair.bangs":3})') // Base li.customize-menu menu(label='Base') button(class='head_0 customize-option', type='button', ng-click='set({"preferences.hair.base":0})') button(class='hair_base_1_{{user.preferences.hair.color}} customize-option', type='button', ng-click='set({"preferences.hair.base":1})') button(class='hair_base_2_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.base.2}', ng-click='unlock("hair.base.2")') button(class='hair_base_3_{{user.preferences.hair.color}} customize-option', type='button', ng-click='set({"preferences.hair.base":3})') button(class='hair_base_4_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.base.4}', ng-click='unlock("hair.base.4")') button(class='hair_base_5_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.base.5}', ng-click='unlock("hair.base.5")') button(class='hair_base_6_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.base.6}', ng-click='unlock("hair.base.6")') button(class='hair_base_7_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.base.7}', ng-click='unlock("hair.base.7")') button(class='hair_base_8_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.base.8}', ng-click='unlock("hair.base.8")') button.btn.btn-small.btn-primary(ng-hide='user.purchased.hair.base.2 && user.purchased.hair.base.4 && user.purchased.hair.base.5 && user.purchased.hair.base.6 && user.purchased.hair.base.7 && user.purchased.hair.base.8', ng-click='unlock("hair.base.2,hair.base.4,hair.base.5,hair.base.6,hair.base.7,hair.base.8")') Unlock Set - 5 h5 Facial Hair // Beard li.customize-menu menu(label='Beard') button(class='head_0 customize-option', type='button', ng-click='set({"preferences.hair.beard":0})') button(class='hair_beard_1_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.beard.1}', ng-click='unlock("hair.beard.1")') button(class='hair_beard_2_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.beard.2}', ng-click='unlock("hair.beard.2")') button(class='hair_beard_3_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.beard.3}', ng-click='unlock("hair.beard.3")') // Mustache li.customize-menu menu(label='Mustache') button(class='head_0 customize-option', type='button', ng-click='set({"preferences.hair.mustache":0})') button(class='hair_mustache_1_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.mustache.1}', ng-click='unlock("hair.mustache.1")') button(class='hair_mustache_2_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.mustache.2}', ng-click='unlock("hair.mustache.2")') button.btn.btn-small.btn-primary(ng-hide='user.purchased.hair.mustache.1 && user.purchased.hair.mustache.2 && user.purchased.hair.beard.1 && user.purchased.hair.beard.2 && user.purchased.hair.beard.3', ng-click='unlock("hair.mustache.1,hair.mustache.2,hair.beard.1,hair.beard.2,hair.beard.3")') Unlock Set - 5 .span4 h3 Skin small. 2 / locked // skin li.customize-menu menu(label='Basic Skins') button.customize-option(type='button', class='skin_ddc994', ng-click='set({"preferences.skin":"ddc994" })') button.customize-option(type='button', class='skin_f5a76e', ng-click='set({"preferences.skin":"f5a76e" })') button.customize-option(type='button', class='skin_ea8349', ng-click='set({"preferences.skin":"ea8349" })') button.customize-option(type='button', class='skin_c06534', ng-click='set({"preferences.skin":"c06534" })') button.customize-option(type='button', class='skin_98461a', ng-click='set({"preferences.skin":"98461a" })') button.customize-option(type='button', class='skin_915533', ng-click='set({"preferences.skin":"915533" })') button.customize-option(type='button', class='skin_c3e1dc', ng-click='set({"preferences.skin":"c3e1dc" })') button.customize-option(type='button', class='skin_6bd049', ng-click='set({"preferences.skin":"6bd049" })') // Rainbow Skin h5. Rainbow Skins //menu(label='Rainbow Skins (2G / skin)') menu button.customize-option(type='button', class='skin_eb052b', ng-class='{locked: !user.purchased.skin.eb052b}', ng-click='unlock("skin.eb052b")') button.customize-option(type='button', class='skin_f69922', ng-class='{locked: !user.purchased.skin.f69922}', ng-click='unlock("skin.f69922")') button.customize-option(type='button', class='skin_f5d70f', ng-class='{locked: !user.purchased.skin.f5d70f}', ng-click='unlock("skin.f5d70f")') button.customize-option(type='button', class='skin_0ff591', ng-class='{locked: !user.purchased.skin.0ff591}', ng-click='unlock("skin.0ff591")') button.customize-option(type='button', class='skin_2b43f6', ng-class='{locked: !user.purchased.skin.2b43f6}', ng-click='unlock("skin.2b43f6")') button.customize-option(type='button', class='skin_d7a9f7', ng-class='{locked: !user.purchased.skin.d7a9f7}', ng-click='unlock("skin.d7a9f7")') button.customize-option(type='button', class='skin_800ed0', ng-class='{locked: !user.purchased.skin.800ed0}', ng-click='unlock("skin.800ed0")') button.customize-option(type='button', class='skin_rainbow', ng-class='{locked: !user.purchased.skin.rainbow}', ng-click='unlock("skin.rainbow")') button.btn.btn-small.btn-primary(ng-hide='user.purchased.skin.eb052b && user.purchased.skin.f69922 && user.purchased.skin.f5d70f && user.purchased.skin.0ff591 && user.purchased.skin.2b43f6 && user.purchased.skin.d7a9f7 && user.purchased.skin.800ed0 && user.purchased.skin.rainbow', ng-click='unlock("skin.eb052b,skin.f69922,skin.f5d70f,skin.0ff591,skin.2b43f6,skin.d7a9f7,skin.800ed0,skin.rainbow")') Unlock Set - 5 // Special Events // restore to d4df481 to see purchasing + "limited edition" code div(ng-if='user.purchased.skin.monster || user.purchased.skin.pumpkin || user.purchased.skin.skeleton || user.purchased.skin.zombie || user.purchased.skin.ghost || user.purchased.skin.shadow') h5 Spooky Skins menu button.customize-option(type='button', class='skin_monster', ng-if='user.purchased.skin.monster', ng-click='unlock("skin.monster")') button.customize-option(type='button', class='skin_pumpkin', ng-if='user.purchased.skin.pumpkin', ng-click='unlock("skin.pumpkin")') button.customize-option(type='button', class='skin_skeleton', ng-if='user.purchased.skin.skeleton', ng-click='unlock("skin.skeleton")') button.customize-option(type='button', class='skin_zombie', ng-if='user.purchased.skin.zombie', ng-click='unlock("skin.zombie")') button.customize-option(type='button', class='skin_ghost', ng-if='user.purchased.skin.ghost', ng-click='unlock("skin.ghost")') button.customize-option(type='button', class='skin_shadow', ng-if='user.purchased.skin.shadow', ng-click='unlock("skin.shadow")') script(id='partials/options.profile.stats.html', type='text/ng-template') .row-fluid .border-right(ng-class='user.flags.classSelected && !user.preferences.disableClasses ? "span4" : "span6"') include ../shared/profiles/stats .span4.border-right.allocate-stats(ng-if='user.flags.classSelected && !user.preferences.disableClasses') h4 | {{user.stats.class}}  a.btn.btn-danger.btn-mini(ng-click='changeClass(null)') | Change & Re-Roll  small 3 h6 Points: {{user.stats.points}} fieldset.auto-allocate label.checkbox input(type='checkbox', ng-model='user.preferences.automaticAllocation', ng-change='set({"preferences.automaticAllocation": user.preferences.automaticAllocation?true: false})') | Automatic Allocation i.icon-question-sign(popover-trigger='mouseenter', popover-placement='bottom', popover="When 'automatic' is checked, your points will be allocated to the stat representing your task focus (see Task > Edit). When unchecked, you'll have one point to allocate each level. The system makes a suggestion, but you can ignore the suggestion.") table.table.table-striped tr td i.icon-question-sign(popover-title='Strength', popover='Strength increases damage you inflict to tasks (reducing redness), and increases critical hit chance.', popover-trigger='mouseenter') |  STR: {{user.stats.str}} td a.btn.btn-primary(ng-show='user.stats.points', ng-click='allocate("str")') + tr td i.icon-question-sign(popover-title='Constitution', popover='Constitution decreases damage inflicted by tasks, and increases the effectiveness of healing and buff spells.', popover-trigger='mouseenter') |  CON: {{user.stats.con}} td a.btn.btn-primary(ng-show='user.stats.points', ng-click='allocate("con")') + tr td i.icon-question-sign(popover-title='Perception', popover='Perception increases drops and gold, and can help with critical hits by spells.', popover-trigger='mouseenter') |  PER: {{user.stats.per}} td a.btn.btn-primary(ng-show='user.stats.points', ng-click='allocate("per")') + tr td i.icon-question-sign(popover-title='Intelligence', popover='Intelligence increases your overall mana, spell effectiveness, and experience gain.', popover-trigger='mouseenter') |  INT: {{user.stats.int}} td a.btn.btn-primary(ng-show='user.stats.points', ng-click='allocate("int")') + div(ng-class='user.flags.classSelected && !user.preferences.disableClasses ? "span4" : "span6"') include ../shared/profiles/achievements script(id='partials/options.profile.profile.html', type='text/ng-template') button.btn.btn-default(ng-click='_editing.profile = true', ng-show='!_editing.profile') Edit button.btn.btn-primary(ng-click='save()', ng-show='_editing.profile') Save div(ng-show='!_editing.profile') h4 Display Name span(ng-show='profile.profile.name') {{profile.profile.name}} span.muted(ng-hide='profile.profile.name') - None - h4 Photo img(ng-show='profile.profile.imageUrl', ng-src='{{profile.profile.imageUrl}}') span.muted(ng-hide='profile.profile.imageUrl') - None - h4 Blurb markdown(ng-show='profile.profile.blurb', ng-model='profile.profile.blurb') span.muted(ng-hide='profile.profile.blurb') - None - //{{profile.profile.blurb | linky:'_blank'}} div.whatever-options(ng-show='_editing.profile') // TODO use photo-upload instead: https://groups.google.com/forum/?fromgroups=#!topic/derbyjs/xMmADvxBOak .control-group.option-large label.control-label Display Name input.option-content(type='text', placeholder='Full Name', ng-model='editingProfile.name') .control-group.option-large label.control-label Photo Url input.option-content(type='url', ng-model='editingProfile.imageUrl', placeholder='Image Url') .control-group.option-large label.control-label Blurb textarea.option-content(style='height:15em;', placeholder='Blurb', ng-model='editingProfile.blurb') include ../shared/formatting-help script(id='partials/options.profile.html', type="text/ng-template") ul.nav.nav-tabs li(ng-class="{ active: $state.includes('options.profile.avatar') }") a(ui-sref='options.profile.avatar') | Avatar li(ng-class="{ active: $state.includes('options.profile.stats') }") a(ui-sref='options.profile.stats') | Stats & Achievements li(ng-class="{ active: $state.includes('options.profile.profile') }") a(ui-sref='options.profile.profile') | Profile .tab-content .tab-pane.active div(ui-view)