Scribd
Upload
3 views

script.js

The document is a JavaScript code snippet that manages user authentication by updating the UI based on the user's login status. It includes functionality for user registration and login, checking for existing users and matching credentials, and handling logout. The UI elements are dynamically displayed or hidden based on whether a user is logged in or not.

Uploaded by

69amazingpro69
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
3 views

script.js

The document is a JavaScript code snippet that manages user authentication by updating the UI based on the user's login status. It includes functionality for user registration and login, checking for existing users and matching credentials, and handling logout. The UI elements are dynamically displayed or hidden based on whether a user is logged in or not.

Uploaded by

69amazingpro69
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

document.

addEventListener('DOMContentLoaded', () => {

function updateUI() {
const loggedInUser = localStorage.getItem('loggedInUser');
const loginLink = document.getElementById('login-link');
const registerLink = document.getElementById('register-link');
const logoutLink = document.getElementById('logout-link');
const loginSection = document.getElementById('login');
const registerSection = document.getElementById('register');

if (loggedInUser) {
loginLink.style.display = 'none';
registerLink.style.display = 'none';
logoutLink.style.display = 'inline';
loginSection.style.display = 'none';
registerSection.style.display = 'none';
} else {
loginLink.style.display = 'inline';
registerLink.style.display = 'inline';
logoutLink.style.display = 'none';
loginSection.style.display = 'block';
registerSection.style.display = 'block';
}
}

updateUI();

document.getElementById('register-form')?.addEventListener('submit', (e) => {


e.preventDefault();

const username = document.getElementById('register-username').value;


const password = document.getElementById('register-password').value;
const confirmPassword = document.getElementById('register-confirm-
password').value;

if (password !== confirmPassword) {


alert("Heslá sa nezhodujú!");
return;
}

const users = JSON.parse(localStorage.getItem('users')) || [];


const existingUser = users.find(user => user.username === username);

if (existingUser) {
alert("Užívateľské meno už existuje!");
return;
}

users.push({ username, password });


localStorage.setItem('users', JSON.stringify(users));

alert("Registrácia úspešná!");
window.location.href = "index.html";
});

document.getElementById('login-form')?.addEventListener('submit', (e) => {


e.preventDefault();

const username = document.getElementById('login-username').value;


const password = document.getElementById('login-password').value;

const users = JSON.parse(localStorage.getItem('users')) || [];


const user = users.find(user => user.username === username && user.password
=== password);

if (user) {
localStorage.setItem('loggedInUser', username);
alert("Prihlásenie úspešné!");
updateUI();
window.location.href = "index.html";
} else {
alert("Nesprávne užívateľské meno alebo heslo!");
}
});

window.logout = () => {
localStorage.removeItem('loggedInUser');
updateUI();
window.location.href = "index.html";
};
});

You might also like