import {Component, Input} from '@angular/core';

@Component({
  selector: 'publications-list-item-photos',
  templateUrl: 'photos.component.html',
  styleUrls: ['photos.component.scss']
})
export class PublicationsListItemPhotosComponent {
  @Input() item: any;
  @Input() editMode: boolean;

  public parsedPhotos: any[] = [];
  public activePhoto: string = '';
  public showFullscreen = false;
  public showId: string = '';
  public activeIndex: number = 0;
  public tmpNumber: number = 0;
  public nextId:string;
  public backId:string;

  constructor() {
  }

  ngOnInit() {
    this.parsed();
  }




  set photo(activePhoto: string) {
    this.activePhoto = activePhoto
  }
  get photo(): string {
    return this.activePhoto
  }

  get items(): any {
    return this.item.assets.data || [];
  }

  parsed(): void {
    this.tmpNumber = 0;
    this.parsedPhotos = this.items;
    this.parsedPhotos.map((photo: any) => {
      if (this.tmpNumber===0) {
        photo.active = true
        this.photo = photo.links.full
        this.showId = photo.id
      } else {
        photo.active = false
        if (this.tmpNumber===1) {
          this.nextId = photo.id
        }
      }
      this.tmpNumber++
      if (this.items.length > 1 && this.items.length == this.tmpNumber) {
        this.backId = photo.id
      }
      return photo
    })
  }

  show(id: string): void {
    this.parsedPhotos?.forEach((photo: any) => {
      if (photo.id === id) {
        this.photo = photo.links.full
        this.showFullscreen = true
      }
    })
  }

  showAll() {
    this.show(this.showId);
  }

  go(how: string) {
    this.show(this.showId)
    switch(how) {
      case 'decrement':
        this.activeIndex--
        if (this.activeIndex < 0) {
          this.activeIndex = this.parsedPhotos.length - 1
        }
        break
      case 'increment':
        this.activeIndex++
        if (this.activeIndex == this.parsedPhotos.length) {
          this.activeIndex = 0
        }
        break
    }

    this.parsedPhotos = this.parsedPhotos.map((item: any, index: number) => {
      if (index === this.activeIndex) {
        item.active = true
        this.photo = item.links.full
        this.showId = item.id
      } else {
        item.active = false
      }
      return item
    })
  }

  back(): void {
    this.go('decrement')
  }
  next(): void {
    this.go('increment')
  }
}
