<h2>Pleasure alert <details style="display: inline-block;font-size:12px;"> <summary class="text-muted" style="opacity:.5;"></summary> <label><input id="test-mode" type="checkbox"> Test Mode</label> · <label><input id="fake-requests" type="checkbox"> Fake Requests</label> </details> </h2> <span data-bs-toggle="modal" data-bs-target="#turn-on" id="btn-on" style="background: #7f0000;font-size: 48px;padding: 10px 50px;border-radius: 10px;width: max-content;display: block;margin-left: auto;margin-right: auto;cursor: pointer;">Turn <b>ON</b></span> <span onclick="disableAlert()" id="btn-off" style="display:none;background: #007f0b;font-size: 48px;padding: 10px 50px;border-radius: 10px;width: max-content;margin-left: auto;margin-right: auto;cursor: pointer;">Turn <b>OFF</b></span> <p style="text-align:center;margin-top:10px;">Sending next notification <b><span id="next-notification">never</span></b></p> <style> .modal-header { border-bottom: 1px solid #353738; } .modal-content { border: 1px solid rgba(255, 255, 255, .2); background-color: #111; } .btn-close { filter: invert(1); } </style> <div class="modal fade" id="turn-on"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title">Somepony will be awoken.</h4> <button type="button" class="btn-close" data-bs-dismiss="modal"></button> </div> <div class="modal-body"> <button onclick="enableAlert();" data-bs-dismiss="modal" class="btn btn-success" style="font-size:20px;font-weight:bold;display:block;width:100%;">I wish to proceed.</button> <hr> <div class="alert alert-warning"> This alert system is designed to emit sudden alerts, and may surprise somecreature if e.g. they are sleeping. Keep that in mind. </div> <p> <b>Disclaimer:</b> This is NOT an emergency alert system, use the "Emergency alert" option is you need immediate help and comfort. </p> <p> © <?= date('Y') ?> Equestria.dev </p> </div> </div> </div> </div> <script> window.alertInterval = null; window.alertIntervalCounter = 15; function sendNotification() { window.alertIntervalCounter = -1; if (document.getElementById("test-mode").checked) { document.getElementById("next-notification").innerText = "now"; if (document.getElementById("fake-requests").checked) { window.alertIntervalCounter = 15; document.getElementById("next-notification").innerText = "15 seconds"; } else { window.fetch("/api/pleasure").then(() => { window.alertIntervalCounter = 15; document.getElementById("next-notification").innerText = "15 seconds"; }) } } else { document.getElementById("next-notification").innerText = "now"; if (document.getElementById("fake-requests").checked) { window.alertIntervalCounter = 15; document.getElementById("next-notification").innerText = "15 seconds"; } else { window.fetch("/api/pleasure-real").then(() => { window.alertIntervalCounter = 15; document.getElementById("next-notification").innerText = "15 seconds"; }) } } } function enableAlert() { sendNotification(); document.getElementById("btn-on").style.display = "none"; document.getElementById("btn-off").style.display = "block"; document.getElementById("test-mode").disabled = true; document.getElementById("fake-requests").disabled = true; window.alertInterval = setInterval(() => { window.alertIntervalCounter--; if (window.alertIntervalCounter === 0) { sendNotification(); } else if (window.alertIntervalCounter > -1) { document.getElementById("next-notification").innerText = window.alertIntervalCounter + " second" + (window.alertIntervalCounter > 1 ? "s" : ""); } }, 1000); } function disableAlert() { clearInterval(window.alertInterval); document.getElementById("next-notification").innerText = "never"; document.getElementById("btn-on").style.display = "block"; document.getElementById("btn-off").style.display = "none"; document.getElementById("test-mode").disabled = false; document.getElementById("fake-requests").disabled = false; } </script>