import { h, Host } from "@stencil/core";
import { watchBlockNumber } from "@wagmi/core";
import state from "../../stores/wallet";
export class NKDropMintWinterButton {
  constructor() {
    this.handleWindowEvent = (e) => {
      const { data } = e;
      if (data === 'closeWinterCheckoutModal') {
        this.isOpen = false;
        this.loading = false;
      }
      else if (data.name === 'successfulWinterCheckout') {
        this.isOpen = false;
        this.loading = false;
        this.dialogTitle = this.successTitle;
        this.dialogMessage = this.successMessage;
        this.dialogOpen = true;
      }
    };
    this.projectId = undefined;
    this.successTitle = 'Success';
    this.successMessage = 'Successfully minted an NFT';
    this.disabled = true;
    this.loading = true;
    this.saleActive = undefined;
    this.presaleActive = undefined;
    this.isOpen = false;
    this.dialogOpen = false;
    this.extraMintParams = null;
  }
  componentWillLoad() {
    this.disconnect = watchBlockNumber({ listen: true }, async () => {
      const [saleActive, presaleActive] = await Promise.all([
        state.diamond.apps.drop.saleActive(),
        state.diamond.apps.drop.presaleActive(),
      ]);
      this.saleActive = saleActive;
      this.presaleActive = presaleActive;
      this.loading = false;
      // sale not active then disable widget
      this.disabled = !(this.saleActive || this.presaleActive);
    });
    if (typeof window !== 'undefined') {
      window.addEventListener('message', this.handleWindowEvent);
    }
  }
  disconnectedCallback() {
    this.disconnect();
    if (typeof window !== 'undefined') {
      window.removeEventListener('message', this.handleWindowEvent);
    }
  }
  getProjectUrl() {
    let queryString = 'projectId=' + this.projectId;
    const { address } = state.client.getAccount();
    if (address) {
      queryString += '&walletAddress=' + address;
    }
    if (this.extraMintParams) {
      queryString += `&extraMintParams=${encodeURIComponent(JSON.stringify(this.extraMintParams))}`;
    }
    const url = !state.diamond.isDev
      ? 'https://checkout.usewinter.com/?' + queryString
      : 'https://sandbox-winter-checkout.onrender.com/?' + queryString;
    return url;
  }
  async openModal() {
    this.loading = true;
    try {
      const { address } = state.client.getAccount();
      if (this.presaleActive) {
        const verify = await state.diamond.verify(address);
        this.extraMintParams = Object.assign({}, verify);
      }
      this.isOpen = true;
    }
    catch (e) {
      this.loading = false;
      this.isOpen = false;
      this.dialogTitle = 'Error';
      this.dialogMessage = e.message;
      this.dialogOpen = true;
    }
  }
  render() {
    const Modal = () => {
      if (!this.isOpen) {
        return null;
      }
      return (h("iframe", { id: "winter-checkout", src: this.getProjectUrl(), style: {
          position: 'fixed',
          top: '0',
          bottom: '0',
          right: '0',
          width: '100%',
          border: 'none',
          margin: '0',
          padding: '0',
          overflow: 'hidden',
          zIndex: '999999',
          height: '100%',
        } }));
    };
    return (h(Host, null, h("div", { part: "wallet-btn-container", class: "mdc-touch-target-wrapper" }, h("button", { onClick: () => this.openModal(), part: "winter-btn", disabled: this.loading || this.disabled, ref: (el) => (this.button = el), class: "mdc-button mdc-button--raised" }, h("span", { class: "mdc-button__ripple" }), h("span", { class: "mdc-button__touch" }), h("span", { class: "mdc-button__label" }, this.loading ? h("nk-loading", null) : h("slot", null)))), h(Modal, null), h("nk-dialog", { open: this.dialogOpen, dialogTitle: this.dialogTitle }, this.dialogMessage)));
  }
  static get is() { return "nk-drop-mint-winter-button"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["nk-drop-mint-winter-button.scss"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["nk-drop-mint-winter-button.css"]
    };
  }
  static get properties() {
    return {
      "projectId": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": true,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Winter Project Id"
        },
        "attribute": "project-id",
        "reflect": false
      },
      "successTitle": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Title on the success modal"
        },
        "attribute": "success-title",
        "reflect": false,
        "defaultValue": "'Success'"
      },
      "successMessage": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Body message on the success modal"
        },
        "attribute": "success-message",
        "reflect": false,
        "defaultValue": "'Successfully minted an NFT'"
      }
    };
  }
  static get states() {
    return {
      "disabled": {},
      "loading": {},
      "saleActive": {},
      "presaleActive": {},
      "isOpen": {},
      "dialogOpen": {},
      "extraMintParams": {}
    };
  }
  static get methods() {
    return {
      "openModal": {
        "complexType": {
          "signature": "() => Promise<void>",
          "parameters": [],
          "references": {
            "Promise": {
              "location": "global",
              "id": "global::Promise"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "",
          "tags": []
        }
      }
    };
  }
}
//# sourceMappingURL=nk-drop-mint-winter-button.js.map
