<div class="suivis form col-lg-12 col-md-12 col-sm-12">
    <?=$this->Form->create($suivi)?>
    <fieldset>
		<h2>
			<i class="icon-plus"></i> Ajouter un suivi
		</h2>
        <?php
        echo $this->Form->hidden('materiel_id', [
            'options' => $materiels,
            'default' => $this->request->getAttribute('params')['pass'][0]
        ]);
        echo $this->Form->control('materiel_numero_laboratoire', [
            'label' => 'N° materiel labo',
            'default' => $materiel['numero_laboratoire'],
            'disabled' => TRUE
        ]);
        
        echo '<div id="listes" style="display:none">';
        echo $this->Form->control('listeunite', [
            'options' => $unite
        ]);
        echo $this->Form->control('listeformule', [
            'options' => $formule
        ]);
        echo '</div>';
        
        echo $this->Form->control('type_suivi_id', [
            'label' => 'Type d\'intervention',
            'options' => $typeSuivis,
            'default' => 3,
        	'empty' => "Choisir le type de suivi"
        ]);
        
        echo '<div id="frequence" style="display:none">';
        echo '</div>';
        
        echo '<div id="dates" style="display:none">';
        echo $this->Form->control('date_controle', [
        		'type' => 'text',
        		'id' => 'date_deb',
        		'label' => 'Date de la prise en charge',
        		'class' => 'datepicker',
        		'placeholder' => 'Cliquez pour sélectionner une date'
        ]);
        echo $this->Form->control('date_prochain_controle', [
        		'type' => 'text',
        		'id' => 'date_fin',
        		'label' => 'Date estimee de fin',
        		'class' => 'datepicker',
        		'placeholder' => 'Cliquez pour sélectionner une date'
        ]);
        
        
        echo '</div>';
        
        echo $this->Form->control('organisme', [
            'label' => 'Prestataire'
        ]);
        echo $this->Form->control('groupes_thematique_id', [
            'label' => $configuration->nom_groupe_thematique,
            'options' => $groupesThematiques,
            'default' => $materiel['groupes_thematique_id']
        ]);
        echo $this->Form->control('groupes_metier_id', [
            'label' => $configuration->nom_groupe_metier,
            'options' => $groupesMetiers,
            'default' => $materiel['groupes_metier_id']
        ]);
        echo $this->Form->control('intitule', [
            'label' => 'Intitulé',
            'required' => 'required'
        ]);
        
        echo '<div id="typedemesure">';
        echo '</div>';
        
        echo '<div id="metro">';
        echo '</div>';
        
        echo $this->Form->control('commentaire', [
            'type' => 'textarea'
        ]);
        echo $this->Form->hidden('nom_createur', [
            'value' => $username
        ]);
        ?>
    </fieldset>
    <?=$this->Form->submit(__('Valider'))?>
    <?=$this->Form->end()?>
</div>

<!--
<div class="actions">
	<php
echo $this->element('menu');
echo $this->element('menu_form', [
    'pluralHumanName' => 'Suivis'
]);
?>
</div>
-->

<script type="text/javascript">

	$(document).ready(function () {
	
	// 	$('#metro').hide();
	var cpt = 0;
		$('#metro').children('.input').each(function(){ 
		$(this).hide();
		cpt ++;
		var props="";
		console.log('Yolo' + cpt + ' - ' + this.textContent + ' - ' + this.hidden);
		for (prop in this){ 
			props+= prop +  " => " +this[prop] + "\n";
		}
		console.log(props);
	});


	console.log("Doc. chargé");
	
	$("#type-suivi-id").bind("change", function (event) {
		var domaineId=$("#type-suivi-id :selected").text();

		if (domaineId== "Vérification métrologique") {
			document.getElementById('typedemesure').innerHTML ="<div class=\"input select required\"><label for=\"typemesure\">Type de mesure</label><select name=\"typemesure\" onchange=\"typedemesure()\" id=\"typemesure\"><option value=\"1\">Direct</option><option value=\"2\">Indirect</option></select></div>";
			$('#listes').show();
			typedemesure();
		} else {
// 			document.getElementById('metro').innerHTML ="";
			document.getElementById('typedemesure').innerHTML = "";
			$('#listes').hide();
		}
		//gère l'affichage dynamique après choix du type de suivi

		if( domaineId == "Panne"){
			document.getElementById('frequence').innerHTML = "";
			$("#frequence").hide();
			$("#dates").show();
			
		} else {
			$("#dates").hide();
			$("#frequence").show();
			document.getElementById('frequence').innerHTML = "<div class=\"input text required\" ><table id=\"tableAlignementFrequence\" ><tbody><tr><td><div class=\"A\"><label for=\"SuiviFrequence\">Fréquence</label><input type=\"text\" name=\"frequence\" id=\"SuiviFrequence\" placeholder=\"\" required=\"required\" maxlength=\"11\"></div></td><td><div class=\"typeFrequence\" ><select name=\"type_frequence\" id=\"type-frequence\"><option value=\"/ Jours\">/ Jours</option><option value=\"/ Semaines\">/ Semaines</option><option value=\"/ Mois\" selected=\"selected\">/ Mois</option><option value=\"/ Ans\">/ Ans</option></select></div></td></tr></tbody></table></div>";
		}
	});



	
	/**
	 * Event calcul date prochain controle
	 */
  	$("#SuiviFrequence").bind("change", function (event) {
  		console.log("SuiviFrequence changed");
  		if($("#date-controle").val() != "" && $("#SuiviFrequence").val() != "") {
  			var url = document.URL;
  			var reg=new RegExp("(suivis).*$","g");
  			var dateUrl = url.replace(reg, "Suivis/getNextDate/");
  			$.ajax({
  				url: dateUrl + $("#date-controle").val() + "/" + $("#SuiviFrequence").val() + "/" + $("#type-frequence").val().substring(2)
  			}).done(function(data) {
  				$("#date-prochain-controle").val(data)
  			});
  		}
  	});
  	
  	$("#type-frequence").bind("change", function (event) {
  		console.log("type-frequence changed");
  		if($("#date-controle").val() != "" && $("#SuiviFrequence").val() != "") {
  			var url = document.URL;
  			var reg=new RegExp("(suivis).*$","g");
  			var dateUrl = url.replace(reg, "Suivis/getNextDate/");
  			$.ajax({
  				url: dateUrl + $("#date-controle").val() + "/" + $("#SuiviFrequence").val() + "/" + $("#type-frequence").val().substring(2)
  			}).done(function(data) {
  				$("#date-prochain-controle").val(data)
  			});
		}
	});
});

function typedemesure(){
	var domaineId=$("#type-suivi-id :selected").text();
	var opts ="";
	$('#listeunite option').each(function(){
		if($(this).val()==10){
			opts += "<option selected=\"selected\" value=\""+$(this).val()+"\">"+$(this).text()+"</option>";
		} else {
			opts += "<option value=\""+$(this).val()+"\">"+$(this).text()+"</option>";
		}
	});

	var listformule = "<option selected=\"selected\"></option>";
	$('#listeformule option').each(function(){
			listformule += "<option value=\""+$(this).val()+"\">"+$(this).text()+"</option>";
	});


	if($('#typemesure option:selected').val() == '1') {
		document.getElementById('metro').innerHTML ="<div class=\"input text required\" ><label for=\"nommesure\">Nom de la mesure</label><input type=\"text\" name=\"nommesure\" maxlength=\"45\" id=\"nommesure\"></div><div class=\"input text required\" ><label for=\"symbole\">Symbole</label><input type=\"text\" name=\"symbole\" maxlength=\"45\" id=\"symbole\"></div>";
		document.getElementById('metro').innerHTML +="<div class=\"input select required\" ><label for=\"unite-id\">Unité</label><select name=\"unite_id\" id=\"unite-id\" >"+opts+"</select></div>";
	} else {
		document.getElementById('metro').innerHTML ="<div class=\"input select required\" ><label for=\"formule_id\">Formule</label><select onchange=\"changeformule()\" name=\"formule_id\" id=\"formule-id\" >"+listformule+"</select></div>";
		document.getElementById('metro').innerHTML +="<div class=\"input text required\" ><label for=\"nommesure\">Nom de la mesure</label><input type=\"text\" readonly name=\"nommesure\" maxlength=\"45\" id=\"nommesure\"></div>";
		document.getElementById('metro').innerHTML +="<div class=\"input text required\" ><label for=\"symbole\">Symbole</label><input type=\"text\" readonly name=\"symbole\" maxlength=\"45\" id=\"symbole\"></div>";
		document.getElementById('metro').innerHTML +="<div class=\"input text required\" ><label for=\"unite\">Unité</label><input type=\"text\" readonly name=\"unite\" id=\"unite\"></div>"
	}
	document.getElementById('metro').innerHTML +="<div class=\"input number required\" ><label for=\"valeurref\">Valeur de référence</label><input type=\"number\" name=\"valeurRef\" step=\"any\" id=\"valeurref\"></div><div class=\"input number\" ><label for=\"plage-debut\">Plage de mesure (debut)</label><input type=\"number\" name=\"plage_debut\" step=\"any\" id=\"plage-debut\"></div><div class=\"input number\" ><label for=\"plage-fin\">Plage de mesure (fin)</label><input type=\"number\" name=\"plage_fin\" step=\"any\" id=\"plage-fin\"></div>";
	document.getElementById('metro').innerHTML +="<div class=\"input number required\" ><label for=\"resolution\">Resolution</label><input type=\"number\" name=\"resolution\" step=\"any\" id=\"resolution\"></div><div class=\"input number required\"  ><label for=\"tolerance\">Tolerance</label><input type=\"number\" name=\"tolerance\" step=\"any\" id=\"tolerance\"></div><div class=\"input number\" ><label for=\"sensibilite\">Sensibilité</label><input type=\"number\" name=\"sensibilite\" step=\"any\" id=\"sensibilite\"></div>";
	document.getElementById('metro').innerHTML +="<div class=\"input number \" ><label for=\"justesse\">Justesse</label><input type=\"number\" name=\"justesse\" step=\"any\" id=\"justesse\"></div><div class=\"input number \" ><label for=\"fidelite\">Fidelite</label><input type=\"number\" name=\"fidelite\" step=\"any\" id=\"fidelite\"></div><div class=\"input number required\" ><label for=\"emtstandart\">EMT standart</label><input type=\"number\" name=\"emtstandart\" step=\"any\" id=\"emtstandart\"></div>";
}

function changeformule(){
	var listeformules = $('#listeformules');
	var formule_id=document.getElementById('formule-id').options[document.getElementById('formule-id').selectedIndex].value;
	var re=new RegExp('.*\"id\": '+formule_id+',.*');
	var formule;
	var formule_array;
	$('#listeformules option').each(function() {
		if(re.test($(this).text())){
			formule =$(this).text();
			formule= formule.substring(2,formule.length-2);
			var reg=new RegExp('[ ,:]+');
			formule_array = formule.split(reg);
			var regE=new RegExp('[ "]+');
			for (var i=0; i< formule_array.length;i++){
				if(regE.test(formule_array[i])){
					formule_array[i]= formule_array[i].substring(1,formule_array[i].length-1);
				}
			}
		}
	});
	document.getElementById("nommesure").value=formule_array[4];
	document.getElementById("symbole").value=formule_array[8];
	document.getElementById("unite").value=formule_array[10];
	var var_array = new Array(<?php $variables?>);
	alert(var_array);
}

</script>