.profile(v-if='user')
.header
.profile-actions
button.btn.btn-secondary.message-icon(@click='sendMessage()', v-b-tooltip.hover.left="$t('sendMessage')")
.svg-icon.message-icon(v-html="icons.message")
button.btn.btn-secondary.gift-icon(@click='openSendGemsModal()', v-b-tooltip.hover.bottom="$t('sendGems')")
.svg-icon.gift-icon(v-html="icons.gift")
button.btn.btn-secondary.remove-icon(v-if='user._id !== this.userLoggedIn._id && userLoggedIn.inbox.blocks.indexOf(user._id) === -1',
@click="blockUser()", v-b-tooltip.hover.right="$t('blockWarning')")
.svg-icon.remove-icon(v-html="icons.remove")
button.btn.btn-secondary.positive-icon(v-if='user._id !== this.userLoggedIn._id && userLoggedIn.inbox.blocks.indexOf(user._id) !== -1',
@click="unblockUser()", v-b-tooltip.hover.right="$t('unblock')")
.svg-icon.positive-icon(v-html="icons.positive")
button.btn.btn-secondary.positive-icon(v-if='this.userLoggedIn.contributor.admin',
@click="toggleAdminTools()", v-b-tooltip.hover.right="'Admin - Toggle Tools'")
.svg-icon.positive-icon(v-html="icons.staff")
.row.admin-profile-actions(v-if='this.userLoggedIn.contributor.admin && adminToolsLoaded')
.col-12.text-right
span.admin-action(v-if='!hero.flags || (hero.flags && !hero.flags.chatShadowMuted)',
@click="adminTurnOnShadowMuting()", v-b-tooltip.hover.bottom="'Turn on Shadow Muting'")
| shadow-mute
span.admin-action(v-if='hero.flags && hero.flags.chatShadowMuted',
@click="adminTurnOffShadowMuting()", v-b-tooltip.hover.bottom="'Turn off Shadow Muting'")
| un-shadow-mute
span.admin-action(v-if='!hero.flags || (hero.flags && !hero.flags.chatRevoked)',
@click="adminRevokeChat()", v-b-tooltip.hover.bottom="'Revoke Chat Privileges'")
| mute
span.admin-action(v-if='hero.flags && hero.flags.chatRevoked',
@click="adminReinstateChat()", v-b-tooltip.hover.bottom="'Reinstate Chat Privileges'")
| un-mute
span.admin-action(v-if='!hero.auth.blocked',
@click="adminBlockUser()", v-b-tooltip.hover.bottom="'Ban User'")
| ban
span.admin-action(v-if='hero.auth.blocked',
@click="adminUnblockUser()", v-b-tooltip.hover.bottom="'Un-Ban User'")
| un-ban
.row
.col-12
member-details(:member="user")
.row
.col-12.col-md-6.offset-md-3.text-center.nav
.nav-item(@click='selectPage("profile")', :class="{active: selectedPage === 'profile'}") {{ $t('profile') }}
.nav-item(@click='selectPage("stats")', :class="{active: selectedPage === 'stats'}") {{ $t('stats') }}
.nav-item(@click='selectPage("achievements")', :class="{active: selectedPage === 'achievements'}") {{ $t('achievements') }}
#userProfile.standard-page(v-show='selectedPage === "profile"', v-if='user.profile')
.row
.col-12.col-md-8
.header.mb-3
h1 {{user.profile.name}}
.name(v-if='user.auth && user.auth.local && user.auth.local.username') @{{ user.auth.local.username }}
.col-12.col-md-4
button.btn.btn-secondary(v-if='user._id === userLoggedIn._id', @click='editing = !editing', style='float:right;') {{ $t('edit') }}
.row(v-if='!editing')
.col-12.col-md-8
.about.profile-section
h2 {{ $t('about') }}
p(v-if='user.profile.blurb', v-markdown='user.profile.blurb')
p(v-else) {{ $t('noDescription') }}
.photo.profile-section
h2 {{ $t('photo') }}
img.img-rendering-auto(v-if='user.profile.imageUrl', :src='user.profile.imageUrl')
p(v-else) {{ $t('noPhoto') }}
.col-12.col-md-4
.info.profile-section
h2 {{ $t('info') }}
.info-item
.info-item-label {{ $t('joined') }}:
.info-item-value {{userJoinedDate}}
.info-item
.info-item-label {{ $t('totalLogins') }}:
.info-item-value {{ user.loginIncentives }}
.info-item
.info-item-label {{ $t('latestCheckin') }}:
.info-item-value {{userLastLoggedIn}}
.info-item
| {{getProgressDisplay()}}
.progress
.progress-bar(role='progressbar', :aria-valuenow='incentivesProgress', aria-valuemin='0', aria-valuemax='100', :style='{width: incentivesProgress + "%"}')
span.sr-only {{ incentivesProgress }}% {{$t('complete')}}
// @TODO: Implement in V2 .social
.row(v-if='editing')
h1 {{$t('editProfile')}}
.col-12
.alert.alert-info.alert-sm(v-html='$t("communityGuidelinesWarning", managerEmail)')
// TODO use photo-upload instead: https://groups.google.com/forum/?fromgroups=#!topic/derbyjs/xMmADvxBOak
.form-group
label {{ $t('displayName') }}
input.form-control(type='text', :placeholder="$t('fullName')", v-model='editingProfile.name')
.form-group
label {{ $t('photoUrl') }}
input.form-control(type='url', v-model='editingProfile.imageUrl', :placeholder="$t('imageUrl')")
.form-group
label {{ $t('about') }}
textarea.form-control(rows=5, :placeholder="$t('displayBlurbPlaceholder')", v-model='editingProfile.blurb')
// include ../../shared/formatting-help
//- .form-group
//- label Facebook
//- input.form-control(type='text', placeholder="Paste your link here", v-model='editingProfile.facebook')
//- .form-group
//- label Instagram
//- input.form-control(type='text', placeholder="Paste your link here", v-model='editingProfile.instagram')
//- .form-group
//- label Twitter
//- input.form-control(type='text', placeholder="Paste your link here", v-model='editingProfile.twitter')
.col-12.text-center
button.btn.btn-primary(@click='save()') {{ $t("save") }}
button.btn.btn-warning(@click='editing = false') {{ $t("cancel") }}
#achievements.standard-page.container(v-show='selectedPage === "achievements"', v-if='user.achievements')
.row(v-for='(category, key) in achievements')
h2.col-12.text-center {{ $t(key+'Achievs') }}
.col-12.col-md-3.text-center(v-for='(achievement, key) in category.achievements')
.box.achievement-container(:id='key + "-achievement"', :class='{"achievement-unearned": !achievement.earned}')
b-popover(
:target="'#' + key + '-achievement'",
triggers="hover",
placement="top",
)
h4.popover-content-title {{ achievement.title }}
div.popover-content-text(v-html="achievement.text")
.achievement(:class='achievement.icon + "2x"', v-if='achievement.earned')
.counter.badge.badge-info.stack-count(v-if='achievement.optionalCount') {{achievement.optionalCount}}
.achievement.achievement-unearned(class='achievement-unearned2x', v-if='!achievement.earned')
hr.col-12
.row
.col-12.col-md-6(v-if='user.achievements.challenges')
.achievement-icon.achievement-karaoke
h2.text-center {{$t('challengesWon')}}
div(v-for='chal in user.achievements.challenges')
span(v-markdown='chal')
hr
.col-12.col-md-6(v-if='user.achievements.quests')
.achievement-icon.achievement-alien
h2.text-center {{$t('questsCompleted')}}
div(v-for='(value, key) in user.achievements.quests')
span {{ content.quests[key].text() }} ({{ value }})
profileStats(
:user='user',
v-show='selectedPage === "stats"',
:showAllocation='showAllocation()',
v-if='user.preferences')