Subversion Repositories eFlore/Applications.cel

// Héritage

function WidgetSaisieFlorileges() {

	this.latLngDebPre = {lat: null, lng: null};

	this.latLngFinPre = {lat: null, lng: null};

	this.okPourChargementCarte = 2;

	this.markerDeb = null;

	this.latLngDeb = null;

	this.markerFin = null;

	this.latLngFin = null;

	this.ligneRue = null;

	this.googleMapMarqueurDebutUrl = null;

	this.googleMapMarqueurFinUrl = null;

	this.premierDeplacement = true;

}

WidgetSaisieFlorileges.prototype = new WidgetSaisieSauvages();

// @TODO harmoniser avec Sauvages (rue)

WidgetSaisieFlorileges.prototype.initCarto = function() {

	var lthis = this;

	this.initialiserGoogleMap();

	this.afficherEtapeGeolocalisation(1);

	$('#carte-recherche').autocomplete({

		//Cette partie utilise geocoder pour extraire des valeurs d'adresse

		source: function(request, response) {

			lthis.geocoder.geocode( {'address': request.term+', France', 'region' : 'fr' }, function(results, status) {

				if (status == google.maps.GeocoderStatus.OK) {

					response($.map(results, function(item) {

						var retour = {

							label: item.formatted_address,

							value: item.formatted_address,

							latitude: item.geometry.location.lat(),

							longitude: item.geometry.location.lng()

						};

						return retour;

					}));

				} else {

					lthis.afficherErreurGoogleMap(status);

				}

			});

		},

		// Cette partie est executee a la selection d'une adresse

		select: function(event, ui) {

			var nouvellePosition = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);

			lthis.initialiserMarkerDeb();

			lthis.deplacerMarkerDeb(nouvellePosition);

			lthis.map.setZoom(16);

			lthis.afficherEtapeGeolocalisation(2);

		}

	});

}

WidgetSaisieFlorileges.prototype.initForm = function() {

	// super() à la main - toute autre manière de faire est über-komplex

	WidgetSaisie.prototype.initForm.call(this);

	this.configurerDatePicker('#date-arret-traitement-phyto');

	this.surChangementTaxonListe();// Vérif lors du chargement de la page

	$('#taxon-liste').on('change', this.surChangementTaxonListe.bind(this));

}

WidgetSaisieFlorileges.prototype.initEvts = function() {

	var lthis = this;

	// super() à la main - toute autre manière de faire est über-komplex

	WidgetSaisie.prototype.initEvts.call(this);

	$('.dropdown-menu input, .dropdown-menu label').on('click', function(event) {

		event.stopPropagation();

	});

	// Afficher/Cacher champs cachés par défaut

	this.surChangementPeriodiciteTraitementPhyto();// Vérif lors du chargement de la page

	$('#periodicite-traitement-phyto').on('change', this.surChangementPeriodiciteTraitementPhyto.bind(this));

	// Sliders

	this.transformerEnSlider('#presence-zone-vegetalise');

	this.transformerEnSlider('#hauteur-batiment-avoisinant');

	this.transformerEnSlider('#periodicite-traitement-phyto');

	this.transformerEnSlider('#resistance-traitement-phyto');

	this.transformerEnSlider('#vitesse-croissance');

	// Gestion des obs

	$('.cb-milieux').on('click', function(event) {

		$(this).valid();

		event.stopPropagation();

	});

	$('input#hauteur-plante').on('blur', function() {

		// if there's a bad value

		var valeur = $(this).val();

		if (! valeur.match(/^[0-9]+$/)) {

			// replace it with nothing

			var nouvelleValeur = valeur.replace(/[^0-9]/g, '');

			$(this).val(nouvelleValeur);

		}

	});

	// Défilement des photos @TODO harmoniser

	$('body').on('click', '.defilement-control-zone', function(event) {

		lthis.defilerMiniatures($(this));

	});

	$('body').on('mouseover', '.defilement-control-zone', function(event) {

		$('.defilement-control', this).removeClass('hidden');

	});

	$('body').on('mouseout', '.defilement-control-zone', function(event) {

		$('.defilement-control', this).addClass('hidden');

	});

	$('#photo-placeholder').click(function(event) {

		$('#fichier').click();

	});

	$('.navigation-rue').on('click', this.surClicRueSuivantPrecedent.bind(this));

};

WidgetSaisieFlorileges.prototype.prechargerForm = function(infos) {

	$('input[name="station"]').val(infos.station);

	//console.log(infos.extension);

	if (infos.extension) {

		var ext = infos.extension;

		if (ext.latitudeDebutRue && ext.longitudeDebutRue && ext.latitudeFinRue && ext.longitudeFinRue) {

			this.okPourChargementCarte--;

			this.latLngDebPre.lat = parseFloat(ext.latitudeDebutRue.valeur);

			this.latLngDebPre.lng = parseFloat(ext.longitudeDebutRue.valeur);

			this.latLngFinPre.lat = parseFloat(ext.latitudeFinRue.valeur);

			this.latLngFinPre.lng = parseFloat(ext.longitudeFinRue.valeur);

			this.prechargerRue();

		}

		var chpsARemplir = ['adresse', 'typoUrbaine', 'revetementSol', 'presenceZoneVegetalise', 'hauteurBatimentAvoisinant',

			'intensiteGestion', 'periodiciteTraitementPhyto', 'dateArretTraitementPhyto', 'itineraireGestion'];

		$.each(infos.extension, function(nomDuChp, value) {

			if (chpsARemplir.indexOf(nomDuChp) >= 0) {

				if ($('[name="' + nomDuChp + '"]').hasClass('slider')) {

					$('select[name="' + nomDuChp + '"] option[value="' + value.valeur + '"]')

						.attr('selected', 'selected');

					var selectedIndexOptions = $('select[name="' + nomDuChp + '"]').prop('selectedIndex') + 1;

					$('[name="' + nomDuChp + '"]').parent().find('.horizontal-slider').slider('value', selectedIndexOptions);

					if (nomDuChp == 'periodiciteTraitementPhyto') {

						$('[name="periodiciteTraitementPhyto"]').trigger('change');

					}

				} else {

					$('[name="' + nomDuChp + '"]').val(value.valeur);

				}

			}

		});

	}

}

WidgetSaisieFlorileges.prototype.prechargerRue = function() {

	if (this.okPourChargementCarte == 0) {

		this.latLngDeb = new google.maps.LatLng(this.latLngDebPre.lat, this.latLngDebPre.lng);

		this.markerDeb = undefined;

		this.initialiserMarkerDeb();

		this.deplacerMarkerDeb(latLngDeb);

		this.premierDeplacement = false;

		this.markerFin = undefined;

		this.latLngFin = new google.maps.LatLng(this.latLngFinPre.lat, this.latLngFinPre.lng);

		this.initialiserMarkerFin();

		this.deplacerMakerFin(latLngFin)

		this.surDeplacementMarkerFin();

		this.map.setZoom(16);

	}

}

WidgetSaisieFlorileges.prototype.focusChampFormulaire = function() {

	$('#structure').focus();

}

WidgetSaisieFlorileges.prototype.initialiserGoogleMap = function() {

	var lthis = this;

	this.latLngDeb = new google.maps.LatLng(46.30871, 2.54395);// Centre de la France

	var options = {

			zoom: 5,

			center: this.latLngDeb,

			mapTypeId: google.maps.MapTypeId.HYBRID,

			mapTypeControlOptions: {

				mapTypeIds: ['OSM',

					google.maps.MapTypeId.ROADMAP,

					google.maps.MapTypeId.HYBRID,

					google.maps.MapTypeId.SATELLITE,

					google.maps.MapTypeId.TERRAIN]}

		};

	// Ajout de la couche OSM à la carte

	var osmMapType = new google.maps.ImageMapType({

		getTileUrl: function(coord, zoom) {

			return 'http://tile.openstreetmap.org/' + zoom + '/' + coord.x + '/' + coord.y + '.png';

		},

		tileSize: new google.maps.Size(256, 256),

		isPng: true,

		alt: 'OpenStreetMap',

		name: 'OSM',

		maxZoom: 19

	});

	// Création de la carte Google

	this.map = new google.maps.Map(document.getElementById('map-canvas'), options); //affiche la google map dans la div map_canvas

	this.map.mapTypes.set('OSM', osmMapType);

	// Ajout de l'évènment sur click dans Carte

	google.maps.event.addListener(this.map, 'click', this.surClickDansCarte.bind(this));

	// Lorsque la carte est chargée, on vérifie si on peut précharger des données

	google.maps.event.addListenerOnce(this.map, 'idle', function(){

		if (lthis.obsId == '') {

			// Initialisation du marker de début de rue

			lthis.initialiserMarkerDeb();

			// Tentative de geocalisation si aucune obs à précharger

			if (lthis.obsId == '') {

				lthis.tenterGeolocalisation();

			}

		} else {

			lthis.okPourChargementCarte--;

			lthis.prechargerRue();

		}

	});

	$("#geolocaliser").on('click', this.geolocaliser.bind(this));

	// Création du Geocoder

	this.geocoder = new google.maps.Geocoder();

}

WidgetSaisieFlorileges.prototype.transformerEnSlider = function(selector) {

	$(selector).each(function(index, el) {

		// hide the element

		$(el).addClass('slider-on');

		// add the slider to each element

		var slider = $( '<div class="slider-holder"><div class="horizontal-slider"></div></div>' ).

			insertBefore( el ).find('.horizontal-slider').slider({

				min: 1,

				max: el.options.length,

				range: 'min',

				value: el.selectedIndex + 1,

				slide: function(event, ui) {

					el.selectedIndex = ui.value - 1;

					slider.find('a').text(el.options[el.selectedIndex].text);

					$(selector + ' option[selected="selected"]').removeAttr('selected');

					$(selector + ' :nth-child('+ui.value+')').attr('selected', 'selected')

					$(selector).valid();

				},

				stop: function() {

					$(el).change();

				}

			});

		slider.find('a').text(el.options[el.selectedIndex].text);

		// Create a legend under the slider so we can see the options

		var options = [];

		for (var option in $(el).children()) {

			if (!isNaN(parseInt(option))) {

				options.push(el.options[option].text);

			}

		}

		// the width of each legend/option

		var width = (slider.width() / (options.length - 1));

		// Add the legend. Half the width of the first and last options for display consistency.

		slider.after('<div class="slider-legend"><p style="width:' + (width / 2) + 'px;text-align:left;">' +

			options.join('</p><p style="width:' + width + 'px;">') +'</p></div>')

			.parent().find('.slider-legend p:last-child').css('width', width / 2)

			.css('text-align', 'right');

		// if there are too many options so that the text is wider than the width, then hide the text

		var lastChild = slider.parent().find('.slider-legend p:last-child');

		if (lastChild[0].clientWidth < lastChild[0].scrollWidth) {

			slider.parent().find('.slider-legend p');//.css('text-indent', '200%');

		}

	});

}

WidgetSaisieFlorileges.prototype.surChangementPeriodiciteTraitementPhyto = function() {

	if ($('#periodicite-traitement-phyto').val() === 'jamais') {

		$('#datp-zone').removeClass('hidden');

	} else {

		$('#datp-zone').addClass('hidden');

	}

}

WidgetSaisieFlorileges.prototype.definirReglesFormValidator = function() {

	$('#form-observateur').validate({

		rules: {

			courriel: {

				required: true,

				email: true},

			courriel_confirmation: {

				required: true,

				equalTo: '#courriel'},

			prenom: {

				required: true},

			nom: {

				required: true},

			personneStructure: {

				required: true},

			personneService: {

				required: true}

		}

	});

	$('#form-site').validate({

		rules: {

			station: {

				required: true},

			latitude : {

				required: true,

				range: [-90, 90]},

			longitude: {

				required: true,

				range: [-180, 180]},

			typoUrbaine: {

				required: true},

			revetementSol: {

				required: true},

			intensiteGestion: {

				required: true},

			periodiciteTraitementPhyto: {

				required: true},

			itineraireGestion: {

				required: true}

		}

	});

	$('#form-date').validate({

		rules: {

			date: {

				required: true,

				'dateCel' : true},

			dateDerniereIntervention: {

				required: true}

		},

		errorPlacement: function(error, element) {

			if (element.attr('name') == 'date') {

				element.parent('.input-prepend').after(error);

			} else {

				error.insertAfter(element);

			}

		}

	});

	$('#form-obs').validate({

		rules: {

			'taxon-liste': {

				required: true},

			'milieux[]': {

				required: true,

				minlength: 1},

			hauteurPlante: {

				required: true,

				digits: true},

			resistanceTraitementPhyto: {

				required: true}

		},

		errorPlacement: function(error, element) {

			if (element.attr('name') == 'milieux[]') {

				error.insertAfter('#milieux-controls');

			} else {

				error.insertAfter(element);

			}

		}

	});

}

WidgetSaisieFlorileges.prototype.validerFormulaire = function() {

	var observateur = $('#form-observateur').valid(),

		station = $('#form-site').valid(),

		date = $('#form-date').valid(),

		obs = $('#form-obs').valid(),

		debRue = (this.latLngDeb == undefined) ? false : true,

		finRue = (this.latLngFin == undefined) ? false : true;

	var ok = (observateur && station && obs && date && debRue && finRue) ? true : false;

	//console.log(observateur+'-'+station+'-'+obs+'-'+date+'-'+debRue+'-'+finRue);

	return ok;

}

/*WidgetSaisieFlorileges.prototype.ajouterObs = function() {

	if (this.validerFormulaire() == true) {

		this.obsNbre = this.obsNbre + 1;

		$('.obs-nbre').text(this.obsNbre);

		$('.obs-nbre').triggerHandler('changement');

		this.afficherObs();

		this.stockerObsData();

		this.supprimerMiniatures();

	} else {

		var debRue = (this.latLngDeb == undefined) ? false : true,

			finRue = (this.latLngFin == undefined) ? false : true;

		if (debRue == false || finRue == false) {

			this.afficherPanneau('#dialogue-form-invalide-rue');

		} else {

			this.afficherPanneau('#dialogue-form-invalide');

		}

	}

}*/

WidgetSaisieFlorileges.prototype.afficherObs = function() {

	var lthis = this;

	var numNomSel = ($('#taxon-liste').val() == '?') ? $('#taxon').data('numNomSel') : $('#taxon-liste').val(),

		nomSpecial = $('#taxon-liste option:selected').hasClass('nom-special'),

		taxon = ($('#taxon-liste').val() == '?') ? $('#taxon').val() : $('#taxon-liste option:selected').data('nom-a-sauver'),

		referentiel = (numNomSel == undefined) ? '' : '['+ this.nomSciReferentiel +']',

		commune = $('#commune-nom').text(),

		codeInsee = $('#commune-code-insee').text(),

		lat = $('input[name="latitude"]').val(),

		lng = $('input[name="longitude"]').val(),

		date = $('#date').val(),

		site = $('#station').val(),

		revetement = $('#revetement-sol').val(),

		intensiteGestion = $('#intensite-gestion').val(),

		resistance = $('#resistance-traitement-phyto').val(),

		milieux = this.getMilieux(),

		notes = (nomSpecial ? this.taxons[numNomSel]['nom_fr'] + ".<br />" : '') + $('#notes').val();

	$('#liste-obs').prepend(

		'<div id="obs'+this.obsNbre+'" class="row-fluid obs obs'+this.obsNbre+'">'+

			'<div class="span12">'+

				'<div class="well">'+

					'<div class="obs-action pull-right has-tooltip" data-placement="bottom" '+

						'title="Supprimer cette observation de la liste à transmettre">'+

						'<button class="btn btn-danger supprimer-obs" value="'+this.obsNbre+'" title="'+this.obsNbre+'">'+

							'<i class="icon-trash icon-white"></i>'+

						'</button>'+

					'</div> '+

					'<div class="row-fluid">'+

						'<div class="span2 obs-miniatures">'+

						this.ajouterImgMiniatureAuTransfert()+

						'</div>'+

						'<div class="span8">'+

							'<ul class="unstyled">'+

								'<li>'+

									'<span class="nom-sci">' + taxon + '</span> ' +

									this.formaterNumNomSel(numNomSel)+

									'<span class="referentiel-obs">' + referentiel + '</span>' +

									' observé à ' +

									'<span class="commune">' + commune + '</span> ' +

									'(' + codeInsee + ') [' + lat +' / ' + lng + ']' +

									' le ' +

									'<span class="date">' + date + '</span>' +

								'</li>' +

								'<li>' +

									'<span>Site :</span> ' + site + ' ' + ' ; ' +

									'<span>Revêtement au sol :</span> ' + revetement + ' ' + ' ; ' +

									'<span>Intensité de gestion :</span> ' + intensiteGestion + ' ' + ' ; ' +

									'<span>Milieu :</span> ' + milieux + ' ' + ' ; ' +

									'<span>Résistance/Résilience :</span> ' + resistance + ' ' +

								'</li>' +

								'<li>' +

									'Commentaires : ' + notes +

								'</li>'+

							'</ul>'+

						'</div>'+

					'</div>'+

				'</div>'+

			'</div>'+

		'</div>');

	$('#zone-liste-obs').removeClass("hidden").show();

}

WidgetSaisieFlorileges.prototype.stockerObsData = function() {

	var nomHorsListe = $('#taxon-liste').val() == '?' ? true : false;

		nomSpecial = $('#taxon-liste option:selected').hasClass('nom-special'),

		numNomSel = nomHorsListe ? $('#taxon').data('numNomSel') : $('#taxon-liste').val(),

		nomSel = nomHorsListe ? $('#taxon').val() : $('#taxon-liste option:selected').data('nom-a-sauver'),

		nomRet = nomHorsListe ? $('#taxon').data('nomRet') : this.taxons[numNomSel]['nom_ret'],

		numNomRet = nomHorsListe ? $('#taxon').data('numNomRet') : this.taxons[numNomSel]['num_nom_ret'],

		numTaxon = nomHorsListe ? $('#taxon').data('nt') : this.taxons[numNomSel]['num_taxon'],

		famille = nomHorsListe ? $('#taxon').data('famille') : this.taxons[numNomSel]['famille'],

		referentiel = (numNomSel == undefined) ? '' : this.nomSciReferentiel,

		notes = (nomSpecial ? this.taxons[numNomSel]['nom_fr'] + '. ' : '') + $('#notes').val();

	$('#liste-obs').data('obsId'+ this.obsNbre, {

		'date': $('#date').val(),

		'notes': notes,

		'station': $('#station').val(),

		'latitude': $('#latitude').val(),

		'longitude': $('#longitude').val(),

		'commune_nom': $('#commune-nom').text(),

		'commune_code_insee': $('#commune-code-insee').text(),

		'nom_sel': nomSel,

		'num_nom_sel': numNomSel,

		'nom_ret': nomRet,

		'num_nom_ret': numNomRet,

		'num_taxon': numTaxon,

		'famille': famille,

		'referentiel': referentiel,

		'milieu': this.getMilieux(),

		// Ajout des champs images

		'image_nom': this.getNomsImgsOriginales(),

		// Ajout des champs étendus de l'obs

		'obs_etendue': this.getObsChpEtendus()

	});

	//console.log($('#liste-obs').data('obsId'+obsNbre));

}

WidgetSaisieFlorileges.prototype.getObsChpEtendus = function() {

	// super()

	var champs = WidgetSaisieSauvages.prototype.getObsChpEtendus.call(this);

	var perceptionTechnicien = this.getPerceptionTechnicien();

	if (perceptionTechnicien != undefined) {

		champs.push(perceptionTechnicien);

	}

	return champs;

}

WidgetSaisieFlorileges.prototype.getPerceptionTechnicien = function() {

	var perceptionTechnicien = undefined,

		perceptions = [];

	$('.cb-perception-technicien:checked').each(function() {

		perceptions.push($(this).val());

	});

	if (perceptions.length > 0) {

		var valeur = Array.prototype.slice.call(perceptions).join(', ');

		perceptionTechnicien = {cle: 'perceptionTechnicien', label: "Perceptions par l'équipe", valeur: valeur};

	}

	return perceptionTechnicien;

}