69 lines
2.3 KiB
JavaScript
69 lines
2.3 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
const form = document.querySelector('form');
|
|
const submitButton = form.querySelector('button[type="submit"]');
|
|
const errorElement = document.getElementById('error');
|
|
|
|
form.addEventListener('keydown', function(event) {
|
|
const activeElement = document.activeElement;
|
|
const formElements = Array.from(form.elements);
|
|
const currentIndex = formElements.indexOf(activeElement);
|
|
|
|
if (activeElement.tagName === 'INPUT') {
|
|
if (event.key === 'Enter') {
|
|
event.preventDefault();
|
|
if (currentIndex === formElements.length - 1) {
|
|
submitButton.focus();
|
|
} else if (currentIndex !== -1 && formElements[currentIndex + 1]) {
|
|
formElements[currentIndex + 1].focus();
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
submitButton.addEventListener('focus', function() {
|
|
submitButton.classList.add('focus-visible');
|
|
});
|
|
|
|
submitButton.addEventListener('blur', function() {
|
|
submitButton.classList.remove('focus-visible');
|
|
});
|
|
|
|
form.addEventListener('submit', function(event) {
|
|
event.preventDefault();
|
|
validateForm();
|
|
});
|
|
|
|
async function validateForm() {
|
|
const name = document.getElementById('name').value.trim();
|
|
const nickname = document.getElementById('nickname').value.trim();
|
|
|
|
if (name === '' || nickname === '') {
|
|
errorElement.textContent = 'Пожалуйста, заполните все поля';
|
|
errorElement.style.display = 'block';
|
|
return false;
|
|
}
|
|
try {
|
|
// Отправка данных для регистрации
|
|
let response = await fetch('/login', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify({name, nickname})
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.status === 0) {
|
|
window.location.href = '/';
|
|
} else {
|
|
throw Error(result.error);
|
|
}
|
|
} catch(error) {
|
|
errorElement.textContent = 'Попробуйте еще раз';
|
|
errorElement.style.display = 'block';
|
|
}
|
|
|
|
}
|
|
});
|