import { Component, Input, OnInit } from "@angular/core";
import { CommonModule } from "@angular/common";
import { Lightbox, LightboxConfig, LightboxModule } from "ngx-lightbox";

interface Album {
  src: string;
  caption: string;
  thumb: string;
}

@Component({
  selector: "app-lightbox",
  standalone: true,
  imports: [CommonModule, LightboxModule],
  templateUrl: "./lightbox.component.html",
  styleUrls: ["./lightbox.component.scss"],
})
export class LightboxComponent implements OnInit {
  @Input() data: any;

  public _album: Album[] = [];

  constructor(
    private _lightbox: Lightbox,
    private _lightboxConfig: LightboxConfig
  ) {
    _lightboxConfig.fadeDuration = 1;
    _lightboxConfig.showZoom = true;
    _lightboxConfig.wrapAround = true;
    _lightboxConfig.positionFromTop = 50;
    _lightboxConfig.disableScrolling = false;
    _lightboxConfig.fadeDuration = 0.7;
  }

  ngOnInit(): void {
    if (this.data) {
      const album: Album = {
        src: this.data.abs_path,
        caption: this.data.filename,
        thumb: this.data.abs_path,
      };
      this._album.push(album);
    }
  }

  open(index: number): void {
    this._lightbox.open(this._album, index);
  }

  close(): void {
    this._lightbox.close();
  }
}
