Site de pause

<?php 
/*
	étapes du code:
	*** Affichage sans ajax ***
	- verifiaction de l'existence du fichier xml (sinon creation)
	- generer le html a partir du fichier xml voir genererHTML.php
		- lecture par domdocument du fichier xml vers un tableau php nommé $bdd
		- affichage du html contenue dans la variable $htmlGenerate
		
	*** Affichage avec ajax (mise a jour en temps reel) ***
	- boucle javascript qui executer le fichier genererHTML.php avec une variable post nommé mise_a_jour qui permet de prendre en compte la derniere partie de ce fichier php.
	- géneration de $bdd en json avec ajout de la varible timer pour gerer le temps ecouler en cour d'excution qui sera ajouter au total grace au bouton stop. si le timestap de stop - start est négatif on affiche le temps en cour.
	- recuperation dans la boucle javascript les données json. chaque ligne du tableau json corespond a un numero user (data.id). jquery reperera id 1 donc user1
	
	*** bouton start ***
	- par l'action du clic sur le bouton start on recupere la balise parente qui est envoyer au fichier index.php avec la variable post nommé identifiant. celle ci permet de prendre en compte seulement une partie du fichier index.php et de transmetre l'atribut id
	- on change user1 en 1
	- cette partie modifier le fichier xml voir les commentaires dans cette partie
	
	*** bouton stop ***
	- par l'action du clic sur le bouton qtop on recupere la balise parente qui est envoyer au fichier index.php avec la variable post nommé identifiant2. celle ci permet de prendre en compte seulement une partie du fichier index.php et de transmetre l'atribut id
	- on change user1 en 1
	- cette partie modifier le fichier xml voir les commentaires dans cette partie
	
*/

// on s'assure que l'existance du fichier xml
if (! file_exists('bdd.xml') ){

	$fp = fopen('bdd.xml', 'w');

		fwrite($fp, '<?xml version="1.0"?>
		<root>
			<param>
				<lastid>3</lastid>
			</param>
			<users>
				<user>
					<id>1</id>
					<name>Alice</name>
					<out>0</out>
					<outs>0</outs>
					<timestart>0</timestart>
					<timestop>0</timestop>
					<time>0</time>
				</user>
				<user>
					<id>2</id>
					<name>Bob</name>
					<out>0</out>
					<outs>0</outs>
					<timestart>0</timestart>
					<timestop>0</timestop>
					<time>0</time>
				</user>
				<user>
					<id>3</id>
					<name>Carole</name>
					<out>0</out>
					<outs>0</outs>
					<timestart>0</timestart>
					<timestop>0</timestop>
					<time>0</time>
				</user>
			</users>
		</root>');

	fclose($fp);

}
// le fichier xml est creer on peux continuer

// si on appuie sur le bouton start on stransmet la varible identifiant
// au fichier php index (celui que tu lis ces lignes en ce moment )
// pour mettre a jour le timestamp du start
if( isset( $_POST['identifiant']) ){
	
	$postID = str_replace( 'user', '',  $_POST['identifiant'] );
	
	$doc = new DOMDocument;
	$doc->load('bdd.xml');
	
	foreach ($doc->getElementsByTagName('user') as $node) {
		$idNode = $node->getElementsByTagName('id')[0]->nodeValue;
		echo 'test '.$idNode.' == '.$postID ;
		if( $idNode == $postID ){
			
			// modifier la valeur de la pause en cour a 1 pour dire que la pause est en train de s'effectuer actuellement
			$doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('out')[0]->nodeValue = 1;
			
			// met le temps actuel dans la valeur de temps de depart
			$doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('timestart')[0]->nodeValue = time();
			// enregistre les modifications dans le fichier xml
			$fp = fopen('bdd.xml', 'w');
			fwrite($fp, $doc->saveXML() );
			fclose($fp);
		}
	}
	exit(0);
}

// si on appuie sur le bouton start on transmet la varible identifiant2
// au fichier php index (celui que où lis ces lignes en ce moment )
// pour mettre a jour le timestamp du stop
if( isset( $_POST['identifiant2']) ){
	$postID = str_replace( 'user', '',  $_POST['identifiant2'] );
	
	$doc = new DOMDocument;
	$doc->load('bdd.xml');
	foreach ($doc->getElementsByTagName('user') as $key => $node) {
		$idNode = $node->getElementsByTagName('id')[0]->nodeValue;
		if( $idNode == $postID ){
			
			// met le temps actuel dans timestop du fichier xml
			$doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('timestop')[0]->nodeValue = time();
			
			// met a zero out pour dire qu'il n'y a pas de pause en ce moment
			$doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('out')[0]->nodeValue = 0;
			
			// temps total accumulé corespond a time = (stop-start)+time
			$doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('time')[0]->nodeValue = ($doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('timestop')[0]->nodeValue - $doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('timestart')[0]->nodeValue)+$doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('time')[0]->nodeValue;
			
			// tout les pauses deja faite sont ajouté au pause deja faite + 1
			//outs = outs +1
			$doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('outs')[0]->nodeValue = ($doc->getElementsByTagName('user')->item(($idNode-1))->getElementsByTagName('outs')[0]->nodeValue+1);
			// enregistre les modifications dans le fichier xml
			$fp = fopen('bdd.xml', 'w');
			fwrite($fp, $doc->saveXML() );
			fclose($fp);
		}
	}
	exit(0);
}


// on genere le html (variable $htmlGenerate)
require "genererHTML.php";



?><!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>samsa74</title>
	<style>
	.user div{
		display: inline-block;
		width: 150px;
		height: 50px;
		font-size: 20px;
	}
	button.stop{
		display:none;
	}
	.entete div{
		vertical-align:top;
	}
	
	</style>
	<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script>
	window.timeUpdate = new Array(200);
  $( function() {
	$( "body" ).on( "click", ".start", function() {
		$(this).parent().find('.stop').css('display','inline');
		$(this).parent().find('.start').css('display','none');
		$(this).parent().css('color', 'red');
		var id = $(this).parent().attr('id') ;
		console.log(id+'\n');
		    $.ajax({
                url: 'index.php',
                type: 'post',
                data : { identifiant: id},
				dataType: "html",
                success:function(html){
					console.log('retour '+html+'\n');
				}
            });
		
	});
	
	$( "body" ).on( "click", ".stop", function() {
		
		$(this).parent().find('.start').css('display','inline');
		$(this).parent().find('.stop').css('display','none');
		$(this).parent().css('color', 'black');
		var id = $(this).parent().attr('id') ;
		console.log(id);
		    $.ajax({
                url: 'index.php',
                type: 'post',
                data : { identifiant2: id},
                success:function(html){
					

				}
            });
		
	});
	
	setInterval( function(){
		$.ajax({
                url: 'genererHTML.php',
                type: 'post',
				dataType: "json",
				data : { mise_a_jour: 1},
                success:function(data){
					
					data.forEach(function(element) {
						
						$('#user'+element.id +" .time").text(element.time+'s');
						$('#user'+element.id +" .name").text(element.name);
						$('#user'+element.id +" .out").text(element.out);
						$('#user'+element.id +" .outs").text(element.outs);
						$('#user'+element.id +" .timer").text(element.timer+'s');
					});
				}
        });
		
		
	}, 500);
	
	
  });

  </script>
</head>
<body>
<?= $htmlGenerate ?>
</body>
</html>

<?php





// init data xml

$doc = new DOMDocument;

$doc->load('bdd.xml');

$bdd = [];

$idArray = 0;

foreach ($doc->getElementsByTagName('user') as $node) {



	$bdd[$idArray]['id'] = $node->getElementsByTagName('id')[0]->nodeValue;

	$bdd[$idArray]['name'] = $node->getElementsByTagName('name')[0]->nodeValue;

	$bdd[$idArray]['out'] = $node->getElementsByTagName('out')[0]->nodeValue;
	
	$bdd[$idArray]['outs'] = $node->getElementsByTagName('outs')[0]->nodeValue;

	$bdd[$idArray]['timestart'] = $node->getElementsByTagName('timestart')[0]->nodeValue;

	$bdd[$idArray]['timestop'] = $node->getElementsByTagName('timestop')[0]->nodeValue;
	
	$bdd[$idArray]['time'] = $node->getElementsByTagName('time')[0]->nodeValue;

	

$idArray++;

}



$htmlGenerate = "";

foreach( $bdd as  $key =>$user){

	$key1 = $key+1;

	$div = "<div id=\"user$key1\" class=\"user\">\n";

	foreach( $user as $key => $value){

		if( $key != 'timestart' and  $key != 'timestop' and  $key != 'id'){

			$div .= "<div class=\"$key\">$value</div>\n";

		}else{

			if( $key == 'timestart'){

				$timeStart = $value;

			}elseif( $key == 'timestop'){

				$timeStop = $value;

				$time = $timeStop - $timeStart;

				$div .= "<div class=\"timer\">$time</div>\n";

			}

		}

	}

	$div = $div.'<button class="start">Start</button><button class="stop">Stop</button></div>';

	$entete = '
	<div class="user entete">
		<div>Nom</div>
		<div>En pause</div>
		<div>Nombre de pause effectuées</div>
		<div>Temps en cour</div>
		<div>Temps total</div>
	</div>
	';
	
	
	$htmlGenerate  .= $div ;

}
$htmlGenerate  = $entete . $htmlGenerate ;


if( isset($_POST['mise_a_jour'])   or false){

	$bddForJson = [] ;
	$loop = 0;
	foreach( $bdd as  $key =>$user){
		foreach( $user as $key => $value){
			if( $key == 'timestart'){

					$timeStart = $value;

			}elseif( $key == 'id'){
				$user['id'] = $loop+1;
			}elseif( $key == 'timestop'){
					$timeStop = $value;
					$time = $timeStop - $timeStart;
					if( $time < 0 ){
						$time = time() - $timeStart;
					}
					$user['timer'] = $time;
			}
		}
		$bddForJson[$loop] = $user;
		$loop++;
	}

	echo json_encode($bddForJson) ;
	exit(0);
}



?>