feat: human-readable uptime formatting

This commit is contained in:
Yurii
2024-01-13 13:00:43 +03:00
parent a9db175dba
commit f22c64e30c
3 changed files with 75 additions and 66 deletions

View File

@@ -95,11 +95,11 @@
</tr> </tr>
<tr> <tr>
<th scope="row">Uptime:</th> <th scope="row">Uptime:</th>
<td><b class="uptime"></b> sec.</td> <td><b class="uptime-days"></b> days, <b class="uptime-hours"></b> hours, <b class="uptime-min"></b> min., <b class="uptime-sec"></b> sec.</td>
</tr> </tr>
<tr> <tr>
<th scope="row">Free memory:</th> <th scope="row">Free memory:</th>
<td><b class="free-heap"></b> of <b class="total-heap"></b> bytes, max block: <b class="max-free-block-heap"></b> bytes</td> <td><b class="free-heap"></b> of <b class="total-heap"></b> bytes, max free block: <b class="max-free-block-heap"></b> bytes</td>
</tr> </tr>
<tr> <tr>
<th scope="row">Last reset reason:</th> <th scope="row">Last reset reason:</th>

Binary file not shown.

View File

@@ -10,17 +10,9 @@ function setupForm(formSelector) {
if (button) { if (button) {
defaultText = button.textContent; defaultText = button.textContent;
button.onmouseout = function (event) {
if (button.hasAttribute('aria-busy')) {
return;
} }
button.classList.remove('success', 'failed'); form.addEventListener('submit', async (event) => {
button.textContent = defaultText;
};
}
form.addEventListener('submit', async function (event) {
event.preventDefault(); event.preventDefault();
if (button) { if (button) {
@@ -29,24 +21,33 @@ function setupForm(formSelector) {
button.setAttribute('aria-busy', true); button.setAttribute('aria-busy', true);
} }
const onSuccess = function (response) { const onSuccess = (response) => {
if (button) { if (button) {
button.textContent = 'Saved'; button.textContent = 'Saved';
button.removeAttribute('disabled');
button.classList.add('success'); button.classList.add('success');
button.removeAttribute('aria-busy'); button.removeAttribute('aria-busy');
setTimeout(() => {
button.removeAttribute('disabled');
button.classList.remove('success', 'failed');
button.textContent = defaultText;
}, 5000);
} }
} };
const onFailed = function (response) { const onFailed = (response) => {
if (button) { if (button) {
button.textContent = 'Error'; button.textContent = 'Error';
button.removeAttribute('disabled');
button.classList.add('failed'); button.classList.add('failed');
button.removeAttribute('aria-busy'); button.removeAttribute('aria-busy');
setTimeout(() => {
button.removeAttribute('disabled');
button.classList.remove('success', 'failed');
button.textContent = defaultText;
}, 5000);
} }
} };
try { try {
let fd = new FormData(form); let fd = new FormData(form);
@@ -92,7 +93,7 @@ function setupNetworkScanForm(formSelector, tableSelector) {
defaultText = button.innerHTML; defaultText = button.innerHTML;
} }
const onSubmitFn = async function (event) { const onSubmitFn = async (event) => {
if (event) { if (event) {
event.preventDefault(); event.preventDefault();
} }
@@ -109,7 +110,7 @@ function setupNetworkScanForm(formSelector, tableSelector) {
return; return;
} }
const onSuccess = async function (response) { const onSuccess = async (response) => {
let result = await response.json(); let result = await response.json();
console.log('networks: ', result); console.log('networks: ', result);
@@ -158,9 +159,9 @@ function setupNetworkScanForm(formSelector, tableSelector) {
button.removeAttribute('disabled'); button.removeAttribute('disabled');
button.removeAttribute('aria-busy'); button.removeAttribute('aria-busy');
} }
} };
const onFailed = async function (response) { const onFailed = async (response) => {
table.classList.remove('hidden'); table.classList.remove('hidden');
if (button) { if (button) {
@@ -168,10 +169,10 @@ function setupNetworkScanForm(formSelector, tableSelector) {
button.removeAttribute('disabled'); button.removeAttribute('disabled');
button.removeAttribute('aria-busy'); button.removeAttribute('aria-busy');
} }
} };
let attempts = 5; let attempts = 5;
let timer = setInterval(async function () { let timer = setInterval(async () => {
attempts--; attempts--;
try { try {
@@ -208,17 +209,9 @@ function setupRestoreBackupForm(formSelector) {
if (button) { if (button) {
defaultText = button.textContent; defaultText = button.textContent;
button.onmouseout = function (event) {
if (button.hasAttribute('aria-busy')) {
return;
} }
button.classList.remove('success', 'failed'); form.addEventListener('submit', async (event) => {
button.textContent = defaultText;
};
}
form.addEventListener('submit', async function (event) {
event.preventDefault(); event.preventDefault();
if (button) { if (button) {
@@ -227,23 +220,33 @@ function setupRestoreBackupForm(formSelector) {
button.setAttribute('aria-busy', true); button.setAttribute('aria-busy', true);
} }
const onSuccess = function (response) { const onSuccess = (response) => {
if (button) { if (button) {
button.textContent = 'Restored'; button.textContent = 'Restored';
button.removeAttribute('disabled');
button.classList.add('success'); button.classList.add('success');
button.removeAttribute('aria-busy'); button.removeAttribute('aria-busy');
}
}
const onFailed = function (response) { setTimeout(() => {
button.removeAttribute('disabled');
button.classList.remove('success', 'failed');
button.textContent = defaultText;
}, 5000);
}
};
const onFailed = (response) => {
if (button) { if (button) {
button.textContent = 'Error'; button.textContent = 'Error';
button.removeAttribute('disabled');
button.classList.add('failed'); button.classList.add('failed');
button.removeAttribute('aria-busy'); button.removeAttribute('aria-busy');
setTimeout(() => {
button.removeAttribute('disabled');
button.classList.remove('success', 'failed');
button.textContent = defaultText;
}, 5000);
} }
} };
const files = form.querySelector('#restore-file').files; const files = form.querySelector('#restore-file').files;
if (files.length <= 0) { if (files.length <= 0) {
@@ -293,17 +296,9 @@ function setupUpgradeForm(formSelector) {
if (button) { if (button) {
defaultText = button.textContent; defaultText = button.textContent;
button.onmouseout = function (event) {
if (button.hasAttribute('aria-busy')) {
return;
} }
button.classList.remove('success', 'failed'); const statusToText = (status) => {
button.textContent = defaultText;
};
}
const statusToText = function (status) {
switch (status) { switch (status) {
case 0: case 0:
return "None"; return "None";
@@ -324,9 +319,9 @@ function setupUpgradeForm(formSelector) {
default: default:
return "Unknown"; return "Unknown";
} }
} };
const onResult = async function (response) { const onResult = async (response) => {
if (!response) { if (!response) {
return; return;
} }
@@ -368,28 +363,38 @@ function setupUpgradeForm(formSelector) {
} }
} }
} }
} };
const onSuccess = function (response) { const onSuccess = (response) => {
onResult(response); onResult(response);
if (button) { if (button) {
button.textContent = defaultText; button.textContent = defaultText;
button.removeAttribute('disabled');
button.removeAttribute('aria-busy'); button.removeAttribute('aria-busy');
}
}
const onFailed = function (response) { setTimeout(() => {
button.removeAttribute('disabled');
button.classList.remove('success', 'failed');
button.textContent = defaultText;
}, 5000);
}
};
const onFailed = (response) => {
if (button) { if (button) {
button.textContent = 'Error'; button.textContent = 'Error';
button.removeAttribute('disabled');
button.classList.add('failed'); button.classList.add('failed');
button.removeAttribute('aria-busy'); button.removeAttribute('aria-busy');
}
}
form.addEventListener('submit', async function (event) { setTimeout(() => {
button.removeAttribute('disabled');
button.classList.remove('success', 'failed');
button.textContent = defaultText;
}, 5000);
}
};
form.addEventListener('submit', async (event) => {
event.preventDefault(); event.preventDefault();
if (button) { if (button) {
@@ -532,6 +537,10 @@ async function loadVars() {
setValue('.version', result.system.version); setValue('.version', result.system.version);
setValue('.build-date', result.system.buildDate); setValue('.build-date', result.system.buildDate);
setValue('.uptime', result.system.uptime); setValue('.uptime', result.system.uptime);
setValue('.uptime-days', Math.floor(result.system.uptime / 86400));
setValue('.uptime-hours', Math.floor(result.system.uptime % 86400 / 3600));
setValue('.uptime-min', Math.floor(result.system.uptime % 3600 / 60));
setValue('.uptime-sec', Math.floor(result.system.uptime % 60));
setValue('.free-heap', result.system.freeHeap); setValue('.free-heap', result.system.freeHeap);
setValue('.total-heap', result.system.totalHeap); setValue('.total-heap', result.system.totalHeap);
setValue('.max-free-block-heap', result.system.maxFreeBlockHeap); setValue('.max-free-block-heap', result.system.maxFreeBlockHeap);