Subversion Repositories eFlore/Applications.cel

Rev

Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
719 jpm 1
//+---------------------------------------------------------------------------------------------------------+
2
// GÉNÉRAL
3
/**
4
 * Stope l'évènement courrant quand on clique sur un lien.
5
 * Utile pour Chrome, Safari...
6
 * @param evenement
7
 * @return
8
 */
9
function arreter(evenement) {
10
	if (evenement.stopPropagation) {
11
		evenement.stopPropagation();
12
	}
13
	return false;
14
}
15
 
16
//+---------------------------------------------------------------------------------------------------------+
17
// FORMULAIRE
18
 
712 jpm 19
$(function() {
719 jpm 20
	$("#saisie-obs").validate({
21
		rules: {
22
			prenom : "required",
23
			nom : "required",
24
			courriel : {
25
				required : true,
26
				email : true},
27
			courriel_confirmation : {
28
				required : true,
29
				equalTo: "#courriel"
30
			},
31
			milieu : "required",
744 jpm 32
			latitude : {
33
				required: true,
34
				range: [-90, 90]},
35
			longitude : {
36
				required: true,
37
				range: [-180, 180]},
38
			date : {
39
				required: true,
40
				date: true},
41
			taxon : "required"
719 jpm 42
		}
43
	});
44
 
833 jpm 45
	$("#date").datepicker({
46
		   onClose: function(dateText, inst) {$("#saisie-obs").valid();}
47
	});
712 jpm 48
 
744 jpm 49
	$("#courriel_confirmation").bind('paste', function(e) {
712 jpm 50
		$("#dialogue-bloquer-copier-coller").dialog();
51
		return false;
52
	});
53
 
719 jpm 54
	$("#localiser-gg-map").fancybox({
55
		'modal'			: true,
56
		'autoDimensions' : true,
57
		'titleShow'		: false,
58
		'onClosed'		: function() {
59
		    $("#gg-map").hide();
60
		},
61
		'onStart'		: function(e) {
62
			arreter(e);
63
			$("#gg-map-localisation").height($(window).height() - 100);
744 jpm 64
			$("#gg-map-carte").height($(window).height() - 200);
719 jpm 65
			$("#gg-map-localisation").width($(window).width() - 100);
66
		},
67
		'onComplete'	: function() {
68
			initialiserCarte();
69
		}
70
	});
71
 
72
	$("#valider-coordonnees").click(function(e) {
73
		var coordonnees = $("#marqueur-coordonnees").data('latLon');
74
		if (coordonnees != undefined) {
75
			$("#latitude").val(coordonnees.lat);
76
			$("#longitude").val(coordonnees.lon);
77
		}
833 jpm 78
		var commune = $("#marqueur-commune").data('commune');
79
		if (commune != undefined) {
80
			$("#commune_nom").val(commune.nom);
81
			$("#commune_code_insee").val(commune.codeInsee);
82
		}
719 jpm 83
		$.fancybox.close();
833 jpm 84
		$("#saisie-obs").valid();
719 jpm 85
	});
86
	$("#annuler-coordonnees").bind('click', function(e) {
87
		$.fancybox.close();
833 jpm 88
		$("#saisie-obs").valid()
719 jpm 89
	});
90
 
712 jpm 91
	var obsNumero = 0;
719 jpm 92
	$("#ajouter-obs").bind('click', function(e) {
93
		if ($("#saisie-obs").valid() == false) {
94
			$("#dialogue-form-invalide").dialog();
95
		} else {
96
			obsNumero = obsNumero + 1;
97
			$("#liste-obs tbody").append(
98
				'<tr id="obs'+obsNumero+'" class="obs">'+
99
					'<td>'+obsNumero+'</td>'+
100
					'<td>'+$("#date").val()+'</td>'+
101
					'<td>'+$("#taxon option:selected").text()+'</td>'+
102
					'<td>'+$("#milieu option:selected").text()+'</td>'+
103
					'<td>'+$("#latitude").val()+'</td>'+
104
					'<td>'+$("#longitude").val()+'</td>'+
105
					'<td>'+$("#notes").val()+'</td>'+
106
					'<td><button class="supprimer-obs" value="'+obsNumero+'" title="'+obsNumero+'">Supprimer</button></td>'+
107
				'</tr>');
108
			var numNomSel = $("#taxon").val();
109
			$("#liste-obs").data('obsId'+obsNumero, {
110
				'date' : $("#date").val(),
111
				'num_nom_sel' : numNomSel,
112
				'nom_sel' : taxons[numNomSel]['nom_sel'],
113
				'nom_ret' : taxons[numNomSel]['nom_ret'],
114
				'num_nom_ret' : taxons[numNomSel]['num_nom_ret'],
115
				'num_taxon' : taxons[numNomSel]['num_taxon'],
116
				'famille' : taxons[numNomSel]['famille'],
117
				'nom_fr' : taxons[numNomSel]['nom_fr'],
118
				'milieu' : $("#milieu option:selected").val(),
119
				'latitude' : $("#latitude").val(),
120
				'longitude' : $("#longitude").val(),
833 jpm 121
				'commune_nom' : $("#commune_nom").val(),
122
				'commune_code_insee' : $("#commune_code_insee").val(),
719 jpm 123
				'notes' : $("#notes").val()});
124
		}
712 jpm 125
	});
126
 
127
	$(".supprimer-obs").live('click', function() {
128
		var obsId = $(this).val();
719 jpm 129
		// Problème avec IE 6 et 7
130
		if (obsId == "Supprimer") {
131
			obsId = $(this).attr("title");
132
		}
133
 
134
		$('#obs'+obsId).remove();
135
		$("#liste-obs").removeData('obsId'+obsId)
712 jpm 136
	});
137
 
719 jpm 138
	$("#tramsmettre-obs").click(function(e) {
712 jpm 139
		var observations = $("#liste-obs").data();
719 jpm 140
 
141
		if (observations == undefined || jQuery.isEmptyObject(observations)) {
712 jpm 142
			$("#dialogue-zero-obs").dialog();
719 jpm 143
		} else if ($("#saisie-obs").valid() == false) {
144
			$("#dialogue-form-invalide").dialog();
712 jpm 145
		} else {
833 jpm 146
			observations['projet'] = 'Biodiversite34';
147
 
719 jpm 148
			var utilisateur = new Object();
149
			utilisateur.prenom = $("#prenom").val();
150
			utilisateur.nom = $("#nom").val();
151
			utilisateur.courriel = $("#courriel").val();
152
			observations['utilisateur'] = utilisateur;
153
 
833 jpm 154
			var erreurMsg = "";
719 jpm 155
			$.ajax({
1348 aurelien 156
				url : SERVICE_SAISIE_URL,
719 jpm 157
				type : "POST",
158
				data : observations,
833 jpm 159
				dataType : "json",
719 jpm 160
				beforeSend : function() {
833 jpm 161
					$(".msg").remove();
162
					$(".msg-erreur").remove();
163
					$(".msg-debug").remove();
719 jpm 164
				},
833 jpm 165
				success : function(data, textStatus, jqXHR) {
166
					$("#dialogue-obs-transaction").append('<p class="msg">Vos observations ont bien été transmises.</p>');
167
				},
719 jpm 168
				statusCode : {
169
				    500 : function(jqXHR, textStatus, errorThrown) {
833 jpm 170
						erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
719 jpm 171
						reponse = jQuery.parseJSON(jqXHR.responseText);
172
						if (reponse != null) {
173
							$.each(reponse, function (cle, valeur) {
833 jpm 174
								erreurMsg += valeur + "\n";
719 jpm 175
							});
176
						}
833 jpm 177
						if (DEBUG) {
178
							$("#dialogue-obs-transaction").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
179
						}
719 jpm 180
				    }
181
				},
833 jpm 182
				error : function(jqXHR, textStatus, errorThrown) {
183
					erreurMsg += "Erreur Ajax :\ntype : "+textStatus+' '+errorThrown+"\n";
184
					reponse = jQuery.parseJSON(jqXHR.responseText);
185
					if (reponse != null) {
186
						$.each(reponse, function (cle, valeur) {
187
							erreurMsg += valeur + "\n";
188
						});
189
					}
190
 
191
					if (DEBUG) {
192
						$("#dialogue-obs-transaction").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
193
					}
719 jpm 194
				},
195
				complete : function(jqXHR, textStatus) {
833 jpm 196
					var debugMsg = '';
197
					if (jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
719 jpm 198
						debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
199
						if (debugInfos != null) {
200
							$.each(debugInfos, function (cle, valeur) {
833 jpm 201
								debugMsg += valeur + "\n";
719 jpm 202
							});
203
						}
204
					}
833 jpm 205
					if (erreurMsg != '') {
206
						$("#dialogue-obs-transaction").append('<p class="msg">'+
207
								'Une erreur est survenue lors de la transmission de vos observations.'+'<br />'+
208
								'Vous pouvez signaler le disfonctionnement à <a href="'+
209
								'mailto:cel@tela-botanica.org'+'?'+
210
								'subject=Disfonctionnement du widget de saisie Biodiversite34'+
211
								"&body="+erreurMsg+"\nDébogage :\n"+debugMsg+
212
								'">cel@tela-botanica.org</a>.'+
213
								'</p>');
214
					}
215
					if (DEBUG) {
216
						$("#dialogue-obs-transaction").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
217
					}
719 jpm 218
 
219
					$("#dialogue-obs-transaction").dialog();
220
					$("#liste-obs").removeData();
221
					$('.obs').remove();
222
					obsNumero = 0;
833 jpm 223
				}
712 jpm 224
			});
225
		}
719 jpm 226
		return false;
227
	});
228
});
712 jpm 229
 
719 jpm 230
//+---------------------------------------------------------------------------------------------------------+
231
// GOOGLE MAP
232
 
233
var geocoder;
234
var latLng;
235
var map;
236
var marker;
237
var osmMapType;
238
function initialiserCarte() {
239
	geocoder = new google.maps.Geocoder();
240
	latLng = new google.maps.LatLng(43.577, 3.455);
747 jpm 241
	map = new google.maps.Map(document.getElementById('gg-map-carte'), {
242
		zoom: 9,
243
		mapTypeId: google.maps.MapTypeId.HYBRID,
244
		mapTypeControlOptions: {
245
			mapTypeIds: ['OSM', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.TERRAIN]}
246
	});
247
 
248
	// Ajout de la couche OSM à la carte
719 jpm 249
	osmMapType = new google.maps.ImageMapType({
250
		getTileUrl: function(coord, zoom) {
251
			return "http://tile.openstreetmap.org/" +
252
			zoom + "/" + coord.x + "/" + coord.y + ".png";
253
		},
254
		tileSize: new google.maps.Size(256, 256),
255
		isPng: true,
256
		alt: "OpenStreetMap",
257
		name: "OSM",
258
		maxZoom: 19
712 jpm 259
	});
719 jpm 260
	map.mapTypes.set('OSM', osmMapType);
261
 
747 jpm 262
	// Ajout des limites de communes
263
	ctaLayer = new google.maps.KmlLayer('http://www.tela-botanica.org/commun/google/map/3/kmz/communes/34.kmz', {preserveViewport: true});
264
	ctaLayer.setMap(map);
265
 
266
	// Définition du marqueur
719 jpm 267
	marker = new google.maps.Marker({
268
		position: latLng,
269
		title: 'Ma station',
270
		map: map,
271
		draggable: true
272
	});
747 jpm 273
	deplacerMarker(latLng);
719 jpm 274
 
747 jpm 275
	// Tentative de géolocalisation
276
	if(navigator.geolocation) {	// Try W3C Geolocation (Preferred)
277
		navigator.geolocation.getCurrentPosition(function(position) {
278
			(DEBUG) ? console.log("Géolocalisation OK.") : '';
279
			latLng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
280
			deplacerMarker(latLng);
281
			map.setCenter(latLng);
833 jpm 282
		}, function(erreur) {
283
			(DEBUG) ? console.log("Géolocalisation échouée : "+erreur.code+" = "+erreur.message) : '';
747 jpm 284
		});
285
	} else { //Browser doesn't support Geolocation
286
		(DEBUG) ? console.log("Navigateur ne supportant pas la géolocalisation. Localisation par défaut.") : '';
287
	}
833 jpm 288
	deplacerMarker(latLng);
289
	map.setCenter(latLng);
719 jpm 290
 
747 jpm 291
	// Add des évènements concernant le marqueur
719 jpm 292
	google.maps.event.addListener(marker, 'dragstart', function() {
293
		mettreAJourMarkerAdresse('Marqueur de station début du déplacement...');
294
	});
295
 
296
	google.maps.event.addListener(marker, 'drag', function() {
297
		mettreAJourMarkerStatut('Marqueur de station en cours de déplacement...');
298
		mettreAJourMarkerPosition(marker.getPosition());
299
	});
300
 
301
	google.maps.event.addListener(marker, 'dragend', function() {
302
		mettreAJourMarkerStatut('Marqueur de station déplacé (glisser/déposer).');
303
		mettreAJourMarkerPosition(marker.getPosition());
304
		geocoderPosition(marker.getPosition());
833 jpm 305
		trouverCommune(marker.getPosition());
719 jpm 306
	});
307
 
308
	google.maps.event.addListener(map, 'click', function(event) {
309
		deplacerMarker(event.latLng);
310
	});
311
}
312
 
747 jpm 313
function deplacerMarker(latLon) {
314
	if (marker != undefined) {
315
		marker.setPosition(latLon);
316
		mettreAJourMarkerStatut('Marqueur de station déplacé (clic).');
317
		mettreAJourMarkerPosition(marker.getPosition());
318
		geocoderPosition(marker.getPosition());
833 jpm 319
		trouverCommune(marker.getPosition());
747 jpm 320
	}
321
}
322
 
719 jpm 323
function geocoderPosition(pos) {
324
	if (geocoder != undefined) {
325
		geocoder.geocode({
326
			latLng: pos
327
		}, function(responses, status) {
328
			if (status == google.maps.GeocoderStatus.OK) {
329
				if (responses && responses.length > 0) {
330
					mettreAJourMarkerAdresse(responses[0].formatted_address);
331
				} else {
332
					mettreAJourMarkerAdresse("Impossible de trouver d'adresse pour cette position.");
333
				}
334
			} else {
335
				mettreAJourMarkerAdresse("Un problème de géolocalisation est survenu : "+status+".");
336
			}
337
		});
338
	}
339
}
340
 
833 jpm 341
function trouverCommune(pos) {
342
	$(function() {
1348 aurelien 343
		var urlNomCommuneFormatee = SERVICE_NOM_COMMUNE_URL.replace('{lat}', pos.lat()).replace('{lon}', pos.lng());
833 jpm 344
		$.ajax({
345
			url : urlNomCommuneFormatee,
346
			type : "GET",
347
			dataType : "json",
348
			beforeSend : function() {
349
				$(".commune-info").empty();
350
				$("#dialogue-erreur").empty();
351
			},
352
			success : function(data, textStatus, jqXHR) {
353
				$(".commune-info").empty();
354
				$("#commune-nom").append(data.nom);
355
				$("#commune-code-insee").append(data.codeINSEE);
356
				$("#marqueur-commune").data('commune', {'nom' : data.nom, 'codeInsee' : data.codeINSEE});
357
			},
358
			statusCode : {
359
			    500 : function(jqXHR, textStatus, errorThrown) {
360
					if (DEBUG) {
361
						$("#dialogue-erreur").append('<p id="msg">Un problème est survenu lors de l\'appel au service fournissante le nom des communes.</p>');
362
						reponse = jQuery.parseJSON(jqXHR.responseText);
363
						var erreurMsg = "";
364
						if (reponse != null) {
365
							$.each(reponse, function (cle, valeur) {
366
								erreurMsg += valeur + "<br />";
367
							});
368
						}
369
 
370
						$("#dialogue-erreur").append('<p class="msg-erreur">Erreur 500 : '+errorThrown+"<br />"+erreurMsg+'</p>');
371
					}
372
			    }
373
			},
374
			error : function(jqXHR, textStatus, errorThrown) {
375
				if (DEBUG) {
376
					$("#dialogue-erreur").append('<p class="msg">Une erreur Ajax est survenue lors de la transmission de vos observations.</p>');
377
					reponse = jQuery.parseJSON(jqXHR.responseText);
378
					var erreurMsg = "";
379
					if (reponse != null) {
380
						$.each(reponse, function (cle, valeur) {
381
							erreurMsg += valeur + "<br />";
382
						});
383
					}
384
 
385
					$("#dialogue-erreur").append('<p class="msg-erreur">Erreur Ajax : '+errorThrown+' (type : '+textStatus+') <br />'+erreurMsg+'</p>');
386
				}
387
			},
388
			complete : function(jqXHR, textStatus) {
389
				if (DEBUG && jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
390
					var debugMsg = "";
391
					debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
392
					if (debugInfos != null) {
393
						$.each(debugInfos, function (cle, valeur) {
394
							debugMsg += valeur + "<br />";
395
						});
396
						$("#dialogue-erreur").append('<pre class="msg-debug msg">Débogage : '+debugMsg+'</pre>');
397
					}
398
				}
399
				if ($("#dialogue-erreur .msg").length > 0) {
400
					$("#dialogue-erreur").dialog();
401
				}
402
			}
403
		});
404
	});
405
}
406
 
719 jpm 407
function mettreAJourMarkerStatut(str) {
408
	document.getElementById('marqueur-statut').innerHTML = str;
409
}
410
 
411
function mettreAJourMarkerPosition(latLng) {
744 jpm 412
	var lat = latLng.lat().toFixed(5);
413
	var lon = latLng.lng().toFixed(5);
414
	document.getElementById('marqueur-wgs84').innerHTML = [lat, lon].join(', ');
415
	$("#marqueur-coordonnees").data('latLon', {'lat' : lat, 'lon' : lon});
416
 
417
	Proj4js.defs["EPSG:4326"] = "+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs";
418
	Proj4js.defs["EPSG:2154"]="+title=RGF93 / Lambert-93 +proj=lcc +lat_1=49 +lat_2=44 +lat_0=46.5 +lon_0=3 +x_0=700000 +y_0=6600000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs ";
419
	var source = new Proj4js.Proj('EPSG:4326');// Coordonnées source : WGS 84
420
	var dest = new Proj4js.Proj('EPSG:2154');// Coordonnées destination  : Lambert 93
421
	var p = new Proj4js.Point(lon+','+lat);//lon+','+lat any object will do as long as it has 'x' and 'y' properties
422
	Proj4js.transform(source, dest, p);
423
	//Proj4js.reportError = function(msg) {alert(msg);}
424
	//console.log(p.toString());
425
	document.getElementById('marqueur-lambert93').innerHTML = [p.x.toFixed(0)+' '+dest.units, p.y.toFixed(0)+' '+dest.units].join(', ');
719 jpm 426
}
427
 
428
function mettreAJourMarkerAdresse(str) {
429
	document.getElementById('marqueur-adresse').innerHTML = str;
430
}
431