diff --git a/src/components/Captcha/Captcha.astro b/src/components/Captcha/Captcha.astro deleted file mode 100644 index 09f3d0a38..000000000 --- a/src/components/Captcha/Captcha.astro +++ /dev/null @@ -1,15 +0,0 @@ ---- ---- - - - - - - -
- - diff --git a/src/components/Captcha/CaptchaFields.astro b/src/components/Captcha/CaptchaFields.astro new file mode 100644 index 000000000..fb30a3371 --- /dev/null +++ b/src/components/Captcha/CaptchaFields.astro @@ -0,0 +1,5 @@ +--- +--- + +
+ \ No newline at end of file diff --git a/src/components/Captcha/CaptchaScripts.astro b/src/components/Captcha/CaptchaScripts.astro new file mode 100644 index 000000000..dd266e2d7 --- /dev/null +++ b/src/components/Captcha/CaptchaScripts.astro @@ -0,0 +1,36 @@ +--- + +--- + + + + + + \ No newline at end of file diff --git a/src/components/Captcha/captcha.js b/src/components/Captcha/captcha.js index dded3e9f1..aa065ac25 100644 --- a/src/components/Captcha/captcha.js +++ b/src/components/Captcha/captcha.js @@ -4,7 +4,6 @@ class Captcha { this.bindValidation = this.bindValidation.bind(this); this.validateCaptchaBeforeSubmit = this.validateCaptchaBeforeSubmit.bind(this); - this.onCaptchaLoad = this.onCaptchaLoad.bind(this); } validateCaptchaBeforeSubmit(e) { @@ -30,36 +29,13 @@ class Captcha { } bindValidation() { - const forms = document.querySelectorAll('.validate-captcha-form'); + const forms = document.querySelectorAll('[captcha-form]'); forms.forEach((form) => { form.addEventListener('submit', this.validateCaptchaBeforeSubmit); }); } - onCaptchaLoad() { - if (!window.grecaptcha) { - console.warn('window.grecaptcha is not defined'); - return; - } - - const recaptchaFields = document.querySelectorAll('.recaptcha-field'); - - // render recaptcha on fields - recaptchaFields.forEach((field) => { - // If captcha already rendered for this field - if (field.hasAttribute('data-recaptcha-id')) { - return; - } - - const renderedId = window.grecaptcha.render(field, { - sitekey: '6Ldn2YsjAAAAABlUxNxukAuDAUIuZIhO0hRVxzJW', - }); - - field.setAttribute('data-recaptcha-id', renderedId); - }); - } - onDOMLoaded() { this.bindValidation(); } @@ -71,5 +47,3 @@ class Captcha { const captcha = new Captcha(); captcha.init(); - -window.onCaptchaLoad = captcha.onCaptchaLoad; diff --git a/src/components/DownloadPopup.astro b/src/components/DownloadPopup.astro index c06362b68..d82fab3f3 100644 --- a/src/components/DownloadPopup.astro +++ b/src/components/DownloadPopup.astro @@ -1,6 +1,6 @@ --- import Popup from './Popup/Popup.astro'; -import Captcha from './Captcha/Captcha.astro'; +import CaptchaFields from './Captcha/CaptchaFields.astro'; --- - + diff --git a/src/components/SubscribePopup.astro b/src/components/SubscribePopup.astro index 1dfc4a002..5acd3790d 100644 --- a/src/components/SubscribePopup.astro +++ b/src/components/SubscribePopup.astro @@ -1,6 +1,6 @@ --- import Popup from './Popup/Popup.astro'; -import Captcha from './Captcha/Captcha.astro'; +import CaptchaFields from './Captcha/CaptchaFields.astro'; --- - + diff --git a/src/pages/[roadmapId]/index.astro b/src/pages/[roadmapId]/index.astro index 03b3f0d65..d1efb4fef 100644 --- a/src/pages/[roadmapId]/index.astro +++ b/src/pages/[roadmapId]/index.astro @@ -1,4 +1,5 @@ --- +import CaptchaScripts from '../../components/Captcha/CaptchaScripts.astro'; import InteractiveRoadamp from '../../components/InteractiveRoadmap/InteractiveRoadmap.astro'; import MarkdownRoadmap from '../../components/MarkdownRoadmap.astro'; import RoadmapHeader from '../../components/RoadmapHeader.astro'; @@ -55,4 +56,6 @@ const roadmapData = roadmapFile.frontmatter as RoadmapFrontmatter; ) } + + diff --git a/src/pages/signup.astro b/src/pages/signup.astro index 739434482..de583132e 100644 --- a/src/pages/signup.astro +++ b/src/pages/signup.astro @@ -1,5 +1,6 @@ --- -import Captcha from '../components/Captcha/Captcha.astro'; +import CaptchaFields from '../components/Captcha/CaptchaFields.astro'; +import CaptchaScripts from '../components/Captcha/CaptchaScripts.astro'; import BaseLayout from '../layouts/BaseLayout.astro'; --- @@ -27,7 +28,8 @@ import BaseLayout from '../layouts/BaseLayout.astro'; action='https://newsletter.roadmap.sh/subscribe' method='POST' accept-charset='utf-8' - class='w-full validate-captcha-form' + class='w-full' + captcha-form > - + @@ -54,4 +56,6 @@ import BaseLayout from '../layouts/BaseLayout.astro'; + +