114 lines
5.2 KiB
Plaintext
114 lines
5.2 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="/assets/css/bootstrap.min.css">
|
|
<title>UBS Admin - Edit ban</title>
|
|
</head>
|
|
<body class="bg-dark text-light">
|
|
<div class="container">
|
|
<div class="row justify-content-center mt-5">
|
|
<div class="col-md-6 col-lg-4">
|
|
<div class="card bg-dark text-light shadow">
|
|
<div class="card-body p-4">
|
|
<h2 class="text-center mb-4">Edit Ban</h2>
|
|
<div class="alert" id="message" style="display: none;"></div>
|
|
<form id="banForm">
|
|
<div class="mb-3">
|
|
<label for="robloxId" class="form-label">Roblox ID (Optional)</label>
|
|
<input type="text" class="form-control" id="robloxId" name="robloxId" pattern="\d*" title="ID Only, must be a number" value="<%= ban.robloxId %>">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="discordId" class="form-label">Discord ID (Optional)</label>
|
|
<input type="text" class="form-control" id="discordId" name="discordId" pattern="\d*" title="ID Only, must be a number" value="<%= ban.discordId %>">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="robloxUsername" class="form-label">Roblox Username (Optional)</label>
|
|
<input type="text" class="form-control" id="robloxUsername" name="robloxUsername" value="<%= ban.robloxUsername %>">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="discordUsername" class="form-label">Discord Username (Optional)</label>
|
|
<input type="text" class="form-control" id="discordUsername" name="discordUsername" value="<%= ban.discordUsername %>">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="reasonShort" class="form-label">Short Reason</label>
|
|
<input type="text" class="form-control" id="reasonShort" name="reasonShort" required value="<%= ban.reasonShort %>">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="reasonLong" class="form-label">Long Reason</label>
|
|
<textarea class="form-control" id="reasonLong" name="reasonLong" rows="3" required><%= ban.reasonLong %></textarea>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label">Flags</label>
|
|
<div>
|
|
<input type="hidden" id="reasonsFlag" name="reasonsFlag" value="0">
|
|
<% Object.keys(reasonFlags).forEach(function(key) { %>
|
|
<div class="form-check">
|
|
<input class="form-check-input flag-checkbox" type="checkbox" id="<%= key %>" value="<%= reasonFlags[key] %>" <%= setFlags.includes(key) ? 'checked' : '' %>>
|
|
<label class="form-check-label" for="<%= key %>"><%= key %></label>
|
|
</div>
|
|
<% }); %>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="expiresTimestamp" class="form-label">Expires (Optional)</label>
|
|
<input type="datetime-local" class="form-control" id="expiresTimestamp" name="expiresTimestamp" value="<%= ban.expiresTimestamp %>" <%= ban.expiresTimestamp ? '' : 'disabled' %>>
|
|
<button type="button" class="btn btn-secondary mt-2" id="setNowButton">Now</button>
|
|
<script>
|
|
document.getElementById('setNowButton').addEventListener('click', function() {
|
|
const expiresTimestamp = document.getElementById('expiresTimestamp');
|
|
const now = new Date();
|
|
const year = now.getFullYear();
|
|
const month = String(now.getMonth() + 1).padStart(2, '0');
|
|
const day = String(now.getDate()).padStart(2, '0');
|
|
const hours = String(now.getHours()).padStart(2, '0');
|
|
const minutes = String(now.getMinutes()).padStart(2, '0');
|
|
const formattedNow = `${year}-${month}-${day}T${hours}:${minutes}`;
|
|
expiresTimestamp.value = formattedNow;
|
|
expiresTimestamp.disabled = false;
|
|
document.getElementById('neverExpires').checked = false;
|
|
});
|
|
|
|
</script>
|
|
<div class="form-check mt-2">
|
|
<input class="form-check-input" type="checkbox" id="neverExpires" name="neverExpires" <%= ban.expiresTimestamp ? '' : 'checked' %>>
|
|
<label class="form-check-label" for="neverExpires">Never</label>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.getElementById('neverExpires').addEventListener('change', function() {
|
|
const expiresTimestamp = document.getElementById('expiresTimestamp');
|
|
if (this.checked) {
|
|
expiresTimestamp.value = '';
|
|
expiresTimestamp.disabled = true;
|
|
expiresTimestamp.setAttribute('data-null', 'true');
|
|
} else {
|
|
expiresTimestamp.disabled = false;
|
|
expiresTimestamp.removeAttribute('data-null');
|
|
}
|
|
});
|
|
|
|
document.getElementById('banForm').addEventListener('submit', function(event) {
|
|
const expiresTimestamp = document.getElementById('expiresTimestamp');
|
|
if (expiresTimestamp.getAttribute('data-null') === 'true') {
|
|
expiresTimestamp.value = null;
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<button type="submit" class="btn btn-primary w-100">Submit</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="/assets/js/bootstrap.bundle.min.js"></script>
|
|
<script>
|
|
const ban = <%- JSON.stringify(ban) %>;
|
|
console.log(ban)
|
|
</script>
|
|
<script src="/assets/js/flags.js"></script>
|
|
<script src="/assets/js/admin/edit.js"></script>
|
|
</body>
|
|
</html> |