344 lines
18 KiB
Twig
344 lines
18 KiB
Twig
{% extends 'master.twig' %}
|
|
|
|
{% set profileHidden = not profile.activated and (user.id != profile.id and not (user.perms.isMod or user.perms.isAdmin)) %}
|
|
|
|
{% set noUserpage = profile.userPage|length < 1 %}
|
|
|
|
{% set title = profileHidden ? 'User not found!' : 'Profile of ' ~ profile.username %}
|
|
|
|
{% set youtubeIsChannelId = profile.youtube|slice(0, 2) == 'UC' and profile.youtube|length == 24 %}
|
|
|
|
{% set fields = {
|
|
"website": {
|
|
"title": "Website",
|
|
"value": profile.website,
|
|
"link": "%s",
|
|
},
|
|
"twitter": {
|
|
"title": "Twitter",
|
|
"value": profile.twitter,
|
|
"link": "https://twitter.com/%s",
|
|
"disp": "@%s",
|
|
},
|
|
"github": {
|
|
"title": "GitHub",
|
|
"value": profile.github,
|
|
"link": "https://github.com/%s",
|
|
},
|
|
"skype": {
|
|
"title": "Skype",
|
|
"value": profile.skype,
|
|
"link": "skype:%s?userinfo",
|
|
},
|
|
"discord": {
|
|
"title": "Discord",
|
|
"value": profile.discord,
|
|
},
|
|
"youtube": {
|
|
"title": "YouTube",
|
|
"value": profile.youtube,
|
|
"link": "https://youtube.com/" ~ (youtubeIsChannelId ? 'channel/' : '') ~ "%s",
|
|
"disp": youtubeIsChannelId ? profile.username ~ "'s channel" : "%s",
|
|
},
|
|
"steam": {
|
|
"title": "Steam",
|
|
"value": profile.steam,
|
|
"link": "https://steamcommunity.com/id/%s",
|
|
},
|
|
"osu": {
|
|
"title": "osu!",
|
|
"value": profile.osu,
|
|
"link": "https://osu.ppy.sh/u/%s",
|
|
},
|
|
"lastfm": {
|
|
"title": "Last.fm",
|
|
"value": profile.lastfm,
|
|
"link": "http://last.fm/user/%s",
|
|
},
|
|
"email": {
|
|
"title": "E-mail address",
|
|
"value": user.perms.viewUserDetails ? profile.email : null,
|
|
"link": "mailto:%s"
|
|
},
|
|
"registerip": {
|
|
"title": "Register IP",
|
|
"value": user.perms.viewUserDetails ? profile.registerIp : null,
|
|
},
|
|
"lastip": {
|
|
"title": "Last IP",
|
|
"value": user.perms.viewUserDetails ? profile.lastIp : null,
|
|
},
|
|
} %}
|
|
|
|
{% block js %}
|
|
{% if not profileHidden %}
|
|
<script type="text/javascript">
|
|
window.addEventListener('load', function () {
|
|
{% if profile.lastfm %}
|
|
var np = new Sakura.AJAX();
|
|
np.SetUrl("{{ route('user.nowplaying', profile.id) }}");
|
|
np.AddCallback(200, function () {
|
|
var data = np.JSON(),
|
|
artist = Sakura.DOM.ID('np-artist'),
|
|
track = Sakura.DOM.ID('np-track'),
|
|
state = Sakura.DOM.ID('np-state'),
|
|
by = Sakura.DOM.ID('np-by');
|
|
|
|
artist.href = data.artist_url;
|
|
artist.textContent = data.artist;
|
|
track.href = data.track_url;
|
|
track.textContent = data.track;
|
|
state.className = 'fa ' + (data.listening ? 'fa-play-circle' : 'fa-history');
|
|
by.className = data.track === '' || data.artist === '' ? 'hidden' : '';
|
|
});
|
|
setInterval(function () { np.Start(Sakura.HTTPMethod.GET); }, 20000);
|
|
np.Start(Sakura.HTTPMethod.GET);
|
|
{% endif %}
|
|
|
|
// Check if location.hash is set
|
|
if (location.hash) {
|
|
var open = location.hash.slice(2);
|
|
|
|
// Check if the element exists
|
|
if (document.getElementById('profile-mode-' + open)) {
|
|
profileMode(open);
|
|
return;
|
|
}
|
|
}
|
|
|
|
var profileUserpage = document.getElementById('profile-mode-userpage');
|
|
|
|
// Check if the user page has contents
|
|
if (profileUserpage.children[0].innerHTML.trim().length) {
|
|
profileMode('userpage');
|
|
} else {
|
|
profileMode('comments');
|
|
}
|
|
});
|
|
|
|
// Switch to a different mode
|
|
function profileMode(id) {
|
|
// Get other active modes and fetch the new element
|
|
var current = document.getElementsByClassName('profile-mode-current'),
|
|
newMode = document.getElementById('profile-mode-' + id);
|
|
|
|
// Check if the new mode exists
|
|
if (typeof newMode == 'undefined') {
|
|
return;
|
|
}
|
|
|
|
// Check if there's any active
|
|
if (current) {
|
|
// Hide them all
|
|
for (i in current) {
|
|
current[i].className = 'hidden';
|
|
}
|
|
}
|
|
|
|
// Set the new to active
|
|
newMode.className = 'profile-mode-current';
|
|
}
|
|
|
|
function handleImageChange(elem, cont) {
|
|
var ajax = new Sakura.AJAX(),
|
|
target = elem.getAttribute('data-target'),
|
|
formData = new FormData(),
|
|
file = elem.files[0];
|
|
|
|
formData.append('session', Sakura.Config.SessionId);
|
|
formData.append('file', file, file.name);
|
|
ajax.SetFormData(formData);
|
|
ajax.SetUrl(target);
|
|
ajax.AddCallback(200, function () {
|
|
var result = ajax.JSON();
|
|
|
|
if (result.error) {
|
|
var diag = new Sakura.Dialogue;
|
|
diag.Text = result.error;
|
|
diag.AddCallback(Sakura.DialogueButton.Ok, function () {
|
|
this.Close();
|
|
});
|
|
diag.Display();
|
|
}
|
|
|
|
cont.style.backgroundImage = "url('" + target + "?" + Date.now() + ")";
|
|
});
|
|
ajax.Start(Sakura.HTTPMethod.POST);
|
|
}
|
|
</script>
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
{% if profileHidden %}
|
|
<div class="content content--alt">
|
|
<div style="padding: 20px;">
|
|
<h1>The requested user does not exist!</h1>
|
|
There are a few possible reasons for this:
|
|
<ul style="padding-left: 40px;">
|
|
<li>They changed their username.</li>
|
|
<li>They may have been restricted.</li>
|
|
<li>You made a typo.</li>
|
|
<li>They never existed.</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="content profile">
|
|
<div class="profile__container">
|
|
<div class="profile__header" style="background-image: url({{ route('user.header', profile.id) }});">
|
|
<label class="uploader__label">
|
|
<input type="file" data-target="{{ route('user.header', user.id) }}" class="uploader" onchange="handleImageChange(this, this.parentElement.parentElement)">
|
|
</label>
|
|
<div class="profile__info">
|
|
<div class="avatar avatar--border profile__avatar" style="background-image: url({{ route('user.avatar', profile.id) }}); box-shadow: 0 0 5px #{% if profile.isOnline %}484{% else %}844{% endif %};">
|
|
<label class="uploader__label">
|
|
<input type="file" data-target="{{ route('user.avatar', user.id) }}" class="uploader" onchange="handleImageChange(this, this.parentElement.parentElement)">
|
|
</label>
|
|
</div>
|
|
<div class="profile__username">
|
|
<h1 style="color: {{ profile.colour }}; text-shadow: 0 0 7px {% if profile.colour != 'inherit' %}{{ profile.colour }}{% else %}#222{% endif %}; padding: 0 0 2px;" {% if profile.getUsernameHistory %} title="Known as {{ profile.getUsernameHistory[0].username_old }} before {{ profile.getUsernameHistory[0].change_time|date(config('general.date_format')) }}." {% endif %}>{{ profile.username }}</h1>
|
|
{% if profile.isPremium %}<img src="/images/tenshi.png" alt="Tenshi" style="vertical-align: middle;"> {% endif %}<img src="/images/flags/{{ profile.country|lower }}.png" alt="{{ profile.country }}" style="vertical-align: middle;" title="{{ profile.country(true) }}"> <span style="font-size: .8em;">{{ profile.title }}</span>
|
|
</div>
|
|
<div class="profile__dates">
|
|
{% spaceless %}
|
|
<div class="profile__date">
|
|
<b>Joined</b> <time class="time-ago" datetime="{{ profile.registered|date('r') }}">{{ profile.registered|date(config('general.date_format')) }}</time>
|
|
</div>
|
|
<div class="profile__date">
|
|
{% if profile.lastOnline < 1 %}
|
|
<b>{{ profile.username }} hasn't logged in yet.</b>
|
|
{% else %}
|
|
<b>Last online</b> <time class="time-ago" datetime="{{ profile.lastOnline|date('r') }}">{{ profile.lastOnline|date(config('general.date_format')) }}</time>
|
|
{% endif %}
|
|
</div>
|
|
{% if profile.birthday != '0000-00-00' and profile.birthday|split('-')[0] > 0 %}
|
|
<div class="profile__date">
|
|
<b>Age</b> <span title="{{ profile.birthday }}">{{ profile.birthday(true) }} years old</span>
|
|
</div>
|
|
{% endif %}
|
|
{% endspaceless %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="profile__interactions">
|
|
<div class="profile__navigation">
|
|
{% if not noUserpage %}
|
|
<a class="profile__interactions-item fa fa-file-text-o" title="View {{ profile.username }}'s user page" href="#_userpage" onclick="profileMode('userpage');"></a>
|
|
{% endif %}
|
|
<a class="profile__interactions-item fa fa-list" title="View {{ profile.username }}'s topics" href="#_topics" onclick="profileMode('topics');"></a>
|
|
<a class="profile__interactions-item fa fa-reply" title="View {{ profile.username }}'s posts" href="#_posts" onclick="profileMode('posts');"></a>
|
|
<a class="profile__interactions-item fa fa-star" title="View {{ profile.username }}'s friends" href="#_friends" onclick="profileMode('friends');"></a>
|
|
<a class="profile__interactions-item fa fa-comments-o" title="View {{ profile.username }}'s profile comments" href="#_comments" onclick="profileMode('comments');"></a>
|
|
{% if (profile.isActive and profile.id == user.id) or user.perms.manageProfileImages %}
|
|
<a class="profile__interactions-item fa fa-picture-o" title="Edit your avatar, background and header" href="#_images" onclick="profileMode('images');"></a>
|
|
{% endif %}
|
|
</div>
|
|
{% if user.isActive %}
|
|
<div class="profile__actions">
|
|
{% if user.id == profile.id %}
|
|
<a class="profile__interactions-item fa fa-pencil-square-o" title="Edit your profile" href="{{ route('settings.account.profile') }}"></a>
|
|
{% else %}
|
|
{% if user.isFriends(profile.id) != 0 %}<a class="fa fa-{% if user.isFriends(profile.id) == 2 %}heart{% else %}star{% endif %}" title="You are friends"></a>{% endif %}
|
|
<a class="profile__interactions-item fa fa-user-{% if user.isFriends(profile.id) == 0 %}plus{% else %}times{% endif %}" title="{% if user.isFriends(profile.id) == 0 %}Add {{ profile.username }} as a friend{% else %}Remove friend{% endif %}" href="javascript:void(0);" onclick="Sakura.Friend.{% if user.isFriends(profile.id) == 0 %}Add({{ profile.id }}){% else %}Remove({{ profile.id }}){% endif %}"></a>
|
|
<a class="profile__interactions-item fa fa-exclamation-circle" title="Report {{ profile.username }}" href="{{ route('user.report', profile.id) }}"></a>
|
|
{% endif %}
|
|
{% if user.perms.canRestrict %}
|
|
<a class="profile__interactions-item fa fa-trash" title="Restrict {{ profile.username }}" href="?restrict={{ session_id() }}"></a>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
<div class="profile__content">
|
|
<div class="profile__mode">
|
|
{% if profile.lastfm %}
|
|
<div class="profile__now-playing">
|
|
<div class="np-icon">
|
|
<span class="fa fa-music"></span>
|
|
</div>
|
|
<div class="np-text">
|
|
<span class="fa fa-ellipsis-h" id="np-state"></span>
|
|
<a href="#" id="np-track" class="profile__now-playing-link"></a>
|
|
<span id="np-by" class="hidden">by</span>
|
|
<a href="#" id="np-artist" class="profile__now-playing-link"></a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
<noscript><h1 style="text-align: center;">Please enable Javascript!</h1></noscript>
|
|
<div id="profile-mode-userpage" class="hidden">
|
|
{% include 'profile/userpage.twig' %}
|
|
</div>
|
|
<div id="profile-mode-friends" class="hidden">
|
|
{% include 'profile/friends.twig' %}
|
|
</div>
|
|
<div id="profile-mode-groups" class="hidden">
|
|
{% include 'profile/groups.twig' %}
|
|
</div>
|
|
<div id="profile-mode-topics" class="hidden">
|
|
{% include 'profile/topics.twig' %}
|
|
</div>
|
|
<div id="profile-mode-posts" class="hidden">
|
|
{% include 'profile/posts.twig' %}
|
|
</div>
|
|
<div id="profile-mode-comments" class="hidden">
|
|
{% include 'profile/comments.twig' %}
|
|
</div>
|
|
<div id="profile-mode-images" class="hidden">
|
|
{% include 'profile/images.twig' %}
|
|
</div>
|
|
</div>
|
|
<div class="profile__data">
|
|
<table style="width: 100%;">
|
|
<tr>
|
|
<td style="text-align: left; font-weight: bold;">Topics</td>
|
|
<td style="text-align: right;">{{ profile.forumStats.topics }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left; font-weight: bold;">Posts</td>
|
|
<td style="text-align: right;">{{ profile.forumStats.posts }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left; font-weight: bold;">Friends</td>
|
|
<td style="text-align: right;">{{ profile.friends(2)|length }}</td>
|
|
</tr>
|
|
</table>
|
|
<hr>
|
|
{% if user.isActive %}
|
|
{# if user.perms.viewUserLinks or user.perms.viewUserDetails #}
|
|
<table style="width: 100%;">
|
|
{% for id, data in fields %}
|
|
{% if data.value != null %}
|
|
<tr>
|
|
<td style="text-align: left; font-weight: bold;">
|
|
{{ data.title }}
|
|
</td>
|
|
<td style="text-align: right;">
|
|
{% if data.link is defined %}
|
|
<a href="{{ data.link|format(data.value) }}">{{ (data.disp is defined ? data.disp : '%s')|format(data.value) }}</a>
|
|
{% else %}
|
|
{{ (data.disp is defined ? data.disp : '%s')|format(data.value) }}
|
|
{% endif %}
|
|
</td>
|
|
</tr>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</table>
|
|
{% else %}
|
|
<b>Log in to view the full profile!</b>
|
|
{% endif %}
|
|
<b>Account Standing</b>
|
|
{% if not profile.activated %}
|
|
<h2 style="color: #888; text-shadow: 0 0 7px #888; margin-top: 0;">Deactivated</h2>
|
|
{% elseif profile.restricted %}
|
|
<h2 style="color: #222; text-shadow: 0 0 7px #800; margin-top: 0;">Restricted</h2>
|
|
{% elseif false %}
|
|
<h2 style="color: #A00; text-shadow: 0 0 7px #A00; margin-top: 0;">Bad</h2>
|
|
{% else %}
|
|
<h2 style="color: #080; text-shadow: 0 0 7px #080; margin-top: 0;">Good</h2>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% endblock %}
|