class ScraperApp {
    constructor() {
        this.form = document.getElementById('scrapingForm');
        this.stopButton = document.getElementById('stopButton');
        this.startButton = document.getElementById('startButton');
        this.activityIndicator = document.getElementById('activity_indicator');
        this.endTimeElement = document.getElementById('end_time');
        this.init();
    }

    init() {
        this.checkScrapingStatusIndex();
        this.addEventListeners();
    }

    async checkScrapingStatusIndex() {
        try {
            const response = await fetch('/scraping_status');
            const data = await response.json();
            if (data.scraping_active) {
                this.startButton.disabled = true;
                this.stopButton.disabled = false;
            } else {
                this.startButton.disabled = false;
                this.stopButton.disabled = true;
            }
        } catch (error) {
            console.error('Error checking scraping status:', error);
        }
    }

    async startScraping(event) {
        event.preventDefault(); // Prevent the default form submission
        const formData = new FormData(this.form);
        try {
            const response = await fetch('/start_scraping', {
                method: 'POST',
                body: formData
            });
            const data = await response.json();
            if (data.status === "Scraping started") {
                this.checkScrapingStatusIndex();
            }
        } catch (error) {
            console.error('Error starting scraping:', error);
        }
    }

    async stopScraping() {
        try {
            const response = await fetch('/stop_scraping', {
                method: 'POST'
            });
            const data = await response.json();
            if (data.status === "Scraping stopped") {
                this.checkScrapingStatusIndex();
            }
        } catch (error) {
            console.error('Error stopping scraping:', error);
        }
    }

    addEventListeners() {
        this.form.addEventListener('submit', (event) => this.startScraping(event));
        this.stopButton.addEventListener('click', () => this.stopScraping());
    }
}

// Initialize the application when DOM is fully loaded
document.addEventListener('DOMContentLoaded', () => {
    new ScraperApp();
});