<xf:if is="{$xf.visitor.user_id}">
<xf:set var="$v" value="{$xf.visitor}" />
<aside class="pkWC">
<header class="pkWC-head">
<h4 class="pkWC-title">Добро пожаловать на, {$xf.options.boardTitle}!</h4>
</header>
<div class="pkWC-user">
<div class="pkWC-avatar">
<xf:avatar user="$v" size="s" notooltip="true" />
</div>
<div class="pkWC-meta">
<a href="{{ link('members', $v) }}" class="pkWC-name"><xf:username user="$v" rich="true" /></a>
<div class="pkWC-role">
{{ $v.user_id ? ($v.is_admin ? phrase('administrator') : ($v.is_moderator ? phrase('moderator') : phrase('member'))) : phrase('guest') }}
</div>
<xf:if is="$v.user_id">
<div class="pkWC-joined">
{{ phrase('joined') }}: <strong><xf:date time="{$v.register_date}" /></strong>
</div>
</xf:if>
</div>
</div>
<ul class="pkWC-stats">
<li>
<span>Messages</span>
<a class="pkWC-numLink" href="/search/member?user_id={$v.user_id}">
<strong>{$v.message_count|number}</strong>
</a>
</li>
<li>
<span>Reactions</span>
<a class="pkWC-numLink" href="/account/reactions">
<strong>{$v.reaction_score|number}</strong>
</a>
</li>
<li>
<span>Conversations</span>
<a class="pkWC-numLink" href="/conversations">
<strong>{$v.conversations_unread|number}</strong>
</a>
</li>
<li>
<span>Notifications</span>
<a class="pkWC-numLink" href="/account/alerts">
<strong>{$v.alerts_unread|number}</strong>
</a>
</li>
</ul>
<xf:if is="$v.user_id">
<a class="pkWC-cta" href="{{ link('account') }}">Mon compte</a>
<xf:else />
<div class="pkWC-ctaRow">
<a class="pkWC-cta pkWC-cta--login" href="{{ link('login') }}">Se connecter</a>
<a class="pkWC-cta pkWC-cta--register" href="{{ link('register') }}">S'inscrire</a>
</div>
</xf:if>
<div class="pkWC-footer">
<div class="pkWC-clock" data-live-clock>--:--:--</div>
<xf:if is="$v.user_id">
<div class="pkWC-last">
Dernière activité: <strong><xf:date time="{$v.last_activity}" /></strong>
</div>
</xf:if>
</div>
</aside>
<script>
(function(){
var el = document.querySelector('.pkWC [data-live-clock]');
if(!el) return;
function pad(n){ return (n<10?'0':'')+n; }
function tick(){
var d=new Date();
el.textContent = pad(d.getHours())+':'+pad(d.getMinutes())+':'+pad(d.getSeconds());
}
tick(); setInterval(tick,1000);
})();
</script>
</xf:if>
