SMMP/view/admin.php

172 lines
4.3 KiB
PHP

<!DOCTYPE html>
<html>
<head>
<title>Authentification</title>
<!-- Informations de la page -->
<meta name='Content-Type' content='text/html; charset=utf-8'>
<meta charset='utf-8'>
<meta name='author' content='Adrien MARQUÈS alias {xdrm};'>
<meta name='desctiption' content="Système de gestion des véhicules pour STEF.">
<!-- Dépendences CSS -->
<link type='text/css' rel='stylesheet' href='/css/reset.css' /> <!-- Reset du css natif des browsers -->
<!-- Dépendences Javascript -->
<script type='text/javascript' src='/js/lib/input-checker.js' ></script> <!-- Gestion dynamique des saisies -->
<script type='text/javascript' src='/js/lib/reset.js' ></script> <!-- Corrections Javascript natif (ajouts) -->
<script type='text/javascript' src='/js/lib/api.js' ></script> <!-- Gestion des transactions avec le serveur -->
<script type='text/javascript' src='/js/lib/page-manager.js' ></script> <!-- Gestion des transactions avec le serveur -->
</head>
<style type='text/css'>
body{
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
background: #933024;
font-family: "Roboto";
}
#FORM{
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
width: 30em;
min-height: 22em;
border-radius: 5px;
background: #fff;
}
#FORM > input{
width: calc( 80% - 2*2em );
height: calc( 4em - 2*1em );
padding: 1em 2em;
border-radius: 3px;
border: 0;
background: #F1F2F4;
color: #444;
font-family: "Open Sans";
box-shadow: inset -1px 1px 5px #ddd;
}
#FORM > input[type='button']{
width: 80%;
height: 4em;
background: #00CD6A;
color: #fff;
box-shadow: 0 2px 0 0 #00B65B;
cursor: pointer;
}
#FORM > input[type='button']:hover{
box-shadow: 0 3px 0 0 #00B65B;
}
#FORM > #err-box{
color: #F64247;
}
</style>
<body style='background-color: <?= $_SESSION['WAREHOUSE']['theme']; ?>;'>
<!-- CORPS DE LA PAGE -->
<div id='FORM'>
<span></span>
<span>[<?= $_SESSION['WAREHOUSE']['name']; ?>] Authentification</span>
<input type='text' placeholder='Identifiant' id='admin-name'>
<input type='password' placeholder="Mot de passe" id='admin-password'>
<input type='button' value='AUTHENTIFICATION' id='admin-submit'>
<span id='err-box'></span>
<span></span>
</div>
<!-- Dépendences Javascript après chargement des éléments -->
<script type='text/javascript'>
var api = new APIClass('/api/');
/* [0] Récupération des éléments utiles du DOM
=========================================================*/
var aForm = document.getElementById('FORM');
var aName = document.getElementById('admin-name');
var aPassword = document.getElementById('admin-password');
var aSubmit = document.getElementById('admin-submit');
var errBox = document.getElementById('err-box');
aName.focus();
/* [1] Gestion de l'évènement
=========================================================*/
function handler(e){
/* (1) Si clavier : si pas touche 'Enter', on ne fais rien */
if( e instanceof KeyboardEvent && e.keyCode != 13 )
return false;
/* (2) On effectue la requête pour voir si tout fonctionne bien */
var request = {
path: 'authentificationDefault/admin',
username: aName.value,
password: aPassword.value
};
api.send(request, function(response){
// Si erreur de module
if( response.ModuleError != 0 ){
errBox.innerHTML = 'Format des champs incorrect.';
aPassword.value = '';
return false;
}
// Si identifiant/mot de passe incorrect
if( !response.status ){
errBox.innerHTML = 'Combinaison incorrecte.';
aPassword.value = '';
return false;
// Si correct, on recharge la page
}else
document.location = '/';
});
}
/* [2] Lancement des 'listeners'
=========================================================*/
aSubmit.addEventListener('click', handler, false);
aForm.addEventListener('keypress', handler, false);
</script>
</body>
</html>