82 lines
1.9 KiB
JavaScript
82 lines
1.9 KiB
JavaScript
import Events from '../_events'
|
|
|
|
const NAME = 'uiTurnstile'
|
|
const SELECTOR = `.${NAME},.js-turnstile,.field.turnstile .cf-turnstile`
|
|
|
|
const init = () => {
|
|
console.log(`${NAME}: init`)
|
|
|
|
const captchas = document.querySelectorAll(SELECTOR)
|
|
if (!captchas.length) {
|
|
console.log(`${NAME}: No Captcha fields.`)
|
|
return
|
|
}
|
|
|
|
if (
|
|
!document.querySelector('#captchaAPI')
|
|
&& !document.querySelector('[src^="https://challenges.cloudflare.com/turnstile/v0/api.js"]')
|
|
) {
|
|
loadScript()
|
|
return
|
|
}
|
|
|
|
// the script may be loading right now
|
|
if (typeof window.turnstile !== 'undefined') {
|
|
renderCaptcha()
|
|
}
|
|
}
|
|
|
|
const renderCaptcha = () => {
|
|
console.log(`${NAME}: renderCaptcha`)
|
|
|
|
const captchas = document.querySelectorAll(SELECTOR)
|
|
|
|
captchas.forEach((el) => {
|
|
if (el.dataset[NAME] || el.innerHTML.length > 0) {
|
|
|
|
if (el.dataset.widgetid) {
|
|
//turnstile.reset(el.dataset.widgetid)
|
|
}
|
|
|
|
return
|
|
}
|
|
|
|
|
|
console.log(`${NAME}: renderCaptcha > new field`)
|
|
|
|
const widgetid = window.turnstile.render(el, {
|
|
sitekey: el.dataset.sitekey,
|
|
callback: function (token) {
|
|
console.log(`${NAME}: Challenge Success ${token}`);
|
|
},
|
|
})
|
|
|
|
/*const form = el.closest('form')
|
|
form.addEventListener('submit', () => {
|
|
console.log(`${NAME}: submit`)
|
|
window.turnstile.reset(el.dataset.widgetid)
|
|
})*/
|
|
|
|
el.dataset.widgetid = widgetid
|
|
|
|
el.dataset[NAME] = true
|
|
})
|
|
}
|
|
|
|
|
|
window.renderCaptcha = renderCaptcha
|
|
|
|
const loadScript = () => {
|
|
|
|
console.log(`${NAME}: Loading Captcha API ...`)
|
|
const script = document.createElement('script');
|
|
script.id = 'captchaAPI';
|
|
script.src = `https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit&onload=renderCaptcha`
|
|
script.async = true
|
|
|
|
document.body.append(script)
|
|
}
|
|
|
|
window.addEventListener(`${Events.LODEDANDREADY}`, init)
|
|
window.addEventListener(`${Events.AJAX}`, init)
|