if (!window.stellaWidget) {
  const stellaWidget = {
    config: null,

    container: null,
    iframe: null,

    init({ src, type, position, app_url, launcher_class }) {
      this.config = {
        src,
        type,
        position,
        app_url,
        launcher_class,
      }

      this.createIframe()
      this.setupListeners()
      this.setupLauncherListeners()
    },

    createIframe() {
      const urlParams = new URLSearchParams(document.location.search)
      const progressId = urlParams.get("stella_progress_id") ?? ""
      urlParams.delete("stella_progress_id")
      const referringUrl = encodeURIComponent(`${document.location.origin}${document.location.pathname}?${urlParams}`)
      const sourceUrl = encodeURIComponent(document.referrer)

      this.container = document.createElement("div")
      this.container.id = "demand-iq-stella-chat"

      if (this.config.type === "icon") {
        this.container.style = "position: fixed; bottom: 0; width: 0; height: 0; z-index: 2147483647;"
      }
      if (this.config.type === "drawer") {
        this.container.style = "position: fixed; top: 0; bottom: 0; width: 0; height: 0; z-index: 2147483647;"
      }
      if (this.config.type === "none") {
        this.container.style = "position: fixed; bottom: 0; width: 0; height: 0; z-index: 2147483647;"
      }

      if (this.config.position === "left") {
        this.container.style.left = 0
      }
      if (this.config.position === "right") {
        this.container.style.right = 0
      }

      this.iframe = document.createElement("iframe")
      this.iframe.src = `${this.config.src}?app_url=${this.config.app_url}&source_url=${sourceUrl}&referring_url=${referringUrl}&progress_id=${progressId}`
      this.iframe.width = "100%"
      this.iframe.height = "100%"
      this.iframe.style = "border: none;"

      this.container.appendChild(this.iframe)
      document.body.appendChild(this.container)
    },

    setupListeners() {
      window.addEventListener("message", this.handleMessage.bind(this))
    },

    handleMessage(e) {
      const { action, width, height } = e.data

      if (action === "stella-embed-chat-resize") {
        if (this.config.type === "icon") {
          this.container.style.width = `${width}`
          this.container.style.height = "100%"
          this.container.style.maxHeight = `${height}`
        }
        if (this.config.type === "drawer") {
          this.container.style.margin = `auto 0`
          this.container.style.width = `${width}`
          this.container.style.height = "100%"
          this.container.style.maxHeight = `${height}`
        }
        if (this.config.type === "none") {
          this.container.style.width = `${width}`
          this.container.style.height = "100%"
          this.container.style.maxHeight = `${height}`
        }

        this.iframe.style.maxWidth = `100%`
        this.iframe.style.maxHeight = `100%`
      }
    },

    setupLauncherListeners() {
      const launcherElements = document.getElementsByClassName(this.config.launcher_class)

      for (let i = 0; i < launcherElements.length; i++) {
        launcherElements[i].addEventListener("click", this.handleLauncherClick.bind(this))
      }
    },

    handleLauncherClick(e) {
      e.preventDefault()

      this.toggle()
    },

    toggle() {
      this.iframe.contentWindow.postMessage({ action: "stella-embed-chat-toggle" }, "*")
    },

    show() {
      this.iframe.contentWindow.postMessage({ action: "stella-embed-chat-show" }, "*")
    },

    hide() {
      this.iframe.contentWindow.postMessage({ action: "stella-embed-chat-hide" }, "*")
    },
  }

  window.stellaWidget = stellaWidget

  window.stellaWidget.init({
    src: `https://stella2.demand-iq.com/`,
    type: `icon`,
    position: `right`,
    app_url: `https://poulin-solar-pro.estimate.demand-iq.com`,
    launcher_class: `diq-stella-2`,
  })
}