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",
33
			latitude : "required",
34
			longitude : "required"
35
		}
36
	});
37
 
712 jpm 38
	$("#date").datepicker($.datepicker.regional['fr']);
39
 
40
	$("#courriel-confirmation").bind('paste', function(e) {
41
		$("#dialogue-bloquer-copier-coller").dialog();
42
		return false;
43
	});
44
 
719 jpm 45
	$("#localiser-gg-map").fancybox({
46
		'modal'			: true,
47
		'autoDimensions' : true,
48
		'titleShow'		: false,
49
		'onClosed'		: function() {
50
		    $("#gg-map").hide();
51
		},
52
		'onStart'		: function(e) {
53
			arreter(e);
54
			$("#gg-map-localisation").height($(window).height() - 100);
55
			$("#gg-map-carte").height($(window).height() - 230);
56
			$("#gg-map-localisation").width($(window).width() - 100);
57
		},
58
		'onComplete'	: function() {
59
			initialiserCarte();
60
		}
61
	});
62
 
63
	$("#valider-coordonnees").click(function(e) {
64
		var coordonnees = $("#marqueur-coordonnees").data('latLon');
65
		if (coordonnees != undefined) {
66
			$("#latitude").val(coordonnees.lat);
67
			$("#longitude").val(coordonnees.lon);
68
		}
69
		$.fancybox.close();
70
	});
71
	$("#annuler-coordonnees").bind('click', function(e) {
72
		$.fancybox.close();
73
	});
74
 
712 jpm 75
	var obsNumero = 0;
719 jpm 76
	$("#ajouter-obs").bind('click', function(e) {
77
		if ($("#saisie-obs").valid() == false) {
78
			$("#dialogue-form-invalide").dialog();
79
		} else {
80
			obsNumero = obsNumero + 1;
81
			$("#liste-obs tbody").append(
82
				'<tr id="obs'+obsNumero+'" class="obs">'+
83
					'<td>'+obsNumero+'</td>'+
84
					'<td>'+$("#date").val()+'</td>'+
85
					'<td>'+$("#taxon option:selected").text()+'</td>'+
86
					'<td>'+$("#milieu option:selected").text()+'</td>'+
87
					'<td>'+$("#latitude").val()+'</td>'+
88
					'<td>'+$("#longitude").val()+'</td>'+
89
					'<td>'+$("#notes").val()+'</td>'+
90
					'<td><button class="supprimer-obs" value="'+obsNumero+'" title="'+obsNumero+'">Supprimer</button></td>'+
91
				'</tr>');
92
			var numNomSel = $("#taxon").val();
93
			$("#liste-obs").data('obsId'+obsNumero, {
94
				'date' : $("#date").val(),
95
				'num_nom_sel' : numNomSel,
96
				'nom_sel' : taxons[numNomSel]['nom_sel'],
97
				'nom_ret' : taxons[numNomSel]['nom_ret'],
98
				'num_nom_ret' : taxons[numNomSel]['num_nom_ret'],
99
				'num_taxon' : taxons[numNomSel]['num_taxon'],
100
				'famille' : taxons[numNomSel]['famille'],
101
				'nom_fr' : taxons[numNomSel]['nom_fr'],
102
				'milieu' : $("#milieu option:selected").val(),
103
				'latitude' : $("#latitude").val(),
104
				'longitude' : $("#longitude").val(),
105
				'tag' : 'Biodiversite34',
106
				'notes' : $("#notes").val()});
107
		}
712 jpm 108
	});
109
 
110
	$(".supprimer-obs").live('click', function() {
111
		var obsId = $(this).val();
719 jpm 112
		// Problème avec IE 6 et 7
113
		if (obsId == "Supprimer") {
114
			obsId = $(this).attr("title");
115
		}
116
 
117
		$('#obs'+obsId).remove();
118
		$("#liste-obs").removeData('obsId'+obsId)
712 jpm 119
	});
120
 
719 jpm 121
	$("#tramsmettre-obs").click(function(e) {
712 jpm 122
		var observations = $("#liste-obs").data();
719 jpm 123
 
124
		if (observations == undefined || jQuery.isEmptyObject(observations)) {
712 jpm 125
			$("#dialogue-zero-obs").dialog();
719 jpm 126
		} else if ($("#saisie-obs").valid() == false) {
127
			$("#dialogue-form-invalide").dialog();
712 jpm 128
		} else {
719 jpm 129
			var utilisateur = new Object();
130
			utilisateur.prenom = $("#prenom").val();
131
			utilisateur.nom = $("#nom").val();
132
			utilisateur.courriel = $("#courriel").val();
133
			observations['utilisateur'] = utilisateur;
134
 
135
			//"http://localhost/cel-jrest/CelWidgetSaisie"
136
			$.ajax({
137
				url : "http://www.tela-botanica.org/eflore-test/cel2/jrest/CelWidgetSaisie",
138
				type : "POST",
139
				data : observations,
140
				context : document.body,
141
				beforeSend : function() {
142
					$("#msg").remove();
143
					$("#msg-erreur").remove();
144
					$("#msg-debug").remove();
145
				},
146
				statusCode : {
147
				    500 : function(jqXHR, textStatus, errorThrown) {
148
						$("#dialogue-obs-transaction").append('<p id="msg">Un problème est survenu lors de la transmission de vos observations.</p>');
149
						reponse = jQuery.parseJSON(jqXHR.responseText);
150
						var erreurMsg = "";
151
						if (reponse != null) {
152
							$.each(reponse, function (cle, valeur) {
153
								erreurMsg += valeur + "<br />";
154
							});
155
						}
156
 
157
						$("#dialogue-obs-transaction").append('<p id="msg-erreur">Erreur 500 : '+errorThrown+"<br />"+erreurMsg+'</p>');
158
				    }
159
				},
160
				success : function(data, textStatus, jqXHR) {
161
					$("#dialogue-obs-transaction").append('<p id="msg">Vos observations ont bien été transmises.</p>');
162
				},
163
				complete : function(jqXHR, textStatus) {
164
					var debugMsg = "";
165
					if (DEBUG && jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
166
						debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
167
						if (debugInfos != null) {
168
							$.each(debugInfos, function (cle, valeur) {
169
								debugMsg += valeur + "<br />";
170
							});
171
							$("#dialogue-obs-transaction").append('<pre id="msg-debug">Débogage : '+debugMsg+'</pre>');
172
						}
173
					}
174
 
175
					$("#dialogue-obs-transaction").dialog();
176
					$("#liste-obs").removeData();
177
					$('.obs').remove();
178
					obsNumero = 0;
179
				},
180
 
712 jpm 181
			});
182
		}
719 jpm 183
		return false;
184
	});
185
});
712 jpm 186
 
719 jpm 187
//+---------------------------------------------------------------------------------------------------------+
188
// GOOGLE MAP
189
 
190
var geocoder;
191
var latLng;
192
var map;
193
var marker;
194
var osmMapType;
195
function initialiserCarte() {
196
	geocoder = new google.maps.Geocoder();
197
	latLng = new google.maps.LatLng(43.577, 3.455);
198
	osmMapType = new google.maps.ImageMapType({
199
		getTileUrl: function(coord, zoom) {
200
			return "http://tile.openstreetmap.org/" +
201
			zoom + "/" + coord.x + "/" + coord.y + ".png";
202
		},
203
		tileSize: new google.maps.Size(256, 256),
204
		isPng: true,
205
		alt: "OpenStreetMap",
206
		name: "OSM",
207
		maxZoom: 19
712 jpm 208
	});
719 jpm 209
	map = new google.maps.Map(document.getElementById('gg-map-carte'), {
210
		zoom: 9,
211
		center: latLng,
212
		mapTypeId: google.maps.MapTypeId.ROADMAP,
213
		mapTypeControlOptions: {
214
			mapTypeIds: ['OSM', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.TERRAIN],
215
			style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}
216
	});
217
 
218
	map.mapTypes.set('OSM', osmMapType);
219
	map.setMapTypeId(google.maps.MapTypeId.HYBRID);
220
 
221
	marker = new google.maps.Marker({
222
		position: latLng,
223
		title: 'Ma station',
224
		map: map,
225
		draggable: true
226
	});
227
 
228
	// Update current position info.
229
	mettreAJourMarkerPosition(latLng);
230
	geocoderPosition(latLng);
231
 
232
	// Add dragging event listeners.
233
	google.maps.event.addListener(marker, 'dragstart', function() {
234
		mettreAJourMarkerAdresse('Marqueur de station début du déplacement...');
235
	});
236
 
237
	google.maps.event.addListener(marker, 'drag', function() {
238
		mettreAJourMarkerStatut('Marqueur de station en cours de déplacement...');
239
		mettreAJourMarkerPosition(marker.getPosition());
240
	});
241
 
242
	google.maps.event.addListener(marker, 'dragend', function() {
243
		mettreAJourMarkerStatut('Marqueur de station déplacé (glisser/déposer).');
244
		mettreAJourMarkerPosition(marker.getPosition());
245
		geocoderPosition(marker.getPosition());
246
	});
247
 
248
	google.maps.event.addListener(map, 'click', function(event) {
249
		deplacerMarker(event.latLng);
250
	});
251
}
252
 
253
function geocoderPosition(pos) {
254
	if (geocoder != undefined) {
255
		geocoder.geocode({
256
			latLng: pos
257
		}, function(responses, status) {
258
			if (status == google.maps.GeocoderStatus.OK) {
259
				if (responses && responses.length > 0) {
260
					mettreAJourMarkerAdresse(responses[0].formatted_address);
261
					console.log(responses);
262
				} else {
263
					mettreAJourMarkerAdresse("Impossible de trouver d'adresse pour cette position.");
264
				}
265
			} else {
266
				mettreAJourMarkerAdresse("Un problème de géolocalisation est survenu : "+status+".");
267
			}
268
		});
269
	}
270
}
271
 
272
function mettreAJourMarkerStatut(str) {
273
	document.getElementById('marqueur-statut').innerHTML = str;
274
}
275
 
276
function mettreAJourMarkerPosition(latLng) {
277
	document.getElementById('marqueur-coordonnees').innerHTML = [
278
		latLng.lat().toFixed(5),
279
		latLng.lng().toFixed(5)
280
	].join(', ');
281
	$("#marqueur-coordonnees").data('latLon', {'lat' : latLng.lat().toFixed(5), 'lon' : latLng.lng().toFixed(5)});
282
}
283
 
284
function mettreAJourMarkerAdresse(str) {
285
	document.getElementById('marqueur-adresse').innerHTML = str;
286
}
287
 
288
function deplacerMarker(latLon) {
289
	if (marker != undefined) {
290
		marker.setPosition(latLon);
291
		mettreAJourMarkerStatut('Marqueur de station déplacé (clic).');
292
		mettreAJourMarkerPosition(marker.getPosition());
293
		geocoderPosition(marker.getPosition());
294
	}
295
}