import { Component, inject, OnDestroy, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { FormsModule } from '@angular/forms';
import {Menu} from './menu/menu';
import { AllEvents } from '../../maps/all-events/all-events';
import { EditForm } from '../../forms/edit-form/edit-form';
import { OedbApi } from '../../services/oedb-api';
import { UnlocatedEvents } from '../../shared/unlocated-events/unlocated-events';
@Component({
  selector: 'app-home',
  standalone: true,
  imports: [
    Menu,
    AllEvents,
    UnlocatedEvents,
    EditForm,
    FormsModule
  ],
  templateUrl: './home.html',
  styleUrl: './home.scss'
})
export class Home implements OnInit, OnDestroy {

  OedbApi = inject(OedbApi);
  private router = inject(Router);
  
  features: Array<any> = [];
  selected: any | null = null;
  showTable = false;
  
  // Nouvelles propriétés pour le rechargement automatique et la sélection de jours
  autoReloadEnabled = true;
  autoReloadInterval: any = null;
  daysAhead = 7; // Nombre de jours dans le futur par défaut
  isLoading = false;

  ngOnInit() {
    this.loadEvents();
    this.startAutoReload();
  }

  ngOnDestroy() {
    this.stopAutoReload();
  }

  loadEvents() {
    this.isLoading = true;
    const today = new Date();
    const endDate = new Date(today);
    endDate.setDate(today.getDate() + this.daysAhead);
    
    const params = {
      start: today.toISOString().split('T')[0],
      end: endDate.toISOString().split('T')[0],
      limit: 1000
    };

    this.OedbApi.getEvents(params).subscribe((events: any) => {
      this.features = Array.isArray(events?.features) ? events.features : [];
      this.isLoading = false;
    });
  }

  startAutoReload() {
    if (this.autoReloadEnabled && !this.autoReloadInterval) {
      this.autoReloadInterval = setInterval(() => {
        this.loadEvents();
      }, 60000); // 1 minute
    }
  }

  stopAutoReload() {
    if (this.autoReloadInterval) {
      clearInterval(this.autoReloadInterval);
      this.autoReloadInterval = null;
    }
  }

  toggleAutoReload() {
    this.autoReloadEnabled = !this.autoReloadEnabled;
    if (this.autoReloadEnabled) {
      this.startAutoReload();
    } else {
      this.stopAutoReload();
    }
  }

  onDaysAheadChange() {
    this.loadEvents();
  }

  goToNewCategories() {
    this.router.navigate(['/nouvelles-categories']);
  }

  onSelect(feature: any) {
    this.selected = feature;
  }

  onPickCoords(coords: [number, number]) {
    // Autofill lat/lon in the form selection or prepare a new feature shell
    const [lon, lat] = coords;
    if (this.selected && this.selected.properties) {
      this.selected = {
        ...this.selected,
        geometry: { type: 'Point', coordinates: [lon, lat] }
      };
    } else {
      this.selected = {
        id: null,
        properties: { label: '', description: '', what: '', where: '' },
        geometry: { type: 'Point', coordinates: [lon, lat] }
      };
    }
  }

  onSaved(_res: any) {
    // refresh list after update
    this.loadEvents();
  }

  onCreated(_res: any) {
    // refresh and clear selection after create
    this.selected = null;
    this.loadEvents();
  }

  onDeleted(_res: any) {
    this.selected = null;
    this.loadEvents();
  }

  // Menu callbacks
  ngAfterViewInit() {
    // Wire menu callbacks if needed via querySelector; left simple for now
    // We keep logic here: toggling and downloads
  }

  toggleView() {
    this.showTable = !this.showTable;
  }

  downloadGeoJSON() {
    const blob = new Blob([JSON.stringify({ type: 'FeatureCollection', features: this.features }, null, 2)], { type: 'application/geo+json' });
    const url = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = 'events.geojson';
    document.body.appendChild(a);
    a.click();
    URL.revokeObjectURL(url);
    a.remove();
  }

  downloadCSV() {
    const header = ['id', 'what', 'label', 'start', 'stop', 'lon', 'lat'];
    const rows = this.features.map((f: any) => [
      JSON.stringify(f?.properties?.id ?? f?.id ?? ''),
      JSON.stringify(f?.properties?.what ?? ''),
      JSON.stringify(f?.properties?.label ?? f?.properties?.name ?? ''),
      JSON.stringify(f?.properties?.start ?? f?.properties?.when ?? ''),
      JSON.stringify(f?.properties?.stop ?? ''),
      JSON.stringify(f?.geometry?.coordinates?.[0] ?? ''),
      JSON.stringify(f?.geometry?.coordinates?.[1] ?? '')
    ].join(','));
    const csv = [header.join(','), ...rows].join('\n');
    const blob = new Blob([csv], { type: 'text/csv' });
    const url = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = 'events.csv';
    document.body.appendChild(a);
    a.click();
    URL.revokeObjectURL(url);
    a.remove();
  }
}