import { Component, input } from '@angular/core';
import { Vorstellung } from '@infinimotion/model-frontend';

@Component({
  selector: 'app-performance-info',
  standalone: false,
  templateUrl: './performance-info.component.html',
  styleUrl: './performance-info.component.css'
})
export class PerformanceInfoComponent {
  performance = input.required<Vorstellung>();

  getStartTimeString(): string {
    const date = new Date(this.performance().start);
    return date.toLocaleDateString('de-DE', { weekday: 'short' }) + '. ' + date.toLocaleDateString('de-DE') + ', ' +  date.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' }) + ' Uhr';
  }

  movie() {
    return this.performance().movie
  }

  onPosterError(event: Event) {
    const img = event.target as HTMLImageElement;
    const placeholder = 'assets/poster_placeholder.png';

    if (img.src !== window.location.origin + placeholder) {
      img.src = placeholder;
    }
  }
}