| 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);
|
|
|
206 |
osmMapType = new google.maps.ImageMapType({
|
|
|
207 |
getTileUrl: function(coord, zoom) {
|
|
|
208 |
return "http://tile.openstreetmap.org/" +
|
|
|
209 |
zoom + "/" + coord.x + "/" + coord.y + ".png";
|
|
|
210 |
},
|
|
|
211 |
tileSize: new google.maps.Size(256, 256),
|
|
|
212 |
isPng: true,
|
|
|
213 |
alt: "OpenStreetMap",
|
|
|
214 |
name: "OSM",
|
|
|
215 |
maxZoom: 19
|
| 712 |
jpm |
216 |
});
|
| 719 |
jpm |
217 |
map = new google.maps.Map(document.getElementById('gg-map-carte'), {
|
|
|
218 |
zoom: 9,
|
|
|
219 |
center: latLng,
|
|
|
220 |
mapTypeId: google.maps.MapTypeId.ROADMAP,
|
|
|
221 |
mapTypeControlOptions: {
|
|
|
222 |
mapTypeIds: ['OSM', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.TERRAIN],
|
|
|
223 |
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}
|
|
|
224 |
});
|
|
|
225 |
|
|
|
226 |
map.mapTypes.set('OSM', osmMapType);
|
|
|
227 |
map.setMapTypeId(google.maps.MapTypeId.HYBRID);
|
|
|
228 |
|
|
|
229 |
marker = new google.maps.Marker({
|
|
|
230 |
position: latLng,
|
|
|
231 |
title: 'Ma station',
|
|
|
232 |
map: map,
|
|
|
233 |
draggable: true
|
|
|
234 |
});
|
|
|
235 |
|
|
|
236 |
// Update current position info.
|
|
|
237 |
mettreAJourMarkerPosition(latLng);
|
|
|
238 |
geocoderPosition(latLng);
|
|
|
239 |
|
|
|
240 |
// Add dragging event listeners.
|
|
|
241 |
google.maps.event.addListener(marker, 'dragstart', function() {
|
|
|
242 |
mettreAJourMarkerAdresse('Marqueur de station début du déplacement...');
|
|
|
243 |
});
|
|
|
244 |
|
|
|
245 |
google.maps.event.addListener(marker, 'drag', function() {
|
|
|
246 |
mettreAJourMarkerStatut('Marqueur de station en cours de déplacement...');
|
|
|
247 |
mettreAJourMarkerPosition(marker.getPosition());
|
|
|
248 |
});
|
|
|
249 |
|
|
|
250 |
google.maps.event.addListener(marker, 'dragend', function() {
|
|
|
251 |
mettreAJourMarkerStatut('Marqueur de station déplacé (glisser/déposer).');
|
|
|
252 |
mettreAJourMarkerPosition(marker.getPosition());
|
|
|
253 |
geocoderPosition(marker.getPosition());
|
|
|
254 |
});
|
|
|
255 |
|
|
|
256 |
google.maps.event.addListener(map, 'click', function(event) {
|
|
|
257 |
deplacerMarker(event.latLng);
|
|
|
258 |
});
|
|
|
259 |
}
|
|
|
260 |
|
|
|
261 |
function geocoderPosition(pos) {
|
|
|
262 |
if (geocoder != undefined) {
|
|
|
263 |
geocoder.geocode({
|
|
|
264 |
latLng: pos
|
|
|
265 |
}, function(responses, status) {
|
|
|
266 |
if (status == google.maps.GeocoderStatus.OK) {
|
|
|
267 |
if (responses && responses.length > 0) {
|
|
|
268 |
mettreAJourMarkerAdresse(responses[0].formatted_address);
|
|
|
269 |
} else {
|
|
|
270 |
mettreAJourMarkerAdresse("Impossible de trouver d'adresse pour cette position.");
|
|
|
271 |
}
|
|
|
272 |
} else {
|
|
|
273 |
mettreAJourMarkerAdresse("Un problème de géolocalisation est survenu : "+status+".");
|
|
|
274 |
}
|
|
|
275 |
});
|
|
|
276 |
}
|
|
|
277 |
}
|
|
|
278 |
|
|
|
279 |
function mettreAJourMarkerStatut(str) {
|
|
|
280 |
document.getElementById('marqueur-statut').innerHTML = str;
|
|
|
281 |
}
|
|
|
282 |
|
|
|
283 |
function mettreAJourMarkerPosition(latLng) {
|
| 744 |
jpm |
284 |
var lat = latLng.lat().toFixed(5);
|
|
|
285 |
var lon = latLng.lng().toFixed(5);
|
|
|
286 |
document.getElementById('marqueur-wgs84').innerHTML = [lat, lon].join(', ');
|
|
|
287 |
$("#marqueur-coordonnees").data('latLon', {'lat' : lat, 'lon' : lon});
|
|
|
288 |
|
|
|
289 |
Proj4js.defs["EPSG:4326"] = "+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs";
|
|
|
290 |
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 ";
|
|
|
291 |
var source = new Proj4js.Proj('EPSG:4326');// Coordonnées source : WGS 84
|
|
|
292 |
var dest = new Proj4js.Proj('EPSG:2154');// Coordonnées destination : Lambert 93
|
|
|
293 |
var p = new Proj4js.Point(lon+','+lat);//lon+','+lat any object will do as long as it has 'x' and 'y' properties
|
|
|
294 |
Proj4js.transform(source, dest, p);
|
|
|
295 |
//Proj4js.reportError = function(msg) {alert(msg);}
|
|
|
296 |
//console.log(p.toString());
|
|
|
297 |
document.getElementById('marqueur-lambert93').innerHTML = [p.x.toFixed(0)+' '+dest.units, p.y.toFixed(0)+' '+dest.units].join(', ');
|
| 719 |
jpm |
298 |
}
|
|
|
299 |
|
|
|
300 |
function mettreAJourMarkerAdresse(str) {
|
|
|
301 |
document.getElementById('marqueur-adresse').innerHTML = str;
|
|
|
302 |
}
|
|
|
303 |
|
|
|
304 |
function deplacerMarker(latLon) {
|
|
|
305 |
if (marker != undefined) {
|
|
|
306 |
marker.setPosition(latLon);
|
|
|
307 |
mettreAJourMarkerStatut('Marqueur de station déplacé (clic).');
|
|
|
308 |
mettreAJourMarkerPosition(marker.getPosition());
|
|
|
309 |
geocoderPosition(marker.getPosition());
|
|
|
310 |
}
|
|
|
311 |
}
|