storj/web/satellite/static/resetPassword/resetPassword.js
NikolaiYurchenko 38196b4809 web/satellite: validation to reset password page added
Change-Id: I493e0499d1806aa856b7ebed40272608140233c7
2020-01-21 13:57:23 +00:00

133 lines
3.7 KiB
JavaScript

/* Copyright (C) 2019 Storj Labs, Inc. */
/* See LICENSE for copying information. */
const passwordType = 'password';
const textType = 'text';
const regularPasswordLabel = 'New Password';
const regularRepeatPasswordLabel = 'Repeat Password';
const errorPasswordLabel = 'Password must contains at least 6 characters';
const errorRepeatPasswordLabel = 'Password doesn\'t match';
const regularColor = '#354049';
const errorColor = '#eb5757';
const passwordInputId = 'passwordInput';
const repeatPasswordId = 'repeatPasswordInput';
const types = {
PASSWORD: 'PASSWORD',
REPEAT_PASSWORD: 'REPEAT_PASSWORD',
};
function togglePasswordVisibility() {
toggleVisibility(passwordInputId);
}
function toggleRepeatPasswordVisibility() {
toggleVisibility(repeatPasswordId);
}
function toggleVisibility(id) {
const element = document.getElementById(id);
if (element) {
const isPasswordVisible = element.type === textType;
toggleEyeIcon(id, isPasswordVisible);
element.type = isPasswordVisible ? passwordType : textType;
}
}
function toggleEyeIcon(id, isPasswordVisible) {
const eyeIcon = document.getElementById(`${id}_eyeIcon`);
if (eyeIcon) {
eyeIcon.src = isPasswordVisible ?
'/static/static/images/common/passwordHidden.svg' :
'/static/static/images/common/passwordShown.svg'
}
}
function submit() {
const passwordInput = document.getElementById(passwordInputId);
if (passwordInput) {
if (!validatePassword(passwordInput.value)) {
setPasswordError(true);
return;
}
}
const repeatPasswordInput = document.getElementById(repeatPasswordId);
if (repeatPasswordInput) {
if (passwordInput.value !== repeatPasswordInput.value) {
setRepeatPasswordError(true);
return;
}
}
document.resetPasswordForm.submit();
}
function setPasswordError(status) {
setError(types.PASSWORD, status);
}
function setRepeatPasswordError(status) {
setError(types.REPEAT_PASSWORD, status);
}
function setError(type, status) {
let passwordLabel;
let passwordInput;
let regularLabel;
let errorLabel;
switch (type) {
case types.PASSWORD:
passwordLabel = document.getElementById('passwordLabel');
passwordInput = document.getElementById(passwordInputId);
regularLabel = regularPasswordLabel;
errorLabel = errorPasswordLabel;
break;
case types.REPEAT_PASSWORD:
passwordLabel = document.getElementById('repeatPasswordLabel');
passwordInput = document.getElementById(repeatPasswordId);
regularLabel = regularRepeatPasswordLabel;
errorLabel = errorRepeatPasswordLabel;
}
if (passwordLabel && passwordInput) {
changeStyling({
labelElement: passwordLabel,
inputElement: passwordInput,
regularLabel,
errorLabel,
status,
});
}
}
function changeStyling(configuration) {
if (configuration.status) {
configuration.labelElement.innerText = configuration.errorLabel;
configuration.labelElement.style.color = configuration.inputElement.style.borderColor = errorColor;
return;
}
configuration.labelElement.innerText = configuration.regularLabel;
configuration.labelElement.style.color = configuration.inputElement.style.borderColor = regularColor;
}
function validatePassword(password) {
return typeof password !== 'undefined' && password.length >= 6;
}
function resetPasswordError() {
setError(types.PASSWORD, false);
}
function resetRepeatPasswordError() {
setError(types.REPEAT_PASSWORD, false);
}