new css and functions

This commit is contained in:
Mateusz Gruszczyński
2025-02-27 00:29:52 +01:00
parent f9215590ea
commit a17423aaa1
3 changed files with 242 additions and 30 deletions

View File

@ -20,7 +20,7 @@
white-space: pre-wrap;
}
/* Stylizacja overlay dla system update */
#system-update-overlay {
#system-update-overlay, #reboot-progress-overlay {
display: none;
position: fixed;
top: 0;
@ -33,16 +33,16 @@
text-align: center;
padding-top: 200px;
}
#system-update-overlay h3 {
#system-update-overlay h3, #reboot-progress-overlay h3 {
margin-bottom: 20px;
}
#system-update-overlay .progress-container {
.progress-container {
width: 50%;
margin: 20px auto;
background: #444;
border-radius: 5px;
}
#system-update-overlay .progress-bar {
.progress-bar {
width: 0%;
height: 30px;
background: #4caf50;
@ -158,7 +158,7 @@
</div>
</div>
<!-- Overlay dla system update -->
<!-- Overlay dla system update (5 minut) -->
<div id="system-update-overlay">
<h3>Aktualizacja systemu rozpoczęta...</h3>
<div class="progress-container">
@ -167,7 +167,16 @@
<p id="system-update-timer">300 sekund</p>
</div>
<!-- Div dla firmware restart -->
<!-- Overlay dla reboot progress (2 minuty) -->
<div id="reboot-progress-overlay">
<h3>Restart urządzenia...</h3>
<div class="progress-container">
<div id="reboot-progress-bar" class="progress-bar"></div>
</div>
<p id="reboot-timer">120 sekund</p>
</div>
<!-- Div dla firmware restart (komunikat z przyciskiem restartu) -->
<div id="firmware-restart-div" style="display:none; margin-top:20px;">
<div class="alert alert-warning">
Router wymaga ręcznego wykonania polecenia reboot.
@ -178,47 +187,74 @@
</div>
<script>
// System update: Po kliknięciu w formularz system update wyświetl overlay z licznikiem
// System update: Po kliknięciu w formularz system update
document.getElementById('system-update-form').addEventListener('submit', function(e) {
e.preventDefault(); // Zatrzymaj standardowe wysłanie formularza
var overlay = document.getElementById('system-update-overlay');
overlay.style.display = 'block';
var timeLeft = 300; // 300 sekund = 5 minut
var timeLeft = 240;
var progressBar = document.getElementById('system-update-progress');
var timerDisplay = document.getElementById('system-update-timer');
var interval = setInterval(function(){
timeLeft--;
var percent = ((300 - timeLeft) / 300) * 100;
var percent = ((240 - timeLeft) / 240) * 100;
progressBar.style.width = percent + '%';
timerDisplay.textContent = timeLeft + ' sekund';
if(timeLeft <= 0){
clearInterval(interval);
location.reload();
// Po zakończeniu 5 minut wykonaj polecenie "Wymuś sprawdzenie"
fetch('{{ url_for("force_check", device_id=device.id) }}', { method: 'GET' })
.then(function(response){
location.reload();
})
.catch(function(error){ console.error('Błąd force check:', error); });
}
}, 1000);
// Opcjonalnie wyślij formularz AJAX
// Opcjonalnie wysyłamy formularz AJAX, aby rozpocząć aktualizację systemu
fetch(this.action, { method: 'POST' })
.then(function(response){ /* opcjonalna obsługa odpowiedzi */ })
.catch(function(error){ console.error('Błąd aktualizacji systemu:', error); });
});
// Firmware update: Po kliknięciu w formularz firmware update wyświetl dodatkowy div z przyciskiem restartu
// Firmware update: Po kliknięciu w formularz firmware update
document.getElementById('firmware-update-form').addEventListener('submit', function(e) {
e.preventDefault(); // Zatrzymaj standardowe wysłanie formularza
fetch(this.action, { method: 'POST' })
.then(function(response){ /* opcjonalna obsługa odpowiedzi */ })
.catch(function(error){ console.error('Błąd aktualizacji firmware:', error); });
// Pokaż div z komunikatem o reboot i przyciskiem restartu
document.getElementById('firmware-restart-div').style.display = 'block';
});
// Restart urządzenia: Po kliknięciu przycisku restart wysyłamy żądanie POST do endpointu restart_device
// Restart urządzenia: Po kliknięciu przycisku restart wysyłamy komendę reboot,
// a następnie pokazujemy overlay z 2-minutowym paskiem postępu
document.getElementById('restart-device-btn').addEventListener('click', function() {
fetch('{{ url_for("restart_device", device_id=device.id) }}', {
method: 'POST'
}).then(function(response){
if(response.ok){
alert('Komenda reboot wysłana.');
location.reload();
// Pokaż overlay dla reboot progress
var rebootOverlay = document.getElementById('reboot-progress-overlay');
rebootOverlay.style.display = 'block';
var timeLeft = 90;
var progressBar = document.getElementById('reboot-progress-bar');
var timerDisplay = document.getElementById('reboot-timer');
var interval = setInterval(function(){
timeLeft--;
var percent = ((90 - timeLeft) / 90) * 100;
progressBar.style.width = percent + '%';
timerDisplay.textContent = timeLeft + ' sekund';
if(timeLeft <= 0){
clearInterval(interval);
// Po 2 minutach wykonaj polecenie "Wymuś sprawdzenie"
fetch('{{ url_for("force_check", device_id=device.id) }}', { method: 'GET' })
.then(function(response){
location.reload();
})
.catch(function(error){ console.error('Błąd force check:', error); });
}
}, 1000);
} else {
alert('Błąd podczas wysyłania komendy reboot.');
}