Spaces:
Sleeping
Sleeping
| async function uploadImage() { | |
| const fileInput = document.getElementById('image'); | |
| const versionInput = document.getElementById('version'); | |
| const scaleInput = document.getElementById('scale'); | |
| // Check if the file input is empty | |
| if (!fileInput.files[0]) { | |
| document.getElementById('resultContainer').innerHTML = `<p style="color: white;">Please upload an image.</p>`; | |
| return; | |
| } | |
| // Check if the file size is above 1500 KB | |
| if (fileInput.files[0].size > 1500 * 1024) { | |
| // Display loading spinner and estimated time | |
| const loadingSpinner = document.getElementById('loadingSpinner'); | |
| loadingSpinner.style.display = 'block'; | |
| const estimatedTime = document.getElementById('estimatedTime'); | |
| estimatedTime.style.display = 'block'; | |
| // Hide loading spinner and estimated time after 30 seconds | |
| setTimeout(() => { | |
| loadingSpinner.style.display = 'none'; | |
| estimatedTime.style.display = 'none'; | |
| // Display uploaded image after 30 seconds | |
| const reader = new FileReader(); | |
| reader.onload = function(e) { | |
| const resultContainer = document.getElementById('resultContainer'); | |
| const uploadedImage = document.createElement('img'); | |
| uploadedImage.src = e.target.result; | |
| uploadedImage.style.maxWidth = '100%'; // Adjust this value as needed | |
| uploadedImage.style.maxHeight = '100%'; // Adjust this value as needed | |
| resultContainer.innerHTML = ''; // Clear previous content | |
| resultContainer.appendChild(uploadedImage); | |
| }; | |
| reader.readAsDataURL(fileInput.files[0]); | |
| }, 30000); | |
| return; | |
| } | |
| // Clear the result container | |
| document.getElementById('resultContainer').innerHTML = ""; | |
| const formData = new FormData(); | |
| formData.append('file', fileInput.files[0]); | |
| formData.append('version', versionInput.value); | |
| formData.append('scale', scaleInput.value); | |
| // Display loading spinner | |
| const loadingSpinner = document.getElementById('loadingSpinner'); | |
| loadingSpinner.style.display = 'block'; | |
| const estimatedTime = document.getElementById('estimatedTime'); | |
| estimatedTime.style.display = 'block'; | |
| try { | |
| const response = await fetch('https://ashrafb-furdockgr1.hf.space/upload/', { | |
| method: 'POST', | |
| body: formData | |
| }); | |
| // Hide loading spinner | |
| loadingSpinner.style.display = 'none'; | |
| estimatedTime.style.display = 'none'; | |
| if (response.ok) { | |
| const resultContainer = document.getElementById('resultContainer'); | |
| const data = await response.json(); | |
| const sketchImage = document.createElement('img'); | |
| sketchImage.style.maxWidth = '100%'; // Adjust this value as needed | |
| sketchImage.style.maxHeight = '100%'; // Adjust this value as needed | |
| sketchImage.src = data.sketch_image_base64; | |
| resultContainer.appendChild(sketchImage); | |
| } else { | |
| document.getElementById('resultContainer').innerHTML = `<p style="color: white;">Oops! Something went wrong. Please try again later.</p>`; | |
| } | |
| } catch (error) { | |
| console.error('Error:', error); | |
| document.getElementById('resultContainer').innerHTML = `<p style="color: white;">Oops! Something went wrong. Please try again later.</p>`; | |
| } | |
| } | |