const TENANT_ID = 1269
const STATIC_URL = 'https://static.sizebay.technology/'
const MODULE_URL = 'https://vfr-v3-production.sizebay.technology/V4/implantation/index.js'

function szbObserver() {
  const vfrBox = document.querySelector('#szb-container')
  const recBox = document.querySelector('span#szb-vfr-recommendation')

  const target = document.querySelector('body')

  const observer = new MutationObserver(function (mutations) {
    mutations.forEach(function (mutation) {
      if (mutation.removedNodes.length) {
        setTimeout(function () {
          if (recBox) {
            document.querySelector('#szb-vfr-recommendation')?.remove()
            document.querySelector(`#szb-container`).before(recBox)
          }
        }, 100)
        document.querySelector('.product-form__quantity').before(vfrBox)
      }
    })
  })

  const config = { attributes: true, childList: true, characterData: true }

  observer.observe(target, config)
}

window.SizebayPrescript = () => ({
  getPermalink() {
    return `https://minimalclub.com.br/${document.querySelector('product-info')?.getAttribute('data-product-id')}`
  },
  getAnchor() {
    return {
      web: 'fieldset:has(input[name*="Tamanho"])',
      mobile: 'fieldset:has(input[name*="Tamanho"])',
    }
  },
  getTenantId() {
    return TENANT_ID
  },
  getLanguage() {
    return 'br'
  },
  getButtons() {
    return {
      order: [
        { name: 'vfr', text: null },
        { name: 'measurements', text: null },
      ],
      position: 'after',
      class: 'vfr__button--clean',
    }
  },
  getRecommendationText() {
    return {
      default: 'Recomendamos o tamanho {size}',
      simplified: 'Recomendamos o tamanho {size}',
      order: 'before',
      anchor: '.vfr__container',
    }
  },
  getEnableRedesignedShoe() {
    return {
      enabled: true,
    }
  },
  getProductSizes() {
    return [
      ...new Set([...document.querySelectorAll('input[name*="Tamanho"]')].map((el) => el.value.trim()).filter(Boolean)),
    ]
  },
  hasOnPageIntegration() {
    return true
  },
  getIsMeasurementsTableEnabled() {
    return true
  },
})

const insertSizebayScript = (src, base) => {
  const script = document.createElement('script')
  script.id = base ? 'szb-vfr__base' : 'szb-vfr__module'
  script.setAttribute('src', src)
  document.querySelector('head').appendChild(script)
}

const sizebayStyles = () => {
  const link = document.createElement('link')
  link.setAttribute('rel', 'stylesheet')
  link.setAttribute('type', 'text/css')
  link.setAttribute('href', `${STATIC_URL}${TENANT_ID}/styles_v4.css`)
  document.querySelector('body').appendChild(link)
}

const sizebayImplantation = () => {
  insertSizebayScript(MODULE_URL, true)
  sizebayStyles()
}

function SizebayInit() {
  if (!document.querySelectorAll('#szb-vfr__base').length) sizebayImplantation()

  const payload = {
    permalink: SizebayPrescript().getPermalink(),
    tenantId: SizebayPrescript().getTenantId(),
    buttons: SizebayPrescript().getButtons(),
    anchor: SizebayPrescript().getAnchor(),
    lang: SizebayPrescript().getLanguage(),
    recommendation: SizebayPrescript().getRecommendationText(),
  }

  const sizebayRender = () => {
    console.log(`Sizebay -> produto: ${payload.permalink}`)
    window?.Sizebay?.Implantation(payload)
  }

  window.addEventListener('sizebay:loaded', () => {
    sizebayRender()
  })

  window.addEventListener('sizebay:rendered', () => {
    szbObserver()
  })

  typeof window?.Sizebay?.Implantation === 'function' && sizebayRender()
}

SizebayInit()