Abuse report management UI
This commit is contained in:
80
res/include/script/file_viewer/AbuseReportWindow.js
Normal file
80
res/include/script/file_viewer/AbuseReportWindow.js
Normal file
@@ -0,0 +1,80 @@
|
||||
function AbuseReportWindow(viewer) {
|
||||
this.viewer = viewer
|
||||
this.visible = false
|
||||
this.modal = new Modal(
|
||||
document.getElementById("file_viewer"),
|
||||
() => { this.toggle() },
|
||||
"Report abuse", "600px", "auto",
|
||||
)
|
||||
|
||||
this.btnReportAbuse = document.getElementById("btn_report_abuse")
|
||||
this.btnReportAbuse.addEventListener("click", () => { this.toggle() })
|
||||
|
||||
let clone = document.getElementById("tpl_report_abuse_popup").content.cloneNode(true)
|
||||
this.form = clone.querySelector(".abuse_type_form")
|
||||
// this.emailField = clone.querySelector(".abuse_email_field")
|
||||
this.notification = clone.querySelector(".abuse_report_notification")
|
||||
this.modal.setBody(clone)
|
||||
|
||||
this.form.addEventListener("submit", e => { this.submit(e) })
|
||||
}
|
||||
|
||||
AbuseReportWindow.prototype.toggle = function () {
|
||||
if (this.visible) {
|
||||
this.modal.close()
|
||||
this.btnReportAbuse.classList.remove("button_highlight")
|
||||
this.visible = false
|
||||
} else {
|
||||
this.modal.open()
|
||||
this.btnReportAbuse.classList.add("button_highlight")
|
||||
this.visible = true
|
||||
}
|
||||
}
|
||||
|
||||
AbuseReportWindow.prototype.notify = function (success, content) {
|
||||
this.notification.style.display = ""
|
||||
this.notification.classList = "abuse_report_notification " + (success ? "highlight_green" : "highlight_red")
|
||||
this.notification.innerHTML = content
|
||||
}
|
||||
|
||||
AbuseReportWindow.prototype.submit = async function (e) {
|
||||
e.preventDefault()
|
||||
|
||||
let abuseType = ""
|
||||
this.form.querySelectorAll('[name="abuse_type"]').forEach(elem => {
|
||||
if (elem.checked) {
|
||||
abuseType = elem.value
|
||||
}
|
||||
})
|
||||
|
||||
if (abuseType === "") {
|
||||
this.notify(false, "Please select an abuse type")
|
||||
return
|
||||
}
|
||||
|
||||
const form = new FormData()
|
||||
form.append("type", abuseType)
|
||||
// form.append("email", this.emailField.value)
|
||||
|
||||
try {
|
||||
const resp = await fetch(
|
||||
this.viewer.file.get_href + "/report_abuse",
|
||||
{ method: "POST", body: form }
|
||||
);
|
||||
if (resp.status >= 400) {
|
||||
let json = await resp.json()
|
||||
if (json.value === "resource_already_exists") {
|
||||
throw "You have already reported this file"
|
||||
} else if (json.value === "file_already_blocked") {
|
||||
throw "This file has already been blocked"
|
||||
} else if (json.value === "multiple_errors") {
|
||||
throw json.errors[0].message
|
||||
}
|
||||
throw json.message
|
||||
}
|
||||
|
||||
this.notify(true, "Report has been sent")
|
||||
} catch (err) {
|
||||
this.notify(false, "Failed to send report: " + err)
|
||||
}
|
||||
}
|
||||
@@ -77,6 +77,7 @@ function Viewer(type, viewToken, data) {
|
||||
}
|
||||
|
||||
this.embedWindow = new EmbedWindow(this)
|
||||
this.abuseReportWindow = new AbuseReportWindow(this)
|
||||
|
||||
if (userAuthenticated && !this.file.can_edit) {
|
||||
let btnGrab = document.getElementById("btn_grab")
|
||||
|
||||
@@ -17,6 +17,10 @@
|
||||
<i class="icon">block</i>
|
||||
Block files
|
||||
</a>
|
||||
<a class="button" href="/admin/abuse_reports">
|
||||
<i class="icon">report</i>
|
||||
User abuse reports
|
||||
</a>
|
||||
<a class="button" href="/admin/abuse_reporters">
|
||||
<i class="icon">report</i>
|
||||
Manage abuse reporters
|
||||
|
||||
19
res/template/admin_abuse_reports.html
Normal file
19
res/template/admin_abuse_reports.html
Normal file
@@ -0,0 +1,19 @@
|
||||
{{define "admin_abuse_reports"}}<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
{{template "meta_tags" "Abuse reports"}}
|
||||
{{template "user_style" .}}
|
||||
<script>window.api_endpoint = '{{.APIEndpoint}}';</script>
|
||||
<link rel='stylesheet' href='/res/svelte/admin_abuse_reports.css'>
|
||||
<script defer src='/res/svelte/admin_abuse_reports.js'></script>
|
||||
</head>
|
||||
<body>
|
||||
{{template "page_top" .}}
|
||||
<h1>Abuse reports</h1>
|
||||
<div id="page_content" class="page_content"></div>
|
||||
|
||||
{{template "page_bottom" .}}
|
||||
{{template "analytics"}}
|
||||
</body>
|
||||
</html>
|
||||
{{end}}
|
||||
@@ -90,6 +90,10 @@
|
||||
<i class="icon">code</i>
|
||||
<span>E<u>m</u>bed</span>
|
||||
</button>
|
||||
<button id="btn_report_abuse" class="toolbar_button button_full_width" title="Report abuse in this file">
|
||||
<i class="icon">flag</i>
|
||||
<span>Report</span>
|
||||
</button>
|
||||
<br/>
|
||||
|
||||
{{ if and .Other.FileAdsEnabled .Other.UserAdsEnabled }}
|
||||
@@ -175,6 +179,10 @@
|
||||
<a class="sponsors_banner" style="display: inline-block; width: 576px; height: 96px;" href="/click/DtZ3hHT9?target=https%3A%2F%2Fwww.amarulasolutions.com/jobs">
|
||||
<img src="/res/img/misc/banner_amarula_jobs.png" style="width: 100%; height: 100%" />
|
||||
</a>
|
||||
{{ else if eq .Other.AdType 7 }}
|
||||
<a class="sponsors_banner" style="display: inline-block; width: 728px; height: 90px;" href="/brave">
|
||||
<img src="/res/img/misc/brave-728x90.png" style="width: 100%; height: 100%" />
|
||||
</a>
|
||||
{{ else if eq .Other.AdType 8 }}
|
||||
<div style="text-align: center; line-height: 1.4em; font-size: 22px;">
|
||||
<img src="/res/img/pixeldrain_128.png" style="height: 2.4em; vertical-align: middle; margin: 4px;"/>
|
||||
@@ -207,10 +215,6 @@
|
||||
<a href="/click/7wy9gg2J?target=%2F%23pro" class="button button_highlight">Pixeldrain Pro: Only €2 per month</a>
|
||||
</div>
|
||||
</div>
|
||||
{{ else }}
|
||||
<a class="sponsors_banner" style="display: inline-block; width: 728px; height: 90px;" href="/click/MdUXxSov?target=https%3A%2F%2Fbrave.com%2Fpix009">
|
||||
<img src="/res/img/misc/brave-728x90.png" style="width: 100%; height: 100%" />
|
||||
</a>
|
||||
{{ end }}
|
||||
{{ else if not .Other.UserAdsEnabled }}
|
||||
<div style="text-align: center; line-height: 1.3em; font-size: 13px;">
|
||||
@@ -309,6 +313,56 @@
|
||||
<div class="embed_preview_area" style="text-align: center;"></div>
|
||||
</template>
|
||||
|
||||
<template id="tpl_report_abuse_popup">
|
||||
<p>
|
||||
If you think this file violates pixeldrain's
|
||||
<a href="/about#content-policy">content policy</a> you can
|
||||
report it for moderation with this form. You cannot report
|
||||
copyright abuse with this form, send a formal DMCA notification
|
||||
to the
|
||||
<a href="/about#content-policy">abuse e-mail address</a>
|
||||
instead.
|
||||
</p>
|
||||
<form class="abuse_type_form" style="width: 100%">
|
||||
<h3>Abuse type</h3>
|
||||
<input type="radio" id="abuse_type_terrorism" name="abuse_type" value="terrorism">
|
||||
<label for="abuse_type_terrorism">Terrorism</label>
|
||||
<br/>
|
||||
<input type="radio" id="abuse_type_gore" name="abuse_type" value="gore">
|
||||
<label for="abuse_type_gore">Gore</label>
|
||||
<br/>
|
||||
<input type="radio" id="abuse_type_child_abuse" name="abuse_type" value="child_abuse">
|
||||
<label for="abuse_type_child_abuse">Child abuse</label>
|
||||
<br/>
|
||||
<input type="radio" id="abuse_type_malware" name="abuse_type" value="malware">
|
||||
<label for="abuse_type_malware">Malware</label>
|
||||
<br/>
|
||||
<!--
|
||||
<h3>E-mail address</h3>
|
||||
<p>
|
||||
If you want to be notified when this file gets blocked you
|
||||
can enter your e-mail address here. This is optional, you
|
||||
can leave it empty if you want.
|
||||
</p>
|
||||
<input class="abuse_email_field" type="text" placeholder="e-mail address" style="width: 100%"/>
|
||||
<br/>
|
||||
-->
|
||||
|
||||
<h3>Send</h3>
|
||||
<div class="abuse_report_notification" style="display: none;"></div>
|
||||
<p>
|
||||
Abuse reports are manually reviewed. Normally this shouldn't
|
||||
take more than 24 hours. But during busy periods it can take
|
||||
longer.
|
||||
</p>
|
||||
<div style="text-align: right;">
|
||||
<button class="button_highlight abuse_report_submit" role="submit">
|
||||
<i class="icon">send</i> Send
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</template>
|
||||
|
||||
<script src="/res/script/Chart.min.js"></script>
|
||||
<script>
|
||||
'use strict';
|
||||
@@ -324,6 +378,7 @@
|
||||
{{template `EditWindow.js`}}
|
||||
{{template `EmbedWindow.js`}}
|
||||
{{template `DetailsWindow.js`}}
|
||||
{{template `AbuseReportWindow.js`}}
|
||||
{{template `ListNavigator.js`}}
|
||||
{{template `Viewer.js`}}
|
||||
|
||||
@@ -351,7 +406,7 @@
|
||||
{{ if eq .Other.AdType 5 }}
|
||||
<!-- AdMaven -->
|
||||
<script data-cfasync="false" async src="//d227cncaprzd7y.cloudfront.net/?acncd=905608"></script>
|
||||
{{ else if or (eq .Other.AdType 7) (eq .Other.AdType 8) (eq .Other.AdType 9) (eq .Other.AdType 10) (eq .Other.AdType 11) }}
|
||||
{{ else if ne .Other.AdType 4 }}
|
||||
<!-- PropellerAds -->
|
||||
<script>
|
||||
// Load fires when the page is completely finished loading,
|
||||
|
||||
Reference in New Issue
Block a user