Initial commit
This commit is contained in:
80
templates/index.html
Normal file
80
templates/index.html
Normal file
@@ -0,0 +1,80 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Attack Status</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
text-align: center;
|
||||
margin-top: 100px;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
#message {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
/* Emergency STOP button */
|
||||
#stopBtn {
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
border-radius: 50%;
|
||||
background: radial-gradient(circle at 30% 30%, #ff6b6b, #b30000);
|
||||
border: 12px solid #f1c40f; /* yellow ring */
|
||||
box-shadow:
|
||||
0 8px 0 #8c0000, /* top shadow */
|
||||
0 15px 20px rgba(0,0,0,0.5);
|
||||
color: white;
|
||||
font-size: 2.2rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
transition: all 0.1s ease-in-out;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Pressed effect */
|
||||
#stopBtn:active {
|
||||
box-shadow:
|
||||
0 3px 0 #8c0000,
|
||||
0 5px 10px rgba(0,0,0,0.4);
|
||||
transform: translateY(5px);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="message"></div>
|
||||
<button id="stopBtn">STOP</button>
|
||||
|
||||
<script>
|
||||
// Server-side injected value
|
||||
const attack = {{ attack }};
|
||||
|
||||
const message = document.getElementById("message");
|
||||
const stopBtn = document.getElementById("stopBtn");
|
||||
|
||||
const green = () => {
|
||||
document.body.style.backgroundColor = "#7dff7d"; // green background
|
||||
message.textContent = "✅ The attack has been stopped.";
|
||||
stopBtn.style.display = "none";
|
||||
}
|
||||
|
||||
stopBtn.onclick = async () => {
|
||||
await fetch("/stop");
|
||||
green();
|
||||
};
|
||||
|
||||
if (attack) {
|
||||
document.body.style.backgroundColor = "#ff4d4d"; // red background
|
||||
message.textContent = "⚠️ Attack in progress...";
|
||||
stopBtn.style.display = "inline-block";
|
||||
} else {
|
||||
green();
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user