Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 2841 Rev 2848
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="btn-coord btn btn-default"
390
									<button class="btn-coord btn btn-default"
398
									
391
									
399
											data-toggle-text="Cacher les coordonnées (WGS 84 et Lambert 93)">
392
											data-toggle-text="Cacher les coordonnées (WGS 84 et Lambert 93)">
400
										Afficher les coordonnées (WGS 84 et Lambert 93)
393
										Afficher les coordonnées (WGS 84 et Lambert 93)
401
									</button>
394
									</button>
402
									<div id="coordonnees-geo" class="well hidden">
395
									<div id="coordonnees-geo" class="well hidden">
403
										<div class="row">
396
										<div class="row">
404
											<div class="col-md-4">
397
											<div class="col-md-4">
405
												<div id="coord-lat" class="form-group form-group-sm">
398
												<div id="coord-lat" class="form-group form-group-sm">
406
													<label for="latitude" class="col-sm-4 control-label">Latitude</label>
399
													<label for="latitude" class="col-sm-4 control-label">Latitude</label>
407
													<div class="col-sm-8">
400
													<div class="col-sm-8">
408
														<input id="latitude" class="form-control" name="latitude" type="text"
401
														<input id="latitude" class="form-control" name="latitude" type="text"
409
															title="Latitude (WGS 84)" value=""/>
402
															title="Latitude (WGS 84)" value=""/>
410
													</div>
403
													</div>
411
												</div>
404
												</div>
412
											</div>
405
											</div>
413
											<div class="col-md-5">
406
											<div class="col-md-5">
414
												<div id="coord-lng" class="form-group form-group-sm">
407
												<div id="coord-lng" class="form-group form-group-sm">
415
													<label for="latitude" class="col-sm-4 control-label">Longitude</label>
408
													<label for="latitude" class="col-sm-4 control-label">Longitude</label>
416
													<div class="col-sm-8">
409
													<div class="col-sm-8">
417
														<input id="longitude" class="form-control" name="longitude" type="text"
410
														<input id="longitude" class="form-control" name="longitude" type="text"
418
															title="Longitude (WGS 84)" value=""/>
411
															title="Longitude (WGS 84)" value=""/>
419
													</div>
412
													</div>
420
												</div>
413
												</div>
421
											</div>
414
											</div>
422
											<div class="col-md-2">
415
											<div class="col-md-2">
423
												<div id="coord-lng" class="form-group form-group-sm">
416
												<div id="coord-lng" class="form-group form-group-sm">
424
													<input type="button" id="geolocaliser"
417
													<input type="button" id="geolocaliser"
425
														class="btn btn-default btn-sm has-tooltip"
418
														class="btn btn-default btn-sm has-tooltip"
426
														title="Centre la carte sur les coordonnées de latitude et longitude saisies."
419
														title="Centre la carte sur les coordonnées de latitude et longitude saisies."
427
														value="Voir sur la carte"/>
420
														value="Voir sur la carte"/>
428
												</div>
421
												</div>
429
											</div>
422
											</div>
430
										</div>
423
										</div>
431
 
424
 
432
										<div class="row">
425
										<div class="row">
433
											<div class="col-md-6">
426
											<div class="col-md-6">
434
												<div id="coord-l93-x" class="form-group">
427
												<div id="coord-l93-x" class="form-group">
435
													<label for="l93-x" class="col-sm-6 control-label">X Lambert 93</label>
428
													<label for="l93-x" class="col-sm-6 control-label">X Lambert 93</label>
436
													<div class="col-sm-5">
429
													<div class="col-sm-5">
437
														<input id="l93-x" disabled type="text" class="input-sm form-control obs-chp-etendu"
430
														<input id="l93-x" disabled type="text" class="input-sm form-control obs-chp-etendu"
438
																name="coordonneeLambert93X"
431
																name="coordonneeLambert93X"
439
																data-label="Lambert 93 X"
432
																data-label="Lambert 93 X"
440
																value=""/>
433
																value=""/>
441
													</div>
434
													</div>
442
												</div>
435
												</div>
443
											</div>
436
											</div>
444
											<div class="col-md-6">
437
											<div class="col-md-6">
445
												<div id="coord-l93-y" class="form-group">
438
												<div id="coord-l93-y" class="form-group">
446
													<label for="l93-y" class="col-sm-6 control-label">Y Lambert 93</label>
439
													<label for="l93-y" class="col-sm-6 control-label">Y Lambert 93</label>
447
													<div class="col-sm-5">
440
													<div class="col-sm-5">
448
														<input id="l93-y" disabled type="text" class="input-sm form-control obs-chp-etendu"
441
														<input id="l93-y" disabled type="text" class="input-sm form-control obs-chp-etendu"
449
																name="coordonneeLambert93Y"
442
																name="coordonneeLambert93Y"
450
																data-label="Lambert 93 Y"
443
																data-label="Lambert 93 Y"
451
																value=""/>
444
																value=""/>
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
							</div>
451
							</div>
459
						</form>
452
						</form>
460
					</div>
453
					</div>
461
				</div>
454
				</div>
462
			</div>
455
			</div>
463
 
456
 
464
			<div class="well well-lg">
457
			<div class="well well-lg">
465
				<div class="row">
458
				<div class="row">
466
					<div class="col-md-6">
459
					<div class="col-md-6">
467
						<form id="form-station-detail" class="form-horizontal" role="form" autocomplete="on">
460
						<form id="form-station-detail" class="form-horizontal" role="form" autocomplete="on">
468
							<h2>Caractéristiques de la station</h2>
461
							<h2>Caractéristiques de la station</h2>
469
 
462
 
470
							<div class="form-group has-tooltip"
463
							<div class="form-group has-tooltip"
471
								title="Type d'habitat plus ou moins standardisé dans les codes Corine ou Catminat (ex: prairie, pelouse, lisière, friche...)." >
464
								title="Type d'habitat plus ou moins standardisé dans les codes Corine ou Catminat (ex: prairie, pelouse, lisière, friche...)." >
472
								<label for="milieu" class="col-sm-4 control-label">
465
								<label for="milieu" class="col-sm-4 control-label">
473
									Type de milieu
466
									Type de milieu
474
								</label>
467
								</label>
475
								<div class="col-sm-8">
468
								<div class="col-sm-8">
476
									<input id="milieu" class="form-control" name="milieu" type="text" />
469
									<input id="milieu" class="form-control" name="milieu" type="text" />
477
								</div>
470
								</div>
478
							</div>
471
							</div>
479
 
472
 
480
							<div class="form-group has-tooltip"
473
							<div class="form-group has-tooltip"
481
									title="Indiquez l'exposition principale de la station.">
474
									title="Indiquez l'exposition principale de la station.">
482
								<label for="station-exposition" class="col-sm-4 control-label">
475
								<label for="station-exposition" class="col-sm-4 control-label">
483
									Exposition du terrain
476
									Exposition du terrain
484
								</label>
477
								</label>
485
								<div class="col-sm-8">
478
								<div class="col-sm-8">
486
									<select id="station-exposition" class="form-control obs-chp-etendu" name="stationExposition">
479
									<select id="station-exposition" class="form-control obs-chp-etendu" name="stationExposition">
487
										<option selected value="">Sélectionnez l'exposition du terrain</option>
480
										<option selected value="">Sélectionnez l'exposition du terrain</option>
488
										<option value="Plat">Terrain plat</option>
481
										<option value="Plat">Terrain plat</option>
489
										<option value="N">Nord</option>
482
										<option value="N">Nord</option>
490
										<option value="N-O">Nord-Ouest</option>
483
										<option value="N-O">Nord-Ouest</option>
491
										<option value="N-E">Nord-Est</option>
484
										<option value="N-E">Nord-Est</option>
492
										<option value="E">Est</option>
485
										<option value="E">Est</option>
493
										<option value="O">Ouest</option>
486
										<option value="O">Ouest</option>
494
										<option value="S">Sud</option>
487
										<option value="S">Sud</option>
495
										<option value="S-O">Sud-Ouest</option>
488
										<option value="S-O">Sud-Ouest</option>
496
										<option value="S-E">Sud-Est</option>
489
										<option value="S-E">Sud-Est</option>
497
									</select>
490
									</select>
498
								</div>
491
								</div>
499
							</div>
492
							</div>
500
 
493
 
501
							<div class="form-group has-tooltip"
494
							<div class="form-group has-tooltip"
502
									title="Indiquez le pourcentage de la pente de la station.">
495
									title="Indiquez le pourcentage de la pente de la station.">
503
								<label for="station-pente" class="col-sm-4 control-label">
496
								<label for="station-pente" class="col-sm-4 control-label">
504
									Pente du terrain
497
									Pente du terrain
505
								</label>
498
								</label>
506
								<div class="col-sm-8">
499
								<div class="col-sm-8">
507
									<select id="station-pente" class="form-control obs-chp-etendu" name="stationPente">
500
									<select id="station-pente" class="form-control obs-chp-etendu" name="stationPente">
508
										<option selected value="">Sélectionnez la pente du terrain</option>
501
										<option selected value="">Sélectionnez la pente du terrain</option>
509
										<option value="0-9%">entre 0 et 9% (0 à 5°)</option>
502
										<option value="0-9%">entre 0 et 9% (0 à 5°)</option>
510
										<option value="10-19%">entre 10 et 19% (5 à 9°)</option>
503
										<option value="10-19%">entre 10 et 19% (5 à 9°)</option>
511
										<option value="20-29%">entre 20 et 29% (10 à 14°)</option>
504
										<option value="20-29%">entre 20 et 29% (10 à 14°)</option>
512
										<option value="+30%">&gt; à 30% (&gt; à 15°)</option>
505
										<option value="+30%">&gt; à 30% (&gt; à 15°)</option>
513
									</select>
506
									</select>
514
								</div>
507
								</div>
515
							</div>
508
							</div>
516
 
509
 
517
						</form>
510
						</form>
518
					</div>
511
					</div>
519
 
512
 
520
					<div class="col-md-6">
513
					<div class="col-md-6">
521
						<form id="form-obs" class="form-horizontal" role="form" autocomplete="on">
514
						<form id="form-obs" class="form-horizontal" role="form" autocomplete="on">
522
							<h2>Relevé de la plante</h2>
515
							<h2>Relevé de la plante</h2>
523
 
516
 
524
							<input id="referentiel" type="hidden" value="bdtfx" />
517
							<input id="referentiel" type="hidden" value="bdtfx" />
525
 
518
 
526
							<div id="taxon-input-groupe" class="form-group has-tooltip"
519
							<div id="taxon-input-groupe" class="form-group has-tooltip"
527
								title="Sélectionnez une espèce dans la liste déroulante pour lier
520
								title="Sélectionnez une espèce dans la liste déroulante pour lier
528
									votre nom au référentiel selectionné. Si vous
521
									votre nom au référentiel selectionné. Si vous
529
									le désirez vous pouvez aussi saisir un nom absent du référentiel
522
									le désirez vous pouvez aussi saisir un nom absent du référentiel
530
									(Ex. : 'fleur violette' ou 'viola sinensis???')." >
523
									(Ex. : 'fleur violette' ou 'viola sinensis???')." >
531
								<label for="taxon"  class="col-sm-4 control-label">
524
								<label for="taxon"  class="col-sm-4 control-label">
532
									<strong class="obligatoire">*</strong>
525
									<strong class="obligatoire">*</strong>
533
									Espèce <?= $referentiel_impose ? '('.$ns_referentiel.')' : '' ?>
526
									Espèce <?= $referentiel_impose ? '('.$ns_referentiel.')' : '' ?>
534
								</label>
527
								</label>
535
								<div class="col-sm-8">
528
								<div class="col-sm-8">
536
									<div class="input-group">
529
									<div class="input-group">
537
										<span class="input-group-addon">
530
										<span class="input-group-addon">
538
											<span class="glyphicon glyphicon-leaf"></span>
531
											<span class="glyphicon glyphicon-leaf"></span>
539
										</span>
532
										</span>
540
										<input id="taxon" name="taxon" type="text" class="form-control"
533
										<input id="taxon" name="taxon" type="text" class="form-control"
541
											value="<?= $nom_sci_espece_defaut; ?>" />
534
											value="<?= $nom_sci_espece_defaut; ?>" />
542
									</div>
535
									</div>
543
								</div>
536
								</div>
544
							</div>
537
							</div>
545
 
538
 
546
							<div class="form-group has-tooltip"
539
							<div class="form-group has-tooltip"
547
									title="Indiquez le type de taille de l'arbre.">
540
									title="Indiquez le type de taille de l'arbre.">
548
								<label for="taille-type" class="col-sm-4 control-label">
541
								<label for="taille-type" class="col-sm-4 control-label">
549
									Phénologie
542
									Phénologie
550
								</label>
543
								</label>
551
								<div class="col-sm-8">
544
								<div class="col-sm-8">
552
									<select id="phenologie" class="form-control" name="phenologie">
545
									<select id="phenologie" class="form-control" name="phenologie">
553
										<option selected value="">Sélectionnez l'état de la plante</option>
546
										<option selected value="">Sélectionnez l'état de la plante</option>
554
										<option value="10-19: développement des feuilles">En feuille</option>
547
										<option value="10-19: développement des feuilles">En feuille</option>
555
										<option value="50-59: apparition de l'inflorescence, épiaison">En bouton</option>
548
										<option value="50-59: apparition de l'inflorescence, épiaison">En bouton</option>
556
										<option value="60-69: floraison">En fleur</option>
549
										<option value="60-69: floraison">En fleur</option>
557
										<option value="70-79: fructification">En fruit</option>
550
										<option value="70-79: fructification">En fruit</option>
558
										<option value="90-99: sénescence et dormance">En sénescence ou dormance</option>
551
										<option value="90-99: sénescence et dormance">En sénescence ou dormance</option>
559
									</select>
552
									</select>
560
								</div>
553
								</div>
561
							</div>
554
							</div>
562
 
555
 
563
							<div class="form-group has-tooltip"
556
							<div class="form-group has-tooltip"
564
									title="Estimation de l'abondance de la plante sur une surface donnée. Surface inventoriée
557
									title="Estimation de l'abondance de la plante sur une surface donnée. Surface inventoriée
565
									limitée par la présence d'un autre milieu ou distancé par au moins 500m d'une autre
558
									limitée par la présence d'un autre milieu ou distancé par au moins 500m d'une autre
566
									zone où la plante est observée.">
559
									zone où la plante est observée.">
567
								<label for="abondance" class="col-sm-4 control-label">
560
								<label for="abondance" class="col-sm-4 control-label">
568
									Abondance
561
									Abondance
569
								</label>
562
								</label>
570
								<div class="col-sm-8">
563
								<div class="col-sm-8">
571
									<select id="abondance" class="form-control" name="abondance">
564
									<select id="abondance" class="form-control" name="abondance">
572
										<option selected value="">Sélectionnez l'abondance</option>
565
										<option selected value="">Sélectionnez l'abondance</option>
573
										<option value="1-4 individus">1-4 individus</option>
566
										<option value="1-4 individus">1-4 individus</option>
574
										<option value="5-9 individus">5-9 individus</option>
567
										<option value="5-9 individus">5-9 individus</option>
575
										<option value="10-49 individus">10-49 individus</option>
568
										<option value="10-49 individus">10-49 individus</option>
576
										<option value="50-99 individus">50-99 individus</option>
569
										<option value="50-99 individus">50-99 individus</option>
577
										<option value="100-499 individus">100-499 individus</option>
570
										<option value="100-499 individus">100-499 individus</option>
578
										<option value=">500 individus">&gt; à 500 individus</option>
571
										<option value=">500 individus">&gt; à 500 individus</option>
579
									</select>
572
									</select>
580
								</div>
573
								</div>
581
							</div>
574
							</div>
582
 
575
 
583
							<div id="individus-nbre-groupe" class="form-group has-tooltip hidden"
576
							<div id="individus-nbre-groupe" class="form-group has-tooltip hidden"
584
								title="Indiquez le nombre d'individus." >
577
								title="Indiquez le nombre d'individus." >
585
								<label for="individus-nbre" class="col-sm-4 control-label">
578
								<label for="individus-nbre" class="col-sm-4 control-label">
586
									Nombre d'individus
579
									Nombre d'individus
587
								</label>
580
								</label>
588
								<div class="col-sm-4">
581
								<div class="col-sm-4">
589
									<input id="individus-nbre" class="form-control obs-chp-etendu" name="individusNombre"
582
									<input id="individus-nbre" class="form-control obs-chp-etendu" name="individusNombre"
590
										min="0"
583
										min="0"
591
										type="number"
584
										type="number"
592
										value="" />
585
										value="" />
593
								</div>
586
								</div>
594
							</div>
587
							</div>
595
 
588
 
596
							<div class="form-group has-tooltip"
589
							<div class="form-group has-tooltip"
597
									title="Indiquez si le relevé effectué vis à acquérir de nouvelle observation ou
590
									title="Indiquez si le relevé effectué vis à acquérir de nouvelle observation ou
598
										viser à confirmer la présence de la plante vis à vis d'une observation historique.">
591
										viser à confirmer la présence de la plante vis à vis d'une observation historique.">
599
								<label for="releve-type" class="col-sm-4 control-label">
592
								<label for="releve-type" class="col-sm-4 control-label">
600
									Type de relevé
593
									Type de relevé
601
								</label>
594
								</label>
602
								<div class="col-sm-8">
595
								<div class="col-sm-8">
603
									<select id="releve-type" class="form-control obs-chp-etendu" name="releveType">
596
									<select id="releve-type" class="form-control obs-chp-etendu" name="releveType">
604
										<option selected value="">Sélectionnez le type de relevé</option>
597
										<option selected value="">Sélectionnez le type de relevé</option>
605
										<option value="nouveau">Acquisition d'une nouvelle donnée</option>
598
										<option value="nouveau">Acquisition d'une nouvelle donnée</option>
606
										<option value="confirmation">Confirmation d'une donnée historique (précisez laquelle dans les notes)</option>
599
										<option value="confirmation">Confirmation d'une donnée historique (précisez laquelle dans les notes)</option>
607
									</select>
600
									</select>
608
								</div>
601
								</div>
609
							</div>
602
							</div>
610
 
603
 
611
							<div class="form-group has-tooltip"
604
							<div class="form-group has-tooltip"
612
									title="Indiquez le code ISBN de l'ouvrage de détermination utilisé.
605
									title="Indiquez le code ISBN de l'ouvrage de détermination utilisé.
613
										L'ISBN est un numéro international qui permet d’identifier, de manière unique,
606
										L'ISBN est un numéro international qui permet d’identifier, de manière unique,
614
										chaque édition de chaque livre publié, que son support soit numérique ou sur papier.
607
										chaque édition de chaque livre publié, que son support soit numérique ou sur papier.
615
										Ce code est généralement présent à l'endos d'un livre (à proximité du code barre)
608
										Ce code est généralement présent à l'endos d'un livre (à proximité du code barre)
616
										ou sur la page des droits d'auteur et de publication.
609
										ou sur la page des droits d'auteur et de publication.
617
										Si votre navigateur le supporte, vous pouvez sélectionner le code ISBN
610
										Si votre navigateur le supporte, vous pouvez sélectionner le code ISBN
618
										d'une flore dans la liste qui s'ouvrira en cliquant dans le champ ou en
611
										d'une flore dans la liste qui s'ouvrira en cliquant dans le champ ou en
619
										utilisant la touche «Flêche bas» (↓). Sinon, indiquez le code ISBN de la
612
										utilisant la touche «Flêche bas» (↓). Sinon, indiquez le code ISBN de la
620
										flore ou de l'ouvrage principal ayant servi à la détermination
613
										flore ou de l'ouvrage principal ayant servi à la détermination
621
										(Ex. : ISBN-13:978-3-642-11746-6, ISBN:978-3-642-11746-6, 3-642-11746-5 ).">
614
										(Ex. : ISBN-13:978-3-642-11746-6, ISBN:978-3-642-11746-6, 3-642-11746-5 ).">
622
								<label for="determination-source-isbn" class="col-sm-4 control-label">
615
								<label for="determination-source-isbn" class="col-sm-4 control-label">
623
									Source détermination
616
									Source détermination
624
								</label>
617
								</label>
625
								<div class="col-sm-8">
618
								<div class="col-sm-8">
626
									<input id="determination-source" class="form-control obs-chp-etendu" list="flores"
619
									<input id="determination-source" class="form-control obs-chp-etendu" list="flores"
627
										name="determinationSource"
620
										name="determinationSource"
628
										type="text" >
621
										type="text" >
629
									<datalist id="flores">
622
									<datalist id="flores">
630
										<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>
623
										<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>
631
										<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>
624
										<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>
632
										<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>
625
										<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>
633
										<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>
626
										<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>
634
									</datalist>
627
									</datalist>
635
								</div>
628
								</div>
636
							</div>
629
							</div>
637
						</form>
630
						</form>
638
					</div>
631
					</div>
639
				</div>
632
				</div>
640
 
633
 
641
 
634
 
642
				<div class="row">
635
				<div class="row">
643
					<div class="col-md-6">
636
					<div class="col-md-6">
644
						<div class="row">
637
						<div class="row">
645
							<div class="col-md-12">
638
							<div class="col-md-12">
646
								<h2>Notes</h2>
639
								<h2>Notes</h2>
647
								<textarea id="notes" form="form-obs" class="form-control col-md-12" rows="7" name="notes"
640
								<textarea id="notes" form="form-obs" class="form-control col-md-12" rows="7" name="notes"
648
									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>
641
									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>
649
							</div>
642
							</div>
650
						</div>
643
						</div>
651
					</div>
644
					</div>
652
 
645
 
653
					<div class="col-md-6">
646
					<div class="col-md-6">
654
						<div class="row">
647
						<div class="row">
655
							<form id="form-upload" class="form form-horizontal" role="form" action="<?= $url_ws_upload ?>"
648
							<form id="form-upload" class="form form-horizontal" role="form" action="<?= $url_ws_upload ?>"
656
								method="post" enctype="multipart/form-data">
649
								method="post" enctype="multipart/form-data">
657
								<div class="col-md-12">
650
								<div class="col-md-12">
658
									<h2>Image(s) de la plante</h2>
651
									<h2>Image(s) de la plante</h2>
659
									<strong>Ajouter une image</strong>
652
									<strong>Ajouter une image</strong>
660
									<p class="miniature-info discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
653
									<p class="miniature-info discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
661
									<div id ="photos-conteneur" class="form-group">
654
									<div id ="photos-conteneur" class="form-group">
662
										<div class="col-sm-12">
655
										<div class="col-sm-12">
663
											<input type="file" id="fichier" name="fichier" class="form-control" accept="image/jpeg" />
656
											<input type="file" id="fichier" name="fichier" class="form-control" accept="image/jpeg" />
664
											<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
657
											<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
665
										</div>
658
										</div>
666
										<div id="miniatures"></div>
659
										<div id="miniatures"></div>
667
										<p class="miniature-msg col-md-12">&nbsp;</p>
660
										<p class="miniature-msg col-md-12">&nbsp;</p>
668
									</div>
661
									</div>
669
								</div>
662
								</div>
670
							</form>
663
							</form>
671
						</div>
664
						</div>
672
					</div>
665
					</div>
673
				</div>
666
				</div>
674
 
667
 
675
				<div class="row">
668
				<div class="row">
676
					<div class="col-md-12 centre has-tooltip"
669
					<div class="col-md-12 centre has-tooltip"
677
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
670
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
678
							ajouter votre observation à la liste à transmettre.">
671
							ajouter votre observation à la liste à transmettre.">
679
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
672
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
680
							Créer
673
							Créer
681
						</button>
674
						</button>
682
					</div>
675
					</div>
683
				</div>
676
				</div>
684
			</div>
677
			</div>
685
 
678
 
686
 
679
 
687
		<!-- Messages d'erreur du formulaire-->
680
		<!-- Messages d'erreur du formulaire-->
688
			<div class="row">
681
			<div class="row">
689
				<div class="zone-alerte col-md-6 col-md-offset-3">
682
				<div class="zone-alerte col-md-6 col-md-offset-3">
690
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
683
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
691
						<a class="close">×</a>
684
						<a class="close">×</a>
692
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
685
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
693
						<p>
686
						<p>
694
							Vous venez d'ajouter votre 10ème observation.<br/>
687
							Vous venez d'ajouter votre 10ème observation.<br/>
695
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
688
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
696
						</p>
689
						</p>
697
					</div>
690
					</div>
698
				</div>
691
				</div>
699
				<div class="zone-alerte col-md-6 col-md-offset-3">
692
				<div class="zone-alerte col-md-6 col-md-offset-3">
700
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
693
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
701
						<a class="close">×</a>
694
						<a class="close">×</a>
702
						<h4 class="alert-heading">Information : champs en erreur</h4>
695
						<h4 class="alert-heading">Information : champs en erreur</h4>
703
						<p>
696
						<p>
704
							Certains champs du formulaire sont mal remplis.<br/>
697
							Certains champs du formulaire sont mal remplis.<br/>
705
							Veuillez vérifier les données saisies dans le formulaire.
698
							Veuillez vérifier les données saisies dans le formulaire.
706
						</p>
699
						</p>
707
					</div>
700
					</div>
708
				</div>
701
				</div>
709
			</div>
702
			</div>
710
 
703
 
711
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
704
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
712
			<div id="zone-liste-obs" class="row">
705
			<div id="zone-liste-obs" class="row">
713
				<div class="col-md-12">
706
				<div class="col-md-12">
714
					<div class="well well-lg">
707
					<div class="well well-lg">
715
						<div class="row">
708
						<div class="row">
716
							<div class="col-md-10">
709
							<div class="col-md-10">
717
								<h2>
710
								<h2>
718
									Observations
711
									Observations
719
									<?=!empty($nom_sci_espece_defaut) ? "de<i> {$nom_sci_espece_defaut}</i> " : ''; ?>
712
									<?=!empty($nom_sci_espece_defaut) ? "de<i> {$nom_sci_espece_defaut}</i> " : ''; ?>
720
									à transmettre :
713
									à transmettre :
721
									<span class="obs-nbre">0</span>
714
									<span class="obs-nbre">0</span>
722
								</h2>
715
								</h2>
723
							</div>
716
							</div>
724
							<div class="col-md-2 text-right">
717
							<div class="col-md-2 text-right">
725
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
718
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
726
									type="button" disabled="disabled"
719
									type="button" disabled="disabled"
727
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
720
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
728
									Transmettre
721
									Transmettre
729
								</button>
722
								</button>
730
							</div>
723
							</div>
731
						</div>
724
						</div>
732
						<div id="liste-obs" ></div>
725
						<div id="liste-obs" ></div>
733
						<div class="row">
726
						<div class="row">
734
							<div class="zone-alerte col-md-6 col-md-offset-3">
727
							<div class="zone-alerte col-md-6 col-md-offset-3">
735
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
728
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
736
									<a class="close">×</a>
729
									<a class="close">×</a>
737
									<h4 class="alert-heading">Attention : aucune observation</h4>
730
									<h4 class="alert-heading">Attention : aucune observation</h4>
738
									<p>Veuillez saisir des observations pour les transmettres.</p>
731
									<p>Veuillez saisir des observations pour les transmettres.</p>
739
								</div>
732
								</div>
740
 
733
 
741
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
734
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
742
									<a class="close">×</a>
735
									<a class="close">×</a>
743
									<h4 class="alert-heading">Information : transmission des observations</h4>
736
									<h4 class="alert-heading">Information : transmission des observations</h4>
744
									<div class="alert-txt"></div>
737
									<div class="alert-txt"></div>
745
								</div>
738
								</div>
746
 
739
 
747
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
740
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
748
									<a class="close">×</a>
741
									<a class="close">×</a>
749
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
742
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
750
									<div class="alert-txt"></div>
743
									<div class="alert-txt"></div>
751
								</div>
744
								</div>
752
							</div>
745
							</div>
753
						</div>
746
						</div>
754
 
747
 
755
					</div>
748
					</div>
756
				</div>
749
				</div>
757
			</div>
750
			</div>
758
 
751
 
759
			<footer class="row">
752
			<footer class="row">
760
				<p class="col-md-12 ">Réalisation &amp; hébergement : <a href="http://www.tela-botanica.org" target="_blank">Tela Botanica</a> 2014</p>
753
				<p class="col-md-12 ">Réalisation &amp; hébergement : <a href="http://www.tela-botanica.org" target="_blank">Tela Botanica</a> 2014</p>
761
			</footer>
754
			</footer>
762
 
755
 
763
			<!-- Templates HTML -->
756
			<!-- Templates HTML -->
764
			<div id="tpl-transmission-ok" style="display:none;">
757
			<div id="tpl-transmission-ok" style="display:none;">
765
				<p class="msg">
758
				<p class="msg">
766
					Vos observations ont bien été transmises.<br />
759
					Vos observations ont bien été transmises.<br />
767
					Elles sont désormais consultables à travers les différents outils de visualisation
760
					Elles sont désormais consultables à travers les différents outils de visualisation
768
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
761
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
769
					<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
762
					<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
770
					<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
763
					<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
771
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
764
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
772
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
765
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
773
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
766
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
774
					N'oubliez pas qu'il est nécessaire de
767
					N'oubliez pas qu'il est nécessaire de
775
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
768
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
776
					au préalable, si ce n'est pas déjà fait.
769
					au préalable, si ce n'est pas déjà fait.
777
				</p>
770
				</p>
778
			</div>
771
			</div>
779
			<div id="tpl-transmission-ko" style="display:none;">
772
			<div id="tpl-transmission-ko" style="display:none;">
780
				<p class="msg">
773
				<p class="msg">
781
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
774
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
782
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
775
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
783
					et transmettre les suivantes.<br />
776
					et transmettre les suivantes.<br />
784
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
777
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
785
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
778
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
786
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
779
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
787
								  target="_blank"
780
								  target="_blank"
788
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
781
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
789
								  le formulaire de signalement d'erreurs</a>.
782
								  le formulaire de signalement d'erreurs</a>.
790
				</p>
783
				</p>
791
			</div>
784
			</div>
792
 
785
 
793
			<!-- Fenêtres modales -->
786
			<!-- Fenêtres modales -->
794
			<div id="chargement" class="modal-fenetre" style="display:none;">
787
			<div id="chargement" class="modal-fenetre" style="display:none;">
795
				<div id="chargement-centrage" class="modal-contenu">
788
				<div id="chargement-centrage" class="modal-contenu">
796
					<div class="progress">
789
					<div class="progress">
797
						<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="">
790
						<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="">
798
							<span class="sr-only">0/10 observations transmises</span>
791
							<span class="sr-only">0/10 observations transmises</span>
799
						</div>
792
						</div>
800
					</div>
793
					</div>
801
 
794
 
802
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
795
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
803
						Transfert des observations en cours...<br />
796
						Transfert des observations en cours...<br />
804
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
797
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
805
						d'observations à transférer.
798
						d'observations à transférer.
806
					</p>
799
					</p>
807
				</div>
800
				</div>
808
			</div>
801
			</div>
809
		</div>
802
		</div>
810
	</body>
803
	</body>
811
</html>
804
</html>