website/web/templates/account/profile.html
Noah 6c91c67c97 More Private User Avatars
* Users who set their Profile Picture to "friends only" or "private" can have
  their avatar be private all over the website to users who are not their
  friends or not granted access.
* Users who are not your friends see a yellow placeholder avatar, and users
  not granted access to a private Profile Pic sees a purple avatar.
* Admin users see these same placeholder avatars most places too (on search,
  forums, comments, etc.) if the user did not friend or grant the admin. But
  admins ALWAYS see it on their Profile Page directly, for ability to moderate.
* Fix marking Notifications as read: clicking the link in an unread notification
  now will wait on the ajax request to finish before allowing the redirect.
* Update the FAQ
2022-09-08 21:42:20 -07:00

399 lines
19 KiB
HTML

{{define "title"}}{{.User.Username}}{{end}}
{{define "content"}}
<div class="container">
<section class="hero {{if and .LoggedIn (not .IsPrivate)}}is-info{{else}}is-light is-bold{{end}}">
<div class="hero-body">
<div class="container">
<div class="columns">
<div class="column is-narrow has-text-centered">
<figure class="profile-photo is-inline-block">
{{if .User.ProfilePhoto.ID}}
{{if and (eq .User.ProfilePhoto.Visibility "private") (not .User.UserRelationship.IsPrivateGranted)}}
<img src="/static/img/shy-private.png" data-photo-id="{{.User.ProfilePhoto.ID}}">
{{else if and (eq .User.ProfilePhoto.Visibility "friends") (not .User.UserRelationship.IsFriend)}}
<img src="/static/img/shy-friends.png" data-photo-id="{{.User.ProfilePhoto.ID}}">
{{else}}
<img src="{{PhotoURL .User.ProfilePhoto.CroppedFilename}}" data-photo-id="{{.User.ProfilePhoto.ID}}">
{{end}}
{{else}}
<img src="/static/img/shy.png">
{{end}}
<!-- CurrentUser can upload a new profile pic -->
{{if and .LoggedIn (eq .CurrentUser.ID .User.ID) (not .IsPrivate)}}
<span class="corner">
<button class="button is-small p-1 is-success">
<a href="/photo/upload?intent=profile_pic"
class="fa fa-camera has-text-link"
title="Upload a new Profile Picture"></a>
</button>
</span>
{{end}}
</figure>
</div>
<div class="column">
<h1 class="title">
{{.User.NameOrUsername}}
{{if eq .User.Visibility "private"}}<sup class="fa fa-mask ml-2 is-size-6" title="Private Profile"></sup>{{end}}
</h1>
{{if ne .User.Status "active"}}
<h2 class="subtitle">
({{.User.Status}})
</h2>
{{end}}
{{if or (not .LoggedIn) .IsPrivate}}
<h2 class="subtitle">is on {{PrettyTitle}}, a social network for nudists &amp; exhibitionists.</h2>
<p>
{{PrettyTitle}} is a new social network for <strong>real</strong> nudists and exhibionists.
Join <strong>{{.User.Username}}</strong> and the others on this site by
<a href="/signup"><ins>creating an account</ins></a> and sending them a friend request! Please
see <a href="/"><ins>the home page</ins></a> for all the details.
</p>
{{end}}
</div>
{{if and .LoggedIn (not .IsPrivate)}}
<div class="column is-narrow">
<div class="box">
<div>
Member since:
<span title="Since {{.User.CreatedAt.Format "Jan _2 2006"}}">
{{SincePrettyCoarse .User.CreatedAt}} ago
</span>
</div>
<div>
Last logged in:
<span title="On {{.User.LastLoginAt.Format "Jan _2 2006 15:04:05 MST"}}">
{{SincePrettyCoarse .User.LastLoginAt}} ago
</span>
</div>
{{if .User.Certified}}
<div class="pt-1">
<div class="icon-text" title="This user has been certified via a verification selfie.">
<span class="icon">
<i class="fa-solid fa-certificate has-text-success"></i>
</span>
<strong class="has-text-success">Certified!</strong>
</div>
</div>
{{else}}
<div class="pt-1">
<div class="icon-text" title="This user has not certified themselves with a verification selfie.">
<span class="icon">
<i class="fa-solid fa-certificate has-text-danger"></i>
</span>
<strong class="has-text-danger">Not certified!</strong>
</div>
</div>
{{end}}
{{if .User.IsAdmin}}
<div class="pt-1">
<div class="icon-text has-text-danger">
<span class="icon">
<i class="fa fa-gavel"></i>
</span>
<strong>Admin</strong>
</div>
</div>
{{end}}
</div>
</div>
{{end}}<!-- if .LoggedIn -->
</div>
{{if and .LoggedIn (not .IsExternalView)}}
<div class="columns is-centered is-gapless">
<div class="column is-narrow has-text-centered">
<form action="/friends/add" method="POST">
{{InputCSRF}}
<input type="hidden" name="username" value="{{.User.Username}}">
<button type="submit" class="button is-fullwidth"
{{if not (eq .IsFriend "none")}}title="Friendship {{.IsFriend}}"{{end}}>
<span class="icon-text">
<span class="icon">
{{if eq .IsFriend "approved"}}
<i class="fa fa-check has-text-success"></i>
{{else if eq .IsFriend "pending"}}
<i class="fa fa-spinner fa-spin"></i>
{{else}}
<i class="fa fa-plus"></i>
{{end}}
</span>
<span>Friend{{if eq .IsFriend "approved"}}s{{end}}</span>
</span>
</button>
</form>
</div>
<div class="column is-narrow has-text-centered">
<a href="/messages/compose?to={{.User.Username}}" class="button is-fullwidth">
<span class="icon-text">
<span class="icon">
<i class="fa fa-message"></i>
</span>
<span>Message</span>
</span>
</a>
</div>
<!-- Like button -->
{{if not .IsPrivate}}
{{$Like := .LikeMap.Get .User.ID}}
<div class="column is-narrow has-text-centered">
<button type="button" class="button is-fullwidth nonshy-like-button"
data-table-name="users" data-table-id="{{.User.ID}}"
title="Like this profile">
<span class="icon{{if $Like.UserLikes}} has-text-danger{{end}}"><i class="fa fa-heart"></i></span>
<span class="nonshy-likes">
Like
{{if gt $Like.Count 0}}
({{$Like.Count}})
{{end}}
</span>
</button>
</div>
{{end}}
<div class="column is-narrow has-text-centered">
<form action="/users/block" method="POST">
{{InputCSRF}}
<input type="hidden" name="username" value="{{.User.Username}}">
<button type="submit" class="button is-fullwidth"
{{if not (eq .IsFriend "none")}}title="Friendship {{.IsFriend}}"{{end}}>
<span class="icon-text">
<span class="icon">
<i class="fa fa-hand"></i>
</span>
<span>Block</span>
</span>
</button>
</form>
</div>
<div class="column is-narrow has-text-centered">
<a href="/contact?intent=report&subject=report.user&id={{.User.ID}}" class="button is-fullwidth">
<span class="icon-text">
<span class="icon">
<i class="fa fa-flag"></i>
</span>
<span>Report</span>
</span>
</a>
</div>
</div><!-- columns -->
{{end}}<!-- if .LoggedIn -->
</div>
</div>
</section>
{{if or (not .LoggedIn) .IsPrivate}}
<div class="py-6"></div>
{{else if .IsPrivate}}
<div class="block p-4">
<div class="notification block is-warning">
<i class="fa fa-mask"></i> This member's profile page is <strong>private.</strong> You may send them
a friend request, and only if approved, you may then view their profile page and photo gallery.
</div>
</div>
{{else}}
<div class="block p-4">
<div class="tabs is-boxed">
<ul>
<li class="is-active">
<a>
<span class="icon is-small">
<i class="fa fa-user"></i>
</span>
<span>Profile</span>
</a>
</li>
<li>
<a href="/photo/u/{{.User.Username}}">
<span class="icon is-small">
<i class="fa fa-image"></i>
</span>
<span>
Photos
{{if .PhotoCount}}<span class="tag is-link is-light ml-1">{{.PhotoCount}}</span>{{end}}
</span>
</a>
</li>
</ul>
</div>
<div class="columns">
<div class="column is-two-thirds">
<div class="card block">
<header class="card-header has-background-link">
<p class="card-header-title has-text-light">
About Me
</p>
</header>
<div class="card-content">
<div class="content">
{{or (ToMarkdown (.User.GetProfileField "about_me")) "n/a"}}
</div>
</div>
</div>
<div class="card block">
<header class="card-header has-background-link">
<p class="card-header-title has-text-light">
My Interests
</p>
</header>
<div class="card-content">
<div class="content">
{{or (ToMarkdown (.User.GetProfileField "interests")) "n/a"}}
</div>
</div>
</div>
<div class="card block">
<header class="card-header has-background-link">
<p class="card-header-title has-text-light">
Music/Bands/Movies
</p>
</header>
<div class="card-content">
<div class="content">
{{or (ToMarkdown (.User.GetProfileField "music_movies")) "n/a"}}
</div>
</div>
</div>
</div>
<div class="column">
<div class="card block">
<header class="card-header has-background-info">
<p class="card-header-title has-text-light">
<i class="fa fa-user pr-2"></i>
About {{.User.Username}}
</p>
</header>
<div class="card-content">
<table class="table is-fullwidth is-hoverable" style="font-size: small">
<tr>
<td class="has-text-right">
<strong class="is-size-7">Age:</label>
</td>
<td>
{{if not .User.Birthdate.IsZero}}
{{ComputeAge .User.Birthdate}}
{{else}}
n/a
{{end}}
</td>
</tr>
<tr>
<td class="has-text-right">
<strong class="is-size-7">Gender:</label>
</td>
<td>
{{or (.User.GetProfileField "gender") "n/a"}}
<small class="ml-3">{{.User.GetProfileField "pronouns"}}</small>
</td>
</tr>
<tr>
<td class="has-text-right">
<strong class="is-size-7">City:</label>
</td>
<td>
{{or (.User.GetProfileField "city") "n/a"}}
</td>
</tr>
<tr>
<td class="has-text-right">
<strong class="is-size-7">Job:</label>
</td>
<td>
{{or (.User.GetProfileField "job") "n/a"}}
</td>
</tr>
<tr>
<td class="has-text-right">
<strong class="is-size-7">Marital&nbsp;status:</label>
</td>
<td>
{{or (.User.GetProfileField "marital_status") "n/a"}}
{{if .User.GetProfileField "relationship_type"}}({{.User.GetProfileField "relationship_type"}}){{end}}
</td>
</tr>
<tr>
<td class="has-text-right">
<strong class="is-size-7">Orientation:</small>
</td>
<td>
{{or (.User.GetProfileField "orientation") "n/a"}}
</td>
</tr>
<tr>
<td class="has-text-right">
<strong class="is-size-7">Here for:</label>
</td>
<td>
{{range Split (.User.GetProfileField "here_for") ","}}
<div class="tag">{{.}}</div>
{{end}}
</td>
</tr>
</table>
</div>
</div>
<!-- Admin Actions-->
{{if .CurrentUser.IsAdmin}}
<div class="card block">
<header class="card-header has-background-danger">
<p class="card-header-title has-text-light">
<i class="fa fa-gavel pr-2"></i>
Admin Actions
</p>
</header>
<div class="card-content">
<ul class="menu-list">
<li>
<a href="/admin/user-action?intent=impersonate&user_id={{.User.ID}}">
<span class="icon"><i class="fa fa-ghost"></i></span>
<span>Impersonate this user</span>
</a>
</li>
<li>
<a href="/admin/user-action?intent=ban&user_id={{.User.ID}}">
<span class="icon"><i class="fa fa-ban"></i></span>
<span>Ban/unban this user</span>
</a>
</li>
<li>
<a href="/admin/user-action?intent=promote&user_id={{.User.ID}}">
<span class="icon"><i class="fa fa-gavel"></i></span>
<span>Add/Remove admin rights</span>
</a>
</li>
<li>
<a href="/admin/user-action?intent=delete&user_id={{.User.ID}}">
<span class="icon"><i class="fa fa-trash"></i></span>
<span>Delete user account</span>
</a>
</li>
</ul>
</div>
</div>
{{end}}
</div>
</div><!-- /columns-->
</div>
{{end}}<!-- not IsPrivate -->
</div>
{{end}}