oedb-backend/frontend/src/app/pages/agenda/agenda.ts

import { Component, inject, OnInit } from '@angular/core';
import { CommonModule } from '@angular/common';
import { OedbApi } from '../../services/oedb-api';
import { EditForm } from '../../forms/edit-form/edit-form';

interface Event {
  id: string;
  properties: {
    label?: string;
    name?: string;
    what?: string;
    start?: string;
    when?: string;
    stop?: string;
    description?: string;
    where?: string;
  };
  geometry?: {
    type: string;
    coordinates: [number, number];
  };
}

interface DayEvents {
  date: Date;
  events: Event[];
}

@Component({
  selector: 'app-agenda',
  standalone: true,
  imports: [CommonModule, EditForm],
  templateUrl: './agenda.html',
  styleUrl: './agenda.scss'
})
export class Agenda implements OnInit {
  private oedbApi = inject(OedbApi);
  
  events: Event[] = [];
  daysWithEvents: DayEvents[] = [];
  selectedEvent: Event | null = null;
  showSidePanel = false;

  ngOnInit() {
    this.loadEvents();
  }

  loadEvents() {
    const today = new Date();
    const startDate = new Date(today);
    startDate.setDate(today.getDate() - 10);
    
    const endDate = new Date(today);
    endDate.setDate(today.getDate() + 10);

    const params = {
      start: `${startDate.toISOString().split('T')[0]}`,
      end: `${endDate.toISOString().split('T')[0]}`,
      limit: 1000
    };

    this.oedbApi.getEvents(params).subscribe((response: any) => {
      this.events = Array.isArray(response?.features) ? response.features : [];
      this.organizeEventsByDay();
    });
  }

  organizeEventsByDay() {
    const daysMap = new Map<string, DayEvents>();
    
    // Initialiser les 20 jours
    for (let i = -10; i <= 10; i++) {
      const date = new Date();
      date.setDate(date.getDate() + i);
      const dateKey = date.toISOString().split('T')[0];
      daysMap.set(dateKey, {
        date: new Date(date),
        events: []
      });
    }

    // Organiser les événements par jour
    this.events.forEach(event => {
      const eventDate = this.getEventDate(event);
      if (eventDate) {
        const dateKey = eventDate.toISOString().split('T')[0];
        const dayEvents = daysMap.get(dateKey);
        if (dayEvents) {
          dayEvents.events.push(event);
        }
      }
    });

    this.daysWithEvents = Array.from(daysMap.values()).sort((a, b) => 
      a.date.getTime() - b.date.getTime()
    );
  }

  getEventDate(event: Event): Date | null {
    const startDate = event.properties.start || event.properties.when;
    if (startDate) {
      return new Date(startDate);
    }
    return null;
  }

  getEventTitle(event: Event): string {
    return event.properties.label || event.properties.name || 'Événement sans titre';
  }

  getEventTime(event: Event): string {
    const startDate = event.properties.start || event.properties.when;
    if (startDate) {
      const date = new Date(startDate);
      return date.toLocaleTimeString('fr-FR', { 
        hour: '2-digit', 
        minute: '2-digit' 
      });
    }
    return '';
  }

  selectEvent(event: Event) {
    this.selectedEvent = event;
    this.showSidePanel = true;
  }

  closeSidePanel() {
    this.showSidePanel = false;
    this.selectedEvent = null;
  }

  onEventSaved(event: any) {
    this.loadEvents(); // Recharger les événements après modification
    this.closeSidePanel();
  }

  onEventCreated(event: any) {
    this.loadEvents(); // Recharger les événements après création
    this.closeSidePanel();
  }

  onEventDeleted(event: any) {
    this.loadEvents(); // Recharger les événements après suppression
    this.closeSidePanel();
  }

  isToday(date: Date): boolean {
    const today = new Date();
    return date.toDateString() === today.toDateString();
  }

  isPast(date: Date): boolean {
    const today = new Date();
    today.setHours(0, 0, 0, 0);
    return date < today;
  }

  formatDate(date: Date): string {
    return date.toLocaleDateString('fr-FR', {
      weekday: 'long',
      day: 'numeric',
      month: 'long'
    });
  }
}