{{define "title"}}Friends{{end}} {{define "content"}} <div class="container"> {{$Root := .}} <section class="hero is-link is-bold"> <div class="hero-body"> <div class="container"> <h1 class="title"> <i class="fa fa-user-group mr-2"></i> Friends </h1> </div> </div> </section> <div class="p-4 is-text-centered"> <div class="level"> <div class="level-item"> <div class="tabs is-toggle"> <ul> <li{{if and (not .IsRequests) (not .IsPending) (not .IsIgnored)}} class="is-active"{{end}}> <a href="/friends">My Friends</a> </li> <li{{if .IsRequests}} class="is-active"{{end}}> <a href="/friends?view=requests"> Requests {{if .NavFriendRequests}}<span class="tag is-warning ml-2">{{.NavFriendRequests}}</span>{{end}} </a> </li> <li{{if .IsPending}} class="is-active"{{end}}> <a href="/friends?view=pending"> Sent </a> </li> <li{{if .IsIgnored}} class="is-active"{{end}}> <a href="/friends?view=ignored"> Ignored {{if .IgnoredFriendCount}}<span class="tag ml-2">{{.IgnoredFriendCount}}</span>{{end}} </a> </li> </ul> </div> </div> </div> </div> <div class="p-4"> <div class="notification is-success is-light"> <strong>New feature:</strong> you can now <a href="/members?friends=true">search and sort</a> your friends list in the <i class="fa fa-people-group"></i> Member Directory! </div> <div class="block"> {{if .IsPending}} You have sent {{.Pager.Total}} friend request{{Pluralize64 .Pager.Total}} which {{Pluralize64 .Pager.Total "has" "have"}} not been approved yet. {{else}} You have {{.Pager.Total}} friend{{if .IsRequests}} request{{end}}{{Pluralize64 .Pager.Total}} {{if .IsIgnored}} on ignore -- they don't know you ignored their request and they can not send another one.{{end}} (page {{.Pager.Page}} of {{.Pager.Pages}}). {{end}} </div> <div class="block"> {{SimplePager .Pager}} </div> <div class="columns is-multiline"> {{range .Friends}} <div class="column is-half-tablet is-one-third-desktop"> <form action="/friends/add" method="POST"> {{InputCSRF}} <input type="hidden" name="username" value="{{.Username}}"> <div class="card"> <div class="card-content"> <div class="media block"> <div class="media-left"> {{template "avatar-64x64" .}} </div> <div class="media-content"> <p class="title is-4"> <a href="/u/{{.Username}}" class="has-text-dark"> {{if ne .Status "active"}} <del>{{.NameOrUsername}}</del> {{else}} {{.NameOrUsername}} {{end}} </a> </p> <p class="subtitle is-6"> <span class="icon"><i class="fa fa-user"></i></span> <a href="/u/{{.Username}}">{{.Username}}</a> {{if not .Certified}} <span class="has-text-danger"> <span class="icon"><i class="fa fa-certificate"></i></span> <span>Not Certified!</span> </span> {{end}} <!-- "(banned)" label --> {{if ne .Status "active"}}<small>({{.Status}})</small>{{end}} {{if .IsAdmin}} <span class="has-text-danger"> <span class="icon"><i class="fa fa-peace"></i></span> <span>Admin</span> </span> {{end}} </p> </div> </div> </div> {{if $Root.IsIgnored}} <footer class="card-footer"> <button type="submit" name="verdict" value="reject" class="card-footer-item button is-danger is-outlined"> <span class="icon"><i class="fa fa-xmark"></i></span> <span>Reject</span> </button> </footer> {{else if $Root.IsRequests}} <footer class="card-footer"> <button type="submit" name="verdict" value="approve" class="card-footer-item button is-success"> <span class="icon"><i class="fa fa-check"></i></span> <span>Approve</span> </button> <button type="submit" name="verdict" value="reject" class="card-footer-item button is-danger"> <span class="icon"><i class="fa fa-xmark"></i></span> <span>Reject</span> </button> <button type="submit" name="verdict" value="ignore" class="card-footer-item button"> <span class="icon"><i class="fa fa-moon"></i></span> <span>Ignore</span> </button> </footer> {{else}} <footer class="card-footer"> <button type="submit" name="verdict" value="remove" class="card-footer-item button is-danger is-outlined" onclick="return confirm('Are you sure you want to remove this friendship?')"> <span class="icon"><i class="fa fa-xmark"></i></span> <span>{{if $Root.IsPending}}Cancel{{else}}Remove{{end}}</span> </button> </footer> {{end}} </div> </form> </div> {{end}}<!-- range .Friends --> </div> <div class="block"> {{SimplePager .Pager}} </div> </div> </div> {{end}}