Subversion Repositories eFlore/Applications.cel

Compare Revisions

Ignore whitespace Rev 1248 → Rev 1249

/branches/v1.5-cisaille/widget/modules/saisie/squelettes/defaut/css/defaut.css
13,6 → 13,7
color:grey;
font-family:arial;
font-size:11px;
line-height: 13px;
}
.droite {
text-align:right;
20,6 → 21,23
.centre {
text-align:center;
}
.modal-fenetre{
position:fixed;
z-index:1000;
top:0;
left:0;
height:100%;
width:100%;
background:#777;
background:rgba(90,86,93,0.7);
text-align:center;
}
.modal-contenu{
position:relative;
width:30%;
margin:0 auto;
top:30%;
}
/*+--------------------------------------------------------------------------------------------------------+*/
/* Formulaire spécifique */
#map-canvas {
/branches/v1.5-cisaille/widget/modules/saisie/squelettes/defaut/defaut.tpl.html
69,9 → 69,10
"version.projet="+NOM_SCI_VERSION+"&"+
"ns.structure=au"+"&"+
"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
console.log(SERVICE_AUTOCOMPLETION_NOM_SCI_URL);
// Nombre d'observations max autorisé avant transmission
var OBS_MAX_NBRE = 10;
// Durée d'affichage en milliseconde des messages d'informations
var DUREE_MESSAGE = 15000;
// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:osm/0.1/nom-commune?lon={lon}&lat={lat}";
// URL du marqueur à utiliser dans la carte Google Map
108,8 → 109,8
Ce widget de saisie vous permet de partager simplement vos observations avec le
<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>.
Complétez les champs, créez jusqu'à 10 observations (bouton "créer") puis partagez-les (bouton "transmettre").
Retrouvez ensuite facilement ces observations dans votre
<a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.
Retrouvez ensuite facilement ces observations dans
<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
</p>
<p class="discretion">
Attention : si vous actualisez la page, fermez votre navigateur... vos observations qui
125,7 → 126,11
<h2>Observateur</h2>
<form id="form-observateur" action="#" class="" autocomplete="on">
<div class="row-fluid">
<div class="span6">
<div class="span6" rel="tooltip" data-placement="right"
title="Saisissez votre courriel avec lequel vous être inscrit à Tela Botanica.
Si vous n'êtes pas inscrit, ce n'est pas grâve, vous pourrez le faire
ultérieurement. Des informations complémentaires vont vous être
demandé : prénom et nom.">
<label for="courriel"
title="Veuillez saisir votre adresse courriel.">
<strong class="obligatoire">*</strong> Courriel
136,8 → 141,8
</span><input id="courriel" class="input-medium" name="courriel" type="text"/>
</div>
</div>
<div class="span6">
<label for="courriel_confirmation "
<div id="zone-courriel-confirmation" class="span6 hidden">
<label for="courriel_confirmation"
title="Veuillez saisir confirmer votre adresse courriel.">
<strong class="obligatoire">*</strong> Courriel (confirmation)
</label>
177,7 → 182,7
<!-- Messages d'erreur du formulaire-->
<div class="row">
<div class="zone-alerte span6 offset3">
<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display: none;" title="">
<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
<a class="close">×</a>
<h4 class="alert-heading">Information : copier/coller</h4>
<p>
185,6 → 190,16
La double saisie permet de vérifier l'absence d'erreurs.
</p>
</div>
<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
<a class="close">×</a>
<h4 class="alert-heading">Information : courriel introuvable</h4>
<p>
Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
</p>
</div>
</div>
</div>
<div class="row-fluid">
219,7 → 234,10
</div>
<div class="row-fluid">
<div class="span12">
<div id="map-canvas"></div>
<div id="map-canvas" rel="tooltip"
title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
représentant votre station ou bien le glisser-déposer sur
le lieu souhaité."></div>
</div>
</div>
<div class="row-fluid">
268,19 → 286,33
</div>
</div>
<div class="row-fluid">
<div class="span4" rel="tooltip" title="Le lieu-dit est la dénomination administrative du lieu que l’on peut trouver sur une carte au 1/25 000, sur le cadastre ou au dire des habitants locaux." >
<div class="span4" rel="tooltip"
title="Le lieu-dit est la dénomination administrative du lieu
que l’on peut trouver sur une carte au 1/25 000, sur le
cadastre ou au dire des habitants locaux." >
<label for="lieudit">Lieu-dit</label>
<div>
<input type="text" id="lieudit" class="span2" name="lieudit"/>
</div>
</div>
<div class="span4" rel="tooltip" title="La station est la dénomination qui caractérise le lieu de la collecte d’un point de vue écologique. Il est recommandéde choisir une station qui soit homogène dans sa compositionfloristique afin de refléter le plus fidèlement possible son identité sous l’angle phytosociologique. Exemple : zone humide située au centre du près. " >
<div class="span4" rel="tooltip"
title="La station est la dénomination qui caractérise le lieu
de la collecte d’un point de vue écologique. Il est
recommandéde choisir une station qui soit homogène dans
sa compositionfloristique afin de refléter le plus
fidèlement possible son identité sous l’angle
phytosociologique. Exemple : zone humide située au centre
du près. " >
<label for="station">Station</label>
<div>
<input type="text" id="station" class="span2" name="station"/>
</div>
</div>
<div class="span4" rel="tooltip" title="Le milieu est un terme générique caractérisant la station. On peut se référer pour cela à des codes comme Corine Biotope ou le nom d’une unité phytosociologique. Exemple : prairie humide">
<div class="span4" rel="tooltip"
title="Le milieu est un terme générique caractérisant la
station. On peut se référer pour cela à des codes comme
Corine Biotope ou le nom d’une unité phytosociologique.
Exemple : prairie humide">
<label for="milieux">Milieu</label>
<div>
<input type="text" id="milieu" class="span2" name="milieu" />
294,7 → 326,9
<form id="form-obs" action="#" autocomplete="on">
<h2>Observations</h2>
<div class="row-fluid">
<div class="span4" rel="tooltip" title="Vous pouvez cliquer sur l'icône de calendrier pour sélectionner un date dans un calendrier.">
<div class="span4" rel="tooltip"
title="Vous pouvez cliquer sur l'icône de calendrier pour
sélectionner un date dans un calendrier.">
<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
<strong class="obligatoire">*</strong> Date du relevé
</label>
304,7 → 338,13
placeholder="jj/mm/aaaa" />
</div>
</div>
<div id="taxon-input-groupe" class="span8" rel="tooltip" title="Sélectionnez une espèce dans la liste déroulante." >
<div id="taxon-input-groupe" class="span8" rel="tooltip"
title="Sélectionnez une espèce dans la liste déroulante pour lier
votre nom au référentiel <?=$ns_referentiel?>. Si vous recharger
la page le nom présent dans le champ ne sera plus lié au référentiel, il sera
nécessaire de le sélectionner à nouveau dans la liste. Si vous
le désirez vous pouvez aussi saisir un nom abscent du référentiel
(Ex. : Rosa sp.)." >
<label for="taxon" title="Choisissez une espèce">
<strong class="obligatoire">*</strong>
Espèce
328,7 → 368,9
</form>
<form id="form-upload" class="form-horizontal" action="<?=$url_base?>saisie?projet=sauvages&amp;service=upload-image"
method="post" enctype="multipart/form-data">
<div rel="tooltip" title="Ajouter une photo de votre observation. Elle doit être au format JPEG et ne doit pas excéder 5Mo.">
<div rel="tooltip"
title="Ajouter une photo de votre observation. Elle doit être au
format JPEG et ne doit pas excéder 5Mo.">
<label>Photo</label>
<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
351,11 → 393,44
</div>
</div>
</div>
<!-- Messages d'erreur du formulaire-->
<div class="row">
<div class="zone-alerte span6 offset3">
<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
<a class="close">×</a>
<h4 class="alert-heading">Information : 10 observations maximum</h4>
<p>
Vous venez d'ajouter votre 10ème observations.<br/>
Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
</p>
</div>
</div>
<div class="zone-alerte span6 offset3">
<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
<a class="close">×</a>
<h4 class="alert-heading">Information : champs en erreur</h4>
<p>
Certains champs du formulaire sont mal remplis.<br/>
Veuillez vérifier vos données.
</p>
</div>
</div>
</div>
<!-- Affiche le tableau récapitualif des observations ajoutées -->
<div id="zone-liste-obs" class="row-fluid">
<div class="span12">
<div class="well">
<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
<div class="row-fluid">
<div class="span8">
<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
</div>
<div class="span4 droite">
<button id="transmettre-obs" class="btn btn-primary btn-large" type="button" disabled="disabled"
title="Ajoute les observations à votre Carnet en Ligne et les rend publiques.">
Transmettre
</button>
</div>
</div>
<div id="liste-obs" ></div>
<div class="row">
<div class="zone-alerte span6 offset3">
365,13 → 440,13
<p>Veuillez saisir des observations pour les transmettres.</p>
</div>
<div id="dialogue-obs-transaction" class="alert alert-success alert-block" style="display: none;"">
<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
<a class="close">×</a>
<h4 class="alert-heading">Information : transmission des observations</h4>
<div class="alert-txt"></div>
</div>
<div id="dialogue-erreur" class="alert alert-error alert-block" style="display: none;">
<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
<a class="close">×</a>
<h4 class="alert-heading">Erreur : transmission des observations</h4>
<div class="alert-txt"></div>
378,14 → 453,7
</div>
</div>
</div>
<div class="row-fluid">
<div class="span12 droite">
<button id="transmettre-obs" class="btn btn-primary btn-large" type="button" disabled="disabled"
title="Ajoute les observations à votre Carnet en Ligne et les rend publiques.">
Transmettre
</button>
</div>
</div>
</div>
</div>
</div>
395,16 → 463,42
</footer>
<!-- Fenêtres modales -->
<div id="chargement" style="position:fixed;z-index:1000;top:0;left:0;height:100%;width:100%;background:#777;background:rgba(90,86,93,0.7);text-align:center;display:none;">
<div id="chargement-centrage" style="position:relative;width:30%;margin:0 auto;top:30%;">
<img id="chargement-img" src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif" alt="Transfert en cours..."/>
<div id="chargement" class="modal-fenetre" style="display:none;">
<div id="chargement-centrage" class="modal-contenu">
<img id="chargement-img"
src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif"
alt="Transfert en cours..."/>
<p id="chargement-txt" style="color:white;font-size:1.5em;">
Transfert des observations en cours...<br />
Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre d'observation à transférer.
Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
d'observation à transférer.
</p>
</div>
</div>
<!-- Templates HTML -->
<div id="tpl-transmission-ok" style="display:none;">
<p class="msg">
Vos observations ont bien été transmises.<br />
Elles sont désormais consultables à travers les différents outils de visualisation
du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
<a href="http://www.tela-botanica.org/page:cel_galerie">galerie d'images</a>,
<a href="http://www.tela-botanica.org/widget:cel:carto">cartographie (widget)</a>...)<br />
Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouvez en vous
connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
N'oubliez pas qu'il est nécessaire de
<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
au préalable, si ce n'est pas déjà fait.
</p>
</div>
<div id="tpl-transmission-ko" style="display:none;">
<p class="msg">
Une erreur est survenue lors de la transmission de vos observations.<br />
Vous pouvez signaler le dysfonctionnement à
<a class="courriel-erreur" href="mailto:">cel@tela-botanica.org</a>.
</p>
</div>
<!-- Stats : Google Analytics-->
<script type="text/javascript">
//<![CDATA[
/branches/v1.5-cisaille/widget/modules/saisie/squelettes/defaut/js/defaut.js
1,5 → 1,12
//+---------------------------------------------------------------------------------------------------------+
// GÉNÉRAL
$(document).ready(function() {
$(window).on('beforeunload', function(event) {
return 'Êtes vous sûr de vouloir quiter la page?\nLes observations saisies mains non transmises seront perdues.';
});
});
//+----------------------------------------------------------------------------------------------------------+
// FONCTIONS GÉNÉRIQUES
/**
* Stope l'évènement courrant quand on clique sur un lien.
* Utile pour Chrome, Safari...
10,25 → 17,32
if (evenement.stopPropagation) {
evenement.stopPropagation();
}
if (evenement.preventDefault) {
evenement.preventDefault();
}
return false;
}
 
// TODO : voir si cette fonction est bien utile. Résoud le pb d'un warning sous chrome.
(function(){
// remove layerX and layerY
var all = $.event.props,
len = all.length,
res = [];
while (len--) {
var el = all[len];
if (el != 'layerX' && el != 'layerY') res.push(el);
}
$.event.props = res;
}());
function extraireEnteteDebug(jqXHR) {
var msgDebug = '';
if (jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
var debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
if (debugInfos != null) {
$.each(debugInfos, function (cle, valeur) {
msgDebug += valeur + "\n";
});
}
}
return msgDebug;
}
 
function afficherPanneau(selecteur) {
$(selecteur).fadeIn("slow").delay(DUREE_MESSAGE).fadeOut("slow");
}
 
//+----------------------------------------------------------------------------------------------------------+
//UPLOAD PHOTO : Traitement de l'image
$(document).ready(function() {
$(document).ready(function() {
$("#effacer-miniature").click(function () {
supprimerMiniature();
54,6 → 68,7
});
}
});
 
function isCanvasSupported(){
var elem = document.createElement('canvas');
return !!(elem.getContext && elem.getContext('2d'));
95,6 → 110,7
}
$("#effacer-miniature").show();
}
 
function transformerImgEnCanvas(img, thumbwidth, thumbheight, crop, background) {
var canvas = document.createElement('canvas');
canvas.width = thumbwidth;
208,23 → 224,29
}
});
$("#geolocaliser").on('click', function() {
var latitude = $('#latitude').val();
var longitude = $('#longitude').val();
latLng = new google.maps.LatLng(latitude, longitude);
deplacerMarker(latLng);
});
$("#geolocaliser").on('click', geolocaliser);
google.maps.event.addListener(marker, 'dragend', function() {
trouverCommune(marker.getPosition());
mettreAJourMarkerPosition(marker.getPosition());
});
google.maps.event.addListener(marker, 'dragend', surDeplacementMarker);
google.maps.event.addListener(map, 'click', function(event) {
deplacerMarker(event.latLng);
});
google.maps.event.addListener(map, 'click', surClickDansCarte);
});
 
function surDeplacementMarker() {
trouverCommune(marker.getPosition());
mettreAJourMarkerPosition(marker.getPosition());
}
 
function surClickDansCarte(event) {
deplacerMarker(event.latLng);
}
 
function geolocaliser() {
var latitude = $('#latitude').val();
var longitude = $('#longitude').val();
latLng = new google.maps.LatLng(latitude, longitude);
deplacerMarker(latLng);
}
 
function initialiserGoogleMap(){
// Carte
var latLng = new google.maps.LatLng(48.8543, 2.3483);// Paris
353,13 → 375,9
}
},
complete : function(jqXHR, textStatus) {
if (DEBUG && jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
var debugMsg = "";
debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
if (debugInfos != null) {
$.each(debugInfos, function (cle, valeur) {
debugMsg += valeur + "<br />";
});
var debugMsg = extraireEnteteDebug(jqXHR);
if (debugMsg != '') {
if (DEBUG) {
$("#dialogue-erreur .alert-txt").append('<pre class="msg-debug msg">Débogage : '+debugMsg+'</pre>');
}
}
373,80 → 391,94
//+---------------------------------------------------------------------------------------------------------+
// IDENTITÉ
$(document).ready(function() {
$("#courriel").on('blur', function() {
var courriel = $("#courriel").val();
var urlAnnuaire = "http://www.tela-botanica.org/client/annuaire_nouveau/actuelle/jrest/utilisateur/identite-par-courriel/"+courriel;//http://localhost/applications/annuaire/jrest/
$.ajax({
url : urlAnnuaire,
type : "GET",
success : function(data, textStatus, jqXHR) {
if (data != undefined) {
var infos = data[courriel];
$("#prenom").val(infos.prenom);
$("#nom").val(infos.nom);
$("#courriel_confirmation").val(courriel);
}
},
error : function(jqXHR, textStatus, errorThrown) {
console.log('ERREUR :'+textStatus);
},
complete : function(jqXHR, textStatus) {
console.log('COMPLETE :'+textStatus);
$("#zone-prenom-nom").removeClass("hidden");
$("#courriel").on('blur', requeterIdentite);
$("#courriel").on('keypress', testerLancementRequeteIdentite);
});
 
function testerLancementRequeteIdentite(event) {
if (event.which == 13) {
requeterIdentite();
event.preventDefault();
event.stopPropagation();
}
}
 
function requeterIdentite() {
var courriel = $("#courriel").val();
var urlAnnuaire = "http://www.tela-botanica.org/client/annuaire_nouveau/actuelle/jrest/utilisateur/identite-par-courriel/"+courriel;//http://localhost/applications/annuaire/jrest/
$.ajax({
url : urlAnnuaire,
type : "GET",
success : function(data, textStatus, jqXHR) {
console.log('SUCCESS:'+textStatus);
if (data != undefined && data[courriel] != undefined) {
var infos = data[courriel];
$("#prenom").val(infos.prenom);
$("#nom").val(infos.nom);
$("#courriel_confirmation").val(courriel);
$("#prenom, #nom, #courriel_confirmation").attr('disabled', 'disabled');
$("#date").focus();
} else {
surErreurCompletionCourriel();
}
});
},
error : function(jqXHR, textStatus, errorThrown) {
console.log('ERREUR :'+textStatus);
surErreurCompletionCourriel();
},
complete : function(jqXHR, textStatus) {
console.log('COMPLETE :'+textStatus);
$("#zone-prenom-nom").removeClass("hidden");
$("#zone-courriel-confirmation").removeClass("hidden");
}
});
});
}
 
function surErreurCompletionCourriel() {
$("#prenom, #nom, #courriel_confirmation").val('');
$("#prenom, #nom, #courriel_confirmation").removeAttr('disabled');
afficherPanneau("#dialogue-courriel-introuvable");
}
//+---------------------------------------------------------------------------------------------------------+
//FORMULAIRE VALIDATION
$(document).ready(function() {
});
//+---------------------------------------------------------------------------------------------------------+
// FORMULAIRE
var obsNbre = 0;
 
$(document).ready(function() {
$(".alert .close").on('click', function() {
$(this).parentsUntil(".zone-alerte", ".alert").hide();
});
$(".alert .close").on('click', fermerPanneauAlert);
$("#btn-aide").on('click', function() {
if ($(this).hasClass('btn-warning')) {
$("[rel=tooltip]").tooltip('enable');
$(this).removeClass('btn-warning').addClass('btn-success');
$('#btn-aide-txt', this).text("Désactiver l'aide");
} else {
$("[rel=tooltip]").tooltip('disable');
$(this).removeClass('btn-success').addClass('btn-warning');
$('#btn-aide-txt', this).text("Activer l'aide");
}
});
$("#btn-aide").on('click', basculerAffichageAide);
$("#prenom").on("change", formaterPrenom);
$("#prenom").on("change", function(event) {
var prenom = new Array();
var mots = $(this).val().split('-');
for(var i = 0; i < mots.length; i++) {
var mot = mots[i];
var motMajuscule = mot.charAt(0).toUpperCase() + mot.slice(1);
prenom.push(motMajuscule);
}
$(this).val(prenom.join('-'));
});
$("#nom").on("change", function(event) {
$(this).val($(this).val().toUpperCase());
});
$("#nom").on("change", formaterNom);
$.datepicker.setDefaults($.datepicker.regional["fr"]);
$("#date").datepicker({
dateFormat: "dd/mm/yy",
showOn: "button",
buttonImageOnly: true,
buttonImage: CALENDRIER_ICONE_URL,
buttonText: "Afficher le calendrier pour saisir la date.",
showButtonPanel: true
});
$("img.ui-datepicker-trigger").appendTo("#date-icone");
configurerDatePicker();
ajouterAutocompletionNoms();
configurerFormValidator();
definirReglesFormValidator();
$("#courriel_confirmation").on('paste', bloquerCopierCollerCourriel);
$("a.afficher-coord").on('click', basculerAffichageCoord);
$("#ajouter-obs").on('click', ajouterObs);
$(".obs-nbre").on('changement', surChangementNbreObs);
$("body").on('click', ".supprimer-obs", supprimerObs);
$("#transmettre-obs").on('click', transmettreObs);
});
 
function configurerFormValidator() {
$.validator.addMethod(
"dateCel",
function (value, element) {
494,6 → 526,9
}
}
});
}
 
function definirReglesFormValidator() {
$("#form-observateur").validate({
rules: {
courriel : {
520,210 → 555,254
taxon : "required"
}
});
$("#courriel_confirmation").on('paste', function(e) {
$("#dialogue-bloquer-copier-coller").show();
return false;
}
 
function configurerDatePicker() {
$.datepicker.setDefaults($.datepicker.regional["fr"]);
$("#date").datepicker({
dateFormat: "dd/mm/yy",
showOn: "button",
buttonImageOnly: true,
buttonImage: CALENDRIER_ICONE_URL,
buttonText: "Afficher le calendrier pour saisir la date.",
showButtonPanel: true
});
//bascule le texte d'afficher à masquer
$("a.afficher-coord").on('click', function() {
$("a.afficher-coord").toggle();
$("#coordonnees-geo").toggle('slow');
//valeur false pour que le lien ne soit pas suivi
return false;
});
var obsNumero = 0;
$("#ajouter-obs").on('click', function(e) {
if (validerFormulaire() == true) {
//rassemble les obs dans un tableau html
obsNumero = obsNumero + 1;
obsNbre = obsNbre + 1;
$(".obs-nbre").text(obsNbre);
$("#liste-obs").prepend(
'<div id="obs'+obsNumero+'" class="row-fluid obs obs'+obsNumero+'">'+
'<div class="span12">'+
'<div class="well" >'+
'<div class="obs-action pull-right" rel="tooltip" title="Supprimer cette observation">'+
'<button class="btn btn-danger supprimer-obs" value="'+obsNumero+'" title="'+obsNumero+'">'+
'<i class="icon-trash icon-white"></i>'+
'</button>'+
'</div> '+
'<div class="row-fluid">'+
'<div class="thumbnail span2">'+
ajouterImgMiniatureAuTransfert()+
'</div>'+
'<div class="span9">'+
'<ul class="unstyled">'+
'<li>'+
'<span class="nom-sci">'+$("#taxon").val()+'</span> '+
ajouterNumNomSel()+
' observé à '+
'<span class="commune">'+$('#commune-nom').text()+'</span> '+
'('+$('#commune-code-insee').text()+') ['+$("#latitude").val()+' / '+$("#longitude").val()+']'+
' le '+
'<span class="date">'+$("#date").val()+'</span>'+
'</li>'+
'<li>'+
'<span>Lieu-dit :</span> '+$('#lieudit').val()+' '+
'<span>Station :</span> '+$('#station').val()+' '+
'<span>Milieu :</span> '+$('#milieu').val()+' '+
'</li>'+
'<li>'+
'Commentaires : <span class="discretion">'+$("#notes").val()+'</span>'+
'</li>'+
'</ul>'+
'</div>'+
'</div>'+
$("img.ui-datepicker-trigger").appendTo("#date-icone");
}
 
function fermerPanneauAlert() {
$(this).parentsUntil(".zone-alerte", ".alert").hide();
}
 
function formaterNom() {
$(this).val($(this).val().toUpperCase());
}
 
function formaterPrenom() {
var prenom = new Array();
var mots = $(this).val().split(' ');
for (var i = 0; i < mots.length; i++) {
var mot = mots[i];
if (mot.indexOf('-') >= 0) {
var prenomCompose = new Array();
var motsComposes = mot.split('-');
for (var j = 0; j < motsComposes.length; j++) {
var motSimple = motsComposes[j];
var motMajuscule = motSimple.charAt(0).toUpperCase() + motSimple.slice(1);
prenomCompose.push(motMajuscule);
}
prenom.push(prenomCompose.join('-'));
} else {
var motMajuscule = mot.charAt(0).toUpperCase() + mot.slice(1);
prenom.push(motMajuscule);
}
}
$(this).val(prenom.join(' '));
}
 
function basculerAffichageAide() {
if ($(this).hasClass('btn-warning')) {
$("[rel=tooltip]").tooltip('enable');
$(this).removeClass('btn-warning').addClass('btn-success');
$('#btn-aide-txt', this).text("Désactiver l'aide");
} else {
$("[rel=tooltip]").tooltip('disable');
$(this).removeClass('btn-success').addClass('btn-warning');
$('#btn-aide-txt', this).text("Activer l'aide");
}
}
 
function bloquerCopierCollerCourriel() {
$("#dialogue-bloquer-copier-coller").show();
return false;
}
 
function basculerAffichageCoord() {
$("a.afficher-coord").toggle();
$("#coordonnees-geo").toggle('slow');
//valeur false pour que le lien ne soit pas suivi
return false;
}
 
function ajouterObs() {
if (validerFormulaire() == true) {
obsNbre = obsNbre + 1;
$(".obs-nbre").text(obsNbre);
$(".obs-nbre").triggerHandler('changement');
afficherObs();
stockerObsData();
supprimerMiniature();
} else {
afficherPanneau('#dialogue-form-invalide');
}
}
 
function afficherObs() {
$("#liste-obs").prepend(
'<div id="obs'+obsNbre+'" class="row-fluid obs obs'+obsNbre+'">'+
'<div class="span12">'+
'<div class="well" >'+
'<div class="obs-action pull-right" rel="tooltip" title="Supprimer cette observation">'+
'<button class="btn btn-danger supprimer-obs" value="'+obsNbre+'" title="'+obsNbre+'">'+
'<i class="icon-trash icon-white"></i>'+
'</button>'+
'</div> '+
'<div class="row-fluid">'+
'<div class="thumbnail span2">'+
ajouterImgMiniatureAuTransfert()+
'</div>'+
'<div class="span9">'+
'<ul class="unstyled">'+
'<li>'+
'<span class="nom-sci">'+$("#taxon").val()+'</span> '+
ajouterNumNomSel()+
' observé à '+
'<span class="commune">'+$('#commune-nom').text()+'</span> '+
'('+$('#commune-code-insee').text()+') ['+$("#latitude").val()+' / '+$("#longitude").val()+']'+
' le '+
'<span class="date">'+$("#date").val()+'</span>'+
'</li>'+
'<li>'+
'<span>Lieu-dit :</span> '+$('#lieudit').val()+' '+
'<span>Station :</span> '+$('#station').val()+' '+
'<span>Milieu :</span> '+$('#milieu').val()+' '+
'</li>'+
'<li>'+
'Commentaires : <span class="discretion">'+$("#notes").val()+'</span>'+
'</li>'+
'</ul>'+
'</div>'+
'</div>'+
'</div>');
//rassemble les obs dans #liste-obs
$("#liste-obs").data('obsId'+obsNumero, {
'date' : $("#date").val(),
'notes' : $("#notes").val(),
'nom_sel' : $("#taxon").val(),
'num_nom_sel' : $("#taxon").data("numNomSel"),
'nom_ret' : $("#taxon").data("nomRet"),
'num_nom_ret' : $("#taxon").data("numNomRet"),
'num_taxon' : $("#taxon").data("nt"),
'famille' : $("#taxon").data("famille"),
'referentiel' : ($("#taxon").data("numNomSel") == undefined ? '' : NOM_SCI_REFERENTIEL),
'latitude' : $("#latitude").val(),
'longitude' : $("#longitude").val(),
'commune_nom' : $("#commune-nom").text(),
'commune_code_insee' : $("#commune-code-insee").text(),
'lieu_dit' : $("#lieu_dit").val(),
'station' : $("#station").val(),
'milieu' : $("#milieu").val(),
//Ajout des champs images
'image_nom' : $("#miniature-img").attr('alt'),
'image_b64' : getB64ImgOriginal()
});
supprimerMiniature();
$(".obs-nbre").triggerHandler('changement');
}
'</div>'+
'</div>'+
'</div>');
}
 
function stockerObsData() {
$("#liste-obs").data('obsId'+obsNbre, {
'date' : $("#date").val(),
'notes' : $("#notes").val(),
'nom_sel' : $("#taxon").val(),
'num_nom_sel' : $("#taxon").data("numNomSel"),
'nom_ret' : $("#taxon").data("nomRet"),
'num_nom_ret' : $("#taxon").data("numNomRet"),
'num_taxon' : $("#taxon").data("nt"),
'famille' : $("#taxon").data("famille"),
'referentiel' : ($("#taxon").data("numNomSel") == undefined ? '' : NOM_SCI_REFERENTIEL),
'latitude' : $("#latitude").val(),
'longitude' : $("#longitude").val(),
'commune_nom' : $("#commune-nom").text(),
'commune_code_insee' : $("#commune-code-insee").text(),
'lieu_dit' : $("#lieu_dit").val(),
'station' : $("#station").val(),
'milieu' : $("#milieu").val(),
//Ajout des champs images
'image_nom' : $("#miniature-img").attr('alt'),
'image_b64' : getB64ImgOriginal()
});
}
 
function surChangementNbreObs() {
if (obsNbre == 0) {
$("#transmettre-obs").attr('disabled', 'disabled');
$("#ajouter-obs").removeAttr('disabled');
} else if (obsNbre > 0 && obsNbre < OBS_MAX_NBRE) {
$("#transmettre-obs").removeAttr('disabled');
$("#ajouter-obs").removeAttr('disabled');
} else if (obsNbre >= OBS_MAX_NBRE) {
$("#ajouter-obs").attr('disabled', 'disabled');
afficherPanneau("#dialogue-bloquer-creer-obs");
}
}
 
function transmettreObs() {
var observations = $("#liste-obs").data();
$(".obs-nbre").on('changement', function() {
if (obsNbre == 0) {
$("#transmettre-obs").attr('disabled', 'disabled');
$("#ajouter-obs").removeAttr('disabled');
} else if (obsNbre > 0 && obsNbre < OBS_MAX_NBRE) {
$("#transmettre-obs").removeAttr('disabled');
$("#ajouter-obs").removeAttr('disabled');
} else if (obsNbre >= OBS_MAX_NBRE) {
$("#ajouter-obs").attr('disabled', 'disabled');
}
});
$("body").on('click', ".supprimer-obs", supprimerObs);
$("#transmettre-obs").on('click', function(e) {
var observations = $("#liste-obs").data();
if (observations == undefined || jQuery.isEmptyObject(observations)) {
afficherPanneau("#dialogue-zero-obs");
} else {
observations['projet'] = TAG_PROJET;
observations['tag-obs'] = TAG_OBS;
observations['tag-img'] = TAG_IMG;
if (observations == undefined || jQuery.isEmptyObject(observations)) {
$("#dialogue-zero-obs").show();
} else {
observations['projet'] = TAG_PROJET;
observations['tag-obs'] = TAG_OBS;
observations['tag-img'] = TAG_IMG;
var utilisateur = new Object();
utilisateur.prenom = $("#prenom").val();
utilisateur.nom = $("#nom").val();
utilisateur.courriel = $("#courriel").val();
observations['utilisateur'] = utilisateur;
envoyerObsAuCel(observations);
}
return false;
}
 
function envoyerObsAuCel(observations) {
var erreurMsg = "";
$.ajax({
url : SERVICE_SAISIE_URL,
type : "POST",
data : observations,
dataType : "json",
beforeSend : function() {
$(".alert-txt .msg").remove();
$(".alert-txt .msg-erreur").remove();
$(".alert-txt .msg-debug").remove();
$("#chargement").show();
},
success : function(data, textStatus, jqXHR) {
$('#dialogue-obs-transaction-ok .alert-txt').append($("#tpl-transmission-ok").clone().html());
supprimerMiniature();
},
statusCode : {
500 : function(jqXHR, textStatus, errorThrown) {
erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
}
},
error : function(jqXHR, textStatus, errorThrown) {
erreurMsg += "Erreur Ajax :\ntype : "+textStatus+' '+errorThrown+"\n";
try {
reponse = jQuery.parseJSON(jqXHR.responseText);
if (reponse != null) {
$.each(reponse, function (cle, valeur) {
erreurMsg += valeur + "\n";
});
}
} catch(e) {
erreurMsg += "L'erreur n'était pas en JSON.";
}
},
complete : function(jqXHR, textStatus) {
$("#chargement").hide();
var debugMsg = extraireEnteteDebug(jqXHR);
var utilisateur = new Object();
utilisateur.prenom = $("#prenom").val();
utilisateur.nom = $("#nom").val();
utilisateur.courriel = $("#courriel").val();
observations['utilisateur'] = utilisateur;
var erreurMsg = "";
$.ajax({
url : SERVICE_SAISIE_URL,
type : "POST",
data : observations,
dataType : "json",
beforeSend : function() {
$(".msg").remove();
$(".msg-erreur").remove();
$(".msg-debug").remove();
$("#chargement").show();
},
success : function(data, textStatus, jqXHR) {
$("#dialogue-obs-transaction .alert-txt").append(
'<p class="msg">Vos observations ont bien été transmises au réseau. '+
"Elles sont désormais consultables à travers les différents outils de visualisation "+
'du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>, '+
'<a href="http://www.tela-botanica.org/page:cel_galerie">galerie d\'images</a>, '+
'<a href="http://www.tela-botanica.org/widget:cel:carto">cartographie (widget)</a>...).'+
"Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouvez en vous "+
'connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne.</p>');
supprimerMiniature();
},
statusCode : {
500 : function(jqXHR, textStatus, errorThrown) {
$("#chargement").hide();
erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
if (DEBUG) {
$("#dialogue-obs-transaction .alert-txt").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
}
}
},
error : function(jqXHR, textStatus, errorThrown) {
erreurMsg += "Erreur Ajax :\ntype : "+textStatus+' '+errorThrown+"\n";
try {
reponse = jQuery.parseJSON(jqXHR.responseText);
if (reponse != null) {
$.each(reponse, function (cle, valeur) {
erreurMsg += valeur + "\n";
});
}
} catch(e) {
erreurMsg += "L'erreur n'était pas en JSON.";
}
if (DEBUG) {
$("#dialogue-obs-transaction .alert-txt").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
}
},
complete : function(jqXHR, textStatus) {
$("#chargement").hide();
var debugMsg = '';
if (jqXHR.getResponseHeader("X-DebugJrest-Data") != '') {
debugInfos = jQuery.parseJSON(jqXHR.getResponseHeader("X-DebugJrest-Data"));
if (debugInfos != null) {
$.each(debugInfos, function (cle, valeur) {
debugMsg += valeur + "\n";
});
}
}
if (erreurMsg != '') {
$("#dialogue-obs-transaction .alert-txt").append('<p class="msg">'+
'Une erreur est survenue lors de la transmission de vos observations.'+'<br />'+
'Vous pouvez signaler le disfonctionnement à <a href="'+
'mailto:cel@tela-botanica.org'+'?'+
'subject=Disfonctionnement du widget de saisie Biodiversite34'+
"&body="+erreurMsg+"\nDébogage :\n"+debugMsg+
'">cel@tela-botanica.org</a>.'+
'</p>');
}
if (DEBUG) {
$("#dialogue-obs-transaction .alert-txt").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
}
$("#dialogue-obs-transaction").show();
$("#liste-obs").removeData();
$('.obs').remove();
obsNumero = 0;
initialiserNbreObs();
if (erreurMsg != '') {
if (DEBUG) {
$("#dialogue-obs-transaction-ko .alert-txt").append('<pre class="msg-erreur">'+erreurMsg+'</pre>');
$("#dialogue-obs-transaction-ko .alert-txt").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
}
});
var hrefCourriel = "mailto:cel@tela-botanica.org?"+
"subject=Disfonctionnement du widget de saisie "+TAG_PROJET+
"&body="+erreurMsg+"\nDébogage :\n"+debugMsg;
$('#dialogue-obs-transaction-ko .alert-txt').append($("#tpl-transmission-ko").clone()
.find('.courriel-erreur')
.attr('href', hrefCourriel)
.end()
.html());
$("#dialogue-obs-transaction-ko").show();
} else {
if (DEBUG) {
$("#dialogue-obs-transaction-ok .alert-txt").append('<pre class="msg-debug">Débogage : '+debugMsg+'</pre>');
}
$("#dialogue-obs-transaction-ok").show();
initialiserObs();
}
}
return false;
});
});
}
 
function validerFormulaire() {
$observateur = $("#form-observateur").valid();
756,9 → 835,13
$("#liste-obs").removeData('obsId'+obsId);
}
 
function initialiserNbreObs() {
function initialiserObs() {
obsNbre = 0;
$(".obs-nbre").text(obsNbre);
$(".obs-nbre").triggerHandler('changement');
$("#liste-obs").removeData();
$('.obs').remove();
$("#dialogue-bloquer-creer-obs").hide();
}
 
function ajouterImgMiniatureAuTransfert() {