2016-07-08 13:18:23 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<title>Connexion au Parc</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 -->
|
2017-01-08 15:30:40 +00:00
|
|
|
<link type='text/css' rel='stylesheet' href='/css/min/fonts.css' /> <!-- Chargement des fonts -->
|
|
|
|
|
<link type='text/css' rel='stylesheet' href='/css/min/reset.css' /> <!-- Reset du css natif des browsers -->
|
2016-07-08 13:18:23 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Dépendences Javascript -->
|
2016-10-18 14:03:03 +00:00
|
|
|
<script type='text/javascript' src='/js/lib/min/input-checker.js' ></script> <!-- Gestion dynamique des saisies -->
|
|
|
|
|
<script type='text/javascript' src='/js/lib/min/reset.js' ></script> <!-- Corrections Javascript natif (ajouts) -->
|
|
|
|
|
<script type='text/javascript' src='/js/lib/min/api.js' ></script> <!-- Gestion des transactions avec le serveur -->
|
|
|
|
|
<script type='text/javascript' src='/js/lib/min/page-manager.js' ></script> <!-- Gestion des transactions avec le serveur -->
|
2016-07-08 13:18:23 +00:00
|
|
|
|
|
|
|
|
</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: #1E3C50;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#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;
|
|
|
|
|
|
|
|
|
|
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>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- CORPS DE LA PAGE -->
|
|
|
|
|
<div id='FORM'>
|
2016-07-09 10:44:06 +00:00
|
|
|
<span></span>
|
2016-07-08 13:18:23 +00:00
|
|
|
<span>Connexion au Parc</span>
|
|
|
|
|
<input type='text' placeholder='Identifiant' id='warehouse-name'>
|
|
|
|
|
<input type='password' placeholder="Code d'accès" id='warehouse-password'>
|
|
|
|
|
|
|
|
|
|
<input type='button' value='CONNEXION' id='warehouse-submit'>
|
|
|
|
|
<span id='err-box'></span>
|
2016-07-09 10:44:06 +00:00
|
|
|
<span></span>
|
2016-07-08 13:18:23 +00:00
|
|
|
</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 wForm = document.getElementById('FORM');
|
|
|
|
|
var wName = document.getElementById('warehouse-name');
|
|
|
|
|
var wPassword = document.getElementById('warehouse-password');
|
|
|
|
|
var wSubmit = document.getElementById('warehouse-submit');
|
|
|
|
|
var errBox = document.getElementById('err-box');
|
|
|
|
|
|
2016-07-08 14:03:32 +00:00
|
|
|
wName.focus();
|
2016-07-08 13:18:23 +00:00
|
|
|
|
|
|
|
|
/* [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/warehouse',
|
|
|
|
|
name: wName.value,
|
|
|
|
|
password: wPassword.value
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
api.send(request, function(response){
|
|
|
|
|
|
2017-01-30 17:39:21 +00:00
|
|
|
console.warn(response);
|
2016-07-08 13:18:23 +00:00
|
|
|
// Si erreur de module
|
2017-01-30 17:39:21 +00:00
|
|
|
if( response.error != 0 ){
|
2016-07-09 10:44:06 +00:00
|
|
|
errBox.innerHTML = 'Format des champs incorrect.';
|
2016-07-08 13:18:23 +00:00
|
|
|
wPassword.value = '';
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Si identifiant/mot de passe incorrect
|
|
|
|
|
if( !response.status ){
|
|
|
|
|
errBox.innerHTML = 'Combinaison incorrecte.';
|
|
|
|
|
wPassword.value = '';
|
|
|
|
|
return false;
|
|
|
|
|
|
|
|
|
|
// Si correct, on recharge la page
|
|
|
|
|
}else
|
|
|
|
|
document.location = '';
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* [2] Lancement des 'listeners'
|
|
|
|
|
=========================================================*/
|
|
|
|
|
wSubmit.addEventListener('click', handler, false);
|
|
|
|
|
wForm.addEventListener('keypress', handler, false);
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
