Fix various loading states, remove .loading
class (#29920)
Various code was using fomantic `loading` class which I think got broken a while ago and rendered only a full circle. Fix those to use `is-loading`. Before: <img width="295" alt="Screenshot 2024-03-19 at 22 56 26" src="dbe83395
-5db4-4868-90bc-3613866a35f0"> After: <img width="60" alt="Screenshot 2024-03-19 at 22 54 35" src="8ac19b7e
-035a-4c6d-850b-53a234ef69c2"> <img width="294" alt="Screenshot 2024-03-19 at 22 54 56" src="34e819d7
-25f7-43a1-9d48-4a68dcd2b6ad"> <img width="320" alt="Screenshot 2024-03-19 at 22 55 16" src="05127544
-47ff-4e18-9fd8-c84e44c374f8"> <img width="153" alt="Screenshot 2024-03-19 at 23 01 43" src="a33248c6
-b11d-40ff-82d8-f5a3d85b55aa"> <img width="1300" alt="Screenshot 2024-03-19 at 23 56 25" src="562ca876
-b5d5-4295-961e-9d2cdab31ab0"> <img width="136" alt="Screenshot 2024-03-20 at 00 00 38" src="44838ac4
-67f3-4fec-a8e3-978cc5dbdb72"> (cherry picked from commit d6fed9ab88b13e124c5e59ceac5b21a3af52ad24)
This commit is contained in:
parent
64fcf0cb64
commit
1f1178ce9b
9 changed files with 18 additions and 34 deletions
|
@ -3,18 +3,20 @@ import {hideElem, showElem} from '../utils/dom.js';
|
|||
import {POST} from '../modules/fetch.js';
|
||||
|
||||
async function getArchive($target, url, first) {
|
||||
const dropdownBtn = $target[0].closest('.ui.dropdown.button');
|
||||
|
||||
try {
|
||||
dropdownBtn.classList.add('is-loading');
|
||||
const response = await POST(url);
|
||||
if (response.status === 200) {
|
||||
const data = await response.json();
|
||||
if (!data) {
|
||||
// XXX Shouldn't happen?
|
||||
$target.closest('.dropdown').children('i').removeClass('loading');
|
||||
dropdownBtn.classList.remove('is-loading');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!data.complete) {
|
||||
$target.closest('.dropdown').children('i').addClass('loading');
|
||||
// Wait for only three quarters of a second initially, in case it's
|
||||
// quickly archived.
|
||||
setTimeout(() => {
|
||||
|
@ -22,12 +24,12 @@ async function getArchive($target, url, first) {
|
|||
}, first ? 750 : 2000);
|
||||
} else {
|
||||
// We don't need to continue checking.
|
||||
$target.closest('.dropdown').children('i').removeClass('loading');
|
||||
dropdownBtn.classList.remove('is-loading');
|
||||
window.location.href = url;
|
||||
}
|
||||
}
|
||||
} catch {
|
||||
$target.closest('.dropdown').children('i').removeClass('loading');
|
||||
dropdownBtn.classList.remove('is-loading');
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue