Spaces:
Sleeping
Sleeping
File size: 2,594 Bytes
242a970 a1320d8 242a970 a1320d8 242a970 a1320d8 242a970 a1320d8 242a970 a1320d8 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 |
// Debug: Check if script is loaded
console.log('Scripts.js loaded successfully');
document.addEventListener('DOMContentLoaded', function() {
console.log('DOM loaded, initializing form handler');
const form = document.getElementById('avatarForm');
if (!form) {
console.error('Avatar form not found!');
return;
}
form.addEventListener('submit', async (e) => {
e.preventDefault();
console.log('Form submitted');
const imageInput = document.getElementById('imageInput');
const textInput = document.getElementById('textInput');
if (!imageInput.files[0]) {
alert('Please select an image');
return;
}
if (!textInput.value.trim()) {
alert('Please enter some text');
return;
}
const formData = new FormData();
formData.append('image', imageInput.files[0]);
formData.append('text', textInput.value);
// Show loading state
const btn = document.querySelector('button[type="submit"]');
btn.disabled = true;
btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2" role="status"></span> Processing...';
try {
console.log('Sending request to /generate');
const response = await fetch('/generate', {
method: 'POST',
body: formData
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
console.log('Response received:', data);
if (data.error) {
throw new Error(data.error);
}
// Display result
const video = document.getElementById('outputVideo');
video.src = data.video;
document.getElementById('result').classList.remove('d-none');
// Set up download
document.getElementById('downloadBtn').onclick = () => {
const a = document.createElement('a');
a.href = data.video;
a.download = 'talking_avatar.mp4';
a.click();
};
} catch (error) {
console.error('Error:', error);
alert('Error: ' + error.message);
} finally {
btn.disabled = false;
btn.innerHTML = '<i class="fas fa-magic me-2"></i>Generate Video';
}
});
}); |