website/web/templates/inbox/inbox.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

192 lines
9.3 KiB
HTML

{{define "title"}}Message Inbox{{end}}
{{define "content"}}
<div class="container">
<section class="hero is-info is-bold">
<div class="hero-body">
<div class="container">
<h1 class="title">Messages</h1>
<h2 class="subtitle">{{if .IsSentBox}}Sent{{else}}Inbox{{end}}</h2>
</div>
</div>
</section>
{{$UserMap := .UserMap}}
{{$Request := .Request}}
<div class="block p-4">
<div class="columns">
<div class="column">
<div class="card">
<header class="card-header has-background-link">
<p class="card-header-title has-text-light">
{{if .ViewThread}}Conversation with {{.ReplyTo}}{{else}}Inbox{{end}}
</p>
</header>
{{if .ViewThread}}
<div class="card-content">
<div class="block">
<form action="/messages/compose" method="POST">
{{InputCSRF}}
<input type="hidden" name="to" value="{{.ReplyTo}}">
<input type="hidden" name="from" value="inbox">
<textarea class="textarea block" cols="80" rows="4"
name="message"
placeholder="Write a response"></textarea>
<div class="columns is-mobile">
<div class="column">
<button type="submit" class="button is-success">Send Reply</button>
</div>
<div class="column is-narrow">
<a href="/contact?intent=report&subject=report.message&id={{.MessageID}}"
class="button has-text-danger ml-4">
<span class="icon"><i class="fa fa-flag"></i></span>
<span>Report</span>
</a>
</div>
</div>
</form>
<hr>
</div>
{{range .ViewThread}}
<div class="media block">
{{$SourceUser := $UserMap.Get .SourceUserID}}
<div class="media-left">
{{template "avatar-64x64" $SourceUser}}
</div>
<div class="media-content">
<p class="title is-4">{{$SourceUser.NameOrUsername}}</p>
<p class="subtitle is-6">
<span class="icon"><i class="fa fa-user"></i></span>
<a href="/u/{{$SourceUser.Username}}">{{$SourceUser.Username}}</a>
{{if not $SourceUser.Certified}}
<span class="has-text-danger">
<span class="icon"><i class="fa fa-certificate"></i></span>
<span>Not Certified!</span>
</span>
{{end}}
{{if $SourceUser.IsAdmin}}
<span class="has-text-danger">
<span class="icon"><i class="fa fa-gavel"></i></span>
<span>Admin</span>
</span>
{{end}}
</p>
</div>
</div>
<div class="block content">
{{ToMarkdown .Message}}
</div>
<div class="block">
<em>Sent on {{.CreatedAt.Format "2006-01-02 15:04:05"}}</em>
{{if not .Read}}<span class="tag is-success ml-2">UNREAD</span>{{end}}
</div>
<hr class="block">
{{end}}
<!-- Pager footer -->
<div class="block">
<div class="level">
<div class="level-left">
<div>
Found <strong>{{.ThreadPager.Total}}</strong> message{{Pluralize64 .ThreadPager.Total}} in this thread
(page {{.ThreadPager.Page}} of {{.ThreadPager.Pages}}).
</div>
</div>
<div class="level-right">
{{if .ThreadPager.HasPrevious}}
<a href="{{$Request.URL.Path}}?page={{.ThreadPager.Previous}}" class="button">Previous</a>
{{end}}
{{if .ThreadPager.HasNext}}
<a href="{{$Request.URL.Path}}?page={{.ThreadPager.Next}}" class="button">Next Page</a>
{{end}}
</div>
</div>
</div>
</div>
{{else}}
<div class="card-content content">
<p>
You have <strong>{{.Unread}}</strong> unread message{{Pluralize64 .Unread}}. Select a message on the
other column to read the conversation here.
</p>
</div>
{{end}}
</div>
</div>
<div class="column is-one-third">
<div class="card block">
<header class="card-header has-background-link">
<p class="card-header-title has-text-light">Messages</p>
</header>
<div class="card-content">
<div class="tabs is-toggle">
<ul>
<li{{if not .IsSentBox}} class="is-active"{{end}}>
<a href="/messages">Inbox</a>
</li>
<li{{if .IsSentBox}} class="is-active"{{end}}>
<a href="/messages?box=sent">Sent</a>
</li>
</ul>
</div>
<ul class="menu-list block">
{{$IsSentBox := .IsSentBox}}
{{range .Messages}}
<li>
<a href="/messages/read/{{.ID}}">
<div>
{{if $IsSentBox}}
{{$User := $UserMap.Get .TargetUserID}}
<strong>Sent to {{$User.Username}}</strong>
{{else}}
{{$User := $UserMap.Get .SourceUserID}}
<strong>From {{$User.Username}}</strong>
{{end}}
{{if not .Read}}
<span class="tag is-success">{{if $IsSentBox}}UNREAD{{else}}NEW{{end}}</span>
{{end}}
</div>
<div class="my-1">
<em>
{{Substring .Message 48}}…
</em>
</div>
<div>
Sent {{.CreatedAt.Format "2006-01-02 15:04:05"}}
</div>
</a>
</li>
{{end}}
</ul>
<!-- Pager footer -->
<div class="block">
<div>
Found <strong>{{.Pager.Total}}</strong> message{{Pluralize64 .Pager.Total}}
(page {{.Pager.Page}} of {{.Pager.Pages}}).
</div>
{{if .Pager.HasPrevious}}
<a href="/messages?{{if .IsSentBox}}box=sent&{{end}}page={{.Pager.Previous}}" class="button">Previous</a>
{{end}}
{{if .Pager.HasNext}}
<a href="/messages?{{if .IsSentBox}}box=sent&{{end}}page={{.Pager.Next}}" class="button">Next Page</a>
{{end}}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{{end}}