Subversion Repositories eFlore/Applications.cel

Rev

Rev 712 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 712 Rev 719
Line -... Line 1...
- 
 
 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 
 
1 
$(function() {
 20 
$(function() {
- 
 
 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
2 
	$("#date").datepicker($.datepicker.regional['fr']);
 38 
	$("#date").datepicker($.datepicker.regional['fr']);
Line 3... Line 39...
3
39
4 
	$("#courriel-confirmation").bind('paste', function(e) {
 40 
	$("#courriel-confirmation").bind('paste', function(e) {
5 
		$("#dialogue-bloquer-copier-coller").dialog();
 41 
		$("#dialogue-bloquer-copier-coller").dialog();
6 
		return false;
 42 
		return false;
Line -... Line 43...
- 
 
 43 
	});
- 
 
 44
- 
 
 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();
7 
	});
 73 
	});
8
74
- 
 
 75 
	var obsNumero = 0;
- 
 
 76 
	$("#ajouter-obs").bind('click', function(e) {
- 
 
 77 
		if ($("#saisie-obs").valid() == false) {
9 
	var obsNumero = 0;
 78 
			$("#dialogue-form-invalide").dialog();
10 
	$("#ajouter-obs").click(function(e) {
 79 
		} else {
11 
		obsNumero = obsNumero + 1;
 80 
			obsNumero = obsNumero + 1;
12 
		$("#liste-obs tbody").append(
 81 
			$("#liste-obs tbody").append(
13 
			'<tr id="obs-'+obsNumero+'">'+
 82 
				'<tr id="obs'+obsNumero+'" class="obs">'+
14 
				'<td>'+obsNumero+'</td>'+
 83 
					'<td>'+obsNumero+'</td>'+
- 
 
 84 
					'<td>'+$("#date").val()+'</td>'+
- 
 
 85 
					'<td>'+$("#taxon option:selected").text()+'</td>'+
- 
 
 86 
					'<td>'+$("#milieu option:selected").text()+'</td>'+
15 
				'<td>'+$("#date").val()+'</td>'+
 87 
					'<td>'+$("#latitude").val()+'</td>'+
16 
				'<td>'+$("#taxon option:selected").text()+'</td>'+
 88 
					'<td>'+$("#longitude").val()+'</td>'+
17 
				'<td>'+$("#notes").val()+'</td>'+
 89 
					'<td>'+$("#notes").val()+'</td>'+
- 
 
 90 
					'<td><button class="supprimer-obs" value="'+obsNumero+'" title="'+obsNumero+'">Supprimer</button></td>'+
18 
				'<td><button class="supprimer-obs" value="'+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',
19 
			'</tr>');
 106 
				'notes' : $("#notes").val()});
Line 20... Line 107...
20 
		$("#liste-obs").data('obs-id:'+obsNumero, {'date' : $("#date").val(), 'taxon' : $("#taxon").val()});
 107 
		}
21 
	});
 108 
	});
- 
 
 109
- 
 
 110 
	$(".supprimer-obs").live('click', function() {
- 
 
 111 
		var obsId = $(this).val();
- 
 
 112 
		// Problème avec IE 6 et 7
- 
 
 113 
		if (obsId == "Supprimer") {
22
114 
			obsId = $(this).attr("title");
23 
	$(".supprimer-obs").live('click', function() {
 115 
		}
24 
		var obsId = $(this).val();
 116
Line 25... Line 117...
25 
		$('#obs-'+obsId).remove();
 117 
		$('#obs'+obsId).remove();
26 
		$("#liste-obs").removeData('obs-id:'+obsId)
 118 
		$("#liste-obs").removeData('obsId'+obsId)
- 
 
 119 
	});
27 
	});
 120
28
121 
	$("#tramsmettre-obs").click(function(e) {
- 
 
 122 
		var observations = $("#liste-obs").data();
- 
 
 123
29 
	$( "#tramsmettre-obs").click(function(e) {
 124 
		if (observations == undefined || jQuery.isEmptyObject(observations)) {
- 
 
 125 
			$("#dialogue-zero-obs").dialog();
- 
 
 126 
		} else if ($("#saisie-obs").valid() == false) {
- 
 
 127 
			$("#dialogue-form-invalide").dialog();
- 
 
 128 
		} else {
- 
 
 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) {
30 
		var observations = $("#liste-obs").data();
 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) {
31 
		if (observations == undefined) {
 164 
					var debugMsg = "";
32 
			$("#dialogue-zero-obs").dialog();
 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
33 
		} else {
 175 
					$("#dialogue-obs-transaction").dialog();
- 
 
 176 
					$("#liste-obs").removeData();
34 
			$.each(observations, function (obsId, value) {
177 
					$('.obs').remove();
35 
				$.each(value, function (key, value) {
 178 
					obsNumero = 0;
- 
 
 179 
				},
- 
 
 180
- 
 
 181 
			});
- 
 
 182 
		}
- 
 
 183 
		return false;
- 
 
 184 
	});
Line -... Line 185...
- 
 
 185 
});
- 
 
 186 
 
- 
 
 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 
		},
36 
					alert(obsId+' : '+key + '=' + value);
 203 
		tileSize: new google.maps.Size(256, 256),
37 
				});
 - 
 
38 
			});
 204 
		isPng: true,
- 
 
 205 
		alt: "OpenStreetMap",
- 
 
 206 
		name: "OSM",
- 
 
 207 
		maxZoom: 19
- 
 
 208 
	});
- 
 
 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).');