import { Component, OnInit, Input } from "@angular/core";
import { ModalController } from "@ionic/angular";
import { ImageModalPage } from "../image-modal.page";
import { SharedDataService } from "src/app/hmg-common/services/shared-data-service/shared-data.service";
import { ImageModal } from "./image.modal";
@Component({
  selector: "image-modal",
  templateUrl: "./image-modal.component.html",
  styleUrls: ["./image-modal.component.scss"]
})
export class ImageModalComponent implements OnInit {

  public image: string;
  public loadingError = false;
  constructor(
    public modalController: ModalController,
    public sharedService: SharedDataService
  ) {}
  ngOnInit() {}
  @Input() set src(src: string) {
    this.image = src;
  }
  get src(): string {
    return this.image;
  }

  public onClick() {
    this.openModal(this.image);
  }
  
  public async openModal(img) {
    this.sharedService.setSharedData(new ImageModal(this.image), ImageModal.SHARED_DATA);
    const modal = await this.modalController.create({
      component: ImageModalPage
    });
    modal.cssClass = this.get_orientation(img); //'modal-image-viewer';
    await modal.present();
  }

  public onError() {}
  public get_orientation(src: any) {
    const img = new Image();
    img.src = src;
    const width = img.width;
    const height = img.height;
    if (width > height) {
      return "modal-image-viewer-landscape";
    } else {
      return "modal-image-viewer-portrait";
    }
  }
}
