Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 2816 Rev 2847
1
<?php 
1
<?php 
2
	if (!isset($_GET['mission'])) {
2
	if (!isset($_GET['mission'])) {
3
		$projets = explode(',', $_GET['projet']);
3
		$projets = explode(',', $_GET['projet']);
4
		if(count($projets) > 1) {
4
		if(count($projets) > 1) {
5
			$_GET['mission'] = $projets[1];
5
			$_GET['mission'] = $projets[1];
6
		}
6
		}
7
	}
7
	}
8
?>
8
?>
9
<?php $mission = isset($_GET['mission']) ? strtolower($_GET['mission']) : null; ?>
9
<?php $mission = isset($_GET['mission']) ? strtolower($_GET['mission']) : null; ?>
10
<?php $missionMotCle = isset($_GET['mission']) ? $_GET['mission'] : 'Inconnue'; ?>
10
<?php $missionMotCle = isset($_GET['mission']) ? $_GET['mission'] : 'Inconnue'; ?>
11
<?php $missionNom = isset($_GET['mission']) ? $nom_mission : 'Inconnue'; ?>
11
<?php $missionNom = isset($_GET['mission']) ? $nom_mission : 'Inconnue'; ?>
12
<!DOCTYPE html>
12
<!DOCTYPE html>
13
<html lang="fr">
13
<html lang="fr">
14
	<head>
14
	<head>
15
		<?php if (isset($_GET['mission'])) :?>
15
		<?php if (isset($_GET['mission'])) :?>
16
			<?php if (isset($titre)) :?>
16
			<?php if (isset($titre)) :?>
17
				<title><?=$titre ?></title>
17
				<title><?=$titre ?></title>
18
			<?php endif; ?>
18
			<?php endif; ?>
19
		<?php else : ?>
19
		<?php else : ?>
20
			<title>Mission flore inconnue !</title>
20
			<title>Mission flore inconnue !</title>
21
		<?php endif; ?>
21
		<?php endif; ?>
22
 
22
 
23
		<meta charset="utf-8">
23
		<meta charset="utf-8">
24
 
24
 
25
		<meta name="revisit-after" content="15 days" />
25
		<meta name="revisit-after" content="15 days" />
26
		<meta name="robots" content="index,follow" />
26
		<meta name="robots" content="index,follow" />
27
		<meta name="author" content="Jean-Pascal MILCENT" />
27
		<meta name="author" content="Jean-Pascal MILCENT" />
28
		<meta name="keywords" content="Tela Botanica, CEL" />
28
		<meta name="keywords" content="Tela Botanica, CEL" />
29
		<meta name="description" content="Projet Missions Flore - Widget de saisie simplifiée pour le CEL" />
29
		<meta name="description" content="Projet Missions Flore - Widget de saisie simplifiée pour le CEL" />
30
 
30
 
31
		<!-- Viewport Mobile -->
31
		<!-- Viewport Mobile -->
32
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
32
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
33
 
33
 
34
		<!-- Favicones -->
34
		<!-- Favicones -->
35
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
35
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
36
 
36
 
37
		<!-- Javascript : bibliothèques -->
37
		<!-- Javascript : bibliothèques -->
38
		<!-- Google Map v3 -->
38
		<!-- Google Map v3 -->
39
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
39
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
40
		<script src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
40
		<script src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
41
		<!-- Proj4js -->
41
		<!-- Proj4js -->
42
		<script type="text/javascript" src="http://resources.tela-botanica.org/proj4js/2.2.1/proj4.js"></script>
42
		<script type="text/javascript" src="http://resources.tela-botanica.org/proj4js/2.2.1/proj4.js"></script>
43
 
43
 
44
		<!-- Jquery -->
44
		<!-- Jquery -->
45
		<script src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
45
		<script src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
46
		<!-- Jquery UI : nécessaire pour le mini-calendrier et l'auto-complétion -->
46
		<!-- Jquery UI : nécessaire pour le mini-calendrier et l'auto-complétion -->
47
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
47
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
48
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
48
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
49
		<!-- Jquery Plugins -->
49
		<!-- Jquery Plugins -->
50
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
50
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
51
		<script src="http://resources.tela-botanica.org/jquery/validate/1.13.0/jquery.validate.min.js"></script>
51
		<script src="http://resources.tela-botanica.org/jquery/validate/1.13.0/jquery.validate.min.js"></script>
52
		<script src="http://resources.tela-botanica.org/jquery/validate/1.13.0/localization/messages_fr.js"></script>
52
		<script src="http://resources.tela-botanica.org/jquery/validate/1.13.0/localization/messages_fr.js"></script>
53
		<!-- Jquery Form :nécessaire pour l'upload des images -->
53
		<!-- Jquery Form :nécessaire pour l'upload des images -->
54
		<script src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
54
		<script src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
55
 
55
 
56
		<!-- Bootstrap -->
56
		<!-- Bootstrap -->
57
		<script src="http://resources.tela-botanica.org/bootstrap/3.2.0/js/bootstrap.min.js"></script>
57
		<script src="http://resources.tela-botanica.org/bootstrap/3.2.0/js/bootstrap.min.js"></script>
58
 
58
 
59
		<!-- Javascript : appli saisie -->
59
		<!-- Javascript : appli saisie -->
60
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
60
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
61
		<script src="<?=$url_base?>modules/saisie/squelettes/missions-flore/js/WidgetSaisieMissionsFlore.js"></script>
61
		<script src="<?=$url_base?>modules/saisie/squelettes/missions-flore/js/WidgetSaisieMissionsFlore.js"></script>
62
		<script>
62
		<script>
63
		//<![CDATA[
63
		//<![CDATA[
64
        	$(document).ready(function() {
64
        	$(document).ready(function() {
65
				var widget = new WidgetSaisieMissionsFlore();
65
				var widget = new WidgetSaisieMissionsFlore();
66
 
66
 
67
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
67
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
68
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
68
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
69
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
69
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
70
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
70
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
71
				// Mot-clé du widget/projet
71
				// Mot-clé du widget/projet
72
				widget.tagProjet = "WidgetSaisie,Missions-Flore,<?=$missionMotCle?>";
72
				widget.tagProjet = "WidgetSaisie,Missions-Flore,<?=$missionMotCle?>";
73
				// Mots-clés à ajouter aux images
73
				// Mots-clés à ajouter aux images
74
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
74
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
75
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
75
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
76
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
76
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
77
				// Mots-clés à ajouter aux observations
77
				// Mots-clés à ajouter aux observations
78
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
78
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
79
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
79
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
80
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
80
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
81
				// Précharger le formulaire avec les infos d'une observation
81
				// Précharger le formulaire avec les infos d'une observation
82
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
82
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
83
				// URL du web service réalisant l'insertion des données dans la base du CEL.
83
				// URL du web service réalisant l'insertion des données dans la base du CEL.
84
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
84
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
85
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
85
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
86
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
86
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
87
				// Code du référentiel utilisé pour les nom scientifiques.
87
				// Code du référentiel utilisé pour les nom scientifiques.
88
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
88
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
89
				// Indication de la présence d'une espèce imposée
89
				// Indication de la présence d'une espèce imposée
90
				widget.especeImposee = "<?=$espece_imposee; ?>";
90
				widget.especeImposee = "<?=$espece_imposee; ?>";
91
				// Tableau d'informations sur l'espèce imposée
91
				// Tableau d'informations sur l'espèce imposée
92
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
92
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
93
				// Nombre d'élément dans les listes d'auto-complétion
93
				// Nombre d'élément dans les listes d'auto-complétion
94
				widget.autocompletionElementsNbre = 20;
94
				widget.autocompletionElementsNbre = 20;
95
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
95
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
96
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
96
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
97
					"masque={masque}&"+
97
					"masque={masque}&"+
98
					"recherche=etendue&"+
98
					"recherche=etendue&"+
99
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
99
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
100
					"retour.tri=alpharet&"+ // tri "à la CeL"
100
					"retour.tri=alpharet&"+ // tri "à la CeL"
101
					"ns.structure=au"+"&"+
101
					"ns.structure=au"+"&"+
102
					"navigation.limite=" + widget.autocompletionElementsNbre;
102
					"navigation.limite=" + widget.autocompletionElementsNbre;
103
				// Nombre d'observations max autorisé avant transmission
103
				// Nombre d'observations max autorisé avant transmission
104
				widget.obsMaxNbre = 10;
104
				widget.obsMaxNbre = 10;
105
				// Durée d'affichage en milliseconde des messages d'informations
105
				// Durée d'affichage en milliseconde des messages d'informations
106
				widget.dureeMessage = 15000;
106
				widget.dureeMessage = 15000;
107
				// Squelette d'URL du web service de l'annuaire.
107
				// Squelette d'URL du web service de l'annuaire.
108
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
108
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
109
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
109
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
110
				widget.serviceNomCommuneUrl = "http://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
110
				widget.serviceNomCommuneUrl = "http://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
111
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
111
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
112
				//widget.serviceNomCommuneUrlAlt = "http://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
112
				//widget.serviceNomCommuneUrlAlt = "http://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
113
				// Squelette d'URL du web service d'eFlore fournissant l'altitude
113
				// Squelette d'URL du web service d'eFlore fournissant l'altitude
114
				widget.serviceAltitudeUrl = "http://api.tela-botanica.org/service:eflore:0.1/nasa-srtm/altitude?lon={lon}&lat={lat}";
114
				widget.serviceAltitudeUrl = "http://api.tela-botanica.org/service:eflore:0.1/nasa-srtm/altitude?lon={lon}&lat={lat}";
115
				// URL du marqueur à utiliser dans la carte Google Map
115
				// URL du marqueur à utiliser dans la carte Google Map
116
				widget.googleMapMarqueurUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/marqueurs/epingle.png";
116
				widget.googleMapMarqueurUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/marqueurs/epingle.png";
117
				// URL de l'icône du chargement en cours
117
				// URL de l'icône du chargement en cours
118
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/icones/chargement.gif";
118
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/icones/chargement.gif";
119
				// URL de l'icône du chargement en cours d'une image
119
				// URL de l'icône du chargement en cours d'une image
120
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/icones/chargement-image.gif";
120
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/icones/chargement-image.gif";
121
				// URL de l'icône du calendrier
121
				// URL de l'icône du calendrier
122
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/icones/calendrier.png";
122
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/icones/calendrier.png";
123
				// URL de l'icône pour une photo manquante
123
				// URL de l'icône pour une photo manquante
124
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/icones/pasdephoto.png";
124
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/missions-flore/img/icones/pasdephoto.png";
125
 
125
 
126
				// Initialisation du bousin
126
				// Initialisation du bousin
127
				widget.init();
127
				widget.init();
128
			});
128
			});
129
		//]]>
129
		//]]>
130
		</script>
130
		</script>
131
 
131
 
132
		<!-- CSS -->
132
		<!-- CSS -->
133
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" />
133
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" />
134
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/theme.css" />
134
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/theme.css" />
135
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap.min.css" />
135
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap.min.css" />
136
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap-theme.min.css" />
136
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap-theme.min.css" />
137
		<link rel="stylesheet" href="<?=$url_base?>modules/saisie/squelettes/missions-flore/css/<?=isset($_GET['style']) ? $_GET['style'] : 'missions-flore'?>.css" />
137
		<link rel="stylesheet" href="<?=$url_base?>modules/saisie/squelettes/missions-flore/css/<?=isset($_GET['style']) ? $_GET['style'] : 'missions-flore'?>.css" />
138
		
138
 
139
		<script>
-
 
140
		  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-
 
141
		  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-
 
142
		  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-
 
143
		  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
-
 
144
		
-
 
145
		  ga('create', 'UA-20092557-1', 'auto');
139
		<!--  Google Analytics -->
146
		  ga('require', 'displayfeatures');
140
		<?php if($prod): ?>
147
		  ga('send', 'pageview');
141
			<?php include "analytics.html"; ?>
148
		
-
 
149
		</script>
142
		<?php endif; ?>
150
	</head>
143
	</head>
151
 
144
 
152
	<body data-spy="scroll">
145
	<body data-spy="scroll">
153
		<div class="container">
146
		<div class="container">
154
			<div class="page-header">
147
			<div class="page-header">
155
				<?php if (isset($_GET['mission'])) :?>
148
				<?php if (isset($_GET['mission'])) :?>
156
					<?php if (file_exists('./modules/saisie/squelettes/missions-flore/squelettes/'.$_GET['mission'].'/titre.tpl.html')) :?>
149
					<?php if (file_exists('./modules/saisie/squelettes/missions-flore/squelettes/'.$_GET['mission'].'/titre.tpl.html')) :?>
157
						<?php include_once './modules/saisie/squelettes/missions-flore/squelettes/'.$_GET['mission'].'/titre.tpl.html'; ?>
150
						<?php include_once './modules/saisie/squelettes/missions-flore/squelettes/'.$_GET['mission'].'/titre.tpl.html'; ?>
158
					<?php endif; ?>
151
					<?php endif; ?>
159
				<?php else : ?>
152
				<?php else : ?>
160
					<img id="logo-titre" class="span1" src="http://resources.tela-botanica.org/tb/img/256x256/logo_sans_mots.png" alt="Tela Botanica" />
153
					<img id="logo-titre" class="span1" src="http://resources.tela-botanica.org/tb/img/256x256/logo_sans_mots.png" alt="Tela Botanica" />
161
					Mission flore inconnue !
154
					Mission flore inconnue !
162
				<?php endif; ?>
155
				<?php endif; ?>
163
			</div>
156
			</div>
164
			<div class="row">
157
			<div class="row">
165
				<div class="col-md-6">
158
				<div class="col-md-6">
166
					<div id="intro" class ="well well-lg">
159
					<div id="intro" class ="well well-lg">
167
						<a class="fermer" data-toggle="collapse" data-target="#intro-txt">
160
						<a class="fermer" data-toggle="collapse" data-target="#intro-txt">
168
							<h3 class="titre">
161
							<h3 class="titre">
169
								La mission «&nbsp;<?=$missionNom ?>&nbsp;»
162
								La mission «&nbsp;<?=$missionNom ?>&nbsp;»
170
								<span class="glyphicon glyphicon-plus-sign"></span>
163
								<span class="glyphicon glyphicon-plus-sign"></span>
171
							</h3>
164
							</h3>
172
						</a>
165
						</a>
173
						<div id="intro-txt" class="collapse in">
166
						<div id="intro-txt" class="collapse in">
174
							<?php if (file_exists("./modules/saisie/squelettes/missions-flore/squelettes/$mission/projet.tpl.html")) :?>
167
							<?php if (file_exists("./modules/saisie/squelettes/missions-flore/squelettes/$mission/projet.tpl.html")) :?>
175
								<?php include_once "./modules/saisie/squelettes/missions-flore/squelettes/$mission/projet.tpl.html"; ?>
168
								<?php include_once "./modules/saisie/squelettes/missions-flore/squelettes/$mission/projet.tpl.html"; ?>
176
							<?php else : ?>
169
							<?php else : ?>
177
								<p>Mission flore inconnue !</p>
170
								<p>Mission flore inconnue !</p>
178
							<?php endif; ?>
171
							<?php endif; ?>
179
						</div>
172
						</div>
180
					</div>
173
					</div>
181
				</div>
174
				</div>
182
 
175
 
183
				<div class="col-md-6">
176
				<div class="col-md-6">
184
					<div id="aide" class="well well-lg">
177
					<div id="aide" class="well well-lg">
185
						<a class="fermer" data-toggle="collapse" data-target="#aide-txt">
178
						<a class="fermer" data-toggle="collapse" data-target="#aide-txt">
186
							<h3 class="titre">
179
							<h3 class="titre">
187
								Aide
180
								Aide
188
								<span class="glyphicon glyphicon-plus-sign"></span>
181
								<span class="glyphicon glyphicon-plus-sign"></span>
189
							</h3>
182
							</h3>
190
						</a>
183
						</a>
191
						<div id="aide-txt" class="collapse in">
184
						<div id="aide-txt" class="collapse in">
192
							<p>
185
							<p>
193
								Cet outil vous permet de partager simplement vos observations avec
186
								Cet outil vous permet de partager simplement vos observations avec
194
								le <a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
187
								le <a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
195
								(sous <a href="http://www.tela-botanica.org/page:licence">licence CC-BY-SA</a>).
188
								(sous <a href="http://www.tela-botanica.org/page:licence">licence CC-BY-SA</a>).
196
								Identifiez-vous bien pour ensuite retrouver et gérer vos données dans
189
								Identifiez-vous bien pour ensuite retrouver et gérer vos données dans
197
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
190
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
198
								Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
191
								Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
199
								Elles apparaissent immédiatement sur les
192
								Elles apparaissent immédiatement sur les
200
								<a href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
193
								<a href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
201
							</p>
194
							</p>
202
							<p class="discretion">
195
							<p class="discretion">
203
								Pour toute question ou remarque,
196
								Pour toute question ou remarque,
204
								<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
197
								<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
205
									target="_blank"
198
									target="_blank"
206
									onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
199
									onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
207
									contactez-nous</a>
200
									contactez-nous</a>
208
							</p>
201
							</p>
209
							<p class="discretion">
202
							<p class="discretion">
210
								Une fois familiarisé avec l'interface vous pouvez cliquer sur le bouton suivant pour désactiver l'aide&nbsp;:
203
								Une fois familiarisé avec l'interface vous pouvez cliquer sur le bouton suivant pour désactiver l'aide&nbsp;:
211
								<button id="btn-aide" class="btn btn-xs btn-success">
204
								<button id="btn-aide" class="btn btn-xs btn-success">
212
									<span class="glyphicon glyphicon-question-sign icon-white"></span>
205
									<span class="glyphicon glyphicon-question-sign icon-white"></span>
213
									<span id="btn-aide-txt">Désactiver l'aide</span>
206
									<span id="btn-aide-txt">Désactiver l'aide</span>
214
								</button>
207
								</button>
215
							</p>
208
							</p>
216
						</div>
209
						</div>
217
					</div>
210
					</div>
218
				</div>
211
				</div>
219
			</div>
212
			</div>
220
 
213
 
221
			<div class="well well-lg">
214
			<div class="well well-lg">
222
				<h2>Observateur</h2>
215
				<h2>Observateur</h2>
223
				<form id="form-observateur" role="form" autocomplete="on">
216
				<form id="form-observateur" role="form" autocomplete="on">
224
					<div class="row">
217
					<div class="row">
225
						<div class="col-md-6 form-group has-tooltip" data-placement="right"
218
						<div class="col-md-6 form-group has-tooltip" data-placement="right"
226
							title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
219
							title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
227
								Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
220
								Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
228
								ultérieurement. Des informations complémentaires vont vous être
221
								ultérieurement. Des informations complémentaires vont vous être
229
								demandées : prénom et nom.">
222
								demandées : prénom et nom.">
230
							<label for="courriel"  title="Veuillez saisir votre adresse courriel.">
223
							<label for="courriel"  title="Veuillez saisir votre adresse courriel.">
231
								<strong class="obligatoire">*</strong>
224
								<strong class="obligatoire">*</strong>
232
								Courriel
225
								Courriel
233
							</label>
226
							</label>
234
							<div class="input-group">
227
							<div class="input-group">
235
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
228
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
236
								<input id="courriel" name="courriel" class="form-control" type="text"/>
229
								<input id="courriel" name="courriel" class="form-control" type="text"/>
237
								<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
230
								<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
238
							</div>
231
							</div>
239
						</div>
232
						</div>
240
						<div id="zone-courriel-confirmation" class="col-md-6 form-group has-feedback hidden">
233
						<div id="zone-courriel-confirmation" class="col-md-6 form-group has-feedback hidden">
241
							<label for="courriel_confirmation" title="Veuillez saisir confirmer le courriel.">
234
							<label for="courriel_confirmation" title="Veuillez saisir confirmer le courriel.">
242
								<strong class="obligatoire">*</strong> Courriel (confirmation)
235
								<strong class="obligatoire">*</strong> Courriel (confirmation)
243
							</label>
236
							</label>
244
							<div class="input-group">
237
							<div class="input-group">
245
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
238
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
246
								<input id="courriel_confirmation" name="courriel_confirmation" class="form-control" type="text"/>
239
								<input id="courriel_confirmation" name="courriel_confirmation" class="form-control" type="text"/>
247
							</div>
240
							</div>
248
						</div>
241
						</div>
249
					</div>
242
					</div>
250
					<div id="zone-prenom-nom" class="row hidden">
243
					<div id="zone-prenom-nom" class="row hidden">
251
						<div class="col-md-6 form-group">
244
						<div class="col-md-6 form-group">
252
							<label for="prenom">Prénom</label>
245
							<label for="prenom">Prénom</label>
253
							<div class="input-group">
246
							<div class="input-group">
254
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
247
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
255
								<input id="prenom" name="prenom" class="form-control" type="text"/>
248
								<input id="prenom" name="prenom" class="form-control" type="text"/>
256
							</div>
249
							</div>
257
						</div>
250
						</div>
258
						<div class="col-md-6 form-group">
251
						<div class="col-md-6 form-group">
259
							<label for="nom">Nom</label>
252
							<label for="nom">Nom</label>
260
							<div class="input-group">
253
							<div class="input-group">
261
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
254
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
262
								<input id="nom" name="nom" class="form-control" type="text"/>
255
								<input id="nom" name="nom" class="form-control" type="text"/>
263
							</div>
256
							</div>
264
						</div>
257
						</div>
265
					</div>
258
					</div>
266
				</form>
259
				</form>
267
			</div>
260
			</div>
268
 
261
 
269
			<!-- Messages d'erreur du formulaire-->
262
			<!-- Messages d'erreur du formulaire-->
270
			<div class="row">
263
			<div class="row">
271
				<div class="zone-alerte col-md-6 col-md-offset-3">
264
				<div class="zone-alerte col-md-6 col-md-offset-3">
272
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
265
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
273
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
266
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
274
						<h4 class="alert-heading">Information : copier/coller</h4>
267
						<h4 class="alert-heading">Information : copier/coller</h4>
275
						<p>
268
						<p>
276
							Merci de ne pas copier/coller votre courriel.<br/>
269
							Merci de ne pas copier/coller votre courriel.<br/>
277
							La double saisie permet de vérifier l'absence d'erreurs.
270
							La double saisie permet de vérifier l'absence d'erreurs.
278
						</p>
271
						</p>
279
					</div>
272
					</div>
280
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
273
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
281
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
274
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
282
						<h4 class="alert-heading">Information : courriel introuvable</h4>
275
						<h4 class="alert-heading">Information : courriel introuvable</h4>
283
						<p>
276
						<p>
284
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
277
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
285
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
278
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
286
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
279
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
287
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
280
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
288
						</p>
281
						</p>
289
					</div>
282
					</div>
290
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
283
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
291
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
284
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
292
						<h4 class="alert-heading">Information sur Google Map</h4>
285
						<h4 class="alert-heading">Information sur Google Map</h4>
293
						<div class="contenu"></div>
286
						<div class="contenu"></div>
294
					</div>
287
					</div>
295
				</div>
288
				</div>
296
			</div>
289
			</div>
297
 
290
 
298
			<div class="well well-lg">
291
			<div class="well well-lg">
299
				<div class="row">
292
				<div class="row">
300
					<div class="col-md-12">
293
					<div class="col-md-12">
301
						<h2>Lieu et date du relevé</h2>
294
						<h2>Lieu et date du relevé</h2>
302
					</div>
295
					</div>
303
				</div>
296
				</div>
304
				<div class="row">
297
				<div class="row">
305
					<div class="col-md-6">
298
					<div class="col-md-6">
306
						<form id="form-obs-date" class="form-horizontal" role="form">
299
						<form id="form-obs-date" class="form-horizontal" role="form">
307
							<div class="form-group has-tooltip"
300
							<div class="form-group has-tooltip"
308
									title="Vous pouvez cliquer sur l'icône de calendrier pour
301
									title="Vous pouvez cliquer sur l'icône de calendrier pour
309
										sélectionner une date dans un calendrier.">
302
										sélectionner une date dans un calendrier.">
310
								<label for="date" class="col-sm-3 control-label"
303
								<label for="date" class="col-sm-3 control-label"
311
										title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
304
										title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
312
									<strong class="obligatoire">*</strong>
305
									<strong class="obligatoire">*</strong>
313
									Date du relevé
306
									Date du relevé
314
								</label>
307
								</label>
315
								<div class="col-sm-9">
308
								<div class="col-sm-9">
316
									<div class="input-group">
309
									<div class="input-group">
317
										<span id="date-icone" class="input-group-addon add-on"></span>
310
										<span id="date-icone" class="input-group-addon add-on"></span>
318
										<input id="date" name="date" class="form-control" type="text" placeholder="jj/mm/aaaa" />
311
										<input id="date" name="date" class="form-control" type="text" placeholder="jj/mm/aaaa" />
319
									</div>
312
									</div>
320
								</div>
313
								</div>
321
							</div>
314
							</div>
322
						</form>
315
						</form>
323
					</div>
316
					</div>
324
					<hr />
317
					<hr />
325
				</div>
318
				</div>
326
 
319
 
327
				<div class="row">
320
				<div class="row">
328
					<div class="col-md-6">
321
					<div class="col-md-6">
329
						<div class="row">
322
						<div class="row">
330
							<div class="col-md-3">
323
							<div class="col-md-3">
331
								<strong title="Veuillez localiser l'observation">Géolocalisation</strong>
324
								<strong title="Veuillez localiser l'observation">Géolocalisation</strong>
332
							</div>
325
							</div>
333
							<div class="col-md-9 text-right">
326
							<div class="col-md-9 text-right">
334
								<form id="form-carte-recherche" class="form-horizontal" role="form">
327
								<form id="form-carte-recherche" class="form-horizontal" role="form">
335
									<div class="form-group">
328
									<div class="form-group">
336
										<label for="carte-recherche" class="sr-only">Rechercher</label>
329
										<label for="carte-recherche" class="sr-only">Rechercher</label>
337
										<div class="col-md-12">
330
										<div class="col-md-12">
338
											<div class="input-group">
331
											<div class="input-group">
339
												<input id="carte-recherche" class="form-control has-tooltip" type="search" value=""
332
												<input id="carte-recherche" class="form-control has-tooltip" type="search" value=""
340
														title="Permet de centrer la carte sur le lieu recherché. Sélectionner un lieu dans la liste déroulante pour centrer la carte."
333
														title="Permet de centrer la carte sur le lieu recherché. Sélectionner un lieu dans la liste déroulante pour centrer la carte."
341
														placeholder="Centrer la carte sur un lieu..."/>
334
														placeholder="Centrer la carte sur un lieu..."/>
342
												<span class="input-group-addon"><span class="glyphicon glyphicon-search"></span></span>
335
												<span class="input-group-addon"><span class="glyphicon glyphicon-search"></span></span>
343
											</div>
336
											</div>
344
										</div>
337
										</div>
345
									</div>
338
									</div>
346
								</form>
339
								</form>
347
							</div>
340
							</div>
348
						</div>
341
						</div>
349
						<div class="row">
342
						<div class="row">
350
							<div class="col-md-12">
343
							<div class="col-md-12">
351
								<div id="map-canvas" class="has-tooltip"
344
								<div id="map-canvas" class="has-tooltip"
352
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
345
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
353
										représentant votre station ou bien le glisser-déposer sur
346
										représentant votre station ou bien le glisser-déposer sur
354
										le lieu souhaité."></div>
347
										le lieu souhaité."></div>
355
							</div>
348
							</div>
356
						</div>
349
						</div>
357
						<div class="row">
350
						<div class="row">
358
							<div id="info-altitude" class="col-md-5">
351
							<div id="info-altitude" class="col-md-5">
359
								<span>Altitude : </span>
352
								<span>Altitude : </span>
360
								<span id="marqueur-altitude"><span id="altitude"></span> m</span>
353
								<span id="marqueur-altitude"><span id="altitude"></span> m</span>
361
							</div>
354
							</div>
362
 
355
 
363
							<div id="info-commune" class="col-md-7">
356
							<div id="info-commune" class="col-md-7">
364
								<span>Commune : </span>
357
								<span>Commune : </span>
365
								<span id="marqueur-commune">
358
								<span id="marqueur-commune">
366
									<span id="commune-nom" class="commune-info"></span>
359
									<span id="commune-nom" class="commune-info"></span>
367
									(<span id="commune-code-insee" class="commune-info has-tooltip"
360
									(<span id="commune-code-insee" class="commune-info has-tooltip"
368
										title="Code INSEE de la commune"></span>)
361
										title="Code INSEE de la commune"></span>)
369
								</span>
362
								</span>
370
							</div>
363
							</div>
371
						</div>
364
						</div>
372
					</div>
365
					</div>
373
					<div class="col-md-6">
366
					<div class="col-md-6">
374
						<form id="form-station" class="form-horizontal" role="form" autocomplete="on">
367
						<form id="form-station" class="form-horizontal" role="form" autocomplete="on">
375
							<div class="form-group has-tooltip"
368
							<div class="form-group has-tooltip"
376
								title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
369
								title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
377
								<label for="lieudit" class="col-sm-2 control-label">
370
								<label for="lieudit" class="col-sm-2 control-label">
378
									Lieu-dit
371
									Lieu-dit
379
								</label>
372
								</label>
380
								<div class="col-sm-10">
373
								<div class="col-sm-10">
381
									<input id="lieudit" class="form-control" name="lieudit" type="text" />
374
									<input id="lieudit" class="form-control" name="lieudit" type="text" />
382
								</div>
375
								</div>
383
							</div>
376
							</div>
384
 
377
 
385
							<div class="span6 form-group has-tooltip"
378
							<div class="span6 form-group has-tooltip"
386
								title="Lieu précis de l'observation définissant une unité écologique homogène (ex: le pré derrière la maison)." >
379
								title="Lieu précis de l'observation définissant une unité écologique homogène (ex: le pré derrière la maison)." >
387
								<label for="station" class="col-sm-2 control-label">
380
								<label for="station" class="col-sm-2 control-label">
388
									Station
381
									Station
389
								</label>
382
								</label>
390
								<div class="col-sm-10">
383
								<div class="col-sm-10">
391
									<input id="station" class="form-control" name="station" type="text" />
384
									<input id="station" class="form-control" name="station" type="text" />
392
								</div>
385
								</div>
393
							</div>
386
							</div>
394
 
387
 
395
							<div class="row">
388
							<div class="row">
396
								<div class="col-md-12">
389
								<div class="col-md-12">
397
									<button class="afficher-coord btn-coord btn btn-default"
390
									<button class="afficher-coord btn-coord btn btn-default"
398
											data-toggle-text="Cacher les coordonnées (WGS 84 et Lambert 93)">
391
											data-toggle-text="Cacher les coordonnées (WGS 84 et Lambert 93)">
399
										Afficher les coordonnées (WGS 84 et Lambert 93)
392
										Afficher les coordonnées (WGS 84 et Lambert 93)
400
									</button>
393
									</button>
401
									<div id="coordonnees-geo" class="well hidden">
394
									<div id="coordonnees-geo" class="well hidden">
402
										<div class="row">
395
										<div class="row">
403
											<div class="col-md-4">
396
											<div class="col-md-4">
404
												<div id="coord-lat" class="form-group form-group-sm">
397
												<div id="coord-lat" class="form-group form-group-sm">
405
													<label for="latitude" class="col-sm-4 control-label">Latitude</label>
398
													<label for="latitude" class="col-sm-4 control-label">Latitude</label>
406
													<div class="col-sm-8">
399
													<div class="col-sm-8">
407
														<input id="latitude" class="form-control" name="latitude" type="text"
400
														<input id="latitude" class="form-control" name="latitude" type="text"
408
															title="Latitude (WGS 84)" value=""/>
401
															title="Latitude (WGS 84)" value=""/>
409
													</div>
402
													</div>
410
												</div>
403
												</div>
411
											</div>
404
											</div>
412
											<div class="col-md-5">
405
											<div class="col-md-5">
413
												<div id="coord-lng" class="form-group form-group-sm">
406
												<div id="coord-lng" class="form-group form-group-sm">
414
													<label for="latitude" class="col-sm-4 control-label">Longitude</label>
407
													<label for="latitude" class="col-sm-4 control-label">Longitude</label>
415
													<div class="col-sm-8">
408
													<div class="col-sm-8">
416
														<input id="longitude" class="form-control" name="longitude" type="text"
409
														<input id="longitude" class="form-control" name="longitude" type="text"
417
															title="Longitude (WGS 84)" value=""/>
410
															title="Longitude (WGS 84)" value=""/>
418
													</div>
411
													</div>
419
												</div>
412
												</div>
420
											</div>
413
											</div>
421
											<div class="col-md-2">
414
											<div class="col-md-2">
422
												<div id="coord-lng" class="form-group form-group-sm">
415
												<div id="coord-lng" class="form-group form-group-sm">
423
													<input type="button" id="geolocaliser"
416
													<input type="button" id="geolocaliser"
424
														class="btn btn-default btn-sm has-tooltip"
417
														class="btn btn-default btn-sm has-tooltip"
425
														title="Centre la carte sur les coordonnées de latitude et longitude saisies."
418
														title="Centre la carte sur les coordonnées de latitude et longitude saisies."
426
														value="Voir sur la carte"/>
419
														value="Voir sur la carte"/>
427
												</div>
420
												</div>
428
											</div>
421
											</div>
429
										</div>
422
										</div>
430
 
423
 
431
										<div class="row">
424
										<div class="row">
432
											<div class="col-md-6">
425
											<div class="col-md-6">
433
												<div id="coord-l93-x" class="form-group">
426
												<div id="coord-l93-x" class="form-group">
434
													<label for="l93-x" class="col-sm-6 control-label">X Lambert 93</label>
427
													<label for="l93-x" class="col-sm-6 control-label">X Lambert 93</label>
435
													<div class="col-sm-5">
428
													<div class="col-sm-5">
436
														<input id="l93-x" disabled type="text" class="input-sm form-control obs-chp-etendu"
429
														<input id="l93-x" disabled type="text" class="input-sm form-control obs-chp-etendu"
437
																name="coordonneeLambert93X"
430
																name="coordonneeLambert93X"
438
																data-label="Lambert 93 X"
431
																data-label="Lambert 93 X"
439
																value=""/>
432
																value=""/>
440
													</div>
433
													</div>
441
												</div>
434
												</div>
442
											</div>
435
											</div>
443
											<div class="col-md-6">
436
											<div class="col-md-6">
444
												<div id="coord-l93-y" class="form-group">
437
												<div id="coord-l93-y" class="form-group">
445
													<label for="l93-y" class="col-sm-6 control-label">Y Lambert 93</label>
438
													<label for="l93-y" class="col-sm-6 control-label">Y Lambert 93</label>
446
													<div class="col-sm-5">
439
													<div class="col-sm-5">
447
														<input id="l93-y" disabled type="text" class="input-sm form-control obs-chp-etendu"
440
														<input id="l93-y" disabled type="text" class="input-sm form-control obs-chp-etendu"
448
																name="coordonneeLambert93Y"
441
																name="coordonneeLambert93Y"
449
																data-label="Lambert 93 Y"
442
																data-label="Lambert 93 Y"
450
																value=""/>
443
																value=""/>
451
													</div>
444
													</div>
452
												</div>
445
												</div>
453
											</div>
446
											</div>
454
										</div>
447
										</div>
455
									</div>
448
									</div>
456
								</div>
449
								</div>
457
							</div>
450
							</div>
458
						</form>
451
						</form>
459
					</div>
452
					</div>
460
				</div>
453
				</div>
461
			</div>
454
			</div>
462
 
455
 
463
			<div class="well well-lg">
456
			<div class="well well-lg">
464
				<div class="row">
457
				<div class="row">
465
					<div class="col-md-6">
458
					<div class="col-md-6">
466
						<form id="form-station-detail" class="form-horizontal" role="form" autocomplete="on">
459
						<form id="form-station-detail" class="form-horizontal" role="form" autocomplete="on">
467
							<h2>Caractéristiques de la station</h2>
460
							<h2>Caractéristiques de la station</h2>
468
 
461
 
469
							<div class="form-group has-tooltip"
462
							<div class="form-group has-tooltip"
470
								title="Type d'habitat plus ou moins standardisé dans les codes Corine ou Catminat (ex: prairie, pelouse, lisière, friche...)." >
463
								title="Type d'habitat plus ou moins standardisé dans les codes Corine ou Catminat (ex: prairie, pelouse, lisière, friche...)." >
471
								<label for="milieu" class="col-sm-4 control-label">
464
								<label for="milieu" class="col-sm-4 control-label">
472
									Type de milieu
465
									Type de milieu
473
								</label>
466
								</label>
474
								<div class="col-sm-8">
467
								<div class="col-sm-8">
475
									<input id="milieu" class="form-control" name="milieu" type="text" />
468
									<input id="milieu" class="form-control" name="milieu" type="text" />
476
								</div>
469
								</div>
477
							</div>
470
							</div>
478
 
471
 
479
							<div class="form-group has-tooltip"
472
							<div class="form-group has-tooltip"
480
									title="Indiquez l'exposition principale de la station.">
473
									title="Indiquez l'exposition principale de la station.">
481
								<label for="station-exposition" class="col-sm-4 control-label">
474
								<label for="station-exposition" class="col-sm-4 control-label">
482
									Exposition du terrain
475
									Exposition du terrain
483
								</label>
476
								</label>
484
								<div class="col-sm-8">
477
								<div class="col-sm-8">
485
									<select id="station-exposition" class="form-control obs-chp-etendu" name="stationExposition">
478
									<select id="station-exposition" class="form-control obs-chp-etendu" name="stationExposition">
486
										<option selected value="">Sélectionnez l'exposition du terrain</option>
479
										<option selected value="">Sélectionnez l'exposition du terrain</option>
487
										<option value="Plat">Terrain plat</option>
480
										<option value="Plat">Terrain plat</option>
488
										<option value="N">Nord</option>
481
										<option value="N">Nord</option>
489
										<option value="N-O">Nord-Ouest</option>
482
										<option value="N-O">Nord-Ouest</option>
490
										<option value="N-E">Nord-Est</option>
483
										<option value="N-E">Nord-Est</option>
491
										<option value="E">Est</option>
484
										<option value="E">Est</option>
492
										<option value="O">Ouest</option>
485
										<option value="O">Ouest</option>
493
										<option value="S">Sud</option>
486
										<option value="S">Sud</option>
494
										<option value="S-O">Sud-Ouest</option>
487
										<option value="S-O">Sud-Ouest</option>
495
										<option value="S-E">Sud-Est</option>
488
										<option value="S-E">Sud-Est</option>
496
									</select>
489
									</select>
497
								</div>
490
								</div>
498
							</div>
491
							</div>
499
 
492
 
500
							<div class="form-group has-tooltip"
493
							<div class="form-group has-tooltip"
501
									title="Indiquez le pourcentage de la pente de la station.">
494
									title="Indiquez le pourcentage de la pente de la station.">
502
								<label for="station-pente" class="col-sm-4 control-label">
495
								<label for="station-pente" class="col-sm-4 control-label">
503
									Pente du terrain
496
									Pente du terrain
504
								</label>
497
								</label>
505
								<div class="col-sm-8">
498
								<div class="col-sm-8">
506
									<select id="station-pente" class="form-control obs-chp-etendu" name="stationPente">
499
									<select id="station-pente" class="form-control obs-chp-etendu" name="stationPente">
507
										<option selected value="">Sélectionnez la pente du terrain</option>
500
										<option selected value="">Sélectionnez la pente du terrain</option>
508
										<option value="0-9%">entre 0 et 9% (0 à 5°)</option>
501
										<option value="0-9%">entre 0 et 9% (0 à 5°)</option>
509
										<option value="10-19%">entre 10 et 19% (5 à 9°)</option>
502
										<option value="10-19%">entre 10 et 19% (5 à 9°)</option>
510
										<option value="20-29%">entre 20 et 29% (10 à 14°)</option>
503
										<option value="20-29%">entre 20 et 29% (10 à 14°)</option>
511
										<option value="+30%">&gt; à 30% (&gt; à 15°)</option>
504
										<option value="+30%">&gt; à 30% (&gt; à 15°)</option>
512
									</select>
505
									</select>
513
								</div>
506
								</div>
514
							</div>
507
							</div>
515
 
508
 
516
						</form>
509
						</form>
517
					</div>
510
					</div>
518
 
511
 
519
					<div class="col-md-6">
512
					<div class="col-md-6">
520
						<form id="form-obs" class="form-horizontal" role="form" autocomplete="on">
513
						<form id="form-obs" class="form-horizontal" role="form" autocomplete="on">
521
							<h2>Relevé de la plante</h2>
514
							<h2>Relevé de la plante</h2>
522
 
515
 
523
							<input id="referentiel" type="hidden" value="bdtfx" />
516
							<input id="referentiel" type="hidden" value="bdtfx" />
524
 
517
 
525
							<div id="taxon-input-groupe" class="form-group has-tooltip"
518
							<div id="taxon-input-groupe" class="form-group has-tooltip"
526
								title="Sélectionnez une espèce dans la liste déroulante pour lier
519
								title="Sélectionnez une espèce dans la liste déroulante pour lier
527
									votre nom au référentiel selectionné. Si vous
520
									votre nom au référentiel selectionné. Si vous
528
									le désirez vous pouvez aussi saisir un nom absent du référentiel
521
									le désirez vous pouvez aussi saisir un nom absent du référentiel
529
									(Ex. : 'fleur violette' ou 'viola sinensis???')." >
522
									(Ex. : 'fleur violette' ou 'viola sinensis???')." >
530
								<label for="taxon"  class="col-sm-4 control-label">
523
								<label for="taxon"  class="col-sm-4 control-label">
531
									<strong class="obligatoire">*</strong>
524
									<strong class="obligatoire">*</strong>
532
									Espèce <?= $referentiel_impose ? '('.$ns_referentiel.')' : '' ?>
525
									Espèce <?= $referentiel_impose ? '('.$ns_referentiel.')' : '' ?>
533
								</label>
526
								</label>
534
								<div class="col-sm-8">
527
								<div class="col-sm-8">
535
									<div class="input-group">
528
									<div class="input-group">
536
										<span class="input-group-addon">
529
										<span class="input-group-addon">
537
											<span class="glyphicon glyphicon-leaf"></span>
530
											<span class="glyphicon glyphicon-leaf"></span>
538
										</span>
531
										</span>
539
										<input id="taxon" name="taxon" type="text" class="form-control"
532
										<input id="taxon" name="taxon" type="text" class="form-control"
540
											value="<?= $nom_sci_espece_defaut; ?>" />
533
											value="<?= $nom_sci_espece_defaut; ?>" />
541
									</div>
534
									</div>
542
								</div>
535
								</div>
543
							</div>
536
							</div>
544
 
537
 
545
							<div class="form-group has-tooltip"
538
							<div class="form-group has-tooltip"
546
									title="Indiquez le type de taille de l'arbre.">
539
									title="Indiquez le type de taille de l'arbre.">
547
								<label for="taille-type" class="col-sm-4 control-label">
540
								<label for="taille-type" class="col-sm-4 control-label">
548
									Phénologie
541
									Phénologie
549
								</label>
542
								</label>
550
								<div class="col-sm-8">
543
								<div class="col-sm-8">
551
									<select id="phenologie" class="form-control" name="phenologie">
544
									<select id="phenologie" class="form-control" name="phenologie">
552
										<option selected value="">Sélectionnez l'état de la plante</option>
545
										<option selected value="">Sélectionnez l'état de la plante</option>
553
										<option value="10-19: développement des feuilles">En feuille</option>
546
										<option value="10-19: développement des feuilles">En feuille</option>
554
										<option value="50-59: apparition de l'inflorescence, épiaison">En bouton</option>
547
										<option value="50-59: apparition de l'inflorescence, épiaison">En bouton</option>
555
										<option value="60-69: floraison">En fleur</option>
548
										<option value="60-69: floraison">En fleur</option>
556
										<option value="70-79: fructification">En fruit</option>
549
										<option value="70-79: fructification">En fruit</option>
557
										<option value="90-99: sénescence et dormance">En sénescence ou dormance</option>
550
										<option value="90-99: sénescence et dormance">En sénescence ou dormance</option>
558
									</select>
551
									</select>
559
								</div>
552
								</div>
560
							</div>
553
							</div>
561
 
554
 
562
							<div class="form-group has-tooltip"
555
							<div class="form-group has-tooltip"
563
									title="Estimation de l'abondance de la plante sur une surface donnée. Surface inventoriée
556
									title="Estimation de l'abondance de la plante sur une surface donnée. Surface inventoriée
564
									limitée par la présence d'un autre milieu ou distancé par au moins 500m d'une autre
557
									limitée par la présence d'un autre milieu ou distancé par au moins 500m d'une autre
565
									zone où la plante est observée.">
558
									zone où la plante est observée.">
566
								<label for="abondance" class="col-sm-4 control-label">
559
								<label for="abondance" class="col-sm-4 control-label">
567
									Abondance
560
									Abondance
568
								</label>
561
								</label>
569
								<div class="col-sm-8">
562
								<div class="col-sm-8">
570
									<select id="abondance" class="form-control" name="abondance">
563
									<select id="abondance" class="form-control" name="abondance">
571
										<option selected value="">Sélectionnez l'abondance</option>
564
										<option selected value="">Sélectionnez l'abondance</option>
572
										<option value="1-4 individus">1-4 individus</option>
565
										<option value="1-4 individus">1-4 individus</option>
573
										<option value="5-9 individus">5-9 individus</option>
566
										<option value="5-9 individus">5-9 individus</option>
574
										<option value="10-49 individus">10-49 individus</option>
567
										<option value="10-49 individus">10-49 individus</option>
575
										<option value="50-99 individus">50-99 individus</option>
568
										<option value="50-99 individus">50-99 individus</option>
576
										<option value="100-499 individus">100-499 individus</option>
569
										<option value="100-499 individus">100-499 individus</option>
577
										<option value=">500 individus">&gt; à 500 individus</option>
570
										<option value=">500 individus">&gt; à 500 individus</option>
578
									</select>
571
									</select>
579
								</div>
572
								</div>
580
							</div>
573
							</div>
581
 
574
 
582
							<div id="individus-nbre-groupe" class="form-group has-tooltip hidden"
575
							<div id="individus-nbre-groupe" class="form-group has-tooltip hidden"
583
								title="Indiquez le nombre d'individus." >
576
								title="Indiquez le nombre d'individus." >
584
								<label for="individus-nbre" class="col-sm-4 control-label">
577
								<label for="individus-nbre" class="col-sm-4 control-label">
585
									Nombre d'individus
578
									Nombre d'individus
586
								</label>
579
								</label>
587
								<div class="col-sm-4">
580
								<div class="col-sm-4">
588
									<input id="individus-nbre" class="form-control obs-chp-etendu" name="individusNombre"
581
									<input id="individus-nbre" class="form-control obs-chp-etendu" name="individusNombre"
589
										min="0"
582
										min="0"
590
										type="number"
583
										type="number"
591
										value="" />
584
										value="" />
592
								</div>
585
								</div>
593
							</div>
586
							</div>
594
 
587
 
595
							<div class="form-group has-tooltip"
588
							<div class="form-group has-tooltip"
596
									title="Indiquez si le relevé effectué vis à acquérir de nouvelle observation ou
589
									title="Indiquez si le relevé effectué vis à acquérir de nouvelle observation ou
597
										viser à confirmer la présence de la plante vis à vis d'une observation historique.">
590
										viser à confirmer la présence de la plante vis à vis d'une observation historique.">
598
								<label for="releve-type" class="col-sm-4 control-label">
591
								<label for="releve-type" class="col-sm-4 control-label">
599
									Type de relevé
592
									Type de relevé
600
								</label>
593
								</label>
601
								<div class="col-sm-8">
594
								<div class="col-sm-8">
602
									<select id="releve-type" class="form-control obs-chp-etendu" name="releveType">
595
									<select id="releve-type" class="form-control obs-chp-etendu" name="releveType">
603
										<option selected value="">Sélectionnez le type de relevé</option>
596
										<option selected value="">Sélectionnez le type de relevé</option>
604
										<option value="nouveau">Acquisition d'une nouvelle donnée</option>
597
										<option value="nouveau">Acquisition d'une nouvelle donnée</option>
605
										<option value="confirmation">Confirmation d'une donnée historique (précisez laquelle dans les notes)</option>
598
										<option value="confirmation">Confirmation d'une donnée historique (précisez laquelle dans les notes)</option>
606
									</select>
599
									</select>
607
								</div>
600
								</div>
608
							</div>
601
							</div>
609
 
602
 
610
							<div class="form-group has-tooltip"
603
							<div class="form-group has-tooltip"
611
									title="Indiquez le code ISBN de l'ouvrage de détermination utilisé.
604
									title="Indiquez le code ISBN de l'ouvrage de détermination utilisé.
612
										L'ISBN est un numéro international qui permet d’identifier, de manière unique,
605
										L'ISBN est un numéro international qui permet d’identifier, de manière unique,
613
										chaque édition de chaque livre publié, que son support soit numérique ou sur papier.
606
										chaque édition de chaque livre publié, que son support soit numérique ou sur papier.
614
										Ce code est généralement présent à l'endos d'un livre (à proximité du code barre)
607
										Ce code est généralement présent à l'endos d'un livre (à proximité du code barre)
615
										ou sur la page des droits d'auteur et de publication.
608
										ou sur la page des droits d'auteur et de publication.
616
										Si votre navigateur le supporte, vous pouvez sélectionner le code ISBN
609
										Si votre navigateur le supporte, vous pouvez sélectionner le code ISBN
617
										d'une flore dans la liste qui s'ouvrira en cliquant dans le champ ou en
610
										d'une flore dans la liste qui s'ouvrira en cliquant dans le champ ou en
618
										utilisant la touche «Flêche bas» (↓). Sinon, indiquez le code ISBN de la
611
										utilisant la touche «Flêche bas» (↓). Sinon, indiquez le code ISBN de la
619
										flore ou de l'ouvrage principal ayant servi à la détermination
612
										flore ou de l'ouvrage principal ayant servi à la détermination
620
										(Ex. : ISBN-13:978-3-642-11746-6, ISBN:978-3-642-11746-6, 3-642-11746-5 ).">
613
										(Ex. : ISBN-13:978-3-642-11746-6, ISBN:978-3-642-11746-6, 3-642-11746-5 ).">
621
								<label for="determination-source-isbn" class="col-sm-4 control-label">
614
								<label for="determination-source-isbn" class="col-sm-4 control-label">
622
									Source détermination
615
									Source détermination
623
								</label>
616
								</label>
624
								<div class="col-sm-8">
617
								<div class="col-sm-8">
625
									<input id="determination-source" class="form-control obs-chp-etendu" list="flores"
618
									<input id="determination-source" class="form-control obs-chp-etendu" list="flores"
626
										name="determinationSource"
619
										name="determinationSource"
627
										type="text" >
620
										type="text" >
628
									<datalist id="flores">
621
									<datalist id="flores">
629
										<option value="ISBN:978-2-909-71790-6">TISON J-M. &amp; JAUZEIN P., 2014. Flore de la France méditerranéenne continentale. Naturalia publications. ISBN:978-2909717906. 2078p.</option>
622
										<option value="ISBN:978-2-909-71790-6">TISON J-M. &amp; JAUZEIN P., 2014. Flore de la France méditerranéenne continentale. Naturalia publications. ISBN:978-2909717906. 2078p.</option>
630
										<option value="ISBN:978-2-853-67058-6">COSTE H. (ABBE), 1937. Flore descriptive et illustrée de la France, de la Corse et des contrées limitrophes. Albert Blanchard, éditeur. ISBN:978-2853670586. 1850p.</option>
623
										<option value="ISBN:978-2-853-67058-6">COSTE H. (ABBE), 1937. Flore descriptive et illustrée de la France, de la Corse et des contrées limitrophes. Albert Blanchard, éditeur. ISBN:978-2853670586. 1850p.</option>
631
										<option value="ISBN:978-2-100-05463-3">FOURNIER P-V., 1934-1940. Les quatres flores de France, Corse comprise. ISBN:978-2100054633. 1103p.</option>
624
										<option value="ISBN:978-2-100-05463-3">FOURNIER P-V., 1934-1940. Les quatres flores de France, Corse comprise. ISBN:978-2100054633. 1103p.</option>
632
										<option value="ISBN:978-2-701-11000-4">BONNIER G. &amp; DE LAYENS G., 1909. La végétation de la France, Suisse et Belgique. Librairie Générale de l'enseignement, Paris. ISBN:978-2701110004. 425p.</option>
625
										<option value="ISBN:978-2-701-11000-4">BONNIER G. &amp; DE LAYENS G., 1909. La végétation de la France, Suisse et Belgique. Librairie Générale de l'enseignement, Paris. ISBN:978-2701110004. 425p.</option>
633
									</datalist>
626
									</datalist>
634
								</div>
627
								</div>
635
							</div>
628
							</div>
636
						</form>
629
						</form>
637
					</div>
630
					</div>
638
				</div>
631
				</div>
639
 
632
 
640
 
633
 
641
				<div class="row">
634
				<div class="row">
642
					<div class="col-md-6">
635
					<div class="col-md-6">
643
						<div class="row">
636
						<div class="row">
644
							<div class="col-md-12">
637
							<div class="col-md-12">
645
								<h2>Notes</h2>
638
								<h2>Notes</h2>
646
								<textarea id="notes" form="form-obs" class="form-control col-md-12" rows="7" name="notes"
639
								<textarea id="notes" form="form-obs" class="form-control col-md-12" rows="7" name="notes"
647
									placeholder="Vous pouvez éventuellement ajouter des informations complémentaires à votre observation. Indiquez ici l'éventuelle donnée historique ayant servi de base au relevé."></textarea>
640
									placeholder="Vous pouvez éventuellement ajouter des informations complémentaires à votre observation. Indiquez ici l'éventuelle donnée historique ayant servi de base au relevé."></textarea>
648
							</div>
641
							</div>
649
						</div>
642
						</div>
650
					</div>
643
					</div>
651
 
644
 
652
					<div class="col-md-6">
645
					<div class="col-md-6">
653
						<div class="row">
646
						<div class="row">
654
							<form id="form-upload" class="form form-horizontal" role="form" action="<?= $url_ws_upload ?>"
647
							<form id="form-upload" class="form form-horizontal" role="form" action="<?= $url_ws_upload ?>"
655
								method="post" enctype="multipart/form-data">
648
								method="post" enctype="multipart/form-data">
656
								<div class="col-md-12">
649
								<div class="col-md-12">
657
									<h2>Image(s) de la plante</h2>
650
									<h2>Image(s) de la plante</h2>
658
									<strong>Ajouter une image</strong>
651
									<strong>Ajouter une image</strong>
659
									<p class="miniature-info discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
652
									<p class="miniature-info discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
660
									<div id ="photos-conteneur" class="form-group">
653
									<div id ="photos-conteneur" class="form-group">
661
										<div class="col-sm-12">
654
										<div class="col-sm-12">
662
											<input type="file" id="fichier" name="fichier" class="form-control" accept="image/jpeg" />
655
											<input type="file" id="fichier" name="fichier" class="form-control" accept="image/jpeg" />
663
											<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
656
											<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
664
										</div>
657
										</div>
665
										<div id="miniatures"></div>
658
										<div id="miniatures"></div>
666
										<p class="miniature-msg col-md-12">&nbsp;</p>
659
										<p class="miniature-msg col-md-12">&nbsp;</p>
667
									</div>
660
									</div>
668
								</div>
661
								</div>
669
							</form>
662
							</form>
670
						</div>
663
						</div>
671
					</div>
664
					</div>
672
				</div>
665
				</div>
673
 
666
 
674
				<div class="row">
667
				<div class="row">
675
					<div class="col-md-12 centre has-tooltip"
668
					<div class="col-md-12 centre has-tooltip"
676
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
669
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
677
							ajouter votre observation à la liste à transmettre.">
670
							ajouter votre observation à la liste à transmettre.">
678
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
671
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
679
							Créer
672
							Créer
680
						</button>
673
						</button>
681
					</div>
674
					</div>
682
				</div>
675
				</div>
683
			</div>
676
			</div>
684
 
677
 
685
 
678
 
686
		<!-- Messages d'erreur du formulaire-->
679
		<!-- Messages d'erreur du formulaire-->
687
			<div class="row">
680
			<div class="row">
688
				<div class="zone-alerte col-md-6 col-md-offset-3">
681
				<div class="zone-alerte col-md-6 col-md-offset-3">
689
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
682
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
690
						<a class="close">×</a>
683
						<a class="close">×</a>
691
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
684
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
692
						<p>
685
						<p>
693
							Vous venez d'ajouter votre 10ème observation.<br/>
686
							Vous venez d'ajouter votre 10ème observation.<br/>
694
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
687
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
695
						</p>
688
						</p>
696
					</div>
689
					</div>
697
				</div>
690
				</div>
698
				<div class="zone-alerte col-md-6 col-md-offset-3">
691
				<div class="zone-alerte col-md-6 col-md-offset-3">
699
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
692
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
700
						<a class="close">×</a>
693
						<a class="close">×</a>
701
						<h4 class="alert-heading">Information : champs en erreur</h4>
694
						<h4 class="alert-heading">Information : champs en erreur</h4>
702
						<p>
695
						<p>
703
							Certains champs du formulaire sont mal remplis.<br/>
696
							Certains champs du formulaire sont mal remplis.<br/>
704
							Veuillez vérifier les données saisies dans le formulaire.
697
							Veuillez vérifier les données saisies dans le formulaire.
705
						</p>
698
						</p>
706
					</div>
699
					</div>
707
				</div>
700
				</div>
708
			</div>
701
			</div>
709
 
702
 
710
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
703
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
711
			<div id="zone-liste-obs" class="row">
704
			<div id="zone-liste-obs" class="row">
712
				<div class="col-md-12">
705
				<div class="col-md-12">
713
					<div class="well well-lg">
706
					<div class="well well-lg">
714
						<div class="row">
707
						<div class="row">
715
							<div class="col-md-10">
708
							<div class="col-md-10">
716
								<h2>
709
								<h2>
717
									Observations
710
									Observations
718
									<?=!empty($nom_sci_espece_defaut) ? "de<i> {$nom_sci_espece_defaut}</i> " : ''; ?>
711
									<?=!empty($nom_sci_espece_defaut) ? "de<i> {$nom_sci_espece_defaut}</i> " : ''; ?>
719
									à transmettre :
712
									à transmettre :
720
									<span class="obs-nbre">0</span>
713
									<span class="obs-nbre">0</span>
721
								</h2>
714
								</h2>
722
							</div>
715
							</div>
723
							<div class="col-md-2 text-right">
716
							<div class="col-md-2 text-right">
724
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
717
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
725
									type="button" disabled="disabled"
718
									type="button" disabled="disabled"
726
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
719
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
727
									Transmettre
720
									Transmettre
728
								</button>
721
								</button>
729
							</div>
722
							</div>
730
						</div>
723
						</div>
731
						<div id="liste-obs" ></div>
724
						<div id="liste-obs" ></div>
732
						<div class="row">
725
						<div class="row">
733
							<div class="zone-alerte col-md-6 col-md-offset-3">
726
							<div class="zone-alerte col-md-6 col-md-offset-3">
734
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
727
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
735
									<a class="close">×</a>
728
									<a class="close">×</a>
736
									<h4 class="alert-heading">Attention : aucune observation</h4>
729
									<h4 class="alert-heading">Attention : aucune observation</h4>
737
									<p>Veuillez saisir des observations pour les transmettres.</p>
730
									<p>Veuillez saisir des observations pour les transmettres.</p>
738
								</div>
731
								</div>
739
 
732
 
740
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
733
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
741
									<a class="close">×</a>
734
									<a class="close">×</a>
742
									<h4 class="alert-heading">Information : transmission des observations</h4>
735
									<h4 class="alert-heading">Information : transmission des observations</h4>
743
									<div class="alert-txt"></div>
736
									<div class="alert-txt"></div>
744
								</div>
737
								</div>
745
 
738
 
746
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
739
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
747
									<a class="close">×</a>
740
									<a class="close">×</a>
748
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
741
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
749
									<div class="alert-txt"></div>
742
									<div class="alert-txt"></div>
750
								</div>
743
								</div>
751
							</div>
744
							</div>
752
						</div>
745
						</div>
753
 
746
 
754
					</div>
747
					</div>
755
				</div>
748
				</div>
756
			</div>
749
			</div>
757
 
750
 
758
			<footer class="row">
751
			<footer class="row">
759
				<p class="col-md-12 ">Réalisation &amp; hébergement : <a href="http://www.tela-botanica.org" target="_blank">Tela Botanica</a> 2014</p>
752
				<p class="col-md-12 ">Réalisation &amp; hébergement : <a href="http://www.tela-botanica.org" target="_blank">Tela Botanica</a> 2014</p>
760
			</footer>
753
			</footer>
761
 
754
 
762
			<!-- Templates HTML -->
755
			<!-- Templates HTML -->
763
			<div id="tpl-transmission-ok" style="display:none;">
756
			<div id="tpl-transmission-ok" style="display:none;">
764
				<p class="msg">
757
				<p class="msg">
765
					Vos observations ont bien été transmises.<br />
758
					Vos observations ont bien été transmises.<br />
766
					Elles sont désormais consultables à travers les différents outils de visualisation
759
					Elles sont désormais consultables à travers les différents outils de visualisation
767
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
760
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
768
					<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
761
					<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
769
					<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
762
					<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
770
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
763
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
771
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
764
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
772
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
765
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
773
					N'oubliez pas qu'il est nécessaire de
766
					N'oubliez pas qu'il est nécessaire de
774
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
767
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
775
					au préalable, si ce n'est pas déjà fait.
768
					au préalable, si ce n'est pas déjà fait.
776
				</p>
769
				</p>
777
			</div>
770
			</div>
778
			<div id="tpl-transmission-ko" style="display:none;">
771
			<div id="tpl-transmission-ko" style="display:none;">
779
				<p class="msg">
772
				<p class="msg">
780
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
773
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
781
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
774
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
782
					et transmettre les suivantes.<br />
775
					et transmettre les suivantes.<br />
783
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
776
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
784
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
777
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
785
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
778
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
786
								  target="_blank"
779
								  target="_blank"
787
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
780
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
788
								  le formulaire de signalement d'erreurs</a>.
781
								  le formulaire de signalement d'erreurs</a>.
789
				</p>
782
				</p>
790
			</div>
783
			</div>
791
 
784
 
792
			<!-- Fenêtres modales -->
785
			<!-- Fenêtres modales -->
793
			<div id="chargement" class="modal-fenetre" style="display:none;">
786
			<div id="chargement" class="modal-fenetre" style="display:none;">
794
				<div id="chargement-centrage" class="modal-contenu">
787
				<div id="chargement-centrage" class="modal-contenu">
795
					<div class="progress">
788
					<div class="progress">
796
						<div id="barre-progression-upload" class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
789
						<div id="barre-progression-upload" class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
797
							<span class="sr-only">0/10 observations transmises</span>
790
							<span class="sr-only">0/10 observations transmises</span>
798
						</div>
791
						</div>
799
					</div>
792
					</div>
800
 
793
 
801
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
794
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
802
						Transfert des observations en cours...<br />
795
						Transfert des observations en cours...<br />
803
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
796
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
804
						d'observations à transférer.
797
						d'observations à transférer.
805
					</p>
798
					</p>
806
				</div>
799
				</div>
807
			</div>
800
			</div>
808
		</div>
801
		</div>
809
	</body>
802
	</body>
810
</html>
803
</html>