asteroid/static/js/auth-ui.js

41 lines
1.4 KiB
JavaScript

// auth-ui.js - Handle authentication UI state across all pages
// Check if user is logged in by calling the API
async function checkAuthStatus() {
try {
const response = await fetch('/api/asteroid/auth-status');
const result = await response.json();
// api-output wraps response in {status, message, data}
const data = result.data || result;
return data;
} catch (error) {
console.error('Error checking auth status:', error);
return { loggedIn: false, isAdmin: false };
}
}
// Update UI based on authentication status
function updateAuthUI(authStatus) {
// Show/hide elements based on login status
document.querySelectorAll('[data-show-if-logged-in]').forEach(el => {
el.style.display = authStatus.loggedIn ? 'inline-block' : 'none';
});
document.querySelectorAll('[data-show-if-logged-out]').forEach(el => {
el.style.display = authStatus.loggedIn ? 'none' : 'inline-block';
});
document.querySelectorAll('[data-show-if-admin]').forEach(el => {
el.style.display = authStatus.isAdmin ? 'inline-block' : 'none';
});
}
// Initialize auth UI on page load
document.addEventListener('DOMContentLoaded', async function() {
console.log('Auth UI initializing...');
const authStatus = await checkAuthStatus();
console.log('Auth status:', authStatus);
updateAuthUI(authStatus);
console.log('Auth UI updated');
});