/**
 * Park Creation Page Object Model
 * 
 * Encapsulates interactions with the park creation/editing form.
 */

import { Page, expect } from '@playwright/test';

export class ParkCreationPage {
  constructor(private page: Page) {}

  async goto() {
    await this.page.goto('/parks/new');
    await this.page.waitForLoadState('networkidle');
  }

  async fillBasicInfo(name: string, description: string) {
    // Fill park name
    await this.page.fill('input[name="name"]', name);
    
    // Slug should auto-generate, but we can override if needed
    // await this.page.fill('input[name="slug"]', slug);
    
    // Fill description (might be a textarea or rich text editor)
    const descField = this.page.locator('textarea[name="description"]').first();
    await descField.fill(description);
  }

  async selectParkType(type: string) {
    // Assuming a select or radio group
    await this.page.click(`[data-park-type="${type}"]`);
  }

  async selectStatus(status: string) {
    await this.page.click(`[data-status="${status}"]`);
  }

  async searchLocation(query: string) {
    const searchInput = this.page.locator('input[placeholder*="location"]').or(
      this.page.locator('input[placeholder*="search"]')
    );
    await searchInput.fill(query);
    await this.page.waitForTimeout(500); // Wait for autocomplete
  }

  async selectLocation(name: string) {
    await this.page.click(`text=${name}`);
  }

  async setOpeningDate(date: string, precision: 'day' | 'month' | 'year' = 'day') {
    await this.page.fill('input[name="opened_date"]', date);
    await this.page.selectOption('select[name="date_precision"]', precision);
  }

  async uploadBannerImage(filePath: string) {
    const fileInput = this.page.locator('input[type="file"][accept*="image"]').first();
    await fileInput.setInputFiles(filePath);
  }

  async uploadCardImage(filePath: string) {
    const fileInputs = this.page.locator('input[type="file"][accept*="image"]');
    await fileInputs.nth(1).setInputFiles(filePath);
  }

  async uploadGalleryImages(filePaths: string[]) {
    const galleryInput = this.page.locator('input[type="file"][multiple]');
    await galleryInput.setInputFiles(filePaths);
  }

  async selectOperator(operatorName: string) {
    await this.page.click('button:has-text("Select operator")');
    await this.page.click(`text=${operatorName}`);
  }

  async submitForm() {
    await this.page.click('button[type="submit"]:has-text("Submit")');
  }

  async expectSuccess() {
    // Wait for success toast
    await expect(this.page.getByText(/submitted.*review/i)).toBeVisible({ timeout: 10000 });
  }

  async expectValidationError(message: string) {
    await expect(this.page.getByText(message)).toBeVisible();
  }
}