IdeaLabx-Quiz / index.html
tjwrld's picture
Update index.html
a23ded8 verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<h1>Welcome to the Quiz</h1>
<h2>Select Your Role</h2>
<button id="userBtn">User</button>
<button id="adminBtn">Admin</button>
<div id="inputContainer" style="display: none;">
<div id="userInput" style="display: none;">
<label for="nameInput">Enter Your Name:</label>
<input type="text" id="nameInput" placeholder="Your Name" required>
</div>
<div id="adminInput" style="display: none;">
<label for="passwordInput">Enter Password:</label>
<input type="password" id="passwordInput" placeholder="Password" required>
</div>
<button id="submitBtn">Continue</button>
</div>
</div>
<script>
document.getElementById('userBtn').addEventListener('click', () => {
document.getElementById('inputContainer').style.display = 'block';
document.getElementById('userInput').style.display = 'block';
document.getElementById('adminInput').style.display = 'none';
document.getElementById('nameInput').value = ''; // Clear the name input
document.getElementById('passwordInput').value = ''; // Clear the password input
});
document.getElementById('adminBtn').addEventListener('click', () => {
document.getElementById('inputContainer').style.display = 'block';
document.getElementById('adminInput').style.display = 'block';
document.getElementById('userInput').style.display = 'none';
document.getElementById('nameInput').value = ''; // Clear the name input
document.getElementById('passwordInput').value = ''; // Clear the password input
});
document.getElementById('submitBtn').addEventListener('click', () => {
const name = document.getElementById('nameInput').value.trim();
const password = document.getElementById('passwordInput').value.trim();
if (document.getElementById('userInput').style.display === 'block') {
// User logic
if (name) {
localStorage.setItem('userName', name);
window.location.href = 'user.html'; // Redirect to user page
} else {
alert('Please enter your name.');
}
} else {
// Admin logic
if (password === 'yoyohoneysingh') {
localStorage.setItem('userName', 'Admin'); // Store admin name for consistency
window.location.href = 'admin.html'; // Redirect to admin page
} else {
alert('Incorrect password. Please try again.');
}
}
});
</script>
</body>
</html>