//Plugin jquery qui efface un champ de saisi au focus
//ou remet la valeur par defaut s'il est laissé vide
$.fn.clearOnClick = function() {
	return this.focus(function() {
		if( this.value == this.defaultValue ) {
			this.value = "";
		}
	}).blur(function() {
		if( !this.value.length ) {
			this.value = this.defaultValue;
		}
	});
};

var BASE_URL = '';

function soumissionFormulaire(){

	var numeroEtape = $('#form-dialog > input[name="etape-courante"]').val();
	var fonctionPC = $('#form-dialog > input[name="mode"]').val();

	var selecteurDivEtape = '#etape-'+numeroEtape;
	var ville = $('#form-dialog > input[name="ville-form-dialog"]').val();

	$(selecteurDivEtape+'>.div-'+fonctionPC+'>table>tbody>tr>td>.span-ville').text(ville);

	var idRadioSelectionnee = $("input[type='radio']:checked").attr('id');
	var labelPCSelectionnee = $("label[for='"+idRadioSelectionnee+"']").text();
	var idPCSelectionnee = $("#"+idRadioSelectionnee).val();

	if(idPCSelectionnee != null){
		
	// + vérifier que la ville existe (voire même que la ville est bien celle du point de collecte sélectionné)


	$(selecteurDivEtape+'>.div-'+fonctionPC+'>table>tbody>tr>td>.span-nom').text(labelPCSelectionnee);

	$(selecteurDivEtape+">.div-"+fonctionPC+" > input[name='"+fonctionPC+"-"+numeroEtape+"']").val(idPCSelectionnee);

	if( ! $(selecteurDivEtape+'>.div-retrait').is(':visible') ){

		if( fonctionPC == 'depot'){

			$(selecteurDivEtape+'>.div-choix-depot').hide();
			$(selecteurDivEtape+'>.div-depot').show();
			$(selecteurDivEtape+'>.div-choix-retrait').show();

		}else if( fonctionPC == 'retrait'){

			$(selecteurDivEtape+'>.div-choix-retrait').hide();
			$(selecteurDivEtape+'>.div-retrait').show();
			$('#derniereLigne').show();
		}
	}

	
		$('#dialog').dialog('close');
	}

	//Bloque la soumission du formulaire
	return false;
}

function afficheDialogPourLien(){

	//Recuperation de l'identifiant et decoupe
	var elements = $(this).attr('name').split('-');
	var fonctionPC = elements[1];
	var numeroEtape = elements[2];
	var titre = "Lieu où je ";
	var zoneville ="Ville ";

	if( fonctionPC == 'depot' ){

		titre += "dépose mes bagages pour l'étape n°";
		zoneville += "de départ";

	}else if( fonctionPC == 'retrait' ){

		titre += "retrouve mes bagages pour l'étape n°";
		zoneville += "de retrait";
	}

	titre += numeroEtape;

	$('#dialog').dialog('option','title',titre);
	$('#form-dialog > input[name="ville-form-dialog"]').val(zoneville);

	//Parametrage du formulaire de dialogue (pour rendre générique la fonction appelé au submit)
	$('#form-dialog > input[name="etape-courante"]').val(numeroEtape);
	$('#form-dialog > input[name="mode"]').val(fonctionPC);

	//Désactivation du bouton de validation du formulaire de dialogue
	$('#form-dialog > input[type="submit"]').button("option", "disabled", true);

	$(".ville").clearOnClick();

	$("input.ville").autocomplete({

		minLength: 0,
		delay:0, // était à 500 ai mis à 0 pour que search se lance plus vite et éviter la possibilité de valider un formulaire faux
		source:BASE_URL+'/ville/autocomplete',

		search: function(event, ui) {

			$('div.liste-form-dialog').empty();
		},

		//Fonction appelée à la selection d'une ville dans le menu d'auto-completion
		select: function(event, ui) {

			//Remplissage du champ input (comportement par defaut quand
			//on ne precise pas sa propre fonction pour l'evenement select
			$(this).val(ui.item.label);

			//Recupération de la liste des points de collecte pour la ville selectionnée
			$.getJSON(BASE_URL+'/Pointcollecte/listeparvilleajax/ville/'+ui.item.label,

				//fonction appelé après la récupération de la liste des points de collecte
				function(datas) {

					//Création de la liste des points de collecte
					if( datas.length > 0 ){

						//var pc = datas[0];
						//var id = pc.id;

						//var list = '<br/><input type="radio" checked="checked" name="pc" id="pc-'+id+'" value="'+id+'"/><label for="pc-'+id+'">'+pc.nom+'</label>';
						var list = '',pc,id;

						for (var i = 0; i < datas.length; i++) {

							pc = datas[i];
							id = pc.id;

							list += '<hr /><input type="radio" name="pc" id="pc-'+id+'" value="'+id+'"';

							if (i == 0) {
								list += 'checked="checked" ';
							}

							list += '/>'+ '<label for="pc-'+id+'"><strong>'+pc.nom+'</strong></label><div id="details-'+id+'" class="details"';

							if( i != 0 ){
								list += 'style="display:none" ';
							}

							list += ' >';

							if (pc.adresse1 != null) {
								list += ''+pc.adresse1;
							}

							if (pc.cp != null || pc.ville != null) {
								list += '<br/>'+pc.cp+' '+pc.ville;
							}


							if (pc.telephone !=null) {
								list += '<br/><strong class="prix">'+pc.telephone+'</strong>';
							}

							if (pc.email != null) {
								list += '<br/><a href="mailto:'+pc.email+'" style="color:#0066FF;">E-mail</a>';
							}


							if (pc.siteinternet != null) {
								list += '<br/><a href="'+pc.siteinternet+'" style="color:#0066FF;" target="_blank">Site Internet</a>';
							}

							list += '</div>';
						}

						$('#form-dialog > .liste-form-dialog').html(list);

						$('input[name="pc"]').change(
							function(){								

								$('.details').hide();
								$('#details-'+$(this).attr('id').substr(3,$(this).attr('id').length-3)).show();
							});

						$('#form-dialog > input[type="submit"]').button("option", "disabled", false);
					}
				}
				);
		}
	});

	$('#dialog').dialog('open');

	return false;
}

function supprimerDerniereEtape(){

	var numeroDerniereEtape = parseInt($("#numeroEtape").val(),10);

	if( numeroDerniereEtape > 1 ){

		$('#etape-'+numeroDerniereEtape).remove();
		$("#numeroEtape").val(numeroDerniereEtape-1);
		$('#derniereLigne').show();
	}

	if( numeroDerniereEtape > 2 ){

		$('#etape-'+(numeroDerniereEtape-1)+'>table:first>tbody>tr>td>button.suppr-etape').show();
	}
}

function ajoutNouvelleLigne(){

	var numeroEtape = parseInt($("#numeroEtape").val(),10)+1;

	var villePointRetraitPrecedente =
	$('#etape-'+(numeroEtape-1)+'>div.div-retrait>table>tbody>tr>td>span.span-ville').text();
	var nomPointRetraitPrecedent =
	$('#etape-'+(numeroEtape-1)+'>div.div-retrait>table>tbody>tr>td>span.span-nom').text();
	var idPointRetraitPrecedent =
	$('#etape-'+(numeroEtape-1)+'>div.div-retrait>input[name="retrait-'+(numeroEtape-1)+'"]').val();

	$('button.suppr-etape').hide();

	$("#derniereLigne").before(
		'<div id="etape-'+numeroEtape+'" style="display:none"><br/><br/>'+
		'<span class="span-numero" style="display:none">'+numeroEtape+'</span>'+
		'<table width="100%"><tr><td><strong>&Eacute;tape '+numeroEtape+'</strong>&nbsp;'+
		'<input type="text" size="10" name="date-'+numeroEtape+'" maxlength="10" value="" class="date"/> &nbsp;</td><td align="right"><button name="suppr-'+numeroEtape+'" class="suppr-etape" type="button" title="Supprimer cette &eacute;tape">&nbsp;</button></td></tr></table>'+
		'<hr />'+
		'<div class="div-depot">'+
		'<table width="100%"><tr><td><img src="'+BASE_URL+'/images/i-bag-depot.png" alt="point de dépot des bagages" title="Lieu o&ugrave; je d&eacute;pose mes bagages" /> <span class="span-ville" >'+villePointRetraitPrecedente+'</span> - <span class="span-nom">'+nomPointRetraitPrecedent+'</span> &nbsp;</td>'+
		'<td align="right"><button name="point-depot-'+numeroEtape+'" class="lien-pc" type="button" title="Modifier">&nbsp;</button></td></tr></table>'+
		'<input type="hidden" name="depot-'+numeroEtape+'" value="'+idPointRetraitPrecedent+'"/><hr />'+
		'</div>'+
		'<div class="div-choix-retrait">'+
		'<img src="'+BASE_URL+'/images/i-bag-depot.png" alt="point de retrait"/> <button name="point-retrait-'+numeroEtape+'" class="lien-pc" type="button">Choisir le lieu où retrouver mes bagages</button>'+
		'</div>'+
		'<div class="div-retrait" style="display:none">'+
		'<table width="100%"><tr><td><img src="'+BASE_URL+'/images/i-bag-retrait.png" alt="point de retrait des bagages" title="Lieu o&ugrave; je retrouve mes babages" /> <span class="span-ville"></span> - <span class="span-nom"></span> &nbsp;</td>'+
		'<td align="right"><button name="point-retrait-'+numeroEtape+'" class="lien-pc" type="button" title="Modifier">&nbsp;</button></td></tr></table>'+
		'<input type="hidden" name="retrait-'+numeroEtape+'" /><hr />'+
		'</div>'+
		'</div>');

	$('#etape-'+numeroEtape+'>table:first>tbody>tr>td>button.suppr-etape')
		.button({icons:{primary:'ui-icon-trash'},text:false})
		.click(supprimerDerniereEtape);

	$("#numeroEtape").val(numeroEtape);

	//Récupération de la date de l'étape précédente
	var date = $('input[name="date-'+(numeroEtape-1)+'"]').datepicker('getDate');

	//Si la date de l'étape précédente n'a pas encore été selectionnée
	if( date == null ){

		date = new Date();
		date.setDate(date.getDate()+numeroEtape);

	}else {
		date.setDate(date.getDate()+1);
	}

	$('#etape-'+numeroEtape+'>table>tbody>tr>td>input.date').datepicker({
		dateFormat: 'dd/mm/yy',
		buttonImage: '/images/calendrier.png',
		constrainInput: true,
		autoSize: true,
		defaultDate: date,
		minDate: +numeroEtape,
		showButtonPanel: true
	});


	$('#etape-'+numeroEtape+'>table>tbody>tr>td>input.date').datepicker('setDate',date);

	$('#etape-'+numeroEtape+'>div>.lien-pc').click(afficheDialogPourLien);
	$('#etape-'+numeroEtape+'>div>table>tbody>tr>td>.lien-pc').click(afficheDialogPourLien);

	$('#etape-'+numeroEtape+'>div>.lien-pc').button();
	$('#etape-'+numeroEtape+'>div>table>tbody>tr>td>.lien-pc').button();

	$('#etape-'+numeroEtape+' > div.div-depot > table>tbody>tr>td > button.lien-pc' ).button( "option", "icons", {
		primary:'ui-icon-pencil'
	} );
	$('#etape-'+numeroEtape+' > div.div-depot > table>tbody>tr>td > button.lien-pc' ).button( "option", "text", false );

	$('#etape-'+numeroEtape+' > div.div-retrait > table>tbody>tr>td > button.lien-pc').button( "option", "icons", {
		primary:'ui-icon-pencil'
	} );
	$('#etape-'+numeroEtape+' > div.div-retrait > table>tbody>tr>td > button.lien-pc' ).button( "option", "text", false );

	$('#etape-'+numeroEtape).show();

	$('#derniereLigne').hide();
}

$(document).ready( function(){

	$("button, input:submit").button();
	
	//effacer le sejour en session
	$('#reset').click(function(){
			window.location.replace('/reservation/nouveausejour');
		});
	
	var numeroEtape = parseInt($("#numeroEtape").val(),10);

	if( numeroEtape > 1 ){

		$('button.suppr-etape')
			.button('option','icons',{primary:'ui-icon-trash'})
			.button('option','text',false)
			.click(supprimerDerniereEtape);
	}

	$('#etape-1>input.date').datepicker({
			dateFormat: 'dd/mm/yy',
			buttonImage: '/images/calendrier.png',
			constrainInput: true,
			autoSize: true,
			defaultDate: +1,
			minDate: +1,
			showButtonPanel: true
		});

	for(var i=2 ; i <= numeroEtape ; i++ ){

		$('#etape-'+i+'>table>tbody>tr>td>input.date').datepicker({
			dateFormat: 'dd/mm/yy',
			buttonImage: '/images/calendrier.png',
			constrainInput: true,
			autoSize: true,
			defaultDate: +i,
			minDate: +i,
			showButtonPanel: true
		});
	}

	if( $("input.date").val() == '' ){

		var date = new Date();
		date.setDate(date.getDate()+1);
		
		$("input.date").val($.datepicker.formatDate('dd/mm/yy',date));
	}

	$('#dialog').dialog({
		autoOpen: false,
		modal:true,
		close: function(event, ui) {
			$('#form-dialog > div.liste-form-dialog').empty();
			$('#form-dialog > input[name="ville-form-dialog"]').val('');
		}
	});

	$('#dialog > table > tbody > tr > td.gmaps-dialog').html('<p><strong>Canal de Bourgogne :</strong> Villes desservies par Bag Transfert<br /></p><iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps/ms?hl=fr&amp;ie=UTF8&amp;t=p&amp;source=embed&amp;msa=0&amp;msid=101764952126423576469.0004871835f08d64b8e82&amp;ll=47.494937,4.284668&amp;spn=1.299025,2.334595&amp;z=8&amp;output=embed"></iframe><br /><small>Afficher <a href="http://maps.google.com/maps/ms?hl=fr&amp;ie=UTF8&amp;t=p&amp;source=embed&amp;msa=0&amp;msid=101764952126423576469.0004871835f08d64b8e82&amp;ll=47.494937,4.284668&amp;spn=1.299025,2.334595&amp;z=8" style="color:#0000FF;text-align:left">Bag Transfert</a> sur une carte plus grande</small>')

	$("#ajoutEtape").click(function(){

		ajoutNouvelleLigne();
		return false;
	});

	$('.lien-pc').click(afficheDialogPourLien);

	$('#form-dialog').submit(soumissionFormulaire);

	//$('#form-dialog')[0].addEventListener('submit',function(){alert('hello2');return false;},true);

	
	$( "div.div-depot > table>tbody>tr>td > button.lien-pc" ).button( "option", "icons", {
		primary:'ui-icon-pencil'
	} );
	$( "div.div-depot > table>tbody>tr>td > button.lien-pc" ).button( "option", "text", false );

	$( "div.div-retrait > table>tbody>tr>td > button.lien-pc" ).button( "option", "icons", {
		primary:'ui-icon-pencil'
	} );
	$( "div.div-retrait > table>tbody>tr>td > button.lien-pc" ).button( "option", "text", false );

	$('#form-dialog > input[type="submit"]').button("option", "disabled", false);

	
} );