Subversion Repositories eFlore/Applications.cel

Rev

Rev 1093 | Rev 1108 | Go to most recent revision | Only display areas with differences | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 1093 Rev 1105
1
//+---------------------------------------------------------------------------------------------------------+
1
//+---------------------------------------------------------------------------------------------------------+
2
// GÉNÉRAL
2
// GÉNÉRAL
3
/**
3
/**
4
 * Stope l'évènement courrant quand on clique sur un lien.
4
 * Stope l'évènement courrant quand on clique sur un lien.
5
 * Utile pour Chrome, Safari...
5
 * Utile pour Chrome, Safari...
6
 * @param evenement
6
 * @param evenement
7
 * @return
7
 * @return
8
 */
8
 */
9
function arreter(evenement) {
9
function arreter(evenement) {
10
	if (evenement.stopPropagation) {
10
	if (evenement.stopPropagation) {
11
		evenement.stopPropagation();
11
		evenement.stopPropagation();
12
	}
12
	}
13
	return false;
13
	return false;
14
}
14
}
15
// TODO : voir si cette fonction est bien utile. Résoud le pb d'un warning sous chrome.
15
// TODO : voir si cette fonction est bien utile. Résoud le pb d'un warning sous chrome.
16
(function(){
16
(function(){
17
    // remove layerX and layerY
17
    // remove layerX and layerY
18
    var all = $.event.props,
18
    var all = $.event.props,
19
        len = all.length,
19
        len = all.length,
20
        res = [];
20
        res = [];
21
    while (len--) {
21
    while (len--) {
22
      var el = all[len];
22
      var el = all[len];
23
      if (el != 'layerX' && el != 'layerY') res.push(el);
23
      if (el != 'layerX' && el != 'layerY') res.push(el);
24
    }
24
    }
25
    $.event.props = res;
25
    $.event.props = res;
26
}());
26
}());
27
 
27
 
28
//+----------------------------------------------------------------------------------------------------------+
28
//+----------------------------------------------------------------------------------------------------------+
29
//UPLOAD PHOTO : Traitement de l'image 
29
//UPLOAD PHOTO : Traitement de l'image 
30
$(document).ready(function() {	
30
$(document).ready(function() {	
31
 
31
 
32
	$("#effacer-miniature").click(function () {
32
	$("#effacer-miniature").click(function () {
33
		supprimerMiniature();
33
		supprimerMiniature();
34
	});
34
	});
35
	
35
	
36
	$("#fichier").bind('change', function () {
36
	$("#fichier").bind('change', function () {
37
		$("#form-upload").ajaxSubmit(options);
37
		$("#form-upload").ajaxSubmit(options);
38
		return false;
38
		return false;
39
	});
39
	});
40
	
40
	
41
	//prepare the form when the DOM is ready 
41
	//prepare the form when the DOM is ready 
42
	//create service object(proxy) using SMD (generated by the json result)
42
	//create service object(proxy) using SMD (generated by the json result)
43
	var options = { 
43
	var options = { 
44
		success: afficherMiniature, // post-submit callback 
44
		success: afficherMiniature, // post-submit callback 
45
		dataType: 'xml', // 'xml', 'script', or 'json' (expected server response type) 
45
		dataType: 'xml', // 'xml', 'script', or 'json' (expected server response type) 
46
		resetForm: true // reset the form after successful submit 
46
		resetForm: true // reset the form after successful submit 
47
	};
47
	};
48
});
48
});
49
 
49
 
50
function afficherMiniature(reponse) { 
50
function afficherMiniature(reponse) { 
51
	// 'responseXML' is the XML document returned by the server; we use 
51
	// 'responseXML' is the XML document returned by the server; we use 
52
	// jQuery to extract the content of the message node from the XML doc 
52
	// jQuery to extract the content of the message node from the XML doc 
53
	var miniatureUrl = $("miniature-url", reponse).text();
53
	var miniatureUrl = $("miniature-url", reponse).text();
54
	var imgNom = $("image-nom", reponse).text();
54
	var imgNom = $("image-nom", reponse).text();
55
	$("#miniature").empty();
55
	$("#miniature").empty();
56
	$("#miniature").append('<img id="miniature-img" class="miniature" alt="'+imgNom+'" src="'+miniatureUrl+'"/>');
56
	$("#miniature").append('<img id="miniature-img" class="miniature" alt="'+imgNom+'" src="'+miniatureUrl+'"/>');
57
	$("#effacer-miniature").show();
57
	$("#effacer-miniature").show();
58
	console.log(imgNom);
58
	console.log(imgNom);
59
	console.log(miniatureUrl);		
59
	console.log(miniatureUrl);		
60
}
60
}
61
 
61
 
62
function supprimerMiniature() {
62
function supprimerMiniature() {
63
	$("#miniature").empty();
63
	$("#miniature").empty();
64
	$("#effacer-miniature").hide();
64
	$("#effacer-miniature").hide();
65
}
65
}
66
 
66
 
67
//+----------------------------------------------------------------------------------------------------------+
67
//+----------------------------------------------------------------------------------------------------------+
68
// GOOGLE MAP
68
// GOOGLE MAP
69
var geocoder;
69
var geocoder;
70
var map;
70
var map;
71
var marker;
71
var marker;
72
var latLng;
72
var latLng;
73
 
73
 
74
function initialiserGoogleMap(){
74
function initialiserGoogleMap(){
75
	// Carte
75
	// Carte
76
	var latLng = new google.maps.LatLng(43.29545, 5.37458);
76
	var latLng = new google.maps.LatLng(43.29545, 5.37458);
77
	if (VILLE == 'Montpellier') {
77
	if (VILLE == 'Montpellier') {
78
		latLng = new google.maps.LatLng(43.61077, 3.87672);
78
		latLng = new google.maps.LatLng(43.61077, 3.87672);
79
	} else {
79
	} else {
80
		console.log('Ville:'+VILLE);
80
		console.log('Ville:'+VILLE);
81
	}
81
	}
-
 
82
	
-
 
83
	// Tentative de geocalisation
-
 
84
	if (navigator.geolocation) {
-
 
85
		navigator.geolocation.getCurrentPosition(function(position) {
-
 
86
			var latitude = position.coords.latitude;
-
 
87
			var longitude = position.coords.longitude;
-
 
88
			latLng = new google.maps.LatLng(latitude, longitude);
-
 
89
		});
-
 
90
	}
82
 
91
 
83
	var options = {
92
	var options = {
84
		zoom: 16,
93
		zoom: 16,
85
		center: latLng,
94
		center: latLng,
86
		mapTypeId: google.maps.MapTypeId.HYBRID,
95
		mapTypeId: google.maps.MapTypeId.HYBRID,
87
		mapTypeControlOptions: {
96
		mapTypeControlOptions: {
88
			mapTypeIds: ['OSM', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.TERRAIN]}
97
			mapTypeIds: ['OSM', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.TERRAIN]}
89
	};
98
	};
90
 
99
 
91
	// Ajout de la couche OSM à la carte
100
	// Ajout de la couche OSM à la carte
92
	osmMapType = new google.maps.ImageMapType({
101
	osmMapType = new google.maps.ImageMapType({
93
		getTileUrl: function(coord, zoom) {
102
		getTileUrl: function(coord, zoom) {
94
			return "http://tile.openstreetmap.org/" +
103
			return "http://tile.openstreetmap.org/" +
95
			zoom + "/" + coord.x + "/" + coord.y + ".png";
104
			zoom + "/" + coord.x + "/" + coord.y + ".png";
96
		},
105
		},
97
		tileSize: new google.maps.Size(256, 256),
106
		tileSize: new google.maps.Size(256, 256),
98
		isPng: true,
107
		isPng: true,
99
		alt: 'OpenStreetMap',
108
		alt: 'OpenStreetMap',
100
		name: 'OSM',
109
		name: 'OSM',
101
		maxZoom: 19
110
		maxZoom: 19
102
	});
111
	});
103
	
112
	
104
	// Création de la carte Google
113
	// Création de la carte Google
105
	map = new google.maps.Map(document.getElementById('map-canvas'), options); //affiche la google map dans la div map_canvas
114
	map = new google.maps.Map(document.getElementById('map-canvas'), options); //affiche la google map dans la div map_canvas
106
	map.mapTypes.set('OSM', osmMapType);
115
	map.mapTypes.set('OSM', osmMapType);
107
	
116
	
108
	// Geocodeur
117
	// Geocodeur
109
	geocoder = new google.maps.Geocoder();
118
	geocoder = new google.maps.Geocoder();
110
	console.log(GOOGLE_MAP_MARQUEUR_URL);
119
	console.log(GOOGLE_MAP_MARQUEUR_URL);
111
 
120
 
112
	// Marqueur google draggable
121
	// Marqueur google draggable
113
	marker = new google.maps.Marker({
122
	marker = new google.maps.Marker({
114
		map: map,
123
		map: map,
115
		draggable: true,
124
		draggable: true,
116
		title: 'Ma station',
125
		title: 'Ma station',
117
		icon: GOOGLE_MAP_MARQUEUR_URL,
126
		icon: GOOGLE_MAP_MARQUEUR_URL,
118
		position: latLng
127
		position: latLng
119
	});
128
	});
120
	
129
	
121
	deplacerMarker(latLng);
130
	deplacerMarker(latLng);
122
}
131
}
123
 
132
 
124
$(document).ready(function() {
133
$(document).ready(function() {
125
	
134
	
126
	initialiserGoogleMap();
135
	initialiserGoogleMap();
127
  
136
	
128
	$(function() {
-
 
129
		// Tentative de geocalisation
-
 
130
		if (navigator.geolocation) {
-
 
131
			navigator.geolocation.getCurrentPosition(function(position) {
-
 
132
				var latitude = position.coords.latitude;
-
 
133
				var longitude = position.coords.longitude;
-
 
134
				var altitude = position.coords.altitude;
-
 
135
				var geocalisation = new google.maps.LatLng(latitude, longitude);
-
 
136
				marker.setPosition(geocalisation);
-
 
137
				map.setCenter(geocalisation);
-
 
138
				$('#adresse').val(codeLatLng(marker.getPosition()));
-
 
139
				mettreAJourMarkerPosition(marker.getPosition());
-
 
140
			});
-
 
141
		}   
-
 
142
		
-
 
143
		// Autocompletion du champ adresse
137
	// Autocompletion du champ adresse
144
		$("#adresse").autocomplete({
138
	$("#rue").autocomplete({
145
			//Cette partie utilise geocoder pour extraire des valeurs d'adresse
139
		//Cette partie utilise geocoder pour extraire des valeurs d'adresse
146
			source: function(request, response) {
140
		source: function(request, response) {
147
				geocoder.geocode( {'address': request.term+', France', 'region' : 'fr' }, function(results, status) {
141
			geocoder.geocode( {'address': request.term+', France', 'region' : 'fr' }, function(results, status) {
148
					if (status == google.maps.GeocoderStatus.OK) {
-
 
149
						response($.map(results, function(item) {
-
 
150
							return {
-
 
151
								label: item.formatted_address,
-
 
152
								value: item.formatted_address,
-
 
153
								latitude: item.geometry.location.lat(),
-
 
154
								longitude: item.geometry.location.lng()
-
 
155
							}
-
 
156
						}));
-
 
157
					} else {
-
 
158
						afficherErreurGoogleMap(status);
-
 
159
					}
-
 
160
				})
-
 
161
			},
-
 
162
			// Cette partie est executee a la selection d'une adresse
-
 
163
			select: function(event, ui) {
-
 
164
				remplirChampLatitude(ui.item.latitude);
-
 
165
				remplirChampLongitude(ui.item.longitude);
-
 
166
				var latLng = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
-
 
167
				deplacerMarker(latLng);
-
 
168
				map.setCenter(latLng);
-
 
169
				map.setZoom(19);
-
 
170
			}
-
 
171
		});
-
 
172
		
-
 
173
		google.maps.event.addListener(marker, 'dragend', function() {
-
 
174
			trouverCommune(marker.getPosition());
-
 
175
			geocoder.geocode({'latLng': marker.getPosition()}, function(results, status) {
-
 
176
				if (status == google.maps.GeocoderStatus.OK) {
142
				if (status == google.maps.GeocoderStatus.OK) {
-
 
143
					response($.map(results, function(item) {
-
 
144
						var rue = "";
-
 
145
						$.each(item.address_components, function(){
-
 
146
							if (this.types[0] == "route" || this.types[0] == "street_address" ) {
-
 
147
								rue = this.short_name;
-
 
148
							}
-
 
149
						});
177
					if (results[0]) {
150
						var retour = {
178
						$('#adresse').val(results[0].formatted_address);
151
							label: item.formatted_address,
-
 
152
							value: rue,
179
						mettreAJourMarkerPosition(marker.getPosition());
153
							latitude: item.geometry.location.lat(),
-
 
154
							longitude: item.geometry.location.lng()
180
					}
155
						};
-
 
156
						return retour;
-
 
157
					}));
181
				} else  {
158
				} else {
182
					afficherErreurGoogleMap(status);
159
					afficherErreurGoogleMap(status);
183
				}
160
				}
184
			});
161
			})
185
		});
162
		},
186
	});
-
 
187
});
-
 
188
 
-
 
189
// Transforme les coordonnés en adresse (reverse geocoder)
163
		// Cette partie est executee a la selection d'une adresse
190
function codeLatLng() {
164
		select: function(event, ui) {
191
	var lat = parseFloat(document.getElementById("latitude").value);
-
 
192
	var lng = parseFloat(document.getElementById("longitude").value);
-
 
193
	var latlng = new google.maps.LatLng(lat, lng);
165
			var latLng = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
194
	geocoder.geocode({'latLng': latlng}, function(results, status) {
-
 
195
		if (status == google.maps.GeocoderStatus.OK) {
-
 
196
			if (results[0]) {
-
 
197
				marker.setPosition(latlng);
-
 
198
				map.setCenter(latlng);
166
			deplacerMarker(latLng);
199
				$('#adresse').val(results[0].formatted_address);
-
 
200
			}
-
 
201
		} else {
-
 
202
			afficherErreurGoogleMap(status);
-
 
203
		}
167
		}
204
	});
168
	});
205
}
169
	
-
 
170
	$("#geolocaliser").click(function() {
-
 
171
		var latitude = $('#latitude').val();
-
 
172
		var longitude = $('#longitude').val();
-
 
173
		latLng = new google.maps.LatLng(latitude, longitude);
-
 
174
		deplacerMarker(latLng);
-
 
175
	});
-
 
176
	
-
 
177
	google.maps.event.addListener(marker, 'dragend', function() {
-
 
178
		trouverCommune(marker.getPosition());
-
 
179
		mettreAJourMarkerPosition(marker.getPosition());
-
 
180
	});
-
 
181
	
-
 
182
	google.maps.event.addListener(map, 'click', function(event) {
-
 
183
		deplacerMarker(event.latLng);
-
 
184
	});
-
 
185
});
206
 
186
 
207
function afficherErreurGoogleMap(status) {
187
function afficherErreurGoogleMap(status) {
208
	if (DEBUG) {
188
	if (DEBUG) {
209
		$("#dialogue-google-map").empty();
189
		$("#dialogue-google-map").empty();
210
		$("#dialogue-google-map").append('<pre class="msg-erreur">'+
190
		$("#dialogue-google-map").append('<pre class="msg-erreur">'+
211
			"Le service de Géocodage de Google Map a échoué à cause de l'erreur : "+status+
191
			"Le service de Géocodage de Google Map a échoué à cause de l'erreur : "+status+
212
			'</pre>');
192
			'</pre>');
213
		$("#dialogue-google-map").dialog();
193
		$("#dialogue-google-map").dialog();
214
	}
194
	}
215
}
195
}
216
 
196
 
217
function deplacerMarker(latLon) {
197
function deplacerMarker(latLng) {
218
	if (marker != undefined) {
198
	if (marker != undefined) {
-
 
199
		marker.setPosition(latLng);
-
 
200
		map.setCenter(latLng);
219
		marker.setPosition(latLon);
201
		//map.setZoom(18);
220
		mettreAJourMarkerPosition(marker.getPosition());
202
		mettreAJourMarkerPosition(latLng);
221
		trouverCommune(marker.getPosition());
203
		trouverCommune(latLng);
222
	}
204
	}
223
}
205
}
224
 
206
 
225
function mettreAJourMarkerPosition(latLng) {
207
function mettreAJourMarkerPosition(latLng) {
226
	var lat = latLng.lat().toFixed(5);
208
	var lat = latLng.lat().toFixed(5);
227
	var lng = latLng.lng().toFixed(5); 
209
	var lng = latLng.lng().toFixed(5); 
228
	remplirChampLatitude(lat);
210
	remplirChampLatitude(lat);
229
	remplirChampLongitude(lng);
211
	remplirChampLongitude(lng);
230
}
212
}
231
 
213
 
232
function remplirChampLatitude(latDecimale) {
214
function remplirChampLatitude(latDecimale) {
233
	var lat = Math.round(latDecimale*100000)/100000;
215
	var lat = Math.round(latDecimale*100000)/100000;
234
	$('#latitude').val(lat);
216
	$('#latitude').val(lat);
235
}
217
}
236
 
218
 
237
function remplirChampLongitude(lngDecimale) {
219
function remplirChampLongitude(lngDecimale) {
238
	var lng = Math.round(lngDecimale*100000)/100000;
220
	var lng = Math.round(lngDecimale*100000)/100000;
239
	$('#longitude').val(lng);
221
	$('#longitude').val(lng);
240
}
222
}
241
 
223
 
242
function trouverCommune(pos) {
224
function trouverCommune(pos) {
243
	$(function() {
225
	$(function() {
244
		var urlNomCommuneFormatee = SERVICE_NOM_COMMUNE_URL.replace('{lat}', pos.lat()).replace('{lon}', pos.lng());
226
		var urlNomCommuneFormatee = SERVICE_NOM_COMMUNE_URL.replace('{lat}', pos.lat()).replace('{lon}', pos.lng());
245
		$.ajax({
227
		$.ajax({
246
			url : urlNomCommuneFormatee,
228
			url : urlNomCommuneFormatee,
247
			type : "GET",
229
			type : "GET",
248
			dataType : "jsonp",
230
			dataType : "jsonp",
249
			beforeSend : function() {
231
			beforeSend : function() {
250
				$(".commune-info").empty();	
232
				$(".commune-info").empty();	
251
				$("#dialogue-erreur").empty();
233
				$("#dialogue-erreur").empty();
252
			},
234
			},
253
			success : function(data, textStatus, jqXHR) {
235
			success : function(data, textStatus, jqXHR) {
254
				$(".commune-info").empty();
236
				$(".commune-info").empty();
255
				$("#commune-nom").append(data.nom);
237
				$("#commune-nom").append(data.nom);
256
				$("#commune-code-insee").append(data.codeINSEE);
238
				$("#commune-code-insee").append(data.codeINSEE);
257
				$("#marqueur-commune").data('commune', {'nom' : data.nom, 'codeInsee' : data.codeINSEE});
239
				$("#marqueur-commune").data('commune', {'nom' : data.nom, 'codeInsee' : data.codeINSEE});
258
			},
240
			},
259
			statusCode : {
241
			statusCode : {
260
			    500 : function(jqXHR, textStatus, errorThrown) {
242
			    500 : function(jqXHR, textStatus, errorThrown) {
261
					if (DEBUG) {	
243
					if (DEBUG) {	
262
						$("#dialogue-erreur").append('<p id="msg">Un problème est survenu lors de l\'appel au service fournissante le nom des communes.</p>');
244
						$("#dialogue-erreur").append('<p id="msg">Un problème est survenu lors de l\'appel au service fournissante le nom des communes.</p>');
263
						reponse = jQuery.parseJSON(jqXHR.responseText);
245
						reponse = jQuery.parseJSON(jqXHR.responseText);
264
						var erreurMsg = "";
246
						var erreurMsg = "";
265
						if (reponse != null) {
247
						if (reponse != null) {
266
							$.each(reponse, function (cle, valeur) {
248
							$.each(reponse, function (cle, valeur) {
267
								erreurMsg += valeur + "<br />";
249
								erreurMsg += valeur + "<br />";
268
							});
250
							});
269
						}
251
						}
270
						
252
						
271
						$("#dialogue-erreur").append('<p class="msg-erreur">Erreur 500 : '+errorThrown+"<br />"+erreurMsg+'</p>');
253
						$("#dialogue-erreur").append('<p class="msg-erreur">Erreur 500 : '+errorThrown+"<br />"+erreurMsg+'</p>');
272
					}
254
					}
273
			    }
255
			    }
274
			},
256
			},
275
			error : function(jqXHR, textStatus, errorThrown) {
257
			error : function(jqXHR, textStatus, errorThrown) {
276
				if (DEBUG) {
258
				if (DEBUG) {
277
					$("#dialogue-erreur").append('<p class="msg">Une erreur Ajax est survenue lors de la transmission de vos observations.</p>');
259
					$("#dialogue-erreur").append('<p class="msg">Une erreur Ajax est survenue lors de la transmission de vos observations.</p>');
278
					reponse = jQuery.parseJSON(jqXHR.responseText);
260
					reponse = jQuery.parseJSON(jqXHR.responseText);
279
					var erreurMsg = "";
261
					var erreurMsg = "";
280
					if (reponse != null) {
262
					if (reponse != null) {
281
						$.each(reponse, function (cle, valeur) {
263
						$.each(reponse, function (cle, valeur) {
282
							erreurMsg += valeur + "<br />";
264
							erreurMsg += valeur + "<br />";
283
						});
265
						});
284
					}
266
					}
285
					
267
					
286
					$("#dialogue-erreur").append('<p class="msg-erreur">Erreur Ajax : '+errorThrown+' (type : '+textStatus+') <br />'+erreurMsg+'</p>');
268
					$("#dialogue-erreur").append('<p class="msg-erreur">Erreur Ajax : '+errorThrown+' (type : '+textStatus+') <br />'+erreurMsg+'</p>');
287
				}
269
				}
288
			},
270
			},
289
			complete : function(jqXHR, textStatus) {
271
			complete : function(jqXHR, textStatus) {
290
				if (DEBUG && jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
272
				if (DEBUG && jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
291
					var debugMsg = "";
273
					var debugMsg = "";
292
					debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
274
					debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
293
					if (debugInfos != null) {
275
					if (debugInfos != null) {
294
						$.each(debugInfos, function (cle, valeur) {
276
						$.each(debugInfos, function (cle, valeur) {
295
							debugMsg += valeur + "<br />";
277
							debugMsg += valeur + "<br />";
296
						});
278
						});
297
						$("#dialogue-erreur").append('<pre class="msg-debug msg">Débogage : '+debugMsg+'</pre>');
279
						$("#dialogue-erreur").append('<pre class="msg-debug msg">Débogage : '+debugMsg+'</pre>');
298
					}
280
					}
299
				}
281
				}
300
				if ($("#dialogue-erreur .msg").length > 0) {
282
				if ($("#dialogue-erreur .msg").length > 0) {
301
					$("#dialogue-erreur").dialog();
283
					$("#dialogue-erreur").dialog();
302
				}
284
				}
303
			}
285
			}
304
		});
286
		});
305
	});
287
	});
306
}
288
}
307
 
289
 
308
//+---------------------------------------------------------------------------------------------------------+
290
//+---------------------------------------------------------------------------------------------------------+
309
// FORMULAIRE
291
// FORMULAIRE
310
$(document).ready(function() {
292
$(document).ready(function() {
311
	$("form#saisie-obs").validate({
293
	$("form#saisie-obs").validate({
312
		rules: {
294
		rules: {
313
			courriel : {
295
			courriel : {
314
				required : true,
296
				required : true,
315
				email : true},
297
				email : true},
316
			courriel_confirmation : {
298
			courriel_confirmation : {
317
				required : true,
299
				required : true,
318
				equalTo: "#courriel"
300
				equalTo: "#courriel"
319
			},
301
			},
320
			rue : "required",
302
			rue : "required",
321
			rue_num_debut : {
303
			rue_num_debut : {
322
				required : true,
304
				required : true,
323
				digits : true,
305
				digits : true,
324
				min : 1},
306
				min : 1},
325
			rue_num_fin : {
307
			rue_num_fin : {
326
				required : true,
308
				required : true,
327
				digits : true,
309
				digits : true,
328
				min : 1},
310
				min : 1},
329
			rue_cote : "required",
311
			rue_cote : "required",
330
			milieu : "required",
312
			milieu : "required",
331
			latitude : {
313
			latitude : {
332
				required: true,
314
				required: true,
333
				range: [-90, 90]},
315
				range: [-90, 90]},
334
			longitude : {
316
			longitude : {
335
				required: true,
317
				required: true,
336
				range: [-180, 180]},
318
				range: [-180, 180]},
337
			date : {
319
			date : {
338
				required: true,
320
				required: true,
339
				date: true},
321
				date: true},
340
			taxon : "required"
322
			taxon : "required"
341
		}
323
		}
342
	});
324
	});
343
	
325
	
344
	$("#date").datepicker($.datepicker.regional['fr']);
326
	$("#date").datepicker($.datepicker.regional['fr']);
345
	
327
	
346
	$("#courriel_confirmation").bind('paste', function(e) {
328
	$("#courriel_confirmation").bind('paste', function(e) {
347
		$("#dialogue-bloquer-copier-coller").dialog();
329
		$("#dialogue-bloquer-copier-coller").dialog();
348
		return false;
330
		return false;
349
	});
331
	});
350
		
332
		
351
	//bascule le texte d'afficher à masquer
333
	//bascule le texte d'afficher à masquer
352
	$("a.afficher-coord").click(function() {
334
	$("a.afficher-coord").click(function() {
353
		$("a.afficher-coord").toggle();
335
		$("a.afficher-coord").toggle();
354
		$("#coordonnees-geo").toggle('slow');
336
		$("#coordonnees-geo").toggle('slow');
355
		//valeur false pour que le lien ne soit pas suivi
337
		//valeur false pour que le lien ne soit pas suivi
356
		return false
338
		return false
357
	});
339
	});
358
	
340
	
359
	var obsNumero = 0;
341
	var obsNumero = 0;
360
	$("#ajouter-obs").bind('click', function(e) {
342
	$("#ajouter-obs").bind('click', function(e) {
361
		if ($("#saisie-obs").valid() == false) {
343
		if ($("#saisie-obs").valid() == false) {
362
			$("#dialogue-form-invalide").dialog();
344
			$("#dialogue-form-invalide").dialog();
363
		} else {
345
		} else {
364
			//rassemble les obs dans un tableau html
346
			//rassemble les obs dans un tableau html
365
			obsNumero = obsNumero + 1;
347
			obsNumero = obsNumero + 1;
366
			$("#liste-obs tbody").append(
348
			$("#liste-obs tbody").append(
367
					'<tr id="obs'+obsNumero+'" class="obs">'+
349
					'<tr id="obs'+obsNumero+'" class="obs">'+
368
					'<td>'+obsNumero+'</td>'+
350
					'<td>'+obsNumero+'</td>'+
369
					'<td>'+$("#date").val()+'</td>'+
351
					'<td>'+$("#date").val()+'</td>'+
370
					'<td>'+$("#adresse").val()+'</td>'+
352
					'<td>'+$("#adresse").val()+'</td>'+
371
					'<td>'+$("#taxon option:selected").text()+'</td>'+
353
					'<td>'+$("#taxon option:selected").text()+'</td>'+
372
					'<td>'+$('input[name=milieu]:checked').val()+'</td>'+
354
					'<td>'+$('input[name=milieu]:checked').val()+'</td>'+
373
					'<td>'+$("#latitude").val()+' / '+$("#longitude").val()+'</td>'+
355
					'<td>'+$("#latitude").val()+' / '+$("#longitude").val()+'</td>'+
374
					//Ajout du champ photo
356
					//Ajout du champ photo
375
					'<td class="obs-miniature">'+ajouterImgMiniature()+'</td>'+
357
					'<td class="obs-miniature">'+ajouterImgMiniature()+'</td>'+
376
					'<td>'+$("#notes").val()+'</td>'+
358
					'<td>'+$("#notes").val()+'</td>'+
377
					'<td><button class="supprimer-obs" value="'+obsNumero+'" title="Supprimer l\'observation '+obsNumero+'">'+
359
					'<td><button class="supprimer-obs" value="'+obsNumero+'" title="Supprimer l\'observation '+obsNumero+'">'+
378
					'<img src="'+SUPPRIMER_ICONE_URL+'"/></button></td>'+
360
					'<img src="'+SUPPRIMER_ICONE_URL+'"/></button></td>'+
379
				'</tr>');
361
				'</tr>');
380
			//rassemble les obs dans #liste-obs
362
			//rassemble les obs dans #liste-obs
381
			var numNomSel = $("#taxon").val();
363
			var numNomSel = $("#taxon").val();
382
			$("#liste-obs").data('obsId'+obsNumero, {
364
			$("#liste-obs").data('obsId'+obsNumero, {
383
				'date' : $("#date").val(), 
365
				'date' : $("#date").val(), 
384
				'num_nom_sel' : numNomSel,
366
				'num_nom_sel' : numNomSel,
385
				'nom_sel' : taxons[numNomSel]['nom_sel'],
367
				'nom_sel' : taxons[numNomSel]['nom_sel'],
386
				'nom_ret' : taxons[numNomSel]['nom_ret'],
368
				'nom_ret' : taxons[numNomSel]['nom_ret'],
387
				'num_nom_ret' : taxons[numNomSel]['num_nom_ret'],
369
				'num_nom_ret' : taxons[numNomSel]['num_nom_ret'],
388
				'num_taxon' : taxons[numNomSel]['num_taxon'],
370
				'num_taxon' : taxons[numNomSel]['num_taxon'],
389
				'famille' : taxons[numNomSel]['famille'],
371
				'famille' : taxons[numNomSel]['famille'],
390
				'nom_fr' : taxons[numNomSel]['nom_fr'],
372
				'nom_fr' : taxons[numNomSel]['nom_fr'],
391
				'milieu' : $('input[name=milieu]:checked').val(),
373
				'milieu' : $('input[name=milieu]:checked').val(),
392
				'latitude' : $("#latitude").val(),
374
				'latitude' : $("#latitude").val(),
393
				'longitude' : $("#longitude").val(),
375
				'longitude' : $("#longitude").val(),
394
				'commune_nom' : '',// TODO : utiliser le web service
376
				'commune_nom' : $("#commune-nom").text(),
395
				'commune_code_insee' : '',// TODO : utiliser le web service
377
				'commune_code_insee' : $("#commune-code-insee").text(),
396
				'lieu_dit' : $("#rue").val(),
378
				'lieu_dit' : $("#rue").val(),
397
				'station' : $("#rue_num_debut").val()+'-'+$("#rue_num_fin").val()+'-'+$("#rue_cote").val(),
379
				'station' : $("#rue_num_debut").val()+'-'+$("#rue_num_fin").val()+'-'+$("#rue_cote").val(),
398
				'notes' : $("#notes").val(),
380
				'notes' : $("#notes").val(),
399
				//Ajout des champs images
381
				//Ajout des champs images
400
				'image_nom' : $("#miniature-img").attr('alt'),
382
				'image_nom' : $("#miniature-img").attr('alt'),
401
				'image_b64' : ''// TODO : ajoute le support HTML5
383
				'image_b64' : ''// TODO : ajoute le support HTML5
402
			});
384
			});
403
		}
385
		}
404
	});
386
	});
405
	
387
	
406
	$(".supprimer-obs").live('click', function() {
388
	$(".supprimer-obs").live('click', function() {
407
		var obsId = $(this).val();
389
		var obsId = $(this).val();
408
		// Problème avec IE 6 et 7
390
		// Problème avec IE 6 et 7
409
		if (obsId == "Supprimer") {
391
		if (obsId == "Supprimer") {
410
			obsId = $(this).attr("title");
392
			obsId = $(this).attr("title");
411
		}
393
		}
412
		
394
		
413
		$('#obs'+obsId).remove();
395
		$('#obs'+obsId).remove();
414
		$("#liste-obs").removeData('obsId'+obsId)
396
		$("#liste-obs").removeData('obsId'+obsId)
415
	});
397
	});
416
	
398
	
417
	// TODO : remplacer par du jquery
399
	// TODO : remplacer par du jquery
418
	//document.getElementById('image_file').addEventListener('change', handleFileSelect, false);
400
	//document.getElementById('image_file').addEventListener('change', handleFileSelect, false);
419
	
401
	
420
	$("#transmettre-obs").click(function(e) {
402
	$("#transmettre-obs").click(function(e) {
421
		var observations = $("#liste-obs").data();
403
		var observations = $("#liste-obs").data();
422
		
404
		
423
		if (observations == undefined || jQuery.isEmptyObject(observations)) {
405
		if (observations == undefined || jQuery.isEmptyObject(observations)) {
424
			$("#dialogue-zero-obs").dialog();
406
			$("#dialogue-zero-obs").dialog();
425
		} else if ($("#saisie-obs").valid() == false) {
407
		} else if ($("#saisie-obs").valid() == false) {
426
			$("#dialogue-form-invalide").dialog();
408
			$("#dialogue-form-invalide").dialog();
427
		} else {
409
		} else {
428
			observations['projet'] = 'Sauvages';
410
			observations['projet'] = 'Sauvages';
429
			
411
			
430
			var utilisateur = new Object();
412
			var utilisateur = new Object();
431
			utilisateur.prenom = $("#prenom").val();
413
			utilisateur.prenom = $("#prenom").val();
432
			utilisateur.nom = $("#nom").val();
414
			utilisateur.nom = $("#nom").val();
433
			utilisateur.courriel = $("#courriel").val();
415
			utilisateur.courriel = $("#courriel").val();
434
			observations['utilisateur'] = utilisateur;
416
			observations['utilisateur'] = utilisateur;
435
			
417
			
436
			var erreurMsg = "";
418
			var erreurMsg = "";
437
			$.ajax({
419
			$.ajax({
438
				url : SERVICE_SAISIE_URL,
420
				url : SERVICE_SAISIE_URL,
439
				type : "POST",
421
				type : "POST",
440
				data : observations,
422
				data : observations,
441
				dataType : "json",
423
				dataType : "json",
442
				beforeSend : function() {
424
				beforeSend : function() {
443
					$(".msg").remove();	
425
					$(".msg").remove();	
444
					$(".msg-erreur").remove();
426
					$(".msg-erreur").remove();
445
					$(".msg-debug").remove();
427
					$(".msg-debug").remove();
446
				},
428
				},
447
				success : function(data, textStatus, jqXHR) {
429
				success : function(data, textStatus, jqXHR) {
448
					$("#dialogue-obs-transaction").append('<p class="msg">Vos observations ont bien été transmises.</p>');
430
					$("#dialogue-obs-transaction").append('<p class="msg">Vos observations ont bien été transmises.</p>');
449
					supprimerMiniature();
431
					supprimerMiniature();
450
				},
432
				},
451
				statusCode : {
433
				statusCode : {
452
				    500 : function(jqXHR, textStatus, errorThrown) {
434
				    500 : function(jqXHR, textStatus, errorThrown) {
453
						erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
435
						erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
454
						reponse = jQuery.parseJSON(jqXHR.responseText);
436
						reponse = jQuery.parseJSON(jqXHR.responseText);
455
						if (reponse != null) {
437
						if (reponse != null) {
456
							$.each(reponse, function (cle, valeur) {
438
							$.each(reponse, function (cle, valeur) {
457
								erreurMsg += valeur + "\n";
439
								erreurMsg += valeur + "\n";
458
							});
440
							});
459
						}
441
						}
460
						if (DEBUG) {
442
						if (DEBUG) {
461
							$("#dialogue-obs-transaction").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
443
							$("#dialogue-obs-transaction").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
462
						}
444
						}
463
				    }
445
				    }
464
				},
446
				},
465
				error : function(jqXHR, textStatus, errorThrown) {
447
				error : function(jqXHR, textStatus, errorThrown) {
466
					erreurMsg += "Erreur Ajax :\ntype : "+textStatus+' '+errorThrown+"\n";
448
					erreurMsg += "Erreur Ajax :\ntype : "+textStatus+' '+errorThrown+"\n";
467
					reponse = jQuery.parseJSON(jqXHR.responseText);
449
					reponse = jQuery.parseJSON(jqXHR.responseText);
468
					if (reponse != null) {
450
					if (reponse != null) {
469
						$.each(reponse, function (cle, valeur) {
451
						$.each(reponse, function (cle, valeur) {
470
							erreurMsg += valeur + "\n";
452
							erreurMsg += valeur + "\n";
471
						});
453
						});
472
					}
454
					}
473
					
455
					
474
					if (DEBUG) {
456
					if (DEBUG) {
475
						$("#dialogue-obs-transaction").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
457
						$("#dialogue-obs-transaction").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
476
					}
458
					}
477
				},
459
				},
478
				complete : function(jqXHR, textStatus) {
460
				complete : function(jqXHR, textStatus) {
479
					var debugMsg = '';
461
					var debugMsg = '';
480
					if (jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
462
					if (jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
481
						debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
463
						debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
482
						if (debugInfos != null) {
464
						if (debugInfos != null) {
483
							$.each(debugInfos, function (cle, valeur) {
465
							$.each(debugInfos, function (cle, valeur) {
484
								debugMsg += valeur + "\n";
466
								debugMsg += valeur + "\n";
485
							});
467
							});
486
						}
468
						}
487
					}
469
					}
488
					if (erreurMsg != '') {
470
					if (erreurMsg != '') {
489
						$("#dialogue-obs-transaction").append('<p class="msg">'+
471
						$("#dialogue-obs-transaction").append('<p class="msg">'+
490
								'Une erreur est survenue lors de la transmission de vos observations.'+'<br />'+
472
								'Une erreur est survenue lors de la transmission de vos observations.'+'<br />'+
491
								'Vous pouvez signaler le disfonctionnement à <a href="'+
473
								'Vous pouvez signaler le disfonctionnement à <a href="'+
492
								'mailto:cel@tela-botanica.org'+'?'+
474
								'mailto:cel@tela-botanica.org'+'?'+
493
								'subject=Disfonctionnement du widget de saisie Biodiversite34'+
475
								'subject=Disfonctionnement du widget de saisie Biodiversite34'+
494
								"&body="+erreurMsg+"\nDébogage :\n"+debugMsg+
476
								"&body="+erreurMsg+"\nDébogage :\n"+debugMsg+
495
								'">cel@tela-botanica.org</a>.'+
477
								'">cel@tela-botanica.org</a>.'+
496
								'</p>');
478
								'</p>');
497
					}
479
					}
498
					if (DEBUG) {
480
					if (DEBUG) {
499
						$("#dialogue-obs-transaction").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
481
						$("#dialogue-obs-transaction").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
500
					}
482
					}
501
					
483
					
502
					$("#dialogue-obs-transaction").dialog();
484
					$("#dialogue-obs-transaction").dialog();
503
					$("#liste-obs").removeData();
485
					$("#liste-obs").removeData();
504
					$('.obs').remove();
486
					$('.obs').remove();
505
					obsNumero = 0;
487
					obsNumero = 0;
506
				}
488
				}
507
			});
489
			});
508
		}
490
		}
509
		return false;
491
		return false;
510
	});
492
	});
511
});
493
});
512
 
494
 
513
function ajouterImgMiniature() {
495
function ajouterImgMiniature() {
514
	var miniature = '';
496
	var miniature = '';
515
	if ($("#miniature img").length == 1) {
497
	if ($("#miniature img").length == 1) {
516
		var src = $("#miniature-img").attr("src");
498
		var src = $("#miniature-img").attr("src");
517
		var alt = $("#miniature-img").attr("alt");
499
		var alt = $("#miniature-img").attr("alt");
518
		miniature = '<img class="miniature" alt="'+alt+'"src="'+src+'" />';
500
		miniature = '<img class="miniature" alt="'+alt+'"src="'+src+'" />';
519
	}
501
	}
520
	return miniature;
502
	return miniature;
521
}
503
}
522
 
504
 
523
function handleFileSelect(evt) {
505
function handleFileSelect(evt) {
524
	// Check for the various File API support.
506
	// Check for the various File API support.
525
	if (window.File && window.FileReader && window.FileList && window.Blob) {
507
	if (window.File && window.FileReader && window.FileList && window.Blob) {
526
	// Great success! All the File APIs are supported.
508
	// Great success! All the File APIs are supported.
527
		var selectedfiles = evt.target.files; // FileList object
509
		var selectedfiles = evt.target.files; // FileList object
528
		
510
		
529
		// Loop through the FileList and render image files as thumbnails.
511
		// Loop through the FileList and render image files as thumbnails.
530
		for (var i = 0, f; f = selectedfiles[i]; i++) {
512
		for (var i = 0, f; f = selectedfiles[i]; i++) {
531
		
513
		
532
		  // Only process image files.
514
		  // Only process image files.
533
		  if (!f.type.match('image.*')) {
515
		  if (!f.type.match('image.*')) {
534
		    continue;
516
		    continue;
535
		  }
517
		  }
536
		
518
		
537
		  var reader = new FileReader();
519
		  var reader = new FileReader();
538
		
520
		
539
		  // Read in the image file as a data URL.
521
		  // Read in the image file as a data URL.
540
		  reader.readAsDataURL(f);
522
		  reader.readAsDataURL(f);
541
		  
523
		  
542
		  // Closure to capture the file information.
524
		  // Closure to capture the file information.
543
		  reader.onload = (function(theFile) {
525
		  reader.onload = (function(theFile) {
544
			 return function(e) {
526
			 return function(e) {
545
		    	// Render thumbnail.
527
		    	// Render thumbnail.
546
		    	document.getElementById('image').src = e.target.result;
528
		    	document.getElementById('image').src = e.target.result;
547
		    	//document.getElementById('list').insertBefore(img, null);
529
		    	//document.getElementById('list').insertBefore(img, null);
548
		    };
530
		    };
549
		  })(f);
531
		  })(f);
550
		}
532
		}
551
 
533
 
552
	} 
534
	} 
553
	else {
535
	else {
554
	  alert('The File APIs are not fully supported in this browser.');
536
	  alert('The File APIs are not fully supported in this browser.');
555
	}
537
	}
556
}
538
}