import { CocoComponent } from "@assets/js/base/coco";

export default CocoComponent("modalLightbox", () => {
  return {
    loaded: false,

    init() {
      if (this.img.complete && this.img.naturalHeight !== 0) {
        this.imageLoaded();
      }
    },

    close() {
      this.modal.hide();
    },

    imageLoaded() {
      this.loaded = true;
      setTimeout(() => {
        const scrollTop = parseInt(this.img.dataset.scrollTop, 10);
        if (!isNaN(scrollTop) && scrollTop !== 0) {
          this.modal.scrollTo(scrollTop);
        }
      }, 200);
    },

    get img() {
      return this.$refs.media.querySelector("img");
    },

    root: {
      ":class": "{loaded}",
    },
  };
});