Subversion Repositories eFlore/Applications.cel

Rev

Rev 1348 | Go to most recent revision | Details | Compare with Previous | 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();
1352 aurelien 149
			utilisateur.id_utilisateur = $("#id_utilisateur").val();
719 jpm 150
			utilisateur.prenom = $("#prenom").val();
151
			utilisateur.nom = $("#nom").val();
152
			utilisateur.courriel = $("#courriel").val();
153
			observations['utilisateur'] = utilisateur;
154
 
833 jpm 155
			var erreurMsg = "";
719 jpm 156
			$.ajax({
1348 aurelien 157
				url : SERVICE_SAISIE_URL,
719 jpm 158
				type : "POST",
159
				data : observations,
833 jpm 160
				dataType : "json",
719 jpm 161
				beforeSend : function() {
833 jpm 162
					$(".msg").remove();
163
					$(".msg-erreur").remove();
164
					$(".msg-debug").remove();
719 jpm 165
				},
833 jpm 166
				success : function(data, textStatus, jqXHR) {
167
					$("#dialogue-obs-transaction").append('<p class="msg">Vos observations ont bien été transmises.</p>');
168
				},
719 jpm 169
				statusCode : {
170
				    500 : function(jqXHR, textStatus, errorThrown) {
833 jpm 171
						erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
719 jpm 172
						reponse = jQuery.parseJSON(jqXHR.responseText);
173
						if (reponse != null) {
174
							$.each(reponse, function (cle, valeur) {
833 jpm 175
								erreurMsg += valeur + "\n";
719 jpm 176
							});
177
						}
833 jpm 178
						if (DEBUG) {
179
							$("#dialogue-obs-transaction").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
180
						}
719 jpm 181
				    }
182
				},
833 jpm 183
				error : function(jqXHR, textStatus, errorThrown) {
184
					erreurMsg += "Erreur Ajax :\ntype : "+textStatus+' '+errorThrown+"\n";
185
					reponse = jQuery.parseJSON(jqXHR.responseText);
186
					if (reponse != null) {
187
						$.each(reponse, function (cle, valeur) {
188
							erreurMsg += valeur + "\n";
189
						});
190
					}
191
 
192
					if (DEBUG) {
193
						$("#dialogue-obs-transaction").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
194
					}
719 jpm 195
				},
196
				complete : function(jqXHR, textStatus) {
833 jpm 197
					var debugMsg = '';
198
					if (jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
719 jpm 199
						debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
200
						if (debugInfos != null) {
201
							$.each(debugInfos, function (cle, valeur) {
833 jpm 202
								debugMsg += valeur + "\n";
719 jpm 203
							});
204
						}
205
					}
833 jpm 206
					if (erreurMsg != '') {
207
						$("#dialogue-obs-transaction").append('<p class="msg">'+
208
								'Une erreur est survenue lors de la transmission de vos observations.'+'<br />'+
209
								'Vous pouvez signaler le disfonctionnement à <a href="'+
210
								'mailto:cel@tela-botanica.org'+'?'+
211
								'subject=Disfonctionnement du widget de saisie Biodiversite34'+
212
								"&body="+erreurMsg+"\nDébogage :\n"+debugMsg+
213
								'">cel@tela-botanica.org</a>.'+
214
								'</p>');
215
					}
216
					if (DEBUG) {
217
						$("#dialogue-obs-transaction").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
218
					}
719 jpm 219
 
220
					$("#dialogue-obs-transaction").dialog();
221
					$("#liste-obs").removeData();
222
					$('.obs').remove();
223
					obsNumero = 0;
833 jpm 224
				}
712 jpm 225
			});
226
		}
719 jpm 227
		return false;
228
	});
229
});
712 jpm 230
 
719 jpm 231
//+---------------------------------------------------------------------------------------------------------+
232
// GOOGLE MAP
233
 
234
var geocoder;
235
var latLng;
236
var map;
237
var marker;
238
var osmMapType;
239
function initialiserCarte() {
240
	geocoder = new google.maps.Geocoder();
241
	latLng = new google.maps.LatLng(43.577, 3.455);
747 jpm 242
	map = new google.maps.Map(document.getElementById('gg-map-carte'), {
243
		zoom: 9,
244
		mapTypeId: google.maps.MapTypeId.HYBRID,
245
		mapTypeControlOptions: {
246
			mapTypeIds: ['OSM', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.TERRAIN]}
247
	});
248
 
249
	// Ajout de la couche OSM à la carte
719 jpm 250
	osmMapType = new google.maps.ImageMapType({
251
		getTileUrl: function(coord, zoom) {
252
			return "http://tile.openstreetmap.org/" +
253
			zoom + "/" + coord.x + "/" + coord.y + ".png";
254
		},
255
		tileSize: new google.maps.Size(256, 256),
256
		isPng: true,
257
		alt: "OpenStreetMap",
258
		name: "OSM",
259
		maxZoom: 19
712 jpm 260
	});
719 jpm 261
	map.mapTypes.set('OSM', osmMapType);
262
 
747 jpm 263
	// Ajout des limites de communes
264
	ctaLayer = new google.maps.KmlLayer('http://www.tela-botanica.org/commun/google/map/3/kmz/communes/34.kmz', {preserveViewport: true});
265
	ctaLayer.setMap(map);
266
 
267
	// Définition du marqueur
719 jpm 268
	marker = new google.maps.Marker({
269
		position: latLng,
270
		title: 'Ma station',
271
		map: map,
272
		draggable: true
273
	});
747 jpm 274
	deplacerMarker(latLng);
719 jpm 275
 
747 jpm 276
	// Tentative de géolocalisation
277
	if(navigator.geolocation) {	// Try W3C Geolocation (Preferred)
278
		navigator.geolocation.getCurrentPosition(function(position) {
279
			(DEBUG) ? console.log("Géolocalisation OK.") : '';
280
			latLng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
281
			deplacerMarker(latLng);
282
			map.setCenter(latLng);
833 jpm 283
		}, function(erreur) {
284
			(DEBUG) ? console.log("Géolocalisation échouée : "+erreur.code+" = "+erreur.message) : '';
747 jpm 285
		});
286
	} else { //Browser doesn't support Geolocation
287
		(DEBUG) ? console.log("Navigateur ne supportant pas la géolocalisation. Localisation par défaut.") : '';
288
	}
833 jpm 289
	deplacerMarker(latLng);
290
	map.setCenter(latLng);
719 jpm 291
 
747 jpm 292
	// Add des évènements concernant le marqueur
719 jpm 293
	google.maps.event.addListener(marker, 'dragstart', function() {
294
		mettreAJourMarkerAdresse('Marqueur de station début du déplacement...');
295
	});
296
 
297
	google.maps.event.addListener(marker, 'drag', function() {
298
		mettreAJourMarkerStatut('Marqueur de station en cours de déplacement...');
299
		mettreAJourMarkerPosition(marker.getPosition());
300
	});
301
 
302
	google.maps.event.addListener(marker, 'dragend', function() {
303
		mettreAJourMarkerStatut('Marqueur de station déplacé (glisser/déposer).');
304
		mettreAJourMarkerPosition(marker.getPosition());
305
		geocoderPosition(marker.getPosition());
833 jpm 306
		trouverCommune(marker.getPosition());
719 jpm 307
	});
308
 
309
	google.maps.event.addListener(map, 'click', function(event) {
310
		deplacerMarker(event.latLng);
311
	});
312
}
313
 
747 jpm 314
function deplacerMarker(latLon) {
315
	if (marker != undefined) {
316
		marker.setPosition(latLon);
317
		mettreAJourMarkerStatut('Marqueur de station déplacé (clic).');
318
		mettreAJourMarkerPosition(marker.getPosition());
319
		geocoderPosition(marker.getPosition());
833 jpm 320
		trouverCommune(marker.getPosition());
747 jpm 321
	}
322
}
323
 
719 jpm 324
function geocoderPosition(pos) {
325
	if (geocoder != undefined) {
326
		geocoder.geocode({
327
			latLng: pos
328
		}, function(responses, status) {
329
			if (status == google.maps.GeocoderStatus.OK) {
330
				if (responses && responses.length > 0) {
331
					mettreAJourMarkerAdresse(responses[0].formatted_address);
332
				} else {
333
					mettreAJourMarkerAdresse("Impossible de trouver d'adresse pour cette position.");
334
				}
335
			} else {
336
				mettreAJourMarkerAdresse("Un problème de géolocalisation est survenu : "+status+".");
337
			}
338
		});
339
	}
340
}
341
 
833 jpm 342
function trouverCommune(pos) {
343
	$(function() {
1348 aurelien 344
		var urlNomCommuneFormatee = SERVICE_NOM_COMMUNE_URL.replace('{lat}', pos.lat()).replace('{lon}', pos.lng());
833 jpm 345
		$.ajax({
346
			url : urlNomCommuneFormatee,
347
			type : "GET",
348
			dataType : "json",
349
			beforeSend : function() {
350
				$(".commune-info").empty();
351
				$("#dialogue-erreur").empty();
352
			},
353
			success : function(data, textStatus, jqXHR) {
354
				$(".commune-info").empty();
355
				$("#commune-nom").append(data.nom);
356
				$("#commune-code-insee").append(data.codeINSEE);
357
				$("#marqueur-commune").data('commune', {'nom' : data.nom, 'codeInsee' : data.codeINSEE});
358
			},
359
			statusCode : {
360
			    500 : function(jqXHR, textStatus, errorThrown) {
361
					if (DEBUG) {
362
						$("#dialogue-erreur").append('<p id="msg">Un problème est survenu lors de l\'appel au service fournissante le nom des communes.</p>');
363
						reponse = jQuery.parseJSON(jqXHR.responseText);
364
						var erreurMsg = "";
365
						if (reponse != null) {
366
							$.each(reponse, function (cle, valeur) {
367
								erreurMsg += valeur + "<br />";
368
							});
369
						}
370
 
371
						$("#dialogue-erreur").append('<p class="msg-erreur">Erreur 500 : '+errorThrown+"<br />"+erreurMsg+'</p>');
372
					}
373
			    }
374
			},
375
			error : function(jqXHR, textStatus, errorThrown) {
376
				if (DEBUG) {
377
					$("#dialogue-erreur").append('<p class="msg">Une erreur Ajax est survenue lors de la transmission de vos observations.</p>');
378
					reponse = jQuery.parseJSON(jqXHR.responseText);
379
					var erreurMsg = "";
380
					if (reponse != null) {
381
						$.each(reponse, function (cle, valeur) {
382
							erreurMsg += valeur + "<br />";
383
						});
384
					}
385
 
386
					$("#dialogue-erreur").append('<p class="msg-erreur">Erreur Ajax : '+errorThrown+' (type : '+textStatus+') <br />'+erreurMsg+'</p>');
387
				}
388
			},
389
			complete : function(jqXHR, textStatus) {
390
				if (DEBUG && jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
391
					var debugMsg = "";
392
					debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
393
					if (debugInfos != null) {
394
						$.each(debugInfos, function (cle, valeur) {
395
							debugMsg += valeur + "<br />";
396
						});
397
						$("#dialogue-erreur").append('<pre class="msg-debug msg">Débogage : '+debugMsg+'</pre>');
398
					}
399
				}
400
				if ($("#dialogue-erreur .msg").length > 0) {
401
					$("#dialogue-erreur").dialog();
402
				}
403
			}
404
		});
405
	});
406
}
407
 
719 jpm 408
function mettreAJourMarkerStatut(str) {
409
	document.getElementById('marqueur-statut').innerHTML = str;
410
}
411
 
412
function mettreAJourMarkerPosition(latLng) {
744 jpm 413
	var lat = latLng.lat().toFixed(5);
414
	var lon = latLng.lng().toFixed(5);
415
	document.getElementById('marqueur-wgs84').innerHTML = [lat, lon].join(', ');
416
	$("#marqueur-coordonnees").data('latLon', {'lat' : lat, 'lon' : lon});
417
 
418
	Proj4js.defs["EPSG:4326"] = "+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs";
419
	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 ";
420
	var source = new Proj4js.Proj('EPSG:4326');// Coordonnées source : WGS 84
421
	var dest = new Proj4js.Proj('EPSG:2154');// Coordonnées destination  : Lambert 93
422
	var p = new Proj4js.Point(lon+','+lat);//lon+','+lat any object will do as long as it has 'x' and 'y' properties
423
	Proj4js.transform(source, dest, p);
424
	//Proj4js.reportError = function(msg) {alert(msg);}
425
	//console.log(p.toString());
426
	document.getElementById('marqueur-lambert93').innerHTML = [p.x.toFixed(0)+' '+dest.units, p.y.toFixed(0)+' '+dest.units].join(', ');
719 jpm 427
}
428
 
429
function mettreAJourMarkerAdresse(str) {
430
	document.getElementById('marqueur-adresse').innerHTML = str;
431
}
432