Subversion Repositories eFlore/Applications.cel

Compare Revisions

Ignore whitespace Rev 1576 → Rev 1577

/trunk/widget/modules/saisie/squelettes/florileges/florileges.tpl.html
20,7 → 20,7
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
<!-- Jquery -->
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.9.1/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.js"></script>
<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.10.2/js/jquery-ui-1.10.2.custom.min.js"></script>
<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.10.2/js/jquery.ui.datepicker-fr.min.js"></script>
96,7 → 96,9
// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
var SERVICE_NOM_COMMUNE_URL_ALT = "http://www.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
// URL du marqueur à utiliser dans la carte Google Map
var GOOGLE_MAP_MARQUEUR_URL = "<?=$url_base?>modules/saisie/squelettes/florileges/img/icones/epingle.png";
var GOOGLE_MAP_MARQUEUR_DEBUT_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/marqueurs/debut.png";
// URL de l'icône de fin de rue
var GOOGLE_MAP_MARQUEUR_FIN_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/marqueurs/fin.png";
// URL de l'icône du chargement en cours
var CHARGEMENT_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/florileges/img/icones/chargement.gif";
// URL de l'icône du chargement en cours d'une image
279,6 → 281,11
il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
</p>
</div>
<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
<a class="close">×</a>
<h4 class="alert-heading">Information sur Google Map</h4>
<div class="contenu"></div>
</div>
</div>
</div>
<div class="row-fluid">
312,12 → 319,27
<strong class="obligatoire">*</strong>
Géolocalisation
</label>
<div class="row-fluid">
<div class="span12">
<ul class="unstyled liste_indication_geolocalisation">
<li class="indication_geolocalisation">Étape 1/4 : Entrez le nom de la rue et de la ville dans l'espace de recherche ci-dessous</li>
<li class="indication_geolocalisation">Étape 2/4 : Placez le drapeau vert au début de la portion de rue étudiée</li>
<li class="indication_geolocalisation">Étape 3/4 : Placez le drapeau rouge à la fin de la portion de rue étudiée, si vous vous êtes trompé, vous pouvez redéplacer le drapeau vert</li>
<li class="indication_geolocalisation">Étape 4/4 : Voilà ! Votre zone d'étude est localisée ! Vous pouvez passer à la saisie de l'observation.</li>
</ul>
</div>
</div>
<div class="form-search form-horizontal">
<div class="control-group">
<input id="carte-recherche" class="search-query" type="text" value=""
<input id="carte-recherche"
class="search-query span12 obs-chp-etendu"
type="text"
rel="tooltip"
title="Permet de centrer la carte sur le lieu recherché. Il est nécessaire de sélectionner le lieu dans la liste déroulante."
placeholder="Centrer la carte sur un lieu..."/>
placeholder="Entrez un nom de ville, de lieu ou de rue..."
name="adresse"
data-label="Adresse"
value=""/>
</div>
</div>
</div>
597,141 → 619,143
</div>
<form id="form-obs" autocomplete="on">
<div class="row-fluid">
<div class="well span6">
<div class="row-fluid">
<div class="span12">
<div id="taxon-liste-input-groupe" class="control-group" rel="tooltip"
title="Sélectionnez une espèce dans la liste déroulante par son nom latin
ou commun. Si une espèce est abscente, sélectionner «Autre espèce»." >
<label class="control-label" for="taxon-liste" title="Choisissez l'espèce rencontrée.">
<strong class="obligatoire">*</strong>
Espèces les plus communes
</label>
<div class="controls">
<div class="input-prepend ">
<span class="add-on">
<i class="icon-leaf"></i>
</span>
<select id="taxon-liste" class="span12" name="taxon-liste">
<option value="" selected>Sélectionner une espèce</option>
<option value="?">Autre espèce</option>
<?php foreach ($taxons as $taxon) :?>
<option
class="<?=($taxon['nom_ret'] == $taxon['nom_fr']) ? 'nom-sci' : 'nom-fr' ?>"
value="<?=$taxon['num_nom_sel']?>"
title="<?=$taxon['nom_ret'].($taxon['nom_fr_autre'] != '' ? ' - '.$taxon['nom_fr_autre'] : '' )?>"
>
<?=$taxon['nom_fr']?>
</option>
<?php endforeach; ?>
</select>
<div class="span6">
<div class="well">
<div class="row-fluid">
<div class="span12">
<div id="taxon-liste-input-groupe" class="control-group" rel="tooltip"
title="Sélectionnez une espèce dans la liste déroulante par son nom latin
ou commun. Si une espèce est abscente, sélectionner «Autre espèce»." >
<label class="control-label" for="taxon-liste" title="Choisissez l'espèce rencontrée.">
<strong class="obligatoire">*</strong>
Espèces les plus communes
</label>
<div class="controls">
<div class="input-prepend ">
<span class="add-on">
<i class="icon-leaf"></i>
</span>
<select id="taxon-liste" class="span10" name="taxon-liste">
<option value="" selected>Sélectionner une espèce</option>
<option value="?">Autre espèce</option>
<?php foreach ($taxons as $taxon) :?>
<option
class="<?=($taxon['nom_ret'] == $taxon['nom_fr']) ? 'nom-sci' : 'nom-fr' ?>"
value="<?=$taxon['num_nom_sel']?>"
title="<?=$taxon['nom_ret'].($taxon['nom_fr_autre'] != '' ? ' - '.$taxon['nom_fr_autre'] : '' )?>"
>
<?=$taxon['nom_fr']?>
</option>
<?php endforeach; ?>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="taxon-input-groupe" class="row-fluid hidden">
<div class="span12">
<div class="control-group" rel="tooltip"
title="Sélectionnez une espèce dans la liste déroulante pour lier
votre nom au référentiel. Si vous le désirez vous pouvez aussi saisir
un nom absent du référentiel (Ex. : 'fleur violette' ou 'viola sinensis???')." >
<label for="taxon" class="control-label" title="Choisissez l'espèce rencontrée.">
Autre espèce
</label>
<div class="controls">
<input id="taxon" name="taxon" type="text" class="span12"
placeholder="Autre espèce (ou indication sur la plante)"
value="<?= $nom_sci_espece_defaut; ?>" />
<div id="taxon-input-groupe" class="row-fluid hidden">
<div class="span12">
<div class="control-group" rel="tooltip"
title="Sélectionnez une espèce dans la liste déroulante pour lier
votre nom au référentiel. Si vous le désirez vous pouvez aussi saisir
un nom absent du référentiel (Ex. : 'fleur violette' ou 'viola sinensis???')." >
<label for="taxon" class="control-label" title="Choisissez l'espèce rencontrée.">
Autre espèce
</label>
<div class="controls">
<input id="taxon" name="taxon" type="text" class="span12"
placeholder="Autre espèce (ou indication sur la plante)"
value="<?= $nom_sci_espece_defaut; ?>" />
</div>
</div>
</div>
</div>
</div>
<div class="row-fluid">
<div class="span12 control-group" rel="tooltip"
title="Sélectionner un ou plusieurs milieux dans lesquels l'espèce est présente sur le site.">
<label class="span2 control-label">
<strong class="obligatoire">*</strong>
Milieux
</label>
<div id="milieux-controls" class="controls">
<div class="input-prepend">
<div class="btn-group">
<button class="btn dropdown-toggle" data-toggle="dropdown">
<i class="icon-globe"></i>
Sélectionner un ou plusieurs milieux
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="chemin"/>
chemin
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="fissures"/>
fissures
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="haie"/>
haie
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="mur"/>
mur
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="pelouse"/>
pelouse
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="pied d'arbre"/>
pied d'arbre
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="plate bande"/>
plate bande
</label>
</li>
</ul>
<div class="row-fluid">
<div class="span12 control-group" rel="tooltip"
title="Sélectionner un ou plusieurs milieux dans lesquels l'espèce est présente sur le site.">
<label class="span2 control-label">
<strong class="obligatoire">*</strong>
Milieux
</label>
<div id="milieux-controls" class="controls">
<div class="input-prepend">
<div class="btn-group">
<button class="btn dropdown-toggle" data-toggle="dropdown">
<i class="icon-globe"></i>
Sélectionner un ou plusieurs milieux
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="chemin"/>
chemin
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="fissures"/>
fissures
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="haie"/>
haie
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="mur"/>
mur
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="pelouse"/>
pelouse
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="pied d'arbre"/>
pied d'arbre
</label>
</li>
<li>
<label class="checkbox">
<input name="milieux[]" class="cb-milieux" type="checkbox" value="plate bande"/>
plate bande
</label>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row-fluid">
<div class="span12 control-group" rel="tooltip"
title="Hauteur maximum en centimètre de la plante sur le site.">
<label class="control-label">
<strong class="obligatoire">*</strong>
Hauteur max. (en cm) de la plante
<input id="hauteur-plante" class="span2 obs-chp-etendu"
name="hauteurPlante"
type="number" min="0" step="5"
data-label="Hauteur max. (en cm) de la plante"/>
</label>
<div class="row-fluid">
<div class="span12 control-group" rel="tooltip"
title="Hauteur maximum en centimètre de la plante sur le site.">
<label class="control-label">
<strong class="obligatoire">*</strong>
Hauteur max. (en cm) de la plante
<input id="hauteur-plante" class="span2 obs-chp-etendu"
name="hauteurPlante"
type="number" min="0" step="5"
data-label="Hauteur max. (en cm) de la plante"/>
</label>
</div>
</div>
</div>
<div class="row-fluid">
<div class="span12">
<label for="notes">Commentaires</label>
<div>
<textarea id="notes" class="span12" rows="7" name="notes"
placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
<div class="row-fluid">
<div class="span12">
<label for="notes">Commentaires</label>
<div>
<textarea id="notes" class="span12" rows="7" name="notes"
placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
</div>
</div>
</div>
</div>
794,31 → 818,31
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li>
<label class="checkbox">
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="ne connaissais pas la plante avant l'étude"/>
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="inconnue"/>
ne connaissais pas la plante avant l'étude
</label>
</li>
<li>
<label class="checkbox">
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="discrète ne pose pas de problème"/>
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="discrète"/>
discrète ne pose pas de problème
</label>
</li>
<li>
<label class="checkbox">
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="visible et esthétique"/>
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="esthétique"/>
visible et esthétique
</label>
</li>
<li>
<label class="checkbox">
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="gênante, difficile à gérer"/>
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="gênante"/>
gênante, difficile à gérer
</label>
</li>
<li>
<label class="checkbox">
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="envahissante, cause des dégâts"/>
<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="envahissante"/>
envahissante, cause des dégâts
</label>
</li>
851,16 → 875,13
method="post" enctype="multipart/form-data">
<div class="row-fluid">
<div class="span12 well">
<strong>Cliquez sur l'icone pour ajouter une image</strong>
<strong>Ajouter des images</strong>
<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
<div id ="photos-conteneur">
<div id="photo-placeholder" rel="tooltip"
title="Cliquez pour ajouter une photo de votre observation. Elle doit être au
format JPEG et ne doit pas excéder 5Mo."></div>
<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
<div id="miniatures"></div>
<p class="miniature-msg" class="span12">&nbsp;</p>
<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
</div>
</div>
</div>
900,6 → 921,16
</p>
</div>
</div>
<div class="zone-alerte span6 offset3">
<div id="dialogue-form-invalide-rue" class="alert alert-warning alert-block" style="display: none;">
<a class="close">×</a>
<h4 class="alert-heading">Information : champs en erreur</h4>
<p>
Le coordonnées du début et de la fin de la rue n'ont pas été géoréférencé.<br/>
Veuillez suivre les étapes indiquées dans le champ « Géolocalisation ».
</p>
</div>
</div>
</div>
<!-- Affiche le tableau récapitualif des observations ajoutées -->
/trunk/widget/modules/saisie/squelettes/florileges/js/florileges.js
66,7 → 66,6
url: urlAnnuaire,
type: 'GET',
success: function(data, textStatus, jqXHR) {
console.log('SUCCESS:'+textStatus);
if (data != undefined && data[courriel] != undefined) {
var infos = data[courriel];
$('#id_utilisateur').val(infos.id);
80,11 → 79,9
}
},
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');
}
127,12 → 124,17
// GOOGLE MAP
 
var map,
marker,
latLng,
geocoder;
geocoder,
markerDeb,
latLngDeb,
markerFin,
latLngFin,
ligneRue,
premierDeplacement = true;
 
$(document).ready(function() {
initialiserGoogleMap();
afficherEtapeGeolocalisation(1);
// Autocompletion du champ adresse
$('#carte-recherche').on('focus', function() {
172,23 → 174,22
select: function(event, ui) {
var latLng = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
deplacerMarker(latLng);
map.setZoom(16);
}
});
$('#geolocaliser').on('click', geolocaliser);
//google.maps.event.addListener(marker, 'dragend', surDeplacementMarker);
google.maps.event.addListener(markerDeb, 'dragend', surDeplacementMarkerDeb);
//google.maps.event.addListener(map, 'click', surClickDansCarte);
google.maps.event.addListener(map, 'click', surClickDansCarte);
});
 
function initialiserGoogleMap(){
// Carte
var latLng = new google.maps.LatLng(46.30871, 2.54395),// Centre de la France
zoomDefaut = 5;
options = {
zoom: zoomDefaut,
center: latLng,
latLngDeb = new google.maps.LatLng(46.30871, 2.54395);// Centre de la France
var options = {
zoom: 5,
center: latLngDeb,
mapTypeId: google.maps.MapTypeId.HYBRID,
mapTypeControlOptions: {
mapTypeIds: ['OSM',
217,50 → 218,53
// Création du Geocoder
geocoder = new google.maps.Geocoder();
// Marqueur google draggable
marker = new google.maps.Marker({
// Marqueur de début de Rue
markerDeb = new google.maps.Marker({
map: map,
draggable: true,
title: 'Ma station',
icon: GOOGLE_MAP_MARQUEUR_URL,
position: latLng
title: 'Début de la portion de rue étudiée',
icon: GOOGLE_MAP_MARQUEUR_DEBUT_URL,
position: latLngDeb
});
initialiserMarkerDeb(latLngDeb);
initialiserMarker(latLng);
// Tentative de geocalisation
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var latitude = position.coords.latitude,
longitude = position.coords.longitude;
latLng = new google.maps.LatLng(latitude, longitude);
deplacerMarker(latLng);
});
}
tenterGeolocalisation();
}
 
function surDeplacementMarker() {
trouverCommune(marker.getPosition());
mettreAJourMarkerPosition(marker.getPosition());
function afficherErreurGoogleMap(status) {
if (DEBUG) {
$('#dialogue-google-map .contenu').empty().append(
'<pre class="msg-erreur">'+
"Le service de Géocodage de Google Map a échoué à cause de l'erreur : "+status+
'</pre>');
afficherPanneau('#dialogue-google-map');
}
}
 
function surClickDansCarte(event) {
deplacerMarker(event.latLng);
}
 
function geolocaliser(event) {
var latitude = $('#latitude').val(),
longitude = $('#longitude').val();
latLng = new google.maps.LatLng(latitude, longitude);
deplacerMarker(latLng);
afficherEtapeGeolocalisation(2);
map.setZoom(16);
arreter(event);
}
 
function initialiserMarker(latLng) {
if (marker != undefined) {
marker.setPosition(latLng);
function surDeplacementMarkerDeb() {
trouverCommune(markerDeb.getPosition());
mettreAJourMarkerPosition(markerDeb.getPosition());
deplacerMarker(markerDeb.getPosition());
}
 
function surClickDansCarte(event) {
deplacerMarker(event.latLng);
}
 
function initialiserMarkerDeb(latLng) {
if (markerDeb != undefined) {
markerDeb.setPosition(latLng);
map.setCenter(latLng);
mettreAJourMarkerPosition(latLng);
trouverCommune(latLng);
267,15 → 271,82
}
}
 
function tenterGeolocalisation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var latitude = position.coords.latitude,
longitude = position.coords.longitude;
latLngDeb = new google.maps.LatLng(latitude, longitude);
latLngFin = latLngDeb;
// si l'utilisateur géolocalise sa ville alors le premier déplacement doit être réinitialisé
premierDeplacement = true;
deplacerMarker(latLngDeb);
map.setZoom(16);
});
}
}
 
function deplacerMarker(latLng) {
if (marker != undefined) {
marker.setPosition(latLng);
map.setCenter(latLng);
mettreAJourMarkerPosition(latLng);
trouverCommune(latLng);
if (markerDeb != undefined) {
latLngDeb = latLng;
markerDeb.setPosition(latLngDeb);
map.setCenter(latLngDeb);
trouverCommune(latLngDeb);
if (!premierDeplacement) {
if (markerFin != undefined) {
markerFin.setMap(null);
}
latLngFin = new google.maps.LatLng(latLngDeb.lat(), latLngDeb.lng() + 0.0010);
markerFin = new google.maps.Marker({
map: map,
draggable: true,
title: 'Fin de la portion de rue étudiée',
icon: GOOGLE_MAP_MARQUEUR_FIN_URL,
position: latLngFin
});
google.maps.event.addListener(markerFin, 'dragend', function() {
dessinerLigneRue(markerDeb.getPosition(), markerFin.getPosition());
latLngDeb = markerDeb.getPosition();
latLngFin = markerFin.getPosition();
latLngCentre = new google.maps.LatLng((latLngFin.lat() + latLngDeb.lat())/2, (latLngFin.lng() + latLngDeb.lng())/2);
mettreAJourMarkerPosition(latLngCentre);
afficherEtapeGeolocalisation(4);
});
dessinerLigneRue(latLngDeb, latLngFin);
latLngCentre = new google.maps.LatLng((latLngFin.lat() + latLngDeb.lat())/2, (latLngFin.lng() + latLngDeb.lng())/2);
mettreAJourMarkerPosition(latLngCentre);
afficherEtapeGeolocalisation(3);
} else {
mettreAJourMarkerPosition(latLngDeb);
}
premierDeplacement = false;
}
}
 
function dessinerLigneRue(pointDebut, pointFin) {
if (ligneRue != undefined) {
ligneRue.setMap(null);
}
ligneRue = new google.maps.Polyline({
path: [pointDebut, pointFin],
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
 
ligneRue.setMap(map);
}
 
function afficherEtapeGeolocalisation(numEtape) {
$('.liste_indication_geolocalisation').children().hide();
$('.liste_indication_geolocalisation :nth-child('+numEtape+')').show();
}
 
function mettreAJourMarkerPosition(latLng) {
var lat = latLng.lat().toFixed(5),
lng = latLng.lng().toFixed(5);
370,7 → 441,6
var url = getUrlAutocompletionNomsSci();
$.getJSON(url, function(data) {
console.log(data);
var suggestions = traiterRetourNomsSci(data);
add(suggestions);
});
474,8 → 544,24
//+----------------------------------------------------------------------------------------------------------+
//UPLOAD PHOTO : Traitement de l'image
$(document).ready(function() {
$('body').on('click', '.effacer-miniature', function(event) {
supprimerMiniature($(this));
$('#fichier').on('click change', function(event) {
if ($(this).val().length > 0) {
arreter(event);
var options = {
success: afficherMiniature, // post-submit callback
dataType: 'xml', // 'xml', 'script', or 'json' (expected server response type)
resetForm: true // reset the form after successful submit
};
$('#miniature').append(
'<img id="miniature-chargement" class="miniature" alt="chargement" src="'+CHARGEMENT_IMAGE_URL+'"/>');
$('#ajouter-obs').attr('disabled', 'disabled');
if (verifierFormat($(this).val())) {
$('#form-upload').ajaxSubmit(options);
} else {
window.alert("Le format de fichier n'est pas supporté, les formats acceptés sont "+ $('#fichier').attr('accept'));
}
return false;
}
});
$('#photo-placeholder').click(function(event) {
482,29 → 568,13
$('#fichier').click();
});
$('#fichier').bind('change', function (e) {
arreter(e);
var options = {
success: afficherMiniature, // post-submit callback
dataType: 'xml', // 'xml', 'script', or 'json' (expected server response type)
resetForm: true // reset the form after successful submit
};
$('#miniature').append(
'<img id="miniature-chargement" class="miniature" alt="chargement" src="'+CHARGEMENT_IMAGE_URL+'"/>');
$('#ajouter-obs').attr('disabled', 'disabled');
if (verifierFormat($('#fichier').val())) {
$('#form-upload').ajaxSubmit(options);
} else {
window.alert("Le format de fichier n'est pas supporté, les formats acceptés sont "+ $('#fichier').attr('accept'));
}
return false;
$('body').on('click', '.effacer-miniature', function(event) {
supprimerMiniature($(this));
});
$('.effacer-miniature').on('click', function() {
$(this).parent().remove();
});
});
 
 
 
function verifierFormat(nom) {
var parts = nom.split('.');
extension = parts[parts.length - 1];
514,7 → 584,7
function afficherMiniature(reponse) {
if (DEBUG) {
var debogage = $('debogage', reponse).text();
console.log('Débogage upload : ' + debogage);
//console.log('Débogage upload : ' + debogage);
}
var message = $('message', reponse).text();
if (message != '') {
522,7 → 592,7
} else {
$('#miniatures').append(creerWidgetMiniature(reponse));
}
$('#ajouter-obs').removeAttr('disabled');
$('#ajouter-obs').removeAttr('disabled');
}
 
function creerWidgetMiniature(reponse) {
600,7 → 670,6
$('input#hauteur-plante').on('blur', function() {
// if there's a bad value
var valeur = $(this).val();
console.log(valeur);
if (! valeur.match(/^[0-9]+$/)) {
// replace it with nothing
var nouvelleValeur = valeur.replace(/[^0-9]/g, '');
694,7 → 763,7
showButtonPanel: true,
onSelect: function(date) {
$(this).valid();
}
}
});
$(selector + ' + img.ui-datepicker-trigger').appendTo(selector + '-icone.add-on');
}
780,12 → 849,12
required: true}
},
errorPlacement: function(error, element) {
if (element.attr('name') == 'date') {
element.parent('.input-prepend').after(error);
} else {
error.insertAfter(element);
}
}
if (element.attr('name') == 'date') {
element.parent('.input-prepend').after(error);
} else {
error.insertAfter(element);
}
}
});
$('#form-obs').validate({
rules: {
801,12 → 870,12
required: true}
},
errorPlacement: function(error, element) {
if (element.attr('name') == 'milieux[]') {
error.insertAfter('#milieux-controls');
} else {
error.insertAfter(element);
}
}
if (element.attr('name') == 'milieux[]') {
error.insertAfter('#milieux-controls');
} else {
error.insertAfter(element);
}
}
});
}
 
814,8 → 883,12
var observateur = $('#form-observateur').valid(),
station = $('#form-site').valid(),
date = $('#form-date').valid(),
obs = $('#form-obs').valid();
return (observateur == true && station == true && obs == true && date == true) ? true : false;
obs = $('#form-obs').valid(),
debRue = (latLngDeb == undefined) ? false : true,
finRue = (latLngFin == undefined) ? false : true;
var ok = (observateur && station && obs && date && debRue && finRue) ? true : false;
//console.log(observateur+'-'+station+'-'+obs+'-'+date+'-'+debRue+'-'+finRue);
return ok;
}
 
 
861,9 → 934,14
afficherObs();
stockerObsData();
supprimerMiniatures();
$('#taxon').val('').data('numNomSel', undefined).removeClass('ns-retenu');
} else {
afficherPanneau('#dialogue-form-invalide');
var debRue = (latLngDeb == undefined) ? false : true,
finRue = (latLngFin == undefined) ? false : true;
if (debRue == false || finRue == false) {
afficherPanneau('#dialogue-form-invalide-rue');
} else {
afficherPanneau('#dialogue-form-invalide');
}
}
}
 
982,7 → 1060,6
var miniatureAffichee = miniatureSelectionne;
var indicateurActif = element.parent().find('.defilement-indicateurs .active');
console.log(indicateurActif)
indicateurActif.removeClass('active');
if (element.hasClass('defilement-control-zone') && element.hasClass('gauche')) {
1106,7 → 1183,7
// Ajout des champs étendus de l'obs
'obs_etendue': getObsChpEtendus()
});
console.log($('#liste-obs').data('obsId'+obsNbre));
//console.log($('#liste-obs').data('obsId'+obsNbre));
}
 
function getObsChpEtendus() {
1115,6 → 1192,19
if (perceptionTechnicien != undefined) {
champs.push(perceptionTechnicien);
}
if (latLngDeb != undefined) {
var latitudeDebutRue = {cle: 'latitudeDebutRue', label: 'Latitude du début de la rue', valeur: latLngDeb.lat().toFixed(5)};
champs.push(latitudeDebutRue);
var longitudeDebutRue = {cle: 'longitudeDebutRue', label: 'Longitude du début de la rue', valeur: latLngDeb.lng().toFixed(5)};
champs.push(longitudeDebutRue);
}
if (latLngFin != undefined) {
var latitudeFinRue = {cle: 'latitudeFinRue', label: 'Latitude de fin de la rue', valeur: latLngFin.lat().toFixed(5)};
champs.push(latitudeFinRue);
var longitudeFinRue = {cle: 'longitudeFinRue', label: 'Longitude de fin de la rue', valeur: latLngFin.lng().toFixed(5)};
champs.push(longitudeFinRue);
}
$('.obs-chp-etendu').each(function() {
var valeur = $(this).val(),
cle = $(this).attr('name'),
1145,7 → 1235,6
 
function transmettreObs() {
var observations = $('#liste-obs').data();
console.log(observations);
if (observations == undefined || jQuery.isEmptyObject(observations)) {
afficherPanneau('#dialogue-zero-obs');
/trunk/widget/modules/saisie/squelettes/florileges/css/florileges.css
77,37 → 77,14
}
 
/* Bouton de sélection des fichiers */
#fichier {
/*#fichier {
visibility: hidden;
height:0;
width:0;
}
}*/
#photos-conteneur {
height: 120px;
}
#photo-placeholder {
background: url("../img/icones/icone-photo.png");
background-size: 89px;
cursor: pointer;
margin-bottom: 15px;
margin-right: 15px;
float:left;
border: 5px dashed #CCCCCC;
border-radius: 8px 8px 8px 8px;
height: 100px;
margin: 2px 0 2px 2px;
text-align: center;
width: 98px;
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
#photo-placeholder:hover {
background: url("../img/icones/icone-photo-hover.png");
background-size: 89px;
border: 5px dashed #111;
border-radius: 8px;
}
 
/* Images d'une observation */
.obs .obs-miniatures {
127,8 → 104,9
}
.defilement-control-zone {
display: block;
z-index:2;
position: absolute;
top: 0;
top: 0;
width: 50%;
height: 116px;
}
139,20 → 117,20
right: 0;
}
.defilement-control {
display: block;
position: absolute;
top: 35%;
width:20px;
height: 20px;
line-height: 20px;
font-size: 17px;
font-weight: 100;
text-align: center;
vertical-align: middle;
border: 3px solid white;
border-radius: 20px;
display: block;
position: absolute;
top: 35%;
width:20px;
height: 20px;
line-height: 20px;
font-size: 17px;
font-weight: 100;
text-align: center;
vertical-align: middle;
border: 3px solid white;
border-radius: 20px;
color: white;
opacity: 1;
opacity: 1;
background: none repeat scroll 0 0 #524C47;
}
.defilement-control.gauche {
222,6 → 200,7
/*+--------------------------------------------------------------------------------------------------------+*/
/* Spécifique Florilèges */
.entete .intro {
background-color: #689E4B;
background: url("../img/background/noise.png") repeat scroll 0 0, radial-gradient(ellipse farthest-corner at center center , #A1C886 0%, #689E4B 100%) repeat scroll 0 0 transparent;
color: white;
padding:5px;
232,7 → 211,7
 
/* Géolocalisation */
#map-canvas {
height: 240px;
height: 280px;
margin-bottom:5px;
}
.coordonnees-geo, .lat-lon-info {