{{define "title"}}People{{end}} {{define "content"}} <div class="container"> {{$Root := .}} <section class="hero is-link is-bold"> <div class="hero-body"> <div class="container"> <h1 class="title"> {{if eq .Sort "distance"}} <i class="fa fa-location-dot mr-2"></i> Who's Nearby {{else}} <i class="fa fa-people-group mr-2"></i> People {{end}} </h1> <h2 class="subtitle">Member Directory</h2> </div> </div> </section> <form action="/members" method="GET"> <div class="p-4"> <div class="columns"> <div class="column"> Found {{FormatNumberCommas .Pager.Total}} user{{Pluralize64 .Pager.Total}} (page {{.Pager.Page}} of {{.Pager.Pages}}). </div> </div> {{if .FriendSearch}} <div class="notification is-success is-light"> Currently searching within your <i class="fa fa-user-group"></i> Friends list. </div> {{else if eq .Sort "distance"}} <div class="notification is-success is-light content"> <p> Showing you <i class="fa fa-location-dot mr-1"></i> <strong>Who's Nearby.</strong> </p> <!-- Show options to refresh their location --> <p> {{if eq .MyLocation.Source "geoip"}} You had set your location to update automatically by your IP address <small>(currently {{.GeoIPInsights.Short}}).</small> <a href="/settings#location">Change your location settings?</a> {{else if eq .MyLocation.Source "gps"}} You once set your location via your device's GPS coordinates. <a href="/settings#location" id="gpsRefresh">Refresh to your current location now?</a> {{else if eq .MyLocation.Source "pin"}} You had set your location by dropping a pin on a map. <a href="/settings#location">Update your location?</a> {{else if eq .MyLocation.Source ""}} You will need to <a href="/settings#location">set your location</a> first before we can sort people by distance from you. {{end}} </p> </div> {{else if eq .Certified "shy"}} <div class="notification is-success is-light content"> <p> Showing you <i class="fa fa-ghost"></i> <strong>Shy Accounts</strong>. These profiles may be marked as private or have no photo available to you, as all of theirs are set to 'friends-only' or 'private.' </p> <p> Shy Accounts are limited in the way they can interact with our non-shy members. <a href="/faq#shy-faqs" target="_blank">Learn more <i class="fa fa-external-link"></i></a> </p> </div> {{end}} <div class="block"> <div class="card nonshy-collapsible-mobile"> <header class="card-header has-background-link-light"> <p class="card-header-title has-text-dark"> Search Filters </p> <button class="card-header-icon" type="button"> <span class="icon"> <i class="fa fa-angle-up"></i> </span> </button> </header> <div class="card-content"> <div class="columns"> <div class="column pr-1"> <div class="field"> <label class="label">Status:</label> <div class="select is-fullwidth"> <select id="certified" name="certified"> <optgroup label="Certification Status"> <option value="true">Only certified users</option> <option value="false"{{if eq $Root.Certified "false"}} selected{{end}}>Non-certified only</option> </optgroup> <optgroup label="Profile Status"> <option value="shy"{{if eq $Root.Certified "shy"}} selected{{end}}>Shy Accounts</option> {{if .CurrentUser.IsInnerCircle}} <option value="circle"{{if eq $Root.Certified "circle"}} selected{{end}}>Inner circle only</option> {{end}} <option value="admin"{{if eq $Root.Certified "admin"}} selected{{end}}>Website administrators</option> </optgroup> {{if .CurrentUser.HasAdminScope "admin.user.ban"}} <optgroup label="Admin Options"> <option value="banned"{{if eq $Root.Certified "banned"}} selected{{end}}>☮ Banned</option> <option value="disabled"{{if eq $Root.Certified "disabled"}} selected{{end}}>☮ Disabled</option> </optgroup> {{end}} <option value="all"{{if eq $Root.Certified "all"}} selected{{end}}>Show all users</option> </select> </div> </div> </div> <div class="column px-1"> <div class="field"> <label class="label">Name or username:</label> <input type="text" class="input" name="username" autocomplete="off" value="{{$Root.EmailOrUsername}}"> </div> </div> <div class="column px-1"> <div class="field"> <label class="label">Age:</label> <div class="columns is-mobile is-gapless"> <div class="column"> <div class="select is-fullwidth"> <select name="age_min"> <option value="">Min</option> {{range IterRange 18 120}} <option value="{{.}}"{{if eq $Root.AgeMin .}} selected{{end}}>{{.}}</option> {{end}} </select> </div> </div> <div class="column"> <div class="select is-fullwidth"> <select name="age_max"> <option value="">Max</option> {{range IterRange 18 120}} <option value="{{.}}"{{if eq $Root.AgeMax .}} selected{{end}}>{{.}}</option> {{end}} </select> </div> </div> </div> </div> </div> <div class="column pl-1"> <div class="field"> <label class="label" for="gender">Gender:</label> <div class="select is-fullwidth"> <select id="gender" name="gender"> <option value=""></option> {{range .Enum.Gender}} <option value="{{.}}"{{if eq $Root.Gender .}} selected{{end}}>{{.}}</option> {{end}} </select> </div> </div> </div> </div> <div class="columns is-centered"> <div class="column pr-1"> <div class="field"> <label class="label" for="orientation">Orientation:</label> <div class="select is-fullwidth"> <select id="orientation" name="orientation"> <option value=""></option> {{range .Enum.Orientation}} <option value="{{.}}"{{if eq $Root.Orientation .}} selected{{end}}>{{.}}</option> {{end}} </select> </div> </div> </div> <div class="column px-1"> <div class="field"> <label class="label" for="marital_status">Relationship:</label> <div class="select is-fullwidth"> <select id="marital_status" name="marital_status"> <option value=""></option> {{range .Enum.MaritalStatus}} <option value="{{.}}"{{if eq $Root.MaritalStatus .}} selected{{end}}>{{.}}</option> {{end}} </select> </div> </div> </div> <div class="column px-1"> <div class="field"> <label class="label" for="here_for">Here for:</label> <div class="select is-fullwidth"> <select id="here_for" name="here_for"> <option value=""></option> {{range .Enum.HereFor}} <option value="{{.}}"{{if eq $Root.HereFor .}} selected{{end}}>{{.}}</option> {{end}} </select> </div> </div> </div> <div class="column px-1"> <div class="field"> <label class="label" for="friends">Friendship:</label> <label class="checkbox"> <input type="checkbox" name="friends" id="friends" value="true" {{if .FriendSearch}}checked{{end}}> Show only my friends </label> </div> </div> <div class="column px-1"> <div class="field"> <label class="label" for="sort">Sort by:</label> <div class="select is-fullwidth"> <select id="sort" name="sort"> <option value="last_login_at desc"{{if eq .Sort "last_login_at desc"}} selected{{end}}>Last login</option> <option value="created_at desc"{{if eq .Sort "created_at desc"}} selected{{end}}>Signup date</option> <option value="username"{{if eq .Sort "username"}} selected{{end}}>Username (a-z)</option> <option value="username desc"{{if eq .Sort "username desc"}} selected{{end}}>Username (z-a)</option> <option value="lower(name)"{{if eq .Sort "lower(name)"}} selected{{end}}>Name (a-z)</option> <option value="lower(name) desc"{{if eq .Sort "lower(name) desc"}} selected{{end}}>Name (z-a)</option> <option value="distance"{{if eq .Sort "distance"}} selected{{end}}>Distance to me</option> </select> </div> </div> </div> <div class="column pl-1 has-text-right"> <a href="/members" class="button">Reset</a> <button type="submit" class="button is-success"> <span>Search</span> <span class="icon"><i class="fa fa-search"></i></span> </button> </div> </div> </div> </div> </div> {{SimplePager .Pager}} <div class="columns is-multiline"> {{range .Users}} <div class="column is-half-tablet is-one-third-desktop"> <div class="card"> <div class="card-content"> <div class="media block"> <div class="media-left"> {{template "avatar-64x64" .}} <!-- Friendship badge --> {{if $Root.FriendMap.Get .ID}} <div class="has-text-centered"> <span class="is-size-7 has-text-warning"> <i class="fa fa-user-group" title="Friends"></i> Friends </span> </div> {{end}} </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}} {{if and $Root.CurrentUser.IsInnerCircle .InnerCircle}} <img src="/static/img/circle-16.png"> {{end}} </a> {{if eq .Visibility "private"}} <sup class="fa fa-mask is-size-7" title="Private Profile"></sup> {{end}} </p> <p class="subtitle is-6 mb-2"> <span class="icon"><i class="fa fa-user"></i></span> <a href="/u/{{.Username}}">{{.Username}}</a> <!-- Not Certified or Shy Account badge --> {{if not .Certified}} <span class="has-text-danger is-size-7"> <i class="fa fa-certificate"></i> <span>Not Certified!</span> </span> {{else if $Root.ShyMap.Get .ID}} <span class="has-text-danger is-size-7"> <i class="fa fa-ghost"></i> <span>Shy Account</span> </span> {{end}} <!-- "(banned)" label --> {{if ne .Status "active"}}<small>({{.Status}})</small>{{end}} {{if .IsAdmin}} <span class="tag is-danger is-light p-1" style="font-size: x-small"> <i class="fa fa-peace mr-1"></i> <span>Admin</span> </span> {{end}} <!-- Photo count pulled to the right --> <a href="/u/{{.Username}}/photos" class="tag is-info is-light is-pulled-right"> <i class="fa fa-camera mr-2"></i> {{$Root.PhotoCountMap.Get .ID}} </a> </p> {{if .GetProfileField "city"}} <p class="subtitle is-6 mb-2"> {{.GetProfileField "city"}} </p> {{end}} <p class="subtitle is-7 mb-2"> {{if or (ne .GetDisplayAge "n/a")}} <span class="mr-2">{{.GetDisplayAge}}</span> {{end}} {{if .GetProfileField "gender"}} <span class="mr-2">{{.GetProfileField "gender"}}</span> {{end}} {{if .GetProfileField "pronouns"}} <span class="mr-2">{{.GetProfileField "pronouns"}}</span> {{end}} {{if .GetProfileField "orientation"}} <span class="mr-2">{{.GetProfileField "orientation"}}</span> {{end}} <!-- Chat room status --> {{if $Root.UserOnChatMap.Get .Username}} <div> <span class="tag is-success is-light"> <i class="fa fa-user mr-2"></i> Currently on chat! </span> </div> {{end}} <!-- Show a subfooter based on ordered by --> {{if eq $Root.Sort "last_login_at desc"}} <div> <small> Last logged in: <span title="On {{.LastLoginAt.Format "Jan _2 2006 15:04:05 MST"}}"> {{SincePrettyCoarse .LastLoginAt}} ago </span> </small> </div> {{end}} {{if eq $Root.Sort "created_at desc"}} <div> <small> Member since: <span title="On {{.CreatedAt.Format "Jan _2 2006 15:04:05 MST"}}"> {{SincePrettyCoarse .CreatedAt}} ago </span> </small> </div> {{end}} <!-- Ordered by distance? --> {{if eq $Root.Sort "distance"}} <div> {{$Root.DistanceMap.Get .ID}} away </div> {{end}} </p> </div> </div><!-- media-block --> </div> </div> </div> {{end}}<!-- range .Friends --> </div> {{SimplePager .Pager}} </div> </form> </div> {{end}}