135 lines
3.9 KiB
JavaScript
135 lines
3.9 KiB
JavaScript
(function () {
|
|
var loginForm = document.querySelector('.js-login-form');
|
|
var accountPanel = document.getElementById('accountPanel');
|
|
var accountLabel = document.getElementById('accountLabel');
|
|
var accountActions = document.getElementById('accountActions');
|
|
var adminLink = document.getElementById('adminLink');
|
|
var logoutLink = document.getElementById('logoutLink');
|
|
var loginStatus = document.getElementById('loginStatus');
|
|
var loginModal = document.getElementById('modal-Login');
|
|
var overlay = document.querySelector('.md-overlay');
|
|
|
|
if (!loginForm || !accountPanel || !accountLabel || !accountActions || !logoutLink) {
|
|
return;
|
|
}
|
|
|
|
function setStatus(message, isError) {
|
|
if (!loginStatus) {
|
|
return;
|
|
}
|
|
|
|
loginStatus.textContent = message || '';
|
|
loginStatus.classList.toggle('is-error', !!isError);
|
|
loginStatus.classList.toggle('is-success', !isError && !!message);
|
|
}
|
|
|
|
function closeModal() {
|
|
if (loginModal) {
|
|
loginModal.classList.remove('md-show');
|
|
}
|
|
if (document.documentElement) {
|
|
document.documentElement.classList.remove('md-perspective');
|
|
}
|
|
if (overlay) {
|
|
overlay.removeEventListener('click', closeModal);
|
|
}
|
|
}
|
|
|
|
function renderAuthenticated(user, role, adminUrl, logoutUrl) {
|
|
accountPanel.classList.add('is-authenticated');
|
|
accountPanel.classList.remove('md-trigger');
|
|
accountPanel.removeAttribute('data-modal');
|
|
accountLabel.textContent = user;
|
|
accountActions.hidden = false;
|
|
|
|
if (role === 'admin' && adminUrl) {
|
|
adminLink.href = adminUrl;
|
|
adminLink.hidden = false;
|
|
} else {
|
|
adminLink.hidden = true;
|
|
}
|
|
|
|
if (logoutUrl) {
|
|
logoutLink.href = logoutUrl;
|
|
}
|
|
}
|
|
|
|
function renderLoggedOut(defaultLabel) {
|
|
accountPanel.classList.remove('is-authenticated');
|
|
accountPanel.classList.add('md-trigger');
|
|
accountPanel.setAttribute('data-modal', 'modal-Login');
|
|
accountLabel.textContent = defaultLabel;
|
|
accountActions.hidden = true;
|
|
adminLink.hidden = true;
|
|
}
|
|
|
|
accountPanel.addEventListener('click', function (event) {
|
|
if (!accountPanel.classList.contains('is-authenticated')) {
|
|
return;
|
|
}
|
|
|
|
event.stopImmediatePropagation();
|
|
}, true);
|
|
|
|
loginForm.addEventListener('submit', function (event) {
|
|
event.preventDefault();
|
|
setStatus('', false);
|
|
|
|
var formData = new FormData(loginForm);
|
|
|
|
fetch('login.php', {
|
|
method: 'POST',
|
|
headers: {
|
|
'X-Requested-With': 'XMLHttpRequest'
|
|
},
|
|
body: formData
|
|
})
|
|
.then(function (response) {
|
|
return response.json().then(function (payload) {
|
|
return {
|
|
ok: response.ok,
|
|
payload: payload
|
|
};
|
|
});
|
|
})
|
|
.then(function (result) {
|
|
if (!result.ok || !result.payload.success) {
|
|
throw new Error(result.payload.message || 'Connexion impossible.');
|
|
}
|
|
|
|
renderAuthenticated(result.payload.user, result.payload.role, result.payload.adminUrl, result.payload.logoutUrl);
|
|
setStatus(result.payload.message || 'Connexion réussie.', false);
|
|
loginForm.reset();
|
|
window.setTimeout(function () {
|
|
closeModal();
|
|
window.location.reload();
|
|
}, 250);
|
|
})
|
|
.catch(function (error) {
|
|
setStatus(error.message || 'Connexion impossible.', true);
|
|
});
|
|
});
|
|
|
|
logoutLink.addEventListener('click', function (event) {
|
|
event.preventDefault();
|
|
|
|
fetch(logoutLink.href, {
|
|
method: 'POST',
|
|
headers: {
|
|
'X-Requested-With': 'XMLHttpRequest'
|
|
}
|
|
})
|
|
.then(function (response) {
|
|
return response.json();
|
|
})
|
|
.then(function () {
|
|
renderLoggedOut(accountPanel.dataset.loginLabel || 'Connexion');
|
|
setStatus('', false);
|
|
window.location.reload();
|
|
})
|
|
.catch(function () {
|
|
window.location.href = logoutLink.href;
|
|
});
|
|
});
|
|
})();
|