mirror of
https://github.com/MasterAcnolo/Freedom-Loader.git
synced 2026-07-29 18:25:47 +02:00
Feat: Enhance download experience with progress indicators and toast notifications
This commit is contained in:
@@ -7,12 +7,24 @@ let userStoppedDownload = false;
|
||||
|
||||
form.addEventListener("submit", async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
const urlInput = form.querySelector("input[name='url']");
|
||||
const url = urlInput.value.trim();
|
||||
|
||||
// Basic URL validation
|
||||
if (!url) {
|
||||
window.showError("Please enter a URL");
|
||||
return;
|
||||
}
|
||||
|
||||
button.disabled = true;
|
||||
stopBtn.style.display = "inline-flex";
|
||||
statusDiv.style.display = "none"; // Hide status div
|
||||
statusDiv.style.display = "none";
|
||||
isDownloading = true;
|
||||
userStoppedDownload = false;
|
||||
|
||||
// Show progress UI immediately with initial message
|
||||
showInitialProgress();
|
||||
|
||||
const formData = new FormData(form);
|
||||
const params = new URLSearchParams(formData);
|
||||
|
||||
@@ -26,12 +38,15 @@ form.addEventListener("submit", async (e) => {
|
||||
if (!res.ok) {
|
||||
if (!userStoppedDownload) {
|
||||
const errorText = await res.text();
|
||||
statusDiv.textContent = errorText;
|
||||
statusDiv.style.display = "block";
|
||||
window.showError(errorText);
|
||||
resetProgressBar();
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// Download successful
|
||||
window.showSuccess("Download completed!");
|
||||
|
||||
} catch (err) {
|
||||
if (!isDownloading && !userStoppedDownload) {
|
||||
statusDiv.style.display = "none";
|
||||
@@ -43,6 +58,29 @@ form.addEventListener("submit", async (e) => {
|
||||
}
|
||||
});
|
||||
|
||||
function showInitialProgress() {
|
||||
const progressWrapper = document.getElementById("downloadProgressWrapper");
|
||||
const progressBarText = document.getElementById("downloadProgressText");
|
||||
const speedElement = document.getElementById("downloadSpeedText");
|
||||
const stageElement = document.getElementById("downloadStage");
|
||||
const stopBtn = document.getElementById("stopBtn");
|
||||
|
||||
if (progressWrapper) progressWrapper.style.display = "block";
|
||||
if (progressBarText) {
|
||||
progressBarText.style.display = "block";
|
||||
progressBarText.innerHTML = "0%";
|
||||
}
|
||||
if (speedElement) {
|
||||
speedElement.style.display = "block";
|
||||
speedElement.textContent = "0 Mib/s";
|
||||
}
|
||||
if (stageElement) {
|
||||
stageElement.style.display = "block";
|
||||
stageElement.textContent = "Retrieving data...";
|
||||
}
|
||||
if (stopBtn) stopBtn.style.display = "inline-flex";
|
||||
}
|
||||
|
||||
async function stopDownload() {
|
||||
if (!isDownloading) return;
|
||||
|
||||
@@ -56,6 +94,7 @@ async function stopDownload() {
|
||||
headers: { "Content-Type": "application/x-www-form-urlencoded" },
|
||||
});
|
||||
|
||||
window.showWarning("Download stopped");
|
||||
} catch (err) {
|
||||
console.error("Error stopping download:", err);
|
||||
} finally {
|
||||
@@ -63,12 +102,20 @@ async function stopDownload() {
|
||||
button.disabled = false;
|
||||
stopBtn.disabled = false;
|
||||
stopBtn.style.display = "none";
|
||||
|
||||
// Reset progress bar
|
||||
const progressWrapper = document.getElementById("downloadProgressWrapper");
|
||||
if (progressWrapper) progressWrapper.style.display = "none";
|
||||
|
||||
const progressBar = document.getElementById("downloadProgress");
|
||||
if (progressBar) progressBar.style.width = "0%";
|
||||
resetProgressBar();
|
||||
}
|
||||
}
|
||||
|
||||
function resetProgressBar() {
|
||||
const progressWrapper = document.getElementById("downloadProgressWrapper");
|
||||
if (progressWrapper) progressWrapper.style.display = "none";
|
||||
|
||||
const progressBar = document.getElementById("downloadProgress");
|
||||
if (progressBar) progressBar.style.width = "0%";
|
||||
|
||||
const progressBarText = document.getElementById("downloadProgressText");
|
||||
if (progressBarText) progressBarText.style.display = "none";
|
||||
|
||||
const speedElement = document.getElementById("downloadSpeedText");
|
||||
if (speedElement) speedElement.style.display = "none";
|
||||
}
|
||||
Reference in New Issue
Block a user