myMedisys/tomcatfiles/mymedisys-frontend/WEB-INF/classes/scripts/otp.js
2023-09-06 05:56:42 +05:30

303 lines
8.2 KiB
JavaScript

!function($) {
"use strict";
var t = 0;
var interval = 15
var intervalTimer = interval + ":00"
var Otp = function(element, options) {
this.$callback = options ? options.callback : null;
this.$verify = $(element); // this.$otpEmail.siblings().find('[data-trigger="verify"]')
this.$verify.on('click.otp', $.proxy(this.verify, this))
this.$otpType = this.$verify.siblings('[data-provides="otpType"]')
this.$otpTimer = this.$verify.parent().parent().siblings(
'[data-provides="otpTimer"]')
this.$otpTimer.attr('value', intervalTimer)
this.$otpVal = this.$verify.parent().parent().siblings(
'[data-provides="otpVal"]')
this.$otpEmail = this.$verify.parent().siblings(
'[data-provides="otpEmail"]')
this.$otpMobile = this.$verify.parent().siblings(
'[data-provides="otpMobile"]')
this.$errMsg = this.$verify.parent().parent().siblings("p.errors")
this.$reset = this.$otpEmail.siblings().find('[data-trigger="reset"]')
this.$reset.on('click.otp', $.proxy(this.reset, this))
this.$validate = this.$otpEmail.siblings().find(
'[data-trigger="validate"]')
}
Otp.prototype = {
validateEmail: function(email) {
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
return emailReg.test(email);
},
reset: function() {
this.$reset.hide();
this.$verify.show();
this.$validate.hide();
this.$otpEmail.prop("readonly", "");
this.$otpEmail.val('');
this.$otpVal.val('0');
this.$btnValidate.hide(); // OTP validate button hide
this.$otpCode.prop("disabled", true);
this.$btnGen.show();
},
verify: function() {
this.$form = this.$verify.closest("form");
if(this.$form.length > 0) {
if(!this.$form.valid()) {
return;
}
}
if (this.$otpEmail.val() == '') {
this.$errMsg.html(prop.errEmailReq);
} else {
this.$errMsg.html('')
var isEmailValid = this.validateEmail(this.$otpEmail.val());
if (isEmailValid) {
this.$errMsg.html('')
if (this.$otpTimer.val() == "0:00" || this.$otpTimer.val() == '') {
this.$otpTimer.val(intervalTimer)
}
this.modal(this.$otpEmail.val(), this.$otpMobile.val())
if (this.$otpVal.val() == '1') {
this.hideBtnGen()
this.$otpCode.prop('disabled')
} else {
this.showBtnGen()
this.$otpCode.prop('disabled', true)
}
} else {
this.$errMsg.html(prop.errEmailFmt);
}
}
},
modal: function(email, mobile) {
var method = "GET";
var inputUrl = contextPath + '/otp';
var dataArr = {};
dataArr.otpId = this.$verify.attr("data-id")
dataArr.email = this.$otpEmail.val();
if (this.$otpMobile) {
dataArr.mobile = this.$otpMobile.val();
}
var data = this.send(method, inputUrl, dataArr);
var content = data;
this.$modal = bootbox.dialog({
closeButton: true,
message: content,
title: prop.otpTitle,
className: "otp-popup"
});
this.$stepperRequest = $(document.querySelector("span#stepperRequest"))
this.$stepperVerify = $(document.querySelector("span#stepperVerify"))
this.$requestPasscode = $(document.querySelector("div#requestPasscode"))
this.$verifyPasscode = $(document.querySelector("div#verifyPasscode"))
this.$otpCode = $(document.querySelector("input#otpCode"))
this.$btnGen = $(document.querySelector("#generateOtp"))
this.$btnGen.on('click.otp', $.proxy(this._generate, this))
this.$btnValidate = $(document.querySelector("#validateOtp"))
this.$btnValidate.on('click.otp', $.proxy(this._validate, this))
this.$errMsgModal = $(document.querySelector("#otpErrorMsg"))
this.$otpTimerDisplay = $(document
.querySelector("#otpTimerDisplay"))
},
_generate: function() {
var method = "GET";
var inputUrl = contextPath + '/otp/generate';
var dataArr = {};
dataArr.otpId = this.$verify.attr("data-id")
dataArr.emailAddress = this.$otpEmail.val();
if (this.$otpMobile) {
dataArr.mobile = this.$otpMobile.val();
}
this.$otpCode.val(''); // Reset to empty
this.$btnGen.prop("disabled", true); // Disable button
if (this.$otpTimer.val() == "0:00" || this.$otpTimer.val() == '') {
this.$otpTimer.val(intervalTimer)
}
var data = this.send(method, inputUrl, dataArr)
if (data) {
var msgs = data.split('*^*');
if (msgs.length > 1) {
if (msgs[1] == 1) {
this.otpAlert(msgs[0])
this.hideBtnGen()
this.$otpTimer.val(intervalTimer);
this.$otpCode.prop("disabled", false);
} else {
this.otpAlert(msgs[0], true)
this.showBtnGen()
this.$otpCode.prop("disabled", true);
}
this.$btnGen.prop("disabled", false);
this.$otpVal.val(msgs[1]);
}
var that = this;
this.startTimer(that);
setTimeout(function() {
that.otpAlert('')
that.showBtnGen()
that.$btnGen.prop("disabled", false);
that.$otpCode.prop("disabled", false);
}, interval * 60 * 1000);
} else {
this.otpAlert(data, true)
this.$btnValidate.hide();
this.$btnGen.show();
this.$btnGen.prop("disabled", false);
this.$otpCode.prop("disabled", true);
}
},
_validate: function() {
var method = "POST";
var otpType = this.$otpType.val();
var otp = this.$otpCode.val();
var otpId = this.$verify.attr("data-id")
var inputUrl = contextPath + '/otp/validate';
this.otpAlert('') // Reset Alert Message
if (otp == '') {
this.otpAlert('OTP is required', true);
return;
}
var dataArr = {
otpCode: otp,
otpId: otpId
};
var data = this.send(method, inputUrl, dataArr)
if (data) {
this.$otpCode.val('');
if (data.isValid && !data.isExpired) {
this.stopTimer();
this.$otpVal.val('0');
this.otpAlert(data.message);
this.$errMsg.html('');
bootbox.hideAll();
if (this.$otpType.val() == 'email') {
this.$verify.hide();
this.$validate.show();
this.$otpEmail.prop("readonly", "readonly");
this.$otpVal.val('1');
this.$reset.show();
} else {
this.$errMsgModal.replaceWith(
'<b class="font-green">' + prop.succVerOTP + '</b>');
if (this.$callback) this.$callback.call();
}
} else {
if (data.isExpired) {
this.$otpVal.val('0');
this.otpAlert(data.message, true)
this.showBtnGen()
} else {
this.otpAlert(data.message, true)
this.hideBtnGen()
}
}
} else {
this.otpAlert(data, true);
this.hideBtnGen()
}
},
send: function(method, inputUrl, dataArr) {
var aaData = null;
$.ajax({
'async': false,
'global': false,
headers: {
'X-CSRF-Token': csrf_token
},
type: method,
action: 'xhttp',
url: inputUrl,
data: dataArr,
success: function(data) {
aaData = data;
}
});
return aaData;
},
showBtnGen: function() {
this.$btnGen.show();
this.$requestPasscode.show();
this.$btnValidate.hide();
this.$verifyPasscode.hide();
this.$stepperRequest.addClass("active");
this.$stepperVerify.removeClass("active");
},
hideBtnGen: function() {
this.$btnGen.hide();
this.$requestPasscode.hide();
this.$btnValidate.show();
this.$verifyPasscode.show();
this.$stepperRequest.removeClass("active");
this.$stepperVerify.addClass("active");
},
otpAlert: function(message, type) {
this.$errMsgModal.html(message);
if (type) {
this.$errMsgModal.attr('style', 'color:red')
} else {
this.$errMsgModal.attr('style', 'color:green')
}
},
startTimer: function(e) {
var presentTime = e.$otpTimer.val();
var timeArray = presentTime.split(/[:]+/);
var m = timeArray[0];
var s = checkSecond((timeArray[1] - 1));
if (s == 59) {
m = m - 1
}
e.$otpTimer.val(m + ":" + s);
e.$otpTimerDisplay.html(m + ":" + s);
if (m > 0 || s > 0) {
t = setTimeout(e.startTimer, 1000, e);
} else {
e.stopTimer(e)
}
},
stopTimer: function() {
clearTimeout(t)
this.$otpTimer.val(intervalTimer);
}
}
$.fn.otp = function(options) {
return this.each(function() {
var $this = $(this), data = $this.data('otp')
if (!data)
$this.data('otp', (data = new Otp(this, options)))
if (typeof options == 'string')
data[options]()
})
}
$.fn.otp.Constructor = Otp
function checkSecond(sec) {
if (sec < 10 && sec >= 0) {
sec = "0" + sec
}
// add zero in front of numbers < 10
if (sec < 0) {
sec = "59"
}
return sec;
}
}(window.jQuery);