<!DOCTYPE html>
<html id="html">
	<head>
		<meta charset="utf-8" />
        <title>Ambiance</title>
		<link rel="stylesheet" type="text/css" href="style/style.css">
		<script type="text/javascript" src="script/scripts.js"></script>
		<script type="text/javascript" src="script/colorpicker.js"></script>
    	<link rel="stylesheet" type="text/css" href="style/style_colorpicker.css" />
    	<script type="text/javascript" src="script/jsweetalert.js"></script>
		<link rel="stylesheet" type="text/css" href="style/style_sweetalert.css">
    	<?php Include('script/rotation.php'); ?>
    	<script type="text/javascript">
    		function file(fichier){
				if(window.XMLHttpRequest)
					xhr_object = new XMLHttpRequest();
				else if(window.ActiveXObject)
					xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
				else
					return(false);
				xhr_object.open("GET", fichier, false);
				xhr_object.send(null);
				if(xhr_object.readyState == 4)
					return(xhr_object.responseText);
			    else
					return(false);
			}
    	</script>
	</head>

	<body onload="retourne()"><!-- Il faut ajouter l'appelle a la fonction retourne au chargement de la page pour eviter un bug d'appui sur le bouton -->
		<div id="entete">
			<img src="img/accueil.png" class="bouton_entete" onclick="self.location.href='index.php'">
			<img src="img/rotation.png" class="bouton_entete" onclick="retourne()">
			<p id="titre">
				<!-- Titre de la page affichee dans l'entete -->
				Ambiance
			</p>
			<img src="img/aide.png" class="bouton_entete_help" onclick="swal('Aide', 'Vous pouvez choisir la couleur des LEDs d\'ambiance à votre convenance.','info');">
		</div>
		<div id="contenu">
			<!-- Le contenu doit etre écrit ci-dessous -->

			<div id="color-picker" class="cp-perso"></div>
			<script type="text/javascript">

				ColorPicker(
		        	document.getElementById('color-picker'),
		        	function(hex, hsv, rgb) {
		        		console.log(hsv.h, hsv.s, hsv.v);         // [0-359], [0-1], [0-1]
				    	console.log(rgb.r, rgb.g, rgb.b);         // [0-255], [0-255], [0-255]
				    	document.body.style.backgroundColor = hex;        // #HEX
				    	var res = hex.replace("#","");
				    	file("http://127.0.0.1/table/led_trav.php?data="+res);
				    	//put_color_file(rgb.r, rgb.g, rgb.b);
					}
				);
			</script>
		</div>
	</body>
</html>
