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
var DEBUG = false; // Mettre à true pour afficher les messages de débogage
4
/**
5
 * Stope l'évènement courrant quand on clique sur un lien.
6
 * Utile pour Chrome, Safari...
7
 * @param evenement
8
 * @return
9
 */
10
function arreter(evenement) {
11
	if (evenement.stopPropagation) {
12
		evenement.stopPropagation();
13
	}
14
	return false;
15
}
16
 
17
//+---------------------------------------------------------------------------------------------------------+
18
// FORMULAIRE
19
 
712 jpm 20
$(function() {
719 jpm 21
	$("#saisie-obs").validate({
22
		rules: {
23
			prenom : "required",
24
			nom : "required",
25
			courriel : {
26
				required : true,
27
				email : true},
28
			courriel_confirmation : {
29
				required : true,
30
				equalTo: "#courriel"
31
			},
32
			milieu : "required",
744 jpm 33
			latitude : {
34
				required: true,
35
				range: [-90, 90]},
36
			longitude : {
37
				required: true,
38
				range: [-180, 180]},
39
			date : {
40
				required: true,
41
				date: true},
42
			taxon : "required"
719 jpm 43
		}
44
	});
45
 
712 jpm 46
	$("#date").datepicker($.datepicker.regional['fr']);
47
 
744 jpm 48
	$("#courriel_confirmation").bind('paste', function(e) {
712 jpm 49
		$("#dialogue-bloquer-copier-coller").dialog();
50
		return false;
51
	});
52
 
719 jpm 53
	$("#localiser-gg-map").fancybox({
54
		'modal'			: true,
55
		'autoDimensions' : true,
56
		'titleShow'		: false,
57
		'onClosed'		: function() {
58
		    $("#gg-map").hide();
59
		},
60
		'onStart'		: function(e) {
61
			arreter(e);
62
			$("#gg-map-localisation").height($(window).height() - 100);
744 jpm 63
			$("#gg-map-carte").height($(window).height() - 200);
719 jpm 64
			$("#gg-map-localisation").width($(window).width() - 100);
65
		},
66
		'onComplete'	: function() {
67
			initialiserCarte();
68
		}
69
	});
70
 
71
	$("#valider-coordonnees").click(function(e) {
72
		var coordonnees = $("#marqueur-coordonnees").data('latLon');
73
		if (coordonnees != undefined) {
74
			$("#latitude").val(coordonnees.lat);
75
			$("#longitude").val(coordonnees.lon);
76
		}
77
		$.fancybox.close();
78
	});
79
	$("#annuler-coordonnees").bind('click', function(e) {
80
		$.fancybox.close();
81
	});
82
 
712 jpm 83
	var obsNumero = 0;
719 jpm 84
	$("#ajouter-obs").bind('click', function(e) {
85
		if ($("#saisie-obs").valid() == false) {
86
			$("#dialogue-form-invalide").dialog();
87
		} else {
88
			obsNumero = obsNumero + 1;
89
			$("#liste-obs tbody").append(
90
				'<tr id="obs'+obsNumero+'" class="obs">'+
91
					'<td>'+obsNumero+'</td>'+
92
					'<td>'+$("#date").val()+'</td>'+
93
					'<td>'+$("#taxon option:selected").text()+'</td>'+
94
					'<td>'+$("#milieu option:selected").text()+'</td>'+
95
					'<td>'+$("#latitude").val()+'</td>'+
96
					'<td>'+$("#longitude").val()+'</td>'+
97
					'<td>'+$("#notes").val()+'</td>'+
98
					'<td><button class="supprimer-obs" value="'+obsNumero+'" title="'+obsNumero+'">Supprimer</button></td>'+
99
				'</tr>');
100
			var numNomSel = $("#taxon").val();
101
			$("#liste-obs").data('obsId'+obsNumero, {
102
				'date' : $("#date").val(),
103
				'num_nom_sel' : numNomSel,
104
				'nom_sel' : taxons[numNomSel]['nom_sel'],
105
				'nom_ret' : taxons[numNomSel]['nom_ret'],
106
				'num_nom_ret' : taxons[numNomSel]['num_nom_ret'],
107
				'num_taxon' : taxons[numNomSel]['num_taxon'],
108
				'famille' : taxons[numNomSel]['famille'],
109
				'nom_fr' : taxons[numNomSel]['nom_fr'],
110
				'milieu' : $("#milieu option:selected").val(),
111
				'latitude' : $("#latitude").val(),
112
				'longitude' : $("#longitude").val(),
113
				'tag' : 'Biodiversite34',
114
				'notes' : $("#notes").val()});
115
		}
712 jpm 116
	});
117
 
118
	$(".supprimer-obs").live('click', function() {
119
		var obsId = $(this).val();
719 jpm 120
		// Problème avec IE 6 et 7
121
		if (obsId == "Supprimer") {
122
			obsId = $(this).attr("title");
123
		}
124
 
125
		$('#obs'+obsId).remove();
126
		$("#liste-obs").removeData('obsId'+obsId)
712 jpm 127
	});
128
 
719 jpm 129
	$("#tramsmettre-obs").click(function(e) {
712 jpm 130
		var observations = $("#liste-obs").data();
719 jpm 131
 
132
		if (observations == undefined || jQuery.isEmptyObject(observations)) {
712 jpm 133
			$("#dialogue-zero-obs").dialog();
719 jpm 134
		} else if ($("#saisie-obs").valid() == false) {
135
			$("#dialogue-form-invalide").dialog();
712 jpm 136
		} else {
719 jpm 137
			var utilisateur = new Object();
138
			utilisateur.prenom = $("#prenom").val();
139
			utilisateur.nom = $("#nom").val();
140
			utilisateur.courriel = $("#courriel").val();
141
			observations['utilisateur'] = utilisateur;
142
 
143
			//"http://localhost/cel-jrest/CelWidgetSaisie"
144
			$.ajax({
145
				url : "http://www.tela-botanica.org/eflore-test/cel2/jrest/CelWidgetSaisie",
146
				type : "POST",
147
				data : observations,
148
				context : document.body,
149
				beforeSend : function() {
150
					$("#msg").remove();
151
					$("#msg-erreur").remove();
152
					$("#msg-debug").remove();
153
				},
154
				statusCode : {
155
				    500 : function(jqXHR, textStatus, errorThrown) {
156
						$("#dialogue-obs-transaction").append('<p id="msg">Un problème est survenu lors de la transmission de vos observations.</p>');
157
						reponse = jQuery.parseJSON(jqXHR.responseText);
158
						var erreurMsg = "";
159
						if (reponse != null) {
160
							$.each(reponse, function (cle, valeur) {
161
								erreurMsg += valeur + "<br />";
162
							});
163
						}
164
 
165
						$("#dialogue-obs-transaction").append('<p id="msg-erreur">Erreur 500 : '+errorThrown+"<br />"+erreurMsg+'</p>');
166
				    }
167
				},
168
				success : function(data, textStatus, jqXHR) {
169
					$("#dialogue-obs-transaction").append('<p id="msg">Vos observations ont bien été transmises.</p>');
170
				},
171
				complete : function(jqXHR, textStatus) {
172
					var debugMsg = "";
173
					if (DEBUG && jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
174
						debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
175
						if (debugInfos != null) {
176
							$.each(debugInfos, function (cle, valeur) {
177
								debugMsg += valeur + "<br />";
178
							});
179
							$("#dialogue-obs-transaction").append('<pre id="msg-debug">Débogage : '+debugMsg+'</pre>');
180
						}
181
					}
182
 
183
					$("#dialogue-obs-transaction").dialog();
184
					$("#liste-obs").removeData();
185
					$('.obs').remove();
186
					obsNumero = 0;
187
				},
188
 
712 jpm 189
			});
190
		}
719 jpm 191
		return false;
192
	});
193
});
712 jpm 194
 
719 jpm 195
//+---------------------------------------------------------------------------------------------------------+
196
// GOOGLE MAP
197
 
198
var geocoder;
199
var latLng;
200
var map;
201
var marker;
202
var osmMapType;
203
function initialiserCarte() {
204
	geocoder = new google.maps.Geocoder();
205
	latLng = new google.maps.LatLng(43.577, 3.455);
747 jpm 206
	map = new google.maps.Map(document.getElementById('gg-map-carte'), {
207
		zoom: 9,
208
		mapTypeId: google.maps.MapTypeId.HYBRID,
209
		mapTypeControlOptions: {
210
			mapTypeIds: ['OSM', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.TERRAIN]}
211
	});
212
 
213
	// Ajout de la couche OSM à la carte
719 jpm 214
	osmMapType = new google.maps.ImageMapType({
215
		getTileUrl: function(coord, zoom) {
216
			return "http://tile.openstreetmap.org/" +
217
			zoom + "/" + coord.x + "/" + coord.y + ".png";
218
		},
219
		tileSize: new google.maps.Size(256, 256),
220
		isPng: true,
221
		alt: "OpenStreetMap",
222
		name: "OSM",
223
		maxZoom: 19
712 jpm 224
	});
719 jpm 225
	map.mapTypes.set('OSM', osmMapType);
226
 
747 jpm 227
	// Ajout des limites de communes
228
	ctaLayer = new google.maps.KmlLayer('http://www.tela-botanica.org/commun/google/map/3/kmz/communes/34.kmz', {preserveViewport: true});
229
	ctaLayer.setMap(map);
230
 
231
	// Définition du marqueur
719 jpm 232
	marker = new google.maps.Marker({
233
		position: latLng,
234
		title: 'Ma station',
235
		map: map,
236
		draggable: true
237
	});
747 jpm 238
	deplacerMarker(latLng);
719 jpm 239
 
747 jpm 240
	// Tentative de géolocalisation
241
	if(navigator.geolocation) {	// Try W3C Geolocation (Preferred)
242
		navigator.geolocation.getCurrentPosition(function(position) {
243
			(DEBUG) ? console.log("Géolocalisation OK.") : '';
244
			latLng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
245
			deplacerMarker(latLng);
246
			map.setCenter(latLng);
247
		}, function() {
248
			(DEBUG) ? console.log("Géolocalisation échouée.") : '';
249
		});
250
	} else { //Browser doesn't support Geolocation
251
		(DEBUG) ? console.log("Navigateur ne supportant pas la géolocalisation. Localisation par défaut.") : '';
252
	}
719 jpm 253
 
747 jpm 254
	// Add des évènements concernant le marqueur
719 jpm 255
	google.maps.event.addListener(marker, 'dragstart', function() {
256
		mettreAJourMarkerAdresse('Marqueur de station début du déplacement...');
257
	});
258
 
259
	google.maps.event.addListener(marker, 'drag', function() {
260
		mettreAJourMarkerStatut('Marqueur de station en cours de déplacement...');
261
		mettreAJourMarkerPosition(marker.getPosition());
262
	});
263
 
264
	google.maps.event.addListener(marker, 'dragend', function() {
265
		mettreAJourMarkerStatut('Marqueur de station déplacé (glisser/déposer).');
266
		mettreAJourMarkerPosition(marker.getPosition());
267
		geocoderPosition(marker.getPosition());
268
	});
269
 
270
	google.maps.event.addListener(map, 'click', function(event) {
271
		deplacerMarker(event.latLng);
272
	});
273
}
274
 
747 jpm 275
function deplacerMarker(latLon) {
276
	if (marker != undefined) {
277
		marker.setPosition(latLon);
278
		mettreAJourMarkerStatut('Marqueur de station déplacé (clic).');
279
		mettreAJourMarkerPosition(marker.getPosition());
280
		geocoderPosition(marker.getPosition());
281
	}
282
}
283
 
719 jpm 284
function geocoderPosition(pos) {
285
	if (geocoder != undefined) {
286
		geocoder.geocode({
287
			latLng: pos
288
		}, function(responses, status) {
289
			if (status == google.maps.GeocoderStatus.OK) {
290
				if (responses && responses.length > 0) {
291
					mettreAJourMarkerAdresse(responses[0].formatted_address);
292
				} else {
293
					mettreAJourMarkerAdresse("Impossible de trouver d'adresse pour cette position.");
294
				}
295
			} else {
296
				mettreAJourMarkerAdresse("Un problème de géolocalisation est survenu : "+status+".");
297
			}
298
		});
299
	}
300
}
301
 
302
function mettreAJourMarkerStatut(str) {
303
	document.getElementById('marqueur-statut').innerHTML = str;
304
}
305
 
306
function mettreAJourMarkerPosition(latLng) {
744 jpm 307
	var lat = latLng.lat().toFixed(5);
308
	var lon = latLng.lng().toFixed(5);
309
	document.getElementById('marqueur-wgs84').innerHTML = [lat, lon].join(', ');
310
	$("#marqueur-coordonnees").data('latLon', {'lat' : lat, 'lon' : lon});
311
 
312
	Proj4js.defs["EPSG:4326"] = "+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs";
313
	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 ";
314
	var source = new Proj4js.Proj('EPSG:4326');// Coordonnées source : WGS 84
315
	var dest = new Proj4js.Proj('EPSG:2154');// Coordonnées destination  : Lambert 93
316
	var p = new Proj4js.Point(lon+','+lat);//lon+','+lat any object will do as long as it has 'x' and 'y' properties
317
	Proj4js.transform(source, dest, p);
318
	//Proj4js.reportError = function(msg) {alert(msg);}
319
	//console.log(p.toString());
320
	document.getElementById('marqueur-lambert93').innerHTML = [p.x.toFixed(0)+' '+dest.units, p.y.toFixed(0)+' '+dest.units].join(', ');
719 jpm 321
}
322
 
323
function mettreAJourMarkerAdresse(str) {
324
	document.getElementById('marqueur-adresse').innerHTML = str;
325
}
326