Spaces:
Running
Running
File size: 3,979 Bytes
282fee0 |
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 121 122 123 124 125 126 127 128 |
// Shared JavaScript across all pages
console.log('Web Scraper Pro loaded');
// DOM Elements
const scraperForm = document.getElementById('scraperForm');
const urlInput = document.getElementById('urlInput');
const loading = document.getElementById('loading');
const results = document.getElementById('results');
const error = document.getElementById('error');
const errorMessage = document.getElementById('errorMessage');
const articleContent = document.getElementById('articleContent');
const imageGallery = document.getElementById('imageGallery');
// Form submission handler
scraperForm.addEventListener('submit', async (e) => {
e.preventDefault();
const url = urlInput.value.trim();
if (!url) return;
// Show loading state
showLoading();
hideResults();
hideError();
try {
// Note: In a real implementation, you would call a backend API
// For demo purposes, we'll simulate the scraping process
await simulateScraping(url);
} catch (err) {
showError('Failed to extract content. Please check the URL and try again.');
}
});
// Simulate scraping process (replace with actual API call)
async function simulateScraping(url) {
// Simulate API delay
await new Promise(resolve => setTimeout(resolve, 2000));
// Hide loading
hideLoading();
// For demo purposes, we'll show sample content
// In a real implementation, you would call your scraping API here
displaySampleResults();
}
// Display sample results for demo
function displaySampleResults() {
// Sample article content
articleContent.innerHTML = `
<h1>Sample Article Title</h1>
<p class="text-gray-500 mb-6">Extracted from: ${urlInput.value}</p>
<h2>Introduction</h2>
<p>This is a sample demonstration of how extracted content would appear. In a real implementation, this would be the actual content from the provided URL.</p>
<h2>Main Content</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<ul>
<li>First extracted paragraph</li>
<li>Second extracted paragraph</li>
<li>Third extracted paragraph with more details</li>
</ul>
<h2>Conclusion</h2>
<p>This demonstrates the web scraping capability. The actual implementation would connect to a backend service that extracts real content.</p>
`;
// Sample images
imageGallery.innerHTML = `
<div class="gallery-image">
<img src="http://static.photos/technology/640x360/1" alt="Sample image 1" class="w-full h-48 object-cover">
</div>
<div class="gallery-image">
<img src="http://static.photos/office/640x360/2" alt="Sample image 2" class="w-full h-48 object-cover">
</div>
<div class="gallery-image">
<img src="http://static.photos/nature/640x360/3" alt="Sample image 3" class="w-full h-48 object-cover">
</div>
`;
// Show results with animation
showResults();
}
// UI Control Functions
function showLoading() {
loading.classList.remove('hidden');
}
function hideLoading() {
loading.classList.add('hidden');
}
function showResults() {
results.classList.remove('hidden');
results.classList.add('fade-in');
}
function hideResults() {
results.classList.add('hidden');
results.classList.remove('fade-in');
}
function showError(message) {
errorMessage.textContent = message;
error.classList.remove('hidden');
hideLoading();
}
function hideError() {
error.classList.add('hidden');
}
function clearResults() {
urlInput.value = '';
hideResults();
hideError();
hideLoading();
}
// Initialize the application
document.addEventListener('DOMContentLoaded', function() {
console.log('Web Scraper Pro initialized');
feather.replace();
}); |