Andreas Hnida
0917adccba
All checks were successful
Build and Deploy Hugo Site / buildAndDeploy (push) Successful in 51s
72 lines
3 KiB
JavaScript
72 lines
3 KiB
JavaScript
/**
|
|
* Author: Kashif Raza
|
|
* Date: 2021-11-26
|
|
* Description: This is the main Javascript file for Captcha.
|
|
*/
|
|
document.onload = getCaptcha()
|
|
|
|
function getCaptcha() {
|
|
var form = document.getElementsByClassName('captcha-container')
|
|
var captcha = document.createElement('div')
|
|
captcha.className = 'captcha'
|
|
var captchaTxt = generateCaptcha()
|
|
captcha.innerHTML =
|
|
"<div class='captcha-image-container'><div class='captcha-image' data-captcha = '" +
|
|
captchaTxt +
|
|
"'>" +
|
|
captchaTxt +
|
|
"</div></div><input type='text' class='captcha-input' placeholder='Enter Captcha Shown' required/><div class='captcha-buttons'><button type='button' class='captcha-refresh' onclick='generateCaptcha2()'>⟳</button> <button type='button' class='captcha-verify' onclick='captchaValidate();'></button></div><h4 id='captcha-response'></h4>"
|
|
form[0].appendChild(captcha)
|
|
var submit = document.getElementsByClassName('submit-after-valid-captcha')
|
|
submit[0].disabled = true
|
|
}
|
|
|
|
function captchaValidate() {
|
|
var captcha = document.getElementsByClassName('captcha-input')
|
|
var captchaText = captcha[0].value
|
|
var originalCaptchaImg = document.getElementsByClassName('captcha-image')
|
|
originalCaptcha = originalCaptchaImg[0].getAttribute('data-captcha')
|
|
|
|
if (captchaText == originalCaptcha) {
|
|
console.log('Captcha Matched')
|
|
var submit = document.getElementsByClassName('submit-after-valid-captcha')
|
|
submit[0].disabled = false
|
|
var verify = document.getElementsByClassName('captcha-verify')
|
|
verify[0].disabled = true
|
|
verify[0].style.cursor = 'not-allowed'
|
|
var captchaResponse = document.getElementById('captcha-response')
|
|
captchaResponse.innerHTML = "<p style='color: green; text-align: center;'>✔</p>"
|
|
} else {
|
|
var submit = document.getElementsByClassName('submit-after-valid-captcha')
|
|
submit[0].disabled = true
|
|
var verify = document.getElementsByClassName('captcha-verify')
|
|
verify[0].disabled = false
|
|
var captchaResponse = document.getElementById('captcha-response')
|
|
captchaResponse.innerHTML = "<p style='color: red; text-align: center;'>X</p>"
|
|
generateCaptcha2()
|
|
}
|
|
}
|
|
|
|
// Function to generate captcha without changing the data and content of the captcha-image div
|
|
// For 1st time generation of captcha
|
|
function generateCaptcha() {
|
|
var text = ''
|
|
var possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
|
|
for (var i = 0; i < 5; i++) {
|
|
text += possible.charAt(Math.floor(Math.random() * possible.length))
|
|
}
|
|
return text
|
|
}
|
|
|
|
// Function to generate captcha without changing the data and content of the captcha-image div
|
|
// For rest of the time generation of captcha
|
|
function generateCaptcha2() {
|
|
var text = ''
|
|
var possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
|
|
for (var i = 0; i < 5; i++) {
|
|
text += possible.charAt(Math.floor(Math.random() * possible.length))
|
|
}
|
|
var captcha = document.getElementsByClassName('captcha-image')
|
|
captcha[0].innerHTML = text
|
|
captcha[0].setAttribute('data-captcha', text)
|
|
}
|