Spaces:
Running
Running
File size: 4,142 Bytes
2c72e40 |
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 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 |
// Main JavaScript for Web Scraper API UI
document.addEventListener('DOMContentLoaded', function() {
// Get form and result elements
const testForm = document.getElementById('test-form');
const urlsTextarea = document.getElementById('urls');
const spinner = document.getElementById('spinner');
const resultSection = document.getElementById('result-section');
const consolidatedResult = document.getElementById('consolidated-result');
const rawResult = document.getElementById('raw-result');
// Only set up event listener if the form exists (we're on the home page)
if (testForm) {
testForm.addEventListener('submit', async function(e) {
e.preventDefault();
// Get URLs from textarea (one per line)
const urlsText = urlsTextarea.value.trim();
if (!urlsText) {
showError('Please enter at least one URL');
return;
}
// Split by newline and filter out empty lines
const urls = urlsText.split('\n')
.map(url => url.trim())
.filter(url => url.length > 0);
if (urls.length === 0) {
showError('Please enter at least one valid URL');
return;
}
if (urls.length > 10) {
showError('Maximum 10 URLs allowed per request');
return;
}
// Show spinner, hide results
spinner.classList.remove('d-none');
resultSection.classList.add('d-none');
try {
// Make API request
const response = await fetch('/api/scrape-and-consolidate', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ urls })
});
// Parse response
const data = await response.json();
// Update results
if (response.ok) {
consolidatedResult.textContent = JSON.stringify(data.consolidated_data, null, 2);
rawResult.textContent = JSON.stringify(data.scraped_results, null, 2);
resultSection.classList.remove('d-none');
} else {
showError(`Error: ${data.error || 'Unknown error occurred'}`);
}
} catch (error) {
showError(`Error: ${error.message}`);
} finally {
// Hide spinner
spinner.classList.add('d-none');
}
});
}
// Initialize Feather icons
if (typeof feather !== 'undefined') {
feather.replace();
}
});
/**
* Show error message to user
* @param {string} message - Error message to display
*/
function showError(message) {
// Check if alert container exists, create if not
let alertContainer = document.getElementById('alert-container');
if (!alertContainer) {
alertContainer = document.createElement('div');
alertContainer.id = 'alert-container';
alertContainer.className = 'mt-3';
// Insert after the form
const testForm = document.getElementById('test-form');
if (testForm) {
testForm.after(alertContainer);
}
}
// Create alert
const alert = document.createElement('div');
alert.className = 'alert alert-danger alert-dismissible fade show';
alert.role = 'alert';
// Create alert content
alert.innerHTML = `
${message}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
`;
// Add alert to container
alertContainer.innerHTML = '';
alertContainer.appendChild(alert);
// Auto-dismiss after 5 seconds
setTimeout(() => {
const bsAlert = new bootstrap.Alert(alert);
bsAlert.close();
}, 5000);
}
|