Subversion Repositories eFlore/Applications.cel

Rev

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

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