mirror of
https://github.com/Viren070/mediaflow-proxy.git
synced 2025-12-01 23:22:12 +01:00
abbeaee0d0
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
140 lines
5.1 KiB
HTML
140 lines
5.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Speedtest</title>
|
|
<style>
|
|
body.light-mode {
|
|
font-family: Arial, sans-serif;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 100vh;
|
|
margin: 0;
|
|
background-color: #f4f4f9;
|
|
color: #333;
|
|
}
|
|
body.dark-mode {
|
|
font-family: Arial, sans-serif;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 100vh;
|
|
margin: 0;
|
|
background-color: #121212;
|
|
color: #ffffff;
|
|
}
|
|
.container {
|
|
text-align: center;
|
|
}
|
|
h1 {
|
|
font-size: 24px;
|
|
}
|
|
.progress-bar {
|
|
width: 80%;
|
|
margin: 20px auto;
|
|
height: 20px;
|
|
background-color: #e0e0e0;
|
|
border-radius: 10px;
|
|
overflow: hidden;
|
|
position: relative;
|
|
}
|
|
.progress-bar::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 0%;
|
|
height: 100%;
|
|
background-color: #3498db;
|
|
animation: progress 180s linear forwards;
|
|
}
|
|
@keyframes progress {
|
|
0% { width: 0%; }
|
|
100% { width: 100%; }
|
|
}
|
|
.toggle-switch {
|
|
position: absolute;
|
|
top: 10px;
|
|
right: 10px;
|
|
}
|
|
</style>
|
|
<script>
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
const taskId = urlParams.get("task_id");
|
|
if (!taskId || !/^[a-zA-Z0-9-_]+$/.test(taskId)) {
|
|
window.location.href = "/speedtest";
|
|
}
|
|
|
|
let statusCheckTimeout;
|
|
let retryCount = 0;
|
|
const MAX_RETRIES = 5;
|
|
|
|
async function checkStatus() {
|
|
try {
|
|
const controller = new AbortController();
|
|
const timeoutId = setTimeout(() => controller.abort(), 5000);
|
|
const response = await fetch(`/speedtest/results/${taskId}`, {
|
|
signal: controller.signal
|
|
});
|
|
clearTimeout(timeoutId);
|
|
|
|
if (!response.ok) {
|
|
throw new Error('Network response was not ok');
|
|
}
|
|
const data = await response.json();
|
|
console.log("Fetched data:", data);
|
|
retryCount = 0;
|
|
|
|
if (data && data.message && data.message.includes("still running")) {
|
|
console.log("Test still running, polling again...");
|
|
statusCheckTimeout = setTimeout(checkStatus, 5000);
|
|
} else {
|
|
console.log("Test complete, redirecting after a short delay...");
|
|
setTimeout(() => {
|
|
window.location.href = `/speedtest/results/${taskId}`;
|
|
}, 2000);
|
|
}
|
|
} catch (error) {
|
|
console.error("Error fetching status:", error);
|
|
retryCount++;
|
|
if (retryCount < MAX_RETRIES) {
|
|
statusCheckTimeout = setTimeout(checkStatus, 5000);
|
|
} else {
|
|
alert("Failed to check status after multiple attempts. Please refresh the page.");
|
|
}
|
|
}
|
|
}
|
|
|
|
// Cleanup on page unload
|
|
window.addEventListener('unload', () => {
|
|
if (statusCheckTimeout) {
|
|
clearTimeout(statusCheckTimeout);
|
|
}
|
|
});
|
|
|
|
// Start the first status check after 120 seconds (120000 milliseconds)
|
|
setTimeout(checkStatus, 120000);
|
|
|
|
// Toggle dark mode
|
|
function toggleDarkMode() {
|
|
const body = document.body;
|
|
body.classList.toggle('dark-mode');
|
|
body.classList.toggle('light-mode');
|
|
}
|
|
</script>
|
|
</head>
|
|
<body class="light-mode">
|
|
<div class="toggle-switch">
|
|
<label for="darkModeToggle" class="switch">
|
|
<input type="checkbox" id="darkModeToggle" onclick="toggleDarkMode()" aria-label="Toggle dark mode">
|
|
<span class="slider">Dark Mode</span>
|
|
</label>
|
|
</div>
|
|
<div class="container">
|
|
<h1>Speedtest in progress... Please wait up to 3 minutes.</h1>
|
|
<div class="progress-bar" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"></div>
|
|
</div>
|
|
</body>
|
|
</html> |