

/**
 * Fonction anonyme de déclaration du template du block liste des vols ( Resultats )
 * Certaines fonctions ne sont visible que par les classes
 * concernées (déclarées ici).<br>
 * Ce mécanisme de fonction anonyme permet de reproduire un
 * système d'encapsulation digne d'un langage de programmation
 * évolué (comme le Java).<br>
 * <br>
 * Classes et éléments visibles seront stockés dans le
 * namespace 'ev.tpl'.
 */
(function() {
	var window = this,
			ev = window.ev,
			document = window.document;

	if (!ev) { throw 'mev.searchHistoryManager#<init>: Needs ev.core module!'; }
	if (!ev.tpl) {ev.tpl = {};}
	if (!ev.lang) {throw new Error("Le namespace 'ev.lang' doit exister");}
	if (!ev.lang.mapper) {throw new Error("L'objet 'ev.lang.mapper' doit exister");}

	var domElement = ev.dom && ev.dom.element,
			// Raccourci vers le mapper de traductions.
			elm = ev.lang.mapper,
			// Raccourci vers les traductions de la page de résultats.
			results = ev.lang.mev && ev.lang.mev.results || ev.lang.meh3 && ev.lang.meh3.results || {},
			// Tableau global contenant les proposition de lieux.
			lieux = [],
			// Nom des images utilisées pour les MARKER de la GOOGLEMAP
			departMarkerImg = 'http://img.easyvoyage.com/atom/formulaires/propositions/gMapMarkerA.png',
			ArriveeMarkerImg = 'http://img.easyvoyage.com/atom/formulaires/propositions/gMapMarkerB.png',
			// Id des champs du formualaire utilisé  dans le template proposition.
			TIPE_DEPART = 'depart',
			TIPE_ARRIVEE = 'arrivee',
			DEPART_INPUT_ID = 'lieuMEVDepartAller',
			ARRIVEE_INPUT_ID = 'lieuMEVArriveeAller',
			HIDDEN_DEPART_INPUT_ID = 'dataMEVDepartAller',
			HIDDEN_ARRIVEE_INPUT_ID = 'dataMEVArriveeAller',
			FIRST_ELEMENT = 0,
			RADIO_BT_ID_PREFIX = 'BT',
			// Liberlle de la page
			titlePropositionDepart = elm.ifdef(results.titlePropositionDepart),
			titlePropositionArrivee = elm.ifdef(results.titlePropositionArrivee),
			LblCLOSE_BT = elm.ifdef(results.lblCLOSE_BT),
			labelContent = '[¤$p,type¤] - ',
			// Instance de l'overlay crée pour l'affichage des propistions..
			overthelay,
			// Tableau de correspondance afin de simplifier le template
			titlePropositionArray = [];

	titlePropositionArray[TIPE_DEPART] = titlePropositionDepart;
	titlePropositionArray[TIPE_ARRIVEE] = titlePropositionArrivee;

	//Définition du 'domaine' ev.tpl.templatePropositions.
	ev.tpl.templatePropositions = [];

	/**
		 * Affiche l'image de status de la requête.
		 * @param {Object} _fieldNode
		 */
	ev.tpl.templatePropositions.displayStatusRequestImg = function(_fieldNode) {
		var imgNode = document.createElement('img');
		imgNode.setAttribute('id', _fieldNode.id + 'imgS');
		imgNode.setAttribute('src', 'http://img.easyvoyage.com/atom/formulaires/propositions/timing.gif');

		/** Affichage de l'image de status de la requête.**/
		ev.dom.insertAfter(imgNode, _fieldNode);
	};

	/**
		 * Supprime l'image du status de la requête.
		 * @param {Object} _fieldNode
		 */
	ev.tpl.templatePropositions.closeStatusRequestImg = function(_fieldNode) {
		var n = domElement(_fieldNode.id + 'imgS');
		if (n) {
			var pn = n.parentNode;
			pn.removeChild(n);
		}
	};

	/**
		 * Ferme le message d'erreur pour le champ donne.
		 * @param {Object} _fieldNode node du champs texte.
		 */
	ev.tpl.templatePropositions.closeErrorMSG = function(_fieldNode) {
		/** Set la classe du champs texte à ERROR.*/
		_fieldNode.className = '';
		/** Suppression de la node du message d'erreur.*/
		var n = domElement(_fieldNode.id + 'PropError');
		if (n) {
			var np = n.parentNode;
			np.removeChild(n);
		}
	};

	/**
		 * Affiche le message d'erreur pour le champs texte donné.
		 * @param {Object} _fieldNode node du champ texte.
		 * @param {Object} _onclickOpenBt action se déroulant sur le click du bouton ouvrir le panel.
		 * @param {Object} _hasProposition boolean indiquant si des propositions sont disponibles pour le lieu.
		 */
	ev.tpl.templatePropositions.displayErrorMSG = function(_fieldNode,_onclickOpenBt,_hasProposition) {
		/** Set la classe du champs texte à ERROR.*/
		_fieldNode.className = 'inputError';
		/** construit les node du message d'erreur et on les insère dans le dom du formulaire.*/
		var divNode = domElement(_fieldNode.id + 'PropError');
		if (!divNode) {
			divNode = document.createElement('div');
			divNode.setAttribute('id', _fieldNode.id + 'PropError');
			ev.dom.insertAfter(divNode, _fieldNode);
		}
		var tpErrorMSG = [];
		if (_onclickOpenBt) {
			tpErrorMSG = [
				{tag: 'p', attr: {className: 'confirm', onclick: _onclickOpenBt},content: elm.ifdef(results.tpErrorMSG1)}
			];
		}else {

			tpErrorMSG = [
				{tag: 'p', attr: {className: 'error'},content: [
					{content: elm.ifdef(results.tpErrorMSG2)}
				]
				}
			];
		}
		ev.tpl.templateManager.initialize(divNode.id, tpErrorMSG, []).evTplPrint();
	};

	/**
	 * Parcours la liste des propositions, et renvoi un élément.
	 * @param {Object} id id du lieu à retourner.
	 */
	function getLieuById(id) {
		if (lieux && lieux.lieux) {
			for (var i = 0; i < lieux.lieux.length; i++) {
				var lieu = lieux.lieux[i];
				if (lieu.id == id) {
					return lieu;
				}
			}
		}else {
			ev.log.warn('ev.tpl.templateProposition_ getLieuById(id)_id_undefined');
		}
	}

	/**
	 *  HELPER- Permet de simplifier la suppression du contenu de la div de proposition.
	 *  => Passe à display none la div puis vide son contenu.
	 */
	function removePropositionPanel(_ctn) {
		/* Suppression de la div d'overlay*/
		var overlayNode = domElement('overlay');
		if (overlayNode) {
			var parentOverlayNode = overlayNode.parentNode;
			parentOverlayNode.removeChild(overlayNode);
			/* Suppression du contenu de l'overlay */
			var ctOverlayNode = domElement('ctOverlay');
			var parentctOverlayNode = ctOverlayNode.parentNode;
			parentctOverlayNode.removeChild(ctOverlayNode);
		}
		var e = domElement(_ctn);
		if (e) {
			var parentNode = e.parentNode;
			parentNode.removeChild(e);
		}
	}

	/***
	 * Evenement appelé lorsque un marker de la google map est cliqué.
	 *  => Met à jour les champs data arrivée et départ avec les info sur le lieu ( cf format autocomplétion).
	 * @param {Object} marker
	 */
	function EVT_ON_CLICK_MARKER(onPropositionSelected,_ctn) {
		/**
		 *
		 * @param {Object} marker
		 */
		this.onclick = function(marker) {
			var radioBTId = 'BT' + marker.codeVille;
			var radioBT = domElement(radioBTId);
			if (!radioBT) {
				return;
			}
			radioBT.checked = true;
			onPropositionSelected(getLieuById(marker.idLieu));
			removePropositionPanel(_ctn);
		};
	}

	/***
	 * Modifié la classe du radio bouton associé au marker.
	 *   =>   mouseover
	 * @param {Object} marker
	 */
	function EVT_ON_MOUSE_OVER_MARKER(marker) {
		var radioBTId = 'BT' + marker.codeVille;
		var radioBT = domElement(radioBTId);
		if (!radioBT) {
			return;
		}
		if (radioBT.tipe == TIPE_DEPART) {
			radioBT.className = 'mouseover';
		}
	}


	/***
	 * supprime la classe du radio bouton associé au marker
	 * @param {Object} marker
	 */
	function EVT_ON_MOUSE_OUT_MARKER(marker) {
		var radioBTId = 'BT' + marker.codeVille;
		var radioBT = domElement(radioBTId);
		if (!radioBT) {
			return;
		}
		if (radioBT.tipe == TIPE_DEPART) {
			radioBT.className = '';
		}else if (radioBT.tipe == TIPE_ARRIVEE) {
			radioBT.className = '';
		}
	}

	/**
	 * Evenement appelé lorsque un radio bouton est sélectionné ( click directement dessus ou sur le label associé).
	 * Utilise l'attribut tipe afin de déterminéer si le radio bouton contient un lieu de départ ou d'arrivée.
	 */
	function EVT_BT_CLICK(onPropositionSelected,_ctn) {
		this.onclick = function() {
			onPropositionSelected(getLieuById(this.idLieu));
			removePropositionPanel(_ctn);
		};
	}

	var SHOW_MAP_BT_ID = 'btshowmap', SHOW_LISTE_BT_ID = 'btshowliste';
	/**
	 *
	 * @param {Object} _ctn contenaire globale.
	 * @param {Object} _status true si la liste est affichée par défaut.
	 * @param {Object} _status false si la googleMap est affichée par défaut.
	 */
	function BT_TOGGLE_LISTE_MAP(_ctn,_status,_departmapPointsArray,_onPropositionSelected) {
		/** status contient true si la liste est affichée, false si la googlemap est affichée. */
		var status = _status;
		var googleMapInitialized = false;
		this.onclick = function() {
			if (status) {
				if (!googleMapInitialized && window.GBrowserIsCompatible()) {
					/** Génération de la google map.*/
					domElement('map2').className = '';
					domElement('GoogleMap').className = '';
					var map = new window.GMap2(domElement('map2'));
					try {
						map.setCenter(new window.GLatLng(_departmapPointsArray[0].lat, _departmapPointsArray[0].lng), 1);
					}catch (e) {
						map.setCenter(new window.GLatLng(27.1373, 31.5527), 1);
					}
					ev.mev.gmapMEV.init(_departmapPointsArray);
					map.addControl(new window.GLargeMapControl());
					map.addControl(new window.GScaleControl());
					var baseIcon = new window.GIcon();
					baseIcon.iconAnchor = new window.GPoint(9, 32);
					baseIcon.iconSize = new window.GSize(19, 32);
					var imgMarker = new window.GIcon(baseIcon, ArriveeMarkerImg, null),
							imgMarkerDepart = new window.GIcon(baseIcon, departMarkerImg, null),
							markers = [],
							markersDepart = [],
							bt = new EVT_ON_CLICK_MARKER(_onPropositionSelected, _ctn),
							GMAP_MARKER_EVTS = {'click': bt.onclick, 'mouseover': EVT_ON_MOUSE_OVER_MARKER, 'mouseout': EVT_ON_MOUSE_OUT_MARKER};
					ev.mev.gmapMEV.transfertLatLngToElement(map, markers, _departmapPointsArray, imgMarkerDepart, GMAP_MARKER_EVTS);
					googleMapInitialized = true;
				}
				domElement('choisirLieuxMEV').className = 'disabled';
				domElement('GoogleMap').className = '';
				domElement(SHOW_MAP_BT_ID).className = 'select';
				domElement(SHOW_LISTE_BT_ID).className = '';
			}else {
				domElement('choisirLieuxMEV').className = '';
				domElement('GoogleMap').className = 'disabled';
				domElement(SHOW_MAP_BT_ID).className = '';
				domElement(SHOW_LISTE_BT_ID).className = 'select';
			}
		};
	}

	/**
	 * Créer dynamiquement les nodes nécessaires à l'affichage du panel de proposition.
	 */
	function initOverLayNode() {
		/** Creation dynamique du contener des propositions + div de l'overlay, tout ça à la racine du body*/
		var overlayNode = document.createElement('div');
		overlayNode.setAttribute('id', 'overlay');
		var overlayctNode = document.createElement('div');
		overlayctNode.setAttribute('id', 'ctOverlay');
		var propositionNode = document.createElement('div');
		propositionNode.setAttribute('id', 'empty');
		overlayctNode.appendChild(propositionNode);
		document.getElementsByTagName('body')[0].appendChild(overlayNode);
		document.getElementsByTagName('body')[0].appendChild(overlayctNode);
		domElement('empty').style.display = 'block';
		overthelay = new window.Overlay(
				domElement('overlay'),
				domElement('empty'),
				domElement('closeOverlay'),
				domElement('closeOverlay')
				);
		overthelay.showOverlay();
	}

	/**
	 * Méthode 'privée' permettant de simplifier la génération du html relatif à une ligne de proposition.
	 * @param {Object} listeLieux
	 * @param {Object} tipe
	 */
	function initListeProposition(listeLieux,tipe,onPropositionSelected,ctn) {
		var bt = new EVT_BT_CLICK(onPropositionSelected, ctn),
				tpElement = [
					{tag: 'li', content: [
						{tag: 'input', attr: {onclick: bt.onclick, type: 'checkbox', code: '[¤$p,code¤]', idLieu: '[¤$p,id¤]', tipe: tipe, name: tipe, id: RADIO_BT_ID_PREFIX + '[¤$p,code¤]', value: '[¤$p,nom¤]'}},
						{tag: 'label', attr: {htmlFor: RADIO_BT_ID_PREFIX + '[¤$p,code¤]'}, content: [
							{tag: 'p', attr: {id: 'ville'}, content: '[¤$p,nom¤] - '},
							{tag: 'p', attr: {id: 'pays'}, content: '[¤$p,pays¤]'}
						]}
					]}
				],
				tpListElement = ev.tpl.templateManager.createIteration(tpElement, listeLieux.lieux.length, '$p'),
				tpfieldsetContenu = [
					{tag: 'ul', content: tpListElement}
				];
		return tpfieldsetContenu;
	}

	/**
	 *  Construit le template d'affichage et l'initialise avec la liste de vol donné en parametre.
	 *  Le contenu html est inséré dans le contener donné en parametre.
	 * @param {Object} vols liste des vols à afficher.
	 * @param {Object} ctn contener de la liste des vols
	 *  mSliders => Tableau des sliders utilisés pour le block de résultat.
	 *  mVols => pointer local vers la liste des vols à afficher.
	 */
	ev.tpl.templatePropositions.display = function(propositions,_fieldIdStr,onPropositionSelected,onclickCloseBt) {
		/** Variable interne contenant la liste des lieux. */
		lieux = [];
		lieux = propositions;
		/**Lecture du texte saisi par l'internaute*/
		var fieldValueStr = domElement(_fieldIdStr).value;
		/**Définition de l'id du panel de proposition.*/
		var ctn = _fieldIdStr + 'Prop';
		/** Boolean d'état de la liste de lieux.*/
		var lieuxEmpty = true;
		/**Mise à jour de lieuxEmpty  en fonction de la liste de lieu.lieuxEmpty.*/
		if (lieux.lieux && (lieux.lieux.length > 0)) {
			lieuxEmpty = false;
		}else {// A revoir !!!! Si champs incorret et pas de proposition QUE FAIRE.......
			return;
		}
		/** Initialisation du dom pour l'affichage des propositions.*/
		initOverLayNode();

		/** Converstion des données de la liste des propositions en une liste compréhensible par la gmap.*/
		var DepartlieuxGMap = [];
		if (lieux.lieux) {
			for (var it2 = 0; it2 < lieux.lieux.length; it2++) {
				var tempDepart = {'lat': lieux.lieux[it2].latitude, 'lng': lieux.lieux[it2].longitude, 'nameVille' : lieux.lieux[it2].nom, 'idVille' : lieux.lieux[it2].id, 'codeVille': lieux.lieux[it2].code, 'champ': 'departAllerData'};
				DepartlieuxGMap.push(tempDepart);
			}
		}
		/** Double conversion des données de la liste des propositions.*/
		var DepartmapPointsArray = window.normalizeJSONArray(DepartlieuxGMap);
		/** Défininition du bouton de switch. */
		var bt = new BT_TOGGLE_LISTE_MAP(ctn, false, DepartmapPointsArray, onPropositionSelected);
		var bt2 = new BT_TOGGLE_LISTE_MAP(ctn, true, DepartmapPointsArray, onPropositionSelected);

		/** template global du panel des propositions.*/
		var tpGlobal = [
			{tag: 'div', attr: {id: 'ctHD'}, content: [
				{tag: 'p', attr: {onclick: onclickCloseBt},content: LblCLOSE_BT},
				{tag: 'h5', content:
							[
								{
									tag: 'span',
									content: fieldValueStr
								},
								{content: elm.ifdef(results.tpErrorCtHD1)},

								{tag: 'br'},
								{content: elm.ifdef(results.tpErrorCtHD2)}
							]
				}
			]},
			{tag: 'div', attr: {id: 'ctPropositionsMEV'}, content: [

				{tag: 'span', attr: {id: SHOW_LISTE_BT_ID, onclick: bt2.onclick, className: 'select', title: elm.ifdef(results.ctPropositionsMEV1)},content: ''},
				{tag: 'span', attr: {id: SHOW_MAP_BT_ID, onclick: bt.onclick, className: '', title: elm.ifdef(results.ctPropositionsMEV2)},content: ''},

				{tag: 'form', attr: {id: 'choisirLieuxMEV', action: '#', method: 'get'},content:
							[
								{tag: 'fieldset', attr: {id: 'choisirLieuAllerMEV', title: elm.ifdef(results.ctPropositionsMEV3)}}
							]
				},
				{tag: 'div', attr: {id: 'GoogleMap', className: 'disabled'}, content: [
					{tag: 'div', attr: {id: 'map2'}},
					{tag: 'div', attr: {id: 'infoBox'}}
				]
				},
				{tag: 'div', attr: {className: 'clear'}}
			]}
		];

		/** Creation du container des propositions.*/
		if (!domElement(ctn)) {
			var propositionNode = document.createElement('div');
			propositionNode.setAttribute('id', ctn);
			var parentNode = (domElement('formMEV') || domElement('formMEH')) .parentNode;
			var formMEVNode = domElement('formMEV') || domElement('formMEH');
			parentNode.insertBefore(propositionNode, formMEVNode);
		}

		/** Génération du code HTML du container des propositions.*/
		ev.tpl.templateManager.initialize(ctn, tpGlobal, propositions).evTplPrint();
		domElement('choisirLieuxMEV').style.display = '';

		/** Initialsiation du code HTML de la liste des propositions.*/
		if (!lieuxEmpty) {
			var tpPropositionsDepart = initListeProposition(lieux, TIPE_DEPART, onPropositionSelected, ctn);
			ev.tpl.templateManager.initialize('choisirLieuAllerMEV', tpPropositionsDepart, lieux.lieux).evTplPrint();
		}

	};

	/**
	 *
	 * @param {Object} _ctn
	 */
	ev.tpl.templatePropositions.close = function(_fieldIdStr) {
		var ctn = _fieldIdStr + 'Prop';
		removePropositionPanel(ctn);
	};
}());

