SMMP/public_html/test/client/interface.php

435 lines
10 KiB
PHP
Raw Permalink Normal View History

2017-01-30 17:39:21 +00:00
<?php define('__ROOT__', dirname(dirname(dirname(__DIR__))) );
require_once __ROOT__.'/autoloader.php';
2017-01-30 17:39:21 +00:00
$_SESSION['history'] = [];
if( !isset($_COOKIE['mac_password']) || !isset($_COOKIE['mac_count']) || !isset($_COOKIE['token']) ){
2017-01-30 17:39:21 +00:00
$_COOKIE['mac_count'] = 10;
$_COOKIE['mac_password'] = 'macPassword';
// hash password
$_COOKIE['token'] = $_COOKIE['mac_password'];
for( $i = 0 ; $i < $_COOKIE['mac_count'] ; $i++ )
$_COOKIE['token'] = hash('512', $_COOKIE['token']);
2017-01-30 17:39:21 +00:00
setcookie('mac_count', $_COOKIE['mac_count'], time()+3600*24*365, '/');
setcookie('mac_password', $_COOKIE['mac_password'], time()+3600*24*365, '/');
setcookie('token', $_COOKIE['token'], time()+3600*24*365, '/');
2017-01-30 17:39:21 +00:00
header('Refresh: 0');
}
?>
2016-07-18 08:28:18 +00:00
<!DOCTYPE html>
<html>
2017-01-30 17:39:21 +00:00
<head>
<meta charset="utf-8">
<title>Virtual Client</title>
<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 réseau/chargement/liens/URL -->
<script type='text/javascript' src='/js/lib/form-deflater.js' ></script> <!-- Gestion des formulaires (Object) -->
<script type='text/javascript' src='/js/lib/local-storage-interface.js' ></script> <!-- Interface pour le 'localStorage' -->
<script type='text/javascript' src='/test/client/lib.js' ></script> <!-- Dépendance Directe -->
<style type='text/css'>
body{
background: #1c384b;
font-size: 16px;
font-family: 'Roboto';
}
#machine-box{
position: absolute;
top: 40%;
left: 60%;
width: 20em;
height: 35em;
border-radius: 10px;
border: 2px solid #1a1a1a;
box-shadow: 0 0 2em #172e3d;
background: #222;
transform: translateX(-50%) translateY(-50%);
cursor: pointer;
}
#machine-box > #led{
position: absolute;
top: calc( 20% - 1.5em/2 - 2px/2 );
left: calc( 75% - 1.5em/2 - 2px/2 );
width: 1.5em;
height: 1.5em;
border-radius: 50% / 50%;
border: 2px solid #111;
background: #000;
}
#machine-box > #r1,
#machine-box > #r2{
position: absolute;
top: calc( 25% - 3em/2 );
left: 100%;
width: 4em;
height: 3em;
background: #000;
color: #ccc;
text-align: center;
line-height: 3em;
}
#machine-box > #r2{
top: calc( 50% - 3em/2 );
}
2017-01-30 17:39:21 +00:00
#machine-box > #r1.active,
#machine-box > #r2.active{
font-weight: bold;
color: #18eea9;
}
2017-01-30 17:39:21 +00:00
#card-stack{
position: absolute;
top: 50%;
left: 20%;
width: 20em;
height: 35em;
2017-01-30 17:39:21 +00:00
transform: translateX(-50%) translateY(-50%);
}
2017-01-30 17:39:21 +00:00
#card-stack > .card{
display: inline-block;
position: relative;
width: 100%;
height: 4em;
margin-bottom: .2em;
2017-01-30 17:39:21 +00:00
border-radius: 10px 10px 0 0;
box-shadow: 0 2px 10px #111;
2017-01-30 17:39:21 +00:00
background: #eee;
2017-01-30 17:39:21 +00:00
color: #333;
font-weight: bold;
line-height: 4em;
text-align: center;
2017-01-30 17:39:21 +00:00
transition: all .2s ease-in-out;
2017-01-30 17:39:21 +00:00
cursor: pointer;
}
2017-01-30 17:39:21 +00:00
#card-stack > .card:hover{
background: #fff;
color: #000;
}
2017-01-30 17:39:21 +00:00
#card-stack > .card.active{
background: #aaa;
color: #000;
}
2017-01-30 17:39:21 +00:00
#card-stack > input{
display: inline-block;
position: relative;
width: calc( 100% - 1em*2 );
height: calc( 3em - 1em*2 );
padding: 1em;
margin-bottom: 2em;
2017-01-30 17:39:21 +00:00
border-radius: 3px;
border: 0;
2017-01-30 17:39:21 +00:00
background: #eee;
}
2017-01-30 17:39:21 +00:00
#sync-button,
#card-pass{
position: absolute;
top: calc( 50% + 29em );
left: 60%;
padding: 1.5em;
2017-01-30 17:39:21 +00:00
border-radius: 3px;
border: 2px solid #fff;
2017-01-30 17:39:21 +00:00
background: #1ee18e;
2017-01-30 17:39:21 +00:00
color: #fff;
font-weight: bold;
letter-spacing: .15em;
text-transform: uppercase;
2017-01-30 17:39:21 +00:00
transition: all .2s ease-in-out;
2017-01-30 17:39:21 +00:00
transform: translateX(-50%) translateY(-50%);
2017-01-30 17:39:21 +00:00
cursor: pointer;
}
2017-01-30 17:39:21 +00:00
#card-pass{
top: calc( 40% + 29em );
background: #3595ce;
}
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
#sync-button:hover{
background: #1ac47c;
}
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
#card-pass:hover{
background: #2d7dad;
}
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
</style>
2017-01-30 17:39:21 +00:00
</head>
<body>
2017-01-30 17:39:21 +00:00
<div id='machine-box'>
<div id='led'></div>
<div id='r1'>r1</div>
<div id='r2'>r2</div>
</div>
2017-01-30 17:39:21 +00:00
<div id='card-stack'>
<input id='add-card' placeholder='Code RFID' type='text'>
<div class='card'>AB-CD-EF-GH</div>
<div class='card'>10-FE-BD-61</div>
<div class='card'>92-55-B9-B3</div>
</div>
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
<input type='button' id='card-pass' value='Passer la carte'>
<input type='button' id='sync-button' value='Synchronisation'>
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
<script type='text/javascript'>
/* [0] Initialisation et éléments
=========================================================*/
/* (1) Etats du système */
var STATE = [ 0, 0, 0 ];
2017-01-30 17:39:21 +00:00
/* (2) Elements du DOM */
var mBox = document.getElementById('machine-box');
var led = document.getElementById('led');
var r1 = document.getElementById('r1');
var r2 = document.getElementById('r2');
var cBox = document.getElementById('card-stack');
var cAdd = document.getElementById('add-card');
var sync = document.getElementById('sync-button');
var pass = document.getElementById('card-pass');
2017-01-30 17:39:21 +00:00
/* (3) Variables de suivi */
var CARD = null;
var lastCard = null;
var lsi = new localStorageInterface();
lsi.createDataset('STATES.CNF' );
lsi.createDataset('ACTIONS.CNF');
lsi.createDataset('CHIPS.CNF');
lsi.createDataset('PERMISSIONS.CNF');
lsi.createDataset('SERVER.CNF' );
lsi.createDataset('HISTORY.LOG');
lsi.createDataset('STATES.LOG' );
2017-01-30 17:39:21 +00:00
/* (4) Récupération des données de fonctionnement */
var api = new APIClass('/api/');
2017-01-30 17:39:21 +00:00
var ACTIONS, STATES, CHIPS, PERMISSIONS;
var request = {
path: 'machineDefault/init',
id_machine: 126,
token:
};
api.send({path: 'machineDefault/init', id_machine: 126}, function(response){
2017-01-30 17:39:21 +00:00
lsi.import('ACTIONS.CNF', response.actions);
lsi.import('STATES.CNF', response.states);
lsi.import('CHIPS.CNF', response.chips);
lsi.import('PERMISSIONS.CNF', response.permissions);
2017-01-30 17:39:21 +00:00
ACTIONS = lsi.export('ACTIONS.CNF');
STATES = lsi.export('STATES.CNF');
CHIPS = lsi.export('CHIPS.CNF');
PERMISSIONS = lsi.export('PERMISSIONS.CNF');
}, '643405e1004845c2291c244faab192e3ad493b9dec147c8030475794b0f2fa23');
2017-01-30 17:39:21 +00:00
/* (5) On initialise la carte + les puces */
var board = new Board(50);
2017-01-30 17:39:21 +00:00
var CHIP = {
led: new LedInterface( new Chip('serial', [1, 2, 3]), led ),
r1: new RelayInterface( new Chip('serial', [4]), r1 ),
r2: new RelayInterface( new Chip('serial', [5]), r2 )
};
2017-01-30 17:39:21 +00:00
var chipList = Object.keys(CHIP);
2017-01-30 17:39:21 +00:00
// Branchement des puces
for( var i = 0 ; i < chipList.length ; i++ )
board.plug( CHIP[chipList[i]] );
2016-07-17 16:22:04 +00:00
2017-01-30 17:39:21 +00:00
/* [1] Fonctions
=========================================================*/
/* (1) Gestion de mise à jour de la led en fonction de l'état
---------------------------------------------------------*/
function updateChips(){
var STATES = lsi.export('STATES.CNF');
var CHIPS = lsi.export('CHIPS.CNF');
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
/* (1) On vérifie quel état correspond */
for( var s in STATES ){
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
/* (2) Si l'état correspond */
if( previous(STATES[s].global_state, STATE) ){
2017-01-30 17:39:21 +00:00
console.log('STATE', STATE.join(''), 'matches', STATES[s].global_state);
2017-01-30 17:39:21 +00:00
/* (3) On applique l'état à chaque CHIP */
for( var c in CHIPS ){
2016-07-17 16:22:04 +00:00
2017-01-30 17:39:21 +00:00
/* (4) Si la puce a bien cet été de défini */
if( !CHIPS[c].states.hasOwnProperty(STATES[s].chips[c]) )
break;
2016-07-19 08:33:30 +00:00
2017-01-30 17:39:21 +00:00
/* (5) On récupère les PIN + les VALUES */
var pins = CHIPS[c].pins;
var values = CHIPS[c].states[STATES[s].chips[c]];
2016-07-18 22:15:25 +00:00
2017-01-30 17:39:21 +00:00
/* (6) On applique les valeurs */
for( var p in pins )
board.set( parseInt(pins[p]), parseInt(values[p]) );
}
2017-01-30 17:39:21 +00:00
break;
}
2017-01-30 17:39:21 +00:00
}
}
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
/* [2] Gestion de l'ajout de carte
=========================================================*/
cAdd.addEventListener('keyup', function(e){
if( e.keyCode == 13 ) cBox.innerHTML += "<div class='card'>"+e.target.value+"</div>";
}, false);
2017-01-30 17:39:21 +00:00
/* [3] Gestion de la sélection de carte
=========================================================*/
cBox.addEventListener('click', function(e){
if( e.target.className == 'card' ){
CARD = e.target.innerHTML;
2017-01-30 17:39:21 +00:00
var allCards = document.querySelectorAll('#card-stack .card');
for( var i = 0 ; i < allCards.length ; i++ )
allCards[i].remClass('active');
2016-07-18 08:28:18 +00:00
2017-01-30 17:39:21 +00:00
e.target.addClass('active');
}
}, false);
CARD = document.querySelector('#card-stack .card').innerHTML;
document.querySelector('#card-stack .card').addClass('active');
2017-01-30 17:39:21 +00:00
/* [4] Passage de carte
=========================================================*/
var INTERVAL = null;
var COUNT = 0;
2017-01-30 17:39:21 +00:00
/* (0) Routine de comptage de temps
---------------------------------------------------------*/
function countRoutine(){
/* (1) Si le TIMEOUT actuel n'est pas défini, on quitte */
var exists = false;
for( var t in Object.keys(ACTIONS) )
if( t == COUNT ) exists = true;
2017-01-30 17:39:21 +00:00
// Si aucune action pour ce timeout, on quitte
if( !exists ) return;
2017-01-30 17:39:21 +00:00
/* (2) Pour chaque action de ce timeout */
for( var a in Object.keys(ACTIONS[COUNT]) ){
2017-01-30 17:39:21 +00:00
/* (3) On vérifie que l'utilisateur a la permissions d'effectuer l'action */
var hasPermission = PERMISSIONS.hasOwnProperty(CARD) && PERMISSIONS[CARD].actions.indexOf( ACTIONS[COUNT][a].id_action.toString() ) > -1;
2016-07-19 16:59:56 +00:00
2017-01-30 17:39:21 +00:00
// Si on a pas la permission, on quitte
if( !hasPermission ) continue;
2017-01-30 17:39:21 +00:00
/* (4) Si la condition est correcte, On applique la modification de l'état */
if( previous(ACTIONS[COUNT][a].previous, STATE) ){
action(ACTIONS[COUNT][a].action, STATE);
2017-01-30 17:39:21 +00:00
/* (5) On enregistre l'action dans l'historique */
var historyKeys = lsi.keys('HISTORY.LOG').length;
2017-01-30 17:39:21 +00:00
lsi.set('HISTORY.LOG', historyKeys+1, {
id_user: parseInt(PERMISSIONS[CARD].id_user),
id_machine: 1,
id_action: parseInt(ACTIONS[COUNT][a].id_action)
});
2017-01-30 17:39:21 +00:00
break;
}
}
2017-01-30 17:39:21 +00:00
updateChips();
COUNT++;
}
/* (1) Appui carte
---------------------------------------------------------*/
pass.addEventListener('mousedown', function(e){
COUNT = 0;
2017-01-30 17:39:21 +00:00
countRoutine();
INTERVAL = setInterval( countRoutine, 1000 );
2017-01-30 17:39:21 +00:00
}, false);
2017-01-30 17:39:21 +00:00
/* (2) Levé carte
---------------------------------------------------------*/
window.addEventListener('mouseup', function(e){
clearInterval(INTERVAL);
}, false);
2016-07-18 08:28:18 +00:00
2016-07-20 09:47:32 +00:00
2017-01-30 17:39:21 +00:00
/* [5] Synchronisation
=========================================================*/
sync.addEventListener('click', function(e){
2016-07-20 09:47:32 +00:00
2017-01-30 17:39:21 +00:00
}, false);
2016-07-20 09:47:32 +00:00
2017-01-30 17:39:21 +00:00
</script>
</body>
</html>