diff --git a/views/options/profile.jade b/views/options/profile.jade index 68b1158dc3..fa1b20bb22 100644 --- a/views/options/profile.jade +++ b/views/options/profile.jade @@ -7,6 +7,17 @@ mixin gemCost(cost) // Make it a mixin so we can call it from mobile mixin customizeProfile(mobile) + + mixin buyPref(path,colors,title,status) + li.customize-menu(ng-if='#{status=="disabled" ? "user.purchased."+path+"."+colors.join(" || user.purchased."+path+".") : true}', class=~["limited","seasonal"].indexOf(status) ? "well limited-edition" : "") + if ~['limited','seasonal'].indexOf(status) + .label.label-info.pull-right.hint(popover=limited, popover-title=env.t(status+'Edition'), popover-placement='right', popover-trigger='mouseenter')=env.t(status+'Edition') + menu(label=env.t(title)) + +gemCost(2) + button.btn.btn-xs(ng-hide='#{status=="disabled"} || user.purchased.#{path}.#{colors.join(" && user.purchased."+path+".")}')!= env.t('unlockSet',{cost:5}) + ' ' + each color in colors + button.customize-option(type='button', class='#{path=="skin" ? "skin_"+color : "customize-option hair hair_bangs_1_"+color}', ng-class='{locked: !user.purchased.#{path}.#{color}}', ng-if='#{status!="disabled"} || user.purchased.#{path}.#{color}', ng-click='unlock("#{path}.#{color}")') + div(class=mobile ? 'padding' : 'container-fluid row') .col-md-4 h3(class=mobile?'item item-divider':'')=env.t('bodyBody') @@ -35,17 +46,8 @@ mixin customizeProfile(mobile) menu(type='list') // For special events code, see commit dfa27b3 - // Color - mixin colorSelection(colors,title,limited) - li.customize-menu(class=limited ? "well limited-edition" : "") - if limited - .label.label-info.pull-right.hint(popover=limited, popover-title=env.t('limitedEdition'), popover-placement='right', popover-trigger='mouseenter')=env.t('limitedEdition') - menu(label=title) - +gemCost(2) - button.btn.btn-xs(ng-hide='user.purchased.hair.color.#{colors.join(" && user.purchased.hair.color.")}', ng-click='unlock("hair.color.#{colors.join(",hair.color.")}")')!= env.t('unlockSet',{cost:5}) + ' ' - each color in colors - button(type='button', ng-class='{locked: !user.purchased.hair.color.#{color}}', class='customize-option hair hair_bangs_1_#{color}', ng-click='unlock("hair.color.#{color}")') + // Color li.customize-menu menu(label=env.t('color')) each v,k in {'c8c8c8':'white','903a00':'brown','cfb853':'blond','ec720f':'red','2e2e2e':'black'} @@ -54,10 +56,11 @@ mixin customizeProfile(mobile) button(type='button', ng-if='user.purchased.hair.color.#{color}', class='customize-option hair hair_bangs_1_#{color}', style='width: 40px; height: 40px;', ng-click='unlock("hair.color.#{color}")') each color in ['pblue','pgreen','porange','ppink','ppurple','pyellow'] button(type='button', ng-if='user.purchased.hair.color.#{color}', class='customize-option hair hair_bangs_1_#{color}', ng-click='unlock("hair.color.#{color}")') - +colorSelection(['rainbow','yellow','green','purple','blue','TRUred'],env.t('rainbowColors')) + +buyPref('hair.color', ['rainbow','yellow','green','purple','blue','TRUred'], 'rainbowColors') + +buyPref('hair.color', ['candycorn','ghostwhite','halloween','midnight','pumpkin','zombie'], 'hauntedColors', 'seasonal') li.customize-menu - h5=env.t('bodyHair') + menu(label=env.t('bodyHair')) // Bangs menu(label=env.t('hairBangs')) @@ -106,25 +109,19 @@ mixin customizeProfile(mobile) .col-md-4 h3(class=mobile?'item item-divider':'')=env.t('bodySkin') // skin - li.customize-menu - menu(label=env.t('basicSkins')) - each color in ['ddc994','f5a76e','ea8349','c06534','98461a','915533','c3e1dc','6bd049'] - button.customize-option(type='button', class='skin_#{color}', ng-click='set({"preferences.skin":"#{color}"})') + menu(type='list') + li.customize-menu + menu(label=env.t('basicSkins')) + each color in ['ddc994','f5a76e','ea8349','c06534','98461a','915533','c3e1dc','6bd049'] + button.customize-option(type='button', class='skin_#{color}', ng-click='set({"preferences.skin":"#{color}"})') // Rainbow Skin - menu(label=env.t('rainbowSkins')) - +gemCost(2) - button.btn.btn-xs(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")')!= env.t('unlockSet',{cost:5}) + ' ' - each color in ['eb052b','f69922','f5d70f','0ff591','2b43f6','d7a9f7','800ed0','rainbow'] - button.customize-option(type='button', class='skin_#{color}', ng-class='{locked: !user.purchased.skin.#{color}}', ng-click='unlock("skin.#{color}")') + +buyPref('skin', ['eb052b','f69922','f5d70f','0ff591','2b43f6','d7a9f7','800ed0','rainbow'], 'rainbowSkins') // 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=env.t('spookySkins') - menu - each color in ['monster','pumpkin','skeleton','zombie','ghost','shadow'] - button.customize-option(type='button', class='skin_#{color}', ng-if='user.purchased.skin.#{color}', ng-click='unlock("skin.#{color}")') + +buyPref('skin', ['monster','pumpkin','skeleton','zombie','ghost','shadow'], 'spookySkins', 'disabled') + +buyPref('skin', ['candycorn','ogre','pumpkin2','reptile','shadow2','skeleton2','transparent','zombie2'], 'supernaturalSkins', 'seasonal') + script(id='partials/options.profile.avatar.html', type='text/ng-template') +customizeProfile()