diff options
| author | Frederick Muriuki Muriithi | 2025-03-21 13:04:28 -0500 |
|---|---|---|
| committer | Frederick Muriuki Muriithi | 2025-03-21 13:04:28 -0500 |
| commit | 8b6ae4a103df26e923143ef3fbecb84ac4c74d2f (patch) | |
| tree | e1ba784ddfdc6e38d266ec2de47a0dfd529e3c5d /uploader | |
| parent | 9df7ff0d54630ae214f94f9625d2e7a78f6b98bf (diff) | |
| download | gn-uploader-8b6ae4a103df26e923143ef3fbecb84ac4c74d2f.tar.gz | |
Add "Busy" indicator
When the user clicks "Bulk Edit (Download Data)" button, it could take
a while to actually process and download the data. In that time, the
visual indicator that the system is busy is helpful to the user. This
commit adds the "busy" indicator.
Diffstat (limited to 'uploader')
| -rw-r--r-- | uploader/templates/phenotypes/view-dataset.html | 32 |
1 files changed, 26 insertions, 6 deletions
diff --git a/uploader/templates/phenotypes/view-dataset.html b/uploader/templates/phenotypes/view-dataset.html index fa1044b..ed59d76 100644 --- a/uploader/templates/phenotypes/view-dataset.html +++ b/uploader/templates/phenotypes/view-dataset.html @@ -147,6 +147,8 @@ }, { text: "Bulk Edit (Download Data)", + className: "btn btn-info btn-bulk-edit", + titleAttr: "Click to download data for editing.", action: (event, dt, node, config) => { var phenoids = []; var selected = dt.rows({selected: true, page: "all"}).data(); @@ -160,6 +162,19 @@ alert("No record selected. Nothing to do!"); return false; } + + $(".btn-bulk-edit").prop("disabled", true); + $(".btn-bulk-edit").addClass("d-none"); + var spinner = $( + "<div id='bulk-edit-spinner' class='spinner-grow text-info'>"); + spinner_content = $( + "<span class='visually-hidden'>"); + spinner_content.html( + "Downloading data …"); + spinner.append(spinner_content) + $(".btn-bulk-edit").parent().append( + spinner); + $.ajax( (`/species/${species_id}/populations/` + `${population_id}/phenotypes/datasets/` + @@ -185,19 +200,24 @@ console.log("Experienced an error: ", textStatus); console.log("The ERROR: ", errorThrown); }, + complete: (jqXHR, textStatus) => { + $("#bulk-edit-spinner").remove(); + $(".btn-bulk-edit").removeClass( + "d-none"); + $(".btn-bulk-edit").prop( + "disabled", false); + }, contentType: "application/json" }); - }, - className: "btn btn-info", - titleAttr: "Click to download data for editing." + } }, { text: "Bulk Edit (Upload Data)", + className: "btn btn-info btn-bulk-edit", + titleAttr: "Click to upload edited data you got by clicking the `Bulk Edit (Download Data)` button.", action: (event, dt, node, config) => { alert("Not implemented yet!") - }, - className: "btn btn-info", - titleAttr: "Click to upload edited data you got by clicking the `Bulk Edit (Download Data)` button." + } } ] }, |