import { Controller } from '@hotwired/stimulus';

export default class extends Controller {
  static targets = ["signupButton"];
  static values = {
    allowSubmit: Boolean
  }
  connect() {
    if(!this.allowSubmitValue) {
      this.element.addEventListener("submit", function(event) {
        event.preventDefault();
        alert("You must first configure your form.");
        document.querySelector("#affiliate-signup-form button").removeAttribute("disabled");
      });
    };

    window.addEventListener("message", (event) => {
      console.log(`event data: ${event.data}, origin: ${event.origin}`);
      if(event.data.themeAppBlockSettings) {
        let newColor = `${event.data.themeAppBlockSettings.buttonTextColor} !important`;
        console.log(`newColor: ${newColor}`);
        this.signupButtonTarget.style.setProperty("color", event.data.themeAppBlockSettings.buttonTextColor, "important");
        let backgroundColor = `${event.data.themeAppBlockSettings.buttonColor} !important`;
        console.log(`backgroundColor: ${backgroundColor}`);
        this.signupButtonTarget.style.setProperty("background-color", event.data.themeAppBlockSettings.buttonColor, "important");
      }
    });
    window.parent.postMessage(
      "formConnected",
      '*'
    );
  }
}