import {Component, inject, input, OnInit, output} from '@angular/core';
import {TheaterSeatState} from '../model/theater-seat-state.model';
import {Sitzkategorie, Sitzplatz} from '@infinimotion/model-frontend';
import {SelectedSeatsService} from '../selected-seats.service';

@Component({
  selector: 'app-seat',
  standalone: false,
  templateUrl: './seat.component.html',
  styleUrl: './seat.component.css'
})
export class SeatComponent{
  seat = input.required<Sitzplatz>();
  state = input.required<TheaterSeatState>()

  selected: boolean = false;

  private seatService = inject(SelectedSeatsService)

  getSeatStateColor(): any {
    switch (this.state()) {
      case TheaterSeatState.RESERVED:
        return 'orange';
      case TheaterSeatState.BOOKED:
        return 'red';
      default:
      case TheaterSeatState.AVAILABLE:
        return 'black';
    }
  }

  updateSelectedSeats(selectedSeat: Sitzplatz) : void {
    if(!this.selected){
      this.seatService.pushSelectedSeat(selectedSeat);
    } else {
      this.seatService.removeSelectedSeat(selectedSeat);
    }

    this.selected = !this.selected;
    //console.log(this.selected)
  }

  protected readonly TheaterSeatState = TheaterSeatState;
}