feat: sleep() to update progress bar as we go

src/ts/frontend.ts

@@ -484,7 +484,11 @@ function variantNavAnchor (cutoff: number): string {
 	<a name="variant-c${String(cutoff)}"></a>`;
 }
 
-function getResults():void {
+async function sleep (ms: number): Promise<string> {
+	return new Promise(resolve => setTimeout(resolve, ms));
+}
+
+async function getResults():Promise<string>{
 	// Disable 'roll' button
 	$("#mainRoll").prop("disabled", true);
 	console.log("Getting results...");
@@ -495,6 +499,7 @@ function getResults():void {
 	let controlCardBody = $("#results").find("#resultsControl .card-body");
 	let controlCardNav = controlCardBody.find("#resultsNav");
 
+	let numDone = 0;
 
 	let maxDice = 10;
 	let cutoffStart = 6;
@@ -524,13 +529,17 @@ function getResults():void {
 				controlCardNav.append(` <a class="btn btn-primary" href="#variant-c${String(cutoff)}">Jump to ${resultProperties.diceVariant}</a> `);
 
 			}
-			$("#resultsProgress").width(`${i/maxDice*100}%`);
-			$("#resultsProgress").text(`${i/maxDice*100}%`);
+			numDone++;
+			let progress = ((numDone) / ( maxDice * cutoffMax ) * 100).toFixed(2);
+			$("#resultsProgress").width(`${progress}%`);
+			$("#resultsProgress").text(`${progress}%`);
+			await(sleep(50));
 		}
 	}
 	console.log("Results done!");
 	$("#resultsProgress").width("100%");
 	$("#resultsProgress").text("100%");
+	return "Done";
 }