import {Component, OnInit} from '@angular/core';
import {Picture} from './Picture';
import {NgForOf, NgIf} from '@angular/common';
import {RouterLink} from '@angular/router';
import {PictureService} from './picture.service';

@Component({
  selector: 'app-gallery',
  imports: [
    NgForOf,
    RouterLink,
    NgIf
  ],
  templateUrl: './gallery.component.html',
  styleUrl: './gallery.component.less'
})
export class GalleryComponent implements OnInit {

  protected readonly Picture = Picture;

  protected pictures: Picture[] = [];

  protected sortByUpload: boolean = true;

  constructor(
    readonly pictureService: PictureService,
  ) {
    //
  }

  ngOnInit(): void {
    this.pictureService.all(list => this.update(list));
  }

  pictureUrl(picture: Picture): string {
    return this.pictureService.apiUrl('http', ['Picture', picture.uuid, 'preview']);
  }

  sorted(): Picture[] {
    return this.pictures.sort(this.sortByUpload ? Picture.byUploadDateDesc : Picture.byOriginalDateDesc);
  }

  toggleVisible(picture: Picture) {
    this.pictureService.toggleVisible(picture, list => this.update(list));
  }

  private update(list: Picture[]) {
    this.pictures = list;
  }

}
