{% set canEdit = currentUser is not null and ( ( ctx.user.id == currentUser.id and currentUser.hasPermission(permission("EDIT_OWN_USER")) ) or currentUser.hasPermission(permission("EDIT_OTHER_USER")) ) %} {% set isOwnProfile = currentUser is not null and currentUser.id == ctx.user.id %} {% set sUserPossessive = isOwnProfile ? "Your posts" : "%display_name%'s posts" %} {% set emailPending = isOwnProfile and ctx.user.pendingEmail is not null %} {% set title = ctx.user.displayName %} {% extends "base.twig" %} {% block content %} <div class="clearfix page-header margin-top-0"> <img class="pull-left margin-right" src="?_action=profilepicture&user={{ ctx.user.id|url_encode }}" alt="{{ __("Profile picture") }}" width="64" height="64"> <span class="h1">{{ ctx.user.displayName }}</span> {% if isOwnProfile %} <span class="label label-primary">{{ __("You") }}</span> {% endif %}<br> @{{ ctx.user.name }} • <span class="text-muted">{{ __("Member since %join_date%", { "join_date": '<span class="_date">' ~ (ctx.dateJoined.format("c")|e("html")) ~ '</span>', }) }}</span> </div> {% if canEdit %} <div class="row"> <div class="col-md-9"> {% endif %} <h3>{{ __(sUserPossessive, { "display_name": ctx.user.displayName|e("html"), }) }}</h3> {% if ctx.posts|length > 0 %} <div class="post-container"> <div class="post-container-posts"> <div class="list-group margin-top"> {% for post in ctx.posts %} <a href="?_action=viewtopic&topic={{ post.topicId|url_encode }}#post-{{ post.id|url_encode }}" class="list-group-item"> {% set hasAttachments = ctx.attachments[post.id] is defined and ctx.attachments[post.id]|length > 0 %} {% if hasAttachments %} <span class="badge"><span class="fa fa-paperclip"></span></span> {% endif %} {{ renderPostSummary(post.content) }}<br> <span class="text-muted">{{ __("posted on %post_date% in %topic%", { "post_date": '<span class="_time">' ~ post.postDate.format("c")|e("html") ~ '</span>', "topic": '<em>' ~ (ctx.topics[post.topicId] is not null and ctx.topics[post.topicId].isLocked ? '<span class="fa fa-lock text-muted" aria-hidden="true"></span> ' : '') ~ (ctx.topics[post.topicId] is not null ? ctx.topics[post.topicId].title : __("unknown"))|e("html") ~ '</em>', }) }}</span> </a> {% endfor %} </div> </div> <div class="post-container-controls"> <button class="btn btn-default">{{ __("Show all posts") }}</button> </div> </div> {% else %} <div class="well icon-well text-info margin-top margin-bottom"> <span class="fa fa-info-circle text-info" aria-hidden="true"></span> <em>{{ __("This user has not posted anything yet") }}</em> </div> {% endif %} {% if canEdit %} </div> <!-- .col-md-9 --> <div class="col-md-3"> <h3>{{ __("Edit profile") }}</h3> {% set formId = "update_profile" %} {% set formError = getAndClearFormError(formId) %} {% if formError %} {% include "components/alert_error.twig" with { message: formError } %} {% endif %} <form action="{{ g.server.REQUEST_URI }}" method="post" enctype="multipart/form-data"> <input type="hidden" name="form_id" value="{{ formId }}"> <div class="form-group"> <label for="i_display_name">{{ __("Display name:") }}</label> <input required class="form-control" type="text" name="display_name" id="i_display_name" value="{{ ctx.user.displayName }}"> </div> <div class="form-group"> <label for="i_name">{{ __("Username:") }}</label> {% if ctx.lastNameChangeTooRecent %} <input class="form-control" type="text" id="i_name" value="{{ ctx.user.name }}" disabled> <small class="text-danger"><strong>{{ __("You can only change your username every 30 days!") }}</strong></small> {% else %} <input required class="form-control" type="text" name="name" id="i_name" value="{{ ctx.user.name }}"> {% endif %} </div> <div class="form-group"> <label for="i_email">{{ __("Email address:") }}</label> {% if emailPending %} <input class="form-control" type="email" id="i_email" value="{{ ctx.user.email }}" disabled> {% else %} <input required class="form-control" type="email" id="i_email" name="email" value="{{ ctx.user.email }}"> {% endif %} </div> <div class="form-group"> <label>{{ __("Profile picture:") }}</label> <div class="radio margin-top-0 {{ ctx.user.profilePicture is empty ? " disabled text-muted" }}"> <label> <input type="radio" name="pfp_action" id="pfp_action_1" value="keep"{{ ctx.user.profilePicture is not empty ? ' checked' : ' disabled' }}> {{ __("Keep current profile picture") }} </label> </div> <div class="radio"> <label> <input type="radio" name="pfp_action" id="pfp_action_2" value="remove"{{ ctx.user.profilePicture is empty ? ' checked' : '' }}> {% if ctx.user.profilePicture is empty %} {{ __("No profile picture") }} {% else %} {{ __("Remove profile picture") }} {% endif %} </label> </div> <div class="radio"> <label> <input type="radio" name="pfp_action" value="replace" id="pfp_action_3"> {{ __("Upload new profile picture") }} </label> </div> <input type="file" name="pfp" id="i_pfp" accept="image/png,image/jpeg" class="margin-left-3x small"> </div> <div class="form-group"> <button type="submit" class="btn btn-success">{{ __("Save changes") }}</button> </div> </form> {% if isOwnProfile %} <h3>{{ __("Change password") }}</h3> {% set formId = "update_password" %} {% set formError = getAndClearFormError(formId) %} {% if formError %} {% include "components/alert_error.twig" with { message: formError } %} {% endif %} <form action="{{ g.server.REQUEST_URI }}" method="post"> <input type="hidden" name="form_id" value="{{ formId }}"> <div class="form-group"> <label for="i_current_password">{{ __("Current password:") }}</label> <input autocomplete="current-password" required class="form-control" type="password" name="current_password" id="i_current_password" required> </div> <div class="form-group"> <label for="i_new_password">{{ __("New password:") }}</label> <input autocomplete="new-password" required class="form-control" type="password" name="new_password" id="i_new_password" required> </div> <div class="form-group"> <label for="i_retype_password">{{ __("Retype password:") }}</label> <input autocomplete="new-password" required class="form-control" type="password" name="retype_password" id="i_retype_password" required> </div> <div class="form-group"> <button type="submit" class="btn btn-success">{{ __("Change password") }}</button> </div> </form> {% endif %} </div> <!-- .col-md-3 --> </div> <!-- .row --> {% endif %} <script> $(function() { $(".post-container").each(function(i, e) { if ($(e).height() > 900) { // more than 800 so it doesn't collapse just a few pixels $(e).addClass("collapsed"); } $(e).find(".post-container-controls button").click(function() { $(e).removeClass("collapsed"); }); }); }); {% if canEdit %} $(function() { function _hide() { $("#i_pfp").hide().prop("disabled", true).prop("required", false); $("#i_pfp + .file-input-group").hide().find("button").prop("disabled", true); } _hide(); setTimeout(_hide, 10); $("[name='pfp_action']").on("change input check click", function() { if ($("#pfp_action_3").is(":checked")) { $("#i_pfp").show().prop("disabled", false).prop("required", true); $("#i_pfp + .file-input-group").show().find("button").prop("disabled", false); } else { _hide(); } }) }); {% endif %} </script> {% endblock %}