mirror of
https://github.com/AudebertAdrien/ft_transcendence.git
synced 2026-11-09 18:17:07 +01:00
autofocus and key handling in the frontend forms
This commit is contained in:
@@ -15,6 +15,15 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
let token;
|
||||
let gameState;
|
||||
|
||||
// Auto-focus and key handling for AUTH-FORM
|
||||
nicknameInput.focus();
|
||||
nicknameInput.addEventListener('keypress', function(event) {
|
||||
if (event.key === 'Enter') {
|
||||
event.preventDefault();
|
||||
checkNicknameButton.click();
|
||||
}
|
||||
});
|
||||
|
||||
checkNicknameButton.addEventListener('click', handleCheckNickname);
|
||||
registerButton.addEventListener('click', handleRegister);
|
||||
loginButton.addEventListener('click', handleLogin);
|
||||
@@ -27,9 +36,30 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
if (exists) {
|
||||
authForm.style.display = 'none';
|
||||
loginForm.style.display = 'block';
|
||||
// Auto-focus and key handling for LOGIN-FORM
|
||||
loginPasswordInput.focus();
|
||||
loginPasswordInput.addEventListener('keypress', function(event) {
|
||||
if (event.key === 'Enter') {
|
||||
event.preventDefault();
|
||||
loginButton.click();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
authForm.style.display = 'none';
|
||||
registerForm.style.display = 'block';
|
||||
// Auto-focus and key handling for REGISTER-FORM
|
||||
passwordInput.focus();
|
||||
passwordInput.addEventListener('keypress', function(event) {
|
||||
if (event.key === 'Enter') {
|
||||
confirmPasswordInput.focus();
|
||||
confirmPasswordInput.addEventListener('keypress', function(event) {
|
||||
if (event.key === 'Enter') {
|
||||
event.preventDefault();
|
||||
registerButton.click();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error checking user existence:', error);
|
||||
@@ -134,7 +164,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
if (data.type === 'authenticated') {
|
||||
console.log('Authentication successful');
|
||||
} else if (data.type === 'waiting_room') {
|
||||
console.log('Entered the waiting room');
|
||||
console.log('Entered the WAITING ROOM');
|
||||
} else if (data.type === 'game_start') {
|
||||
console.log('Game started:', data.game_id, '(', data.player1, 'vs', data.player2, ')');
|
||||
startGame(data.game_id, data.player1, data.player2);
|
||||
@@ -164,7 +194,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
}
|
||||
|
||||
function handleKeyDown(event) {
|
||||
if (event.key === 'ArrowUp' || event.key === 'ArrowDown' || event.key === '+') {
|
||||
if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {
|
||||
sendKeyPress(event.key.toLowerCase());
|
||||
}
|
||||
}
|
||||
|
||||
@@ -37,6 +37,6 @@
|
||||
<div id="ball"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="{% static 'game.js' %}"></script>
|
||||
<script src="{% static 'game.js' %}"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user