import { Component, HostListener } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { FormControl } from "@angular/forms";
import {MovieLogos, NetworkLogos} from "./networks.enum";
import {LogoOptions} from "../movie/movie.enum";

@Component({
  selector: 'app-collection',
  templateUrl: './series.component.html',
})
export class SeriesComponent {
  selectedFile: File | null = null;
  retrievedImage: any;
  base64Data: any;
  retrieveResponse: any;
  message: string | undefined;
  windowHeight: number = window.innerHeight - 200;
  title: any;
  title2: any;
  season: any;
  subtitle: any;
  topSubtitle: any;
  networkLogos = NetworkLogos;
  studioLogos = MovieLogos;
  logoOptions = LogoOptions;
  selectedLogoControl = new FormControl();
  logoOptionControl = new FormControl();
  selectedStudioControl = new FormControl();
  isLimitedSeries: any;

  constructor(private http: HttpClient)
  {
    this.onResize();
  }

  onFileSelected(event: Event) {
    const element = event.target as HTMLInputElement;
    let files = element.files;
    this.selectedFile = files && files.length > 0 ? files[0] : null;
  }

  onUpload() {
    if (!this.selectedFile) {
      console.log('No file selected');
      return;
    }
    const fd = new FormData();
    fd.append('image', this.selectedFile, this.selectedFile.name);
    fd.append('title', this.title);
    fd.append('title2', this.title2);
    fd.append('season', this.season);
    fd.append('subtitle', this.subtitle);
    fd.append('topSubtitle', this.topSubtitle);
    fd.append('limitedSeries', this.isLimitedSeries)
    if (this.selectedLogoControl.value != null){
      fd.append('networkLogo', this.selectedLogoControl.value);
    }
    if (this.selectedStudioControl.value != null){
      fd.append('logo', this.selectedStudioControl.value);
    }
    if (this.logoOptionControl.value != null){
      fd.append('logoOption', this.logoOptionControl.value);
    }
    this.http.post('https://localhost:44369/poster/series', fd)
      .subscribe(res => {
        console.log(res);
        this.retrieveResponse = res;
        this.base64Data = this.retrieveResponse.picBytes;
        this.retrievedImage = 'data:image/jpeg;base64,' + this.base64Data;
      });
  }

  @HostListener('window:resize')
  onResize() {
    this.windowHeight = window.innerHeight - 200;
  }

  protected readonly LogoOptions = LogoOptions;
}