Clean up polltask.js

app/public/static/js/polltask.js

@@ -22,7 +22,7 @@ function sleep(interval) {
 }
 
 
-async function pollTask(poll_url, disableTimeout) {
+async function pollTask(poll_url, disableTimeout, onProgress) {
 	let tries = 0;
 
 	while (true) {
@@ -43,30 +43,7 @@ async function pollTask(poll_url, disableTimeout) {
 		}
 
 		if (res && res.status) {
-			let status = res.status.toLowerCase();
-
-			const progress = document.getElementById("progress");
-
-			if (status === "progress") {
-				progress.classList.remove("d-none");
-				const bar = progress.children[0];
-
-				const {current, total, running} = res.result;
-				const perc = Math.min( Math.max(100 * current / total, 0), 100);
-				bar.style.width = `${perc}%`;
-				bar.setAttribute("aria-valuenow", current);
-				bar.setAttribute("aria-valuemax", total);
-
-				const packages = running.map(x => `${x.author}/${x.name}`).join(", ");
-				document.getElementById("status").textContent = `Status: in progress (${current} / ${total})\n\n${packages}`;
-			} else {
-				progress.classList.add("d-none");
-
-				if (status === "pending") {
-					status = "pending or unknown";
-				}
-				document.getElementById("status").textContent = `Status: ${status}`;
-			}
+			onProgress?.(res);
 		}
 
 		if (res && res.status === "SUCCESS") {
@@ -89,3 +66,38 @@ async function performTask(url) {
 		throw "Start task didn't return string!";
 	}
 }
+
+window.addEventListener("load", () => {
+	const taskId = document.querySelector("[data-task-id]")?.getAttribute("data-task-id");
+	if (taskId) {
+		const progress = document.getElementById("progress");
+
+		function onProgress(res) {
+			let status = res.status.toLowerCase();
+			if (status === "progress") {
+				progress.classList.remove("d-none");
+				const bar = progress.children[0];
+
+				const {current, total, running} = res.result;
+				const perc = Math.min(Math.max(100 * current / total, 0), 100);
+				bar.style.width = `${perc}%`;
+				bar.setAttribute("aria-valuenow", current);
+				bar.setAttribute("aria-valuemax", total);
+
+				const packages = running.map(x => `${x.author}/${x.name}`).join(", ");
+				document.getElementById("status").textContent = `Status: in progress (${current} / ${total})\n\n${packages}`;
+			} else {
+				progress.classList.add("d-none");
+
+				if (status === "pending") {
+					status = "pending or unknown";
+				}
+				document.getElementById("status").textContent = `Status: ${status}`;
+			}
+		}
+
+		pollTask(`/tasks/${taskId}/`, true, onProgress)
+			.then(function() { location.reload() })
+			.catch(function() { location.reload() })
+	}
+});

app/templates/packages/create_edit.html

@@ -18,7 +18,7 @@
 	{{ form_scripts() }}
 	{{ easymde_scripts() }}
 	{% if enable_wizard %}
-		<script src="/static/js/polltask.js"></script>
+		<script src="/static/js/polltask.js?v=3"></script>
 		<script src="/static/js/package_create.js"></script>
 	{% endif %}
 	<script src="/static/js/package_edit.js?v=3"></script>

app/templates/tasks/view.html

@@ -10,22 +10,17 @@
 
 {% block content %}
 	<h1>{{ self.title() }}</h1>
-	<p id="status"></p>
-	<div id="progress" class="progress d-none">
-		<div class="progress-bar bg-info" role="progressbar" style="width: 50%;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
-	</div>
+	<article data-task-id="{{ info.id }}">
+		<p id="status"></p>
+		<div id="progress" class="progress d-none">
+			<div class="progress-bar bg-info" role="progressbar" style="width: 50%;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
+		</div>
+	</article>
 
 	{% if "error" in info or info.status == "FAILURE" or info.status == "REVOKED" %}
 		<pre style="white-space: pre-wrap; word-wrap: break-word;">{{ info.error }}</pre>
 	{% else %}
-		<script src="/static/js/polltask.js?v=2"></script>
-		<script>
-			// @author rubenwardy
-			// @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-v3-or-Later
-			pollTask("{{ url_for('tasks.check', id=info.id) }}", true)
-					.then(function() { location.reload() })
-					.catch(function() { location.reload() })
-		</script>
+		<script src="/static/js/polltask.js?v=3"></script>
 		<noscript>
 			{{ _("Reload the page to check for updates.") }}
 		</noscript>