import { Page, expect } from '@playwright/test';
import { LogParser } from '../utils/logParser';

export class CreateEventPage {
    readonly page: Page;
    private readonly selectors = {
        // Instructions section
        instructionsSection: '#event-creation-instructions',
        
        // Form fields
        eventNameInput: '#event-name',
        eventDescriptionInput: '#event-description',
        eventDateInput: '#event-date',
        eventTimeInput: '#event-time',
        eventLocationInput: '#event-location',
        eventOrganizerInput: '#event-organizer',
        ticketPriceInput: '#ticket-price',
        ticketQuantityInput: '#ticket-quantity',
        
        // Validation messages
        validationError: '.validation-error',
        
        // Navigation buttons
        submitButton: '#submit-event-btn',
        returnToDashboardButton: '#return-dashboard-btn'
    };

    constructor(page: Page) {
        this.page = page;
    }

    async navigate() {
        await this.page.goto('/wp-admin/admin.php?page=community-events-create');
    }

    async verifyInstructionsVisibility() {
        const instructions = await this.page.locator(this.selectors.instructionsSection);
        await expect(instructions).toBeVisible();
    }

    async fillEventDetails(eventDetails: {
        name: string;
        description: string;
        date: string;
        time: string;
        location: string;
        organizer: string;
        ticketPrice: string;
        ticketQuantity: string;
    }) {
        await this.page.fill(this.selectors.eventNameInput, eventDetails.name);
        await this.page.fill(this.selectors.eventDescriptionInput, eventDetails.description);
        await this.page.fill(this.selectors.eventDateInput, eventDetails.date);
        await this.page.fill(this.selectors.eventTimeInput, eventDetails.time);
        await this.page.fill(this.selectors.eventLocationInput, eventDetails.location);
        await this.page.fill(this.selectors.eventOrganizerInput, eventDetails.organizer);
        await this.page.fill(this.selectors.ticketPriceInput, eventDetails.ticketPrice);
        await this.page.fill(this.selectors.ticketQuantityInput, eventDetails.ticketQuantity);
    }

    async submitEvent() {
        await this.page.click(this.selectors.submitButton);
    }

    async returnToDashboard() {
        await this.page.click(this.selectors.returnToDashboardButton);
    }

    async verifyValidationError(field: string, expectedMessage: string) {
        const errorMessage = await this.page.locator(`${this.selectors.validationError}[data-field="${field}"]`);
        await expect(errorMessage).toHaveText(expectedMessage);
    }

    async verifyRequiredFieldValidation() {
        await this.submitEvent();
        const requiredFields = [
            'event-name',
            'event-date',
            'event-time',
            'event-location',
            'ticket-price',
            'ticket-quantity'
        ];

        for (const field of requiredFields) {
            const errorMessage = await this.page.locator(`${this.selectors.validationError}[data-field="${field}"]`);
            await expect(errorMessage).toBeVisible();
        }
    }

    async verifyPluginIntegration() {
        // Verify The Events Calendar Community Events plugin elements
        await expect(this.page.locator('.tribe-community-events')).toBeVisible();
        await expect(this.page.locator('.tribe-community-events-content')).toBeVisible();
    }
}