yetangitu/Battery-Emulator
1
0
Fork 0
mirror of https://github.com/dalathegreat/Battery-Emulator.git synced 2025-10-06 03:50:13 +02:00
Code Issues Projects Releases Packages Wiki Activity

Add Loading Animation During OTA Firmware and Hardware Info Retrieval

Browse source
This commit is contained in:
amarofarinha 2024-09-16 14:41:39 +01:00
parent 3849980a26
commit 1ba88637be
3 changed files with 50 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

46
Software/src/lib/ayushsharma82-ElegantOTA/CurrentPlainHTML.txt
View file

@ -5,29 +5,34 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Battery Emulator OTA Update</title> <title>Battery Emulator OTA Update</title>
<script> <script>
async function checkEmulatorStatusReboot() { let loadingDivText = "Loading...";
async function checkEmulatorStatusReboot() {
const data = await getData('/GetFirmwareInfo'); const data = await getData('/GetFirmwareInfo');
if (data) { if (data) {
document.getElementById('firmwareVersion').textContent = data.firmware; document.getElementById('firmwareVersion').textContent = data.firmware;
document.getElementById('hardwareID').textContent = data.hardware; document.getElementById('hardwareID').textContent = data.hardware;
document.getElementById('rebooting-container').classList.add('hidden'); stopLoadingEfect();
document.getElementById('content').classList.remove('rebootingOn');
resetView(); resetView();
} else { } else {
// Emulator not online, keep waiting // Emulator not online, keep waiting
setTimeout(checkEmulatorStatusReboot, 2000); // Check again in 2 seconds setTimeout(checkEmulatorStatusReboot, 2000); // Check again in 2 seconds
} }
}; };
function startRebootEfect(){ function startLoadingEfect(){
document.getElementById("rebooting-message").textContent =loadingDivText;
document.getElementById('rebooting-container').classList.remove('hidden'); document.getElementById('rebooting-container').classList.remove('hidden');
document.getElementById('content').classList.add('rebootingOn'); document.getElementById('content').classList.add('rebootingOn');
} }
function stopLoadingEfect(){
document.getElementById('rebooting-container').classList.add('hidden');
document.getElementById('content').classList.remove('rebootingOn');
}
function startRebootWait(){ function startRebootWait(){
loadingDivText = "Rebooting...";
const div1 = document.getElementById('successColumn'); const div1 = document.getElementById('successColumn');
if (!div1.classList.contains('hidden')) { if (!div1.classList.contains('hidden')) {
setTimeout(startRebootEfect, 1000); setTimeout(startLoadingEfect, 1000);
setTimeout(checkEmulatorStatusReboot, 5000); setTimeout(checkEmulatorStatusReboot, 5000);
} }
}; };
@ -61,15 +66,32 @@ async function getData(relativePath) {
} }
}; };
window.onload = () => { window.onload = () => {
let hardware =""; let hardware ="?";
let firmware=""; let firmware="?";
getData('/GetFirmwareInfo').then(data => {
// Set a timeout of 10 seconds (10000 milliseconds)
const timeout = new Promise((_, reject) =>
setTimeout(() => reject(new Error('Request timed out')), 10000)
);
// Race between getData and the timeout
Promise.race([getData('/GetFirmwareInfo'), timeout])
.then(data => {
if (data) { if (data) {
document.getElementById('firmwareVersion').textContent = data.firmware; document.getElementById('firmwareVersion').textContent = data.firmware;
document.getElementById('hardwareID').textContent = data.hardware; document.getElementById('hardwareID').textContent = data.hardware;
}else
{
document.getElementById('firmwareVersion').textContent = "(error)";
document.getElementById('hardwareID').textContent = "(error)";
} }
})
.catch(error => {
document.getElementById('firmwareVersion').textContent = "(timeout)";
document.getElementById('hardwareID').textContent = "(timeout)";
}); });
stopLoadingEfect();
const div1 = document.getElementById('progressColumn'); const div1 = document.getElementById('progressColumn');
observer.observe(div1, { attributes: true, attributeFilter: ['class'] }); observer.observe(div1, { attributes: true, attributeFilter: ['class'] });
const div2 = document.getElementById('successColumn'); const div2 = document.getElementById('successColumn');
@ -101,8 +123,8 @@ h3 {font-size: 2rem; margin: 0.00em 0 0.00em 0; font-weight: bold; font-family:
</style> </style>
</head> </head>
<body class="dark:bg-[#18191a] bg-white dark:text-[#e4e6eb] px-6"> <body class="dark:bg-[#18191a] bg-white dark:text-[#e4e6eb] px-6">
<div id="rebooting-container" class="hidden"> <div id="rebooting-container" class="">
<div id="rebooting-message">Rebooting...</div> <div id="rebooting-message">Loading...</div>
<div class="spinner"></div> <div class="spinner"></div>
</div> </div>
<h2>Battery Emulator</h2> <h2>Battery Emulator</h2>

2
Software/src/lib/ayushsharma82-ElegantOTA/src/elop.cpp
View file

File diff suppressed because one or more lines are too long

2
Software/src/lib/ayushsharma82-ElegantOTA/src/elop.h
View file

@ -3,6 +3,6 @@
#include <Arduino.h> #include <Arduino.h>
extern const uint8_t ELEGANT_HTML[40500]; extern const uint8_t ELEGANT_HTML[41354];
#endif #endif