Update app/static/script.js

app/static/script.js

@@ -2,7 +2,7 @@
 document.addEventListener('DOMContentLoaded', () => {
     // --- State ---
     let currentFile = null;
-    let currentXHR = null; // To hold the request object for cancellation
+    let currentXHR = null;
 
     // --- DOM Elements ---
     const states = {
@@ -22,6 +22,10 @@ document.addEventListener('DOMContentLoaded', () => {
     const uploadAnotherBtn = document.getElementById('upload-another-btn');
     const errorMessage = document.getElementById('error-message');
     const retryBtn = document.getElementById('retry-btn');
+    
+    // New elements for copy functionality
+    const downloadUrlInput = document.getElementById('download-url-input');
+    const copyLinkBtn = document.getElementById('copy-link-btn');
 
     // --- UI State Management ---
     function switchState(state) {
@@ -50,6 +54,7 @@ document.addEventListener('DOMContentLoaded', () => {
 
     uploadAnotherBtn.addEventListener('click', resetUploader);
     retryBtn.addEventListener('click', resetUploader);
+    copyLinkBtn.addEventListener('click', handleCopyLink);
 
     // --- Core Functions ---
     function handleFileSelect(event) {
@@ -71,8 +76,6 @@ document.addEventListener('DOMContentLoaded', () => {
         const formData = new FormData();
         formData.append('file', file);
 
-        // We use XMLHttpRequest instead of fetch because it provides
-        // a native 'onprogress' event for tracking upload progress.
         const xhr = new XMLHttpRequest();
         currentXHR = xhr;
 
@@ -87,8 +90,14 @@ document.addEventListener('DOMContentLoaded', () => {
         xhr.addEventListener('load', () => {
             if (xhr.status >= 200 && xhr.status < 300) {
                 const response = JSON.parse(xhr.responseText);
+                
+                // Construct the full, absolute URL for sharing
+                const fullUrl = `${window.location.origin}${response.download_url}`;
+                
                 downloadLink.href = response.download_url;
-                downloadLink.download = response.filename; // Set the default download filename
+                downloadLink.download = response.filename;
+                downloadUrlInput.value = fullUrl;
+
                 switchState('complete');
             } else {
                 handleUploadError(xhr);
@@ -101,6 +110,25 @@ document.addEventListener('DOMContentLoaded', () => {
         xhr.open('POST', '/upload', true);
         xhr.send(formData);
     }
+    
+    // NEW: Function to handle copying the link
+    function handleCopyLink() {
+        // Use the modern Navigator Clipboard API
+        navigator.clipboard.writeText(downloadUrlInput.value).then(() => {
+            // Provide visual feedback
+            copyLinkBtn.textContent = 'Copied!';
+            copyLinkBtn.classList.add('copied');
+            
+            // Revert back after a couple of seconds
+            setTimeout(() => {
+                copyLinkBtn.textContent = 'Copy';
+                copyLinkBtn.classList.remove('copied');
+            }, 2000);
+        }).catch(err => {
+            console.error('Failed to copy text: ', err);
+            // You could add an error state to the button here if needed
+        });
+    }
 
     function handleUploadError(xhr) {
         let message = 'An unknown network error occurred.';
@@ -108,7 +136,6 @@ document.addEventListener('DOMContentLoaded', () => {
             const errorData = JSON.parse(xhr.responseText);
             message = errorData.detail || 'Upload failed.';
         } catch (e) {
-            // Response was not JSON, use status text
             if (xhr.statusText) {
                 message = xhr.statusText;
             }
@@ -119,15 +146,15 @@ document.addEventListener('DOMContentLoaded', () => {
 
     function resetUploader() {
         if (currentXHR) {
-            currentXHR.abort(); // Cancel any ongoing upload
+            currentXHR.abort();
             currentXHR = null;
         }
         currentFile = null;
-        fileInput.value = ''; // Reset file input
+        fileInput.value = '';
+        downloadUrlInput.value = ''; // Clear the URL input
         switchState('initial');
     }
 
-    // --- Helper ---
     function formatBytes(bytes, decimals = 2) {
         if (bytes === 0) return '0 Bytes';
         const k = 1024;
@@ -137,6 +164,5 @@ document.addEventListener('DOMContentLoaded', () => {
         return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
     }
 
-    // --- Initial State ---
     switchState('initial');
 });