f0e69f78da
* Add an Admin Certification Photo workflow where we can request the user to upload a secondary form of ID (government issued photo ID showing their face and date of birth). * An admin rejection option can request secondary photo ID. * It sends a distinct e-mail to the user apart from the regular rejection email * It flags their cert photo as "Secondary Needed" forever: even if the user removes their cert photo and starts from scratch, it will immediately request secondary ID when uploading a new primary photo. * Secondary photos are deleted from the server on both Approve and Reject by the admin account, for user privacy. * If approved, a Secondary Approved=true boolean is stored in the database. This boolean is set to False if the user deletes their cert photo in the future.
303 lines
16 KiB
HTML
303 lines
16 KiB
HTML
{{define "title"}}Certification Photo{{end}}
|
|
{{define "content"}}
|
|
<div class="container">
|
|
<section class="hero is-info is-bold">
|
|
<div class="hero-body">
|
|
<div class="container">
|
|
<h1 class="title">
|
|
Certification Photo
|
|
</h1>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<div class="block p-4">
|
|
<div class="level">
|
|
<div class="level-item">
|
|
<div class="card" style="width: 100%; max-width: 640px">
|
|
<header class="card-header has-background-link">
|
|
<p class="card-header-title has-text-light">
|
|
<span class="icon"><i class="fa fa-image-portrait"></i></span>
|
|
Certification Photo
|
|
</p>
|
|
</header>
|
|
<div class="card-content">
|
|
|
|
<div class="block">
|
|
<strong>Certification Status:</strong>
|
|
{{if eq .CertificationPhoto.Status "needed"}}
|
|
<span class="tag is-warning">Awaiting Upload</span>
|
|
{{else if eq .CertificationPhoto.Status "pending"}}
|
|
<span class="tag is-info">Pending Approval</span>
|
|
{{else if eq .CertificationPhoto.Status "approved"}}
|
|
<span class="tag is-success">Approved</span>
|
|
{{else if eq .CertificationPhoto.Status "secondary"}}
|
|
<span class="tag is-info">Secondary ID Requested</span>
|
|
{{else if eq .CertificationPhoto.Status "rejected"}}
|
|
<span class="tag is-danger">Rejected</span>
|
|
{{else}}
|
|
<span class="tag is-danger">{{.CertificationPhoto.Status}}</span>
|
|
{{end}}
|
|
</div>
|
|
|
|
<!-- Secondary form of ID requested? -->
|
|
{{if eq .CertificationPhoto.Status "secondary"}}
|
|
<div class="notification is-info is-light content">
|
|
<p>
|
|
A {{PrettyTitle}} admin has reviewed your certification photo and has requested
|
|
that you show a secondary form of photo ID to verify your age.
|
|
</p>
|
|
|
|
<p>
|
|
Please upload a scan or photo of an official, government issued ID which shows
|
|
a photo of your face and your date of birth. <strong>Please black out any other
|
|
personal information from your ID.</strong> We do not want your name, address,
|
|
ID number, or any sensitive information - <em>just</em> your <strong>photo</strong>
|
|
and your <strong>date of birth</strong>.
|
|
</p>
|
|
|
|
<p>
|
|
Please refer to this <strong>example photo ID:</strong>
|
|
</p>
|
|
|
|
<p>
|
|
<img src="/static/img/photoid-example.jpg">
|
|
</p>
|
|
|
|
<p>
|
|
Acceptable forms of ID may include the following:
|
|
</p>
|
|
|
|
<ul>
|
|
<li>A government issued passport</li>
|
|
<li>A government issued driver's license or photo ID card</li>
|
|
</ul>
|
|
|
|
<p>
|
|
Please prepare this scan of your photo ID and upload it below.
|
|
</p>
|
|
|
|
<p>
|
|
For your privacy, <strong>we will delete this image</strong> from
|
|
the {{PrettyTitle}} database after it has been reviewed.
|
|
</p>
|
|
|
|
<form method="POST" action="/photo/certification" enctype="multipart/form-data">
|
|
{{InputCSRF}}
|
|
<input type="hidden" name="secondary" value="true">
|
|
|
|
<div class="field">
|
|
<label for="file" class="label">Browse and select your photo ID scan:</label>
|
|
<div class="file has-name is-fullwidth">
|
|
<label class="file-label">
|
|
<input class="file-input" type="file"
|
|
name="file"
|
|
id="file"
|
|
accept=".jpg,.jpeg,.jpe,.png"
|
|
required>
|
|
<span class="file-cta">
|
|
<span class="file-icon">
|
|
<i class="fas fa-upload"></i>
|
|
</span>
|
|
<span class="file-label">
|
|
Choose a file…
|
|
</span>
|
|
</span>
|
|
<span class="file-name" id="fileName">
|
|
Select a file
|
|
</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="block has-text-centered">
|
|
<button type="submit" class="button is-primary">Upload Photo ID</button>
|
|
</div>
|
|
|
|
</form>
|
|
</div>
|
|
{{else if ne .CertificationPhoto.SecondaryFilename ""}}
|
|
<div class="notification is-success is-light content">
|
|
<p>
|
|
Your <strong>secondary form of photo ID</strong> is pending approval. It will
|
|
be deleted from the website's database after it has been reviewed.
|
|
</p>
|
|
|
|
<p>
|
|
If you wish to delete it immediately, please use the button below to
|
|
"Delete My Certification Photo." It will remove your original certification
|
|
photo as well as the secondary photo ID that you had uploaded before.
|
|
</p>
|
|
</div>
|
|
{{else if .CertificationPhoto.SecondaryVerified}}
|
|
<div class="notification is-success is-light content">
|
|
<p>
|
|
Your <i class="fa fa-id-card"></i> <strong>secondary form of photo ID</strong> has
|
|
been reviewed and approved by an administrator. We have removed the image itself
|
|
from the server.
|
|
</p>
|
|
|
|
<p>
|
|
Note: if you delete your Certification Photo at this point, or upload a new one,
|
|
you will be requested to re-upload your photo ID again as well.
|
|
</p>
|
|
</div>
|
|
{{end}}
|
|
|
|
<!-- Admin rejection comment -->
|
|
{{if .CertificationPhoto.AdminComment}}
|
|
<div class="notification is-warning content">
|
|
<p>
|
|
Your certification photo has been rejected. Please review the admin comment
|
|
below and try taking and uploading a new certification photo.
|
|
</p>
|
|
<p>
|
|
<strong>Admin comment:</strong>
|
|
</p>
|
|
<p>
|
|
{{.CertificationPhoto.AdminComment}}
|
|
</p>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if .CertificationPhoto.Filename}}
|
|
<div class="image block">
|
|
<img src="{{PhotoURL .CertificationPhoto.Filename}}">
|
|
</div>
|
|
<div class="block">
|
|
<form action="/photo/certification" method="POST">
|
|
{{InputCSRF}}
|
|
<input type="hidden" name="delete" value="true">
|
|
|
|
<div class="field">
|
|
<label class="label has-text-danger">Delete Photo</label>
|
|
|
|
<p class="help block">
|
|
If your Certification Photo has been approved (so that your user
|
|
account is "Certified"), removing this picture will revert your
|
|
account to "Not Certified" status. You would then need to be
|
|
re-approved with a new Certification Photo to be recertified.
|
|
</p>
|
|
|
|
<button type="submit" class="button is-danger"
|
|
{{if eq .CertificationPhoto.Status "approved"}}
|
|
onclick="return window.confirm('Removing this photo will mark your account as Not Certified.\n\nYou will then need to upload a new certification photo for approval to certify your account again.\n\nAre you sure you want to do this?')"
|
|
{{end}}>
|
|
<span class="icon"><i class="fa fa-trash"></i></span>
|
|
<span>Delete My Certification Photo</span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<hr class="block">
|
|
{{end}}
|
|
|
|
<div class="block content">
|
|
<p>
|
|
Uploading a certification photo (or "verification selfie") is required to gain
|
|
full access to this website. We want to know that only "real" users are here --
|
|
no anonymous lurkers. To get certified, please take a selfie that shows your
|
|
face and depicts you holding a sheet of paper with the following information
|
|
written on it:
|
|
</p>
|
|
|
|
<ul>
|
|
<li>The name of this website: {{PrettyTitle}}</li>
|
|
<li>Your username: <strong>{{.CurrentUser.Username}}</strong></li>
|
|
<li>Today's date: <strong>{{Now.Format "2006/01/02"}}</strong></li>
|
|
</ul>
|
|
|
|
<p>
|
|
Please ensure that your face is visible and your hand is clearly seen
|
|
holding the sheet of paper. Your certification photo <strong>will not</strong>
|
|
appear on your photo gallery, and nor should you upload it separately
|
|
to your gallery page (as it may enable others to photoshop your image
|
|
and use it to verify a fake profile on another website).
|
|
</p>
|
|
</div>
|
|
|
|
<!-- If the user has no profile picture, ask them to upload that first. -->
|
|
{{if not .CurrentUser.ProfilePhotoID}}
|
|
<div class="notification is-danger is-light content">
|
|
<p>
|
|
<i class="fa fa-hand mr-1"></i>
|
|
<strong>Hang on a moment!</strong>
|
|
</p>
|
|
|
|
<p>
|
|
Before you submit your certification photo, please upload
|
|
<a href="/photo/upload?intent=profile_pic" class="has-text-link"><strong>a profile photo</strong></a>
|
|
that shows your face. Your certification photo will be compared to the face
|
|
picture on your profile page so that we know it's actually the same person.
|
|
</p>
|
|
|
|
<p>
|
|
<strong>Note:</strong> you may make your profile picture "Friends-only" or
|
|
"Private" if you need; but you should have a clear face picture on your
|
|
profile page for the {{PrettyTitle}} admin to compare your certification
|
|
picture to!
|
|
</p>
|
|
</div>
|
|
{{else}}
|
|
|
|
<form method="POST" action="/photo/certification" enctype="multipart/form-data">
|
|
{{InputCSRF}}
|
|
|
|
<div class="has-text-centered block">
|
|
<div><strong>Example Picture</strong></div>
|
|
<div><small class="has-text-grey">(ink colors not important)</small></div>
|
|
<img src="/static/img/certification-example.jpg">
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="file" class="label">Browse and select your verification photo:</label>
|
|
<div class="file has-name is-fullwidth">
|
|
<label class="file-label">
|
|
<input class="file-input" type="file"
|
|
name="file"
|
|
id="file"
|
|
accept=".jpg,.jpeg,.jpe,.png"
|
|
required>
|
|
<span class="file-cta">
|
|
<span class="file-icon">
|
|
<i class="fas fa-upload"></i>
|
|
</span>
|
|
<span class="file-label">
|
|
Choose a file…
|
|
</span>
|
|
</span>
|
|
<span class="file-name" id="fileName">
|
|
Select a file
|
|
</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="block has-text-centered">
|
|
<button type="submit" class="button is-primary">Upload Certification Photo</button>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
window.addEventListener("DOMContentLoaded", (event) => {
|
|
let $file = document.querySelector("#file"),
|
|
$fileName = document.querySelector("#fileName");
|
|
|
|
$file.addEventListener("change", function() {
|
|
let file = this.files[0];
|
|
$fileName.innerHTML = file.name;
|
|
});
|
|
});
|
|
</script>
|
|
{{end}}
|