Subversion Repositories eFlore/Applications.cel

Rev

Rev 3061 | Only display areas with differences | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 3061 Rev 3099
1
<!DOCTYPE html>
1
<!DOCTYPE html>
2
<html lang="fr">
2
<html lang="fr">
3
	<head>
3
	<head>
4
		<title>Belles de ma rue</title>
4
		<title>Belles de ma rue</title>
5
		<meta charset="utf-8">
5
		<meta charset="utf-8">
6
 
6
 
7
		<meta name="author" content="Delphine Cauquil" />
7
		<meta name="author" content="Delphine Cauquil" />
8
		<meta name="keywords" content="Belles de ma rue, Straatmadeliefjes, CEL, Tela Botanica, Saint-Gilles" />
8
		<meta name="keywords" content="Belles de ma rue, Straatmadeliefjes, CEL, Tela Botanica, Saint-Gilles" />
9
		<meta name="description" content="Widget de saisie pour le projet Belles de ma rue" />
9
		<meta name="description" content="Widget de saisie pour le projet Belles de ma rue" />
10
 
10
 
11
		<!-- Viewport Mobile -->
11
		<!-- Viewport Mobile -->
12
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
12
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
13
 
13
 
14
		<!-- Favicones -->
14
		<!-- Favicones -->
15
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/favicon.ico" />
15
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/favicon.ico" />
16
 
16
 
17
		<!-- Javascript : bibliothèques -->
17
		<!-- Javascript : bibliothèques -->
18
		<!-- Google Map v3 -->
18
		<!-- Google Map v3 -->
19
		<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=<?php echo $cleGoogleMaps; ?>&language=fr&amp;region=FR"></script>
19
		<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=<?php echo $cleGoogleMaps; ?>&language=fr&amp;region=FR"></script>
20
		<!-- Jquery -->
20
		<!-- Jquery -->
21
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
21
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
22
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
22
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
23
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
23
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
24
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
24
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
25
		<!-- Jquery Plugins -->
25
		<!-- Jquery Plugins -->
26
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
26
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
27
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
27
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
28
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
28
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
29
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
29
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
30
		<!-- Jquery Form :nécessaire pour l'upload des images -->
30
		<!-- Jquery Form :nécessaire pour l'upload des images -->
31
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
31
		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
32
		<!-- Bootstrap -->
32
		<!-- Bootstrap -->
33
		<script type="text/javascript" src="https://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
33
		<script type="text/javascript" src="https://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
34
 
34
 
35
		<!-- Javascript : appli saisie -->
35
		<!-- Javascript : appli saisie -->
36
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
36
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
37
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/bellesdemarue/js/WidgetSaisieBellesdemarue.js"></script>
37
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/bellesdemarue/js/WidgetSaisieBellesdemarue.js"></script>
38
		<script src="<?=$url_base?>saisie?projet=bellesdemarue&service=taxons" type="text/javascript"></script>
38
		<script src="<?=$url_base?>saisie?projet=bellesdemarue&service=taxons" type="text/javascript"></script>
39
		<script type="text/javascript">
39
		<script type="text/javascript">
40
		//<![CDATA[
40
		//<![CDATA[
41
        	$(document).ready(function() {
41
        	$(document).ready(function() {
42
				// Héritage !!
42
				// Héritage !!
43
				var widget = new WidgetSaisieBellesdemarue("fr");
43
				var widget = new WidgetSaisieBellesdemarue("fr");
44
 
44
 
45
				// la variable "taxons" chargée par "service=taxons" ci-dessus n'est pas accessible dans le contexte objet
45
				// la variable "taxons" chargée par "service=taxons" ci-dessus n'est pas accessible dans le contexte objet
46
				widget.taxons = taxons;
46
				widget.taxons = taxons;
47
 
47
 
48
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
48
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
49
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
49
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
50
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
50
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
51
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
51
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
52
				// Mot-clé du widget/projet
52
				// Mot-clé du widget/projet
53
				widget.tagProjet = "WidgetBellesdemarue,bellesdemarue";
53
				widget.tagProjet = "WidgetBellesdemarue,bellesdemarue";
54
				// Mots-clés à ajouter aux images
54
				// Mots-clés à ajouter aux images
55
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
55
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
56
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
56
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
57
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
57
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
58
				// Mots-clés à ajouter aux observations
58
				// Mots-clés à ajouter aux observations
59
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
59
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
60
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
60
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
61
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
61
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
62
				// Précharger le formulaire avec les infos d'une observation
62
				// Précharger le formulaire avec les infos d'une observation
63
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
63
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
64
				// URL du web service réalisant l'insertion des données dans la base du CEL.
64
				// URL du web service réalisant l'insertion des données dans la base du CEL.
65
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
65
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
66
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
66
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
67
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
67
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
68
				// Code du référentiel utilisé pour les nom scientifiques.
68
				// Code du référentiel utilisé pour les nom scientifiques.
69
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
69
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
70
				// Indication de la présence d'une espèce imposée
70
				// Indication de la présence d'une espèce imposée
71
				widget.especeImposee = "<?=$espece_imposee; ?>";
71
				widget.especeImposee = "<?=$espece_imposee; ?>";
72
				// Tableau d'informations sur l'espèce imposée
72
				// Tableau d'informations sur l'espèce imposée
73
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
73
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
74
				// Nombre d'élément dans les listes d'auto-complétion
74
				// Nombre d'élément dans les listes d'auto-complétion
75
				widget.autocompletionElementsNbre = 20;
75
				widget.autocompletionElementsNbre = 20;
76
				// Indication de la présence d'un référentiel imposé
76
				// Indication de la présence d'un référentiel imposé
77
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
77
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
78
				// URL du web service permettant l'auto-complétion des noms scientifiques
78
				// URL du web service permettant l'auto-complétion des noms scientifiques
79
				widget.serviceAutocompletionNomSciUrl = "<?=$url_ws_autocompletion_ns?>?"+
79
				widget.serviceAutocompletionNomSciUrl = "<?=$url_ws_autocompletion_ns?>?"+
80
					"masque={masque}&"+
80
					"masque={masque}&"+
81
					"recherche=etendue&"+
81
					"recherche=etendue&"+
82
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
82
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
83
					"ns.structure=au"+"&"+
83
					"ns.structure=au"+"&"+
84
					"navigation.limite=" + widget.autocompletionElementsNbre;
84
					"navigation.limite=" + widget.autocompletionElementsNbre;
85
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
85
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
86
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
86
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
87
					"masque={masque}&"+
87
					"masque={masque}&"+
88
					"recherche=etendue&"+
88
					"recherche=etendue&"+
89
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
89
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
90
					"retour.tri=alpharet&"+ // tri "à la CeL"
90
					"retour.tri=alpharet&"+ // tri "à la CeL"
91
					"ns.structure=au"+"&"+
91
					"ns.structure=au"+"&"+
92
					"navigation.limite=" + widget.autocompletionElementsNbre;
92
					"navigation.limite=" + widget.autocompletionElementsNbre;
93
				// Nombre d'observations max autorisé avant transmission
93
				// Nombre d'observations max autorisé avant transmission
94
				widget.obsMaxNbre = 10;
94
				widget.obsMaxNbre = 10;
95
				// Durée d'affichage en milliseconde des messages d'informations
95
				// Durée d'affichage en milliseconde des messages d'informations
96
				widget.dureeMessage = 15000;
96
				widget.dureeMessage = 15000;
97
				// Squelette d'URL du web service de l'annuaire.
97
				// Squelette d'URL du web service de l'annuaire.
98
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
98
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
99
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes. @TODO configurer !!!!
99
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes. @TODO configurer !!!!
100
				widget.serviceNomCommuneUrl = "https://api.tela-botanica.org/service:eflore:0.1/osm/zone-admin?lon={lon}&lat={lat}";
100
				widget.serviceNomCommuneUrl = "https://api.tela-botanica.org/service:eflore:0.1/osm/zone-admin?lon={lon}&lat={lat}";
101
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
101
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
102
				widget.serviceNomCommuneUrlAlt = "https://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
102
				widget.serviceNomCommuneUrlAlt = "https://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
103
				// URL de l'icône du chargement en cours
103
				// URL de l'icône du chargement en cours
104
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
104
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
105
				// URL de l'icône du chargement en cours d'une image
105
				// URL de l'icône du chargement en cours d'une image
106
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement-image.gif";
106
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement-image.gif";
107
				// URL de l'icône du calendrier
107
				// URL de l'icône du calendrier
108
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
108
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
109
				// URL de l'icône pour une photo manquante
109
				// URL de l'icône pour une photo manquante
110
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
110
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
111
 
111
 
112
				// La présence du parametre 'ville' dans l'URL géolocalise
112
				// La présence du parametre 'ville' dans l'URL géolocalise
113
				widget.ville = "<?=isset($_GET['ville']) ? $_GET['ville'] : ''?>";
113
				widget.ville = "<?=isset($_GET['ville']) ? $_GET['ville'] : ''?>";
114
				widget.ville = <?= isset($_GET['commune']) ? "'".$_GET['commune']."'" : 'widget.ville' ?>;
114
				widget.ville = <?= isset($_GET['commune']) ? "'".$_GET['commune']."'" : 'widget.ville' ?>;
115
				// La zone géographique passée en paramètre dans l'URL
115
				// La zone géographique passée en paramètre dans l'URL
116
				widget.zoneGeo = "<?= $zone_geo ?>";
116
				widget.zoneGeo = "<?= $zone_geo ?>";
117
				// Pareil, avec un gorupe de zones géo
117
				// Pareil, avec un gorupe de zones géo
118
				widget.groupeZonesGeo = "<?= $groupe_zones_geo ?>";
118
				widget.groupeZonesGeo = "<?= $groupe_zones_geo ?>";
119
				// URL service de recherche de zones
119
				// URL service de recherche de zones
120
				widget.serviceCoordSearchUrl = "<?=$url_ws_coord_search_tpl?>";
120
				widget.serviceCoordSearchUrl = "<?=$url_ws_coord_search_tpl?>";
121
 
121
 
122
				// URL de l'icône du bouton supprimer
122
				// URL de l'icône du bouton supprimer
123
				widget.supprimerIconeUrl = "<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/icones/supprimer.png";
123
				widget.supprimerIconeUrl = "<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/icones/supprimer.png";
124
				
124
				
125
				// Go bibiche !
125
				// Go bibiche !
126
				widget.init();
126
				widget.init();
127
        });
127
        });
128
		//]]>
128
		//]]>
129
		</script>
129
		</script>
130
 
130
 
131
		<!-- CSS -->
131
		<!-- CSS -->
132
		<link href="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" media="screen" />
132
		<link href="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" media="screen" />
133
		<link href="https://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
133
		<link href="https://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
134
		<link href="https://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
134
		<link href="https://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
135
		<link href="<?=$url_base?>modules/saisie/squelettes/bellesdemarue/css/<?=isset($_GET['style']) ? $_GET['style'] : 'bellesdemarue'?>.css" rel="stylesheet" type="text/css" media="screen" />
135
		<link href="<?=$url_base?>modules/saisie/squelettes/bellesdemarue/css/<?=isset($_GET['style']) ? $_GET['style'] : 'bellesdemarue'?>.css" rel="stylesheet" type="text/css" media="screen" />
136
 
136
 
137
		<!--  Google Analytics -->
137
		<!--  Google Analytics -->
138
		<?php if($prod): ?>
138
		<?php if($prod): ?>
139
			<?php include "analytics.html"; ?>
139
			<?php include "analytics.html"; ?>
140
		<?php endif; ?>	
140
		<?php endif; ?>	
141
	</head>
141
	</head>
142
 
142
 
143
	<body data-spy="scroll">
143
	<body data-spy="scroll">
144
		<div id="zone-appli" class="container">
144
		<div id="zone-appli" class="container">
145
			<div class="row-fluid entete">
145
			<div class="row-fluid entete">
146
				<div class="span12">
146
				<div class="span12">
147
					<div class="row-fluid">
147
					<div class="row-fluid">
148
						<div class="span12">
148
						<div class="span12">
149
							<?php if($logo != 'defaut' && $logo != '0') { ?>
149
							<?php if($logo != 'defaut' && $logo != '0') { ?>
150
								<img id="logo-titre" class="span1" src="<?= $logo ?>" alt="Logo" />
150
								<img id="logo-titre" class="span1" src="<?= $logo ?>" alt="Logo" />
151
							<?php } else if($logo == 'defaut') { ?>
151
							<?php } else if($logo == 'defaut') { ?>
152
								<h1 id="widget-titre"><img src="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/logos/bdmr.jpg" alt="Belles de ma rue : Saisie des observations"/></h1>
152
								<h1 id="widget-titre"><img src="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/logos/bdmr.jpg" alt="Belles de ma rue : Saisie des observations"/></h1>
153
							<?php } ?>
153
							<?php } ?>
154
						</div>
154
						</div>
155
					</div>
155
					</div>
156
					<!--<div class="row-fluid">
156
					<!--<div class="row-fluid">
157
						<div class="span12">
157
						<div class="span12">
158
							<p class="discretion">
158
							<p class="discretion">
159
								Un aide interactive est à votre disposition sur l'interface.
159
								Un aide interactive est à votre disposition sur l'interface.
160
								Une fois familiarisé, vous pouvez cliquer sur le bouton suivant pour la désactiver :
160
								Une fois familiarisé, vous pouvez cliquer sur le bouton suivant pour la désactiver :
161
								<button id="btn-aide" class="btn btn-mini btn-success">
161
								<button id="btn-aide" class="btn btn-mini btn-success">
162
									<span class="icon-question-sign icon-white"></span>
162
									<span class="icon-question-sign icon-white"></span>
163
									<span id="btn-aide-txt" >Désactiver l'aide</span>
163
									<span id="btn-aide-txt" >Désactiver l'aide</span>
164
								</button>
164
								</button>
165
							</p>
165
							</p>
166
						</div>
166
						</div>
167
					</div>-->
167
					</div>-->
168
				</div>
168
				</div>
169
			</div>
169
			</div>
170
			<div class="row-fluid">
170
			<div class="row-fluid">
171
				<div class="span12">
171
				<div class="span12">
172
					<form id="form-observateur" action="#" autocomplete="on">
172
					<form id="form-observateur" action="#" autocomplete="on">
173
						<h2 id="titre-form-observateur">Observateur</h2>
173
						<h2 id="titre-form-observateur">Observateur</h2>
174
						<div id="zone-identification">
174
						<div id="zone-identification">
175
							<fieldset id="partie-identification">
175
							<fieldset id="partie-identification">
176
								<div class="row-fluid">
176
								<div class="row-fluid">
177
									<div class="span6 control-group has-tooltip" data-placement="bottom">
177
									<div class="span6 control-group has-tooltip" data-placement="bottom">
178
											<label class="control-label" for="courriel">
178
											<label class="control-label" for="courriel">
179
												<strong class="obligatoire">*</strong>
179
												<strong class="obligatoire">*</strong>
180
												Courriel
180
												Courriel
181
											</label>
181
											</label>
182
											<div class="controls">
182
											<div class="controls">
183
												<div class="input-prepend">
183
												<div class="input-prepend">
184
													<span class="add-on">
184
													<span class="add-on">
185
														<i class="icon-envelope"></i>
185
														<i class="icon-envelope"></i>
186
													</span>
186
													</span>
187
													<input id="courriel" name="courriel" class="span11" type="text"/>
187
													<input id="courriel" name="courriel" class="span11" type="text"/>
188
													<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
188
													<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
189
												</div>
189
												</div>
190
											</div>
190
											</div>
191
 
191
 
192
									</div>
192
									</div>
193
									<div id="zone-courriel-confirmation" class="span6 control-group has-tooltip"
193
									<div id="zone-courriel-confirmation" class="span6 control-group has-tooltip"
194
										style="display:none;"
194
										style="display:none;"
195
										data-placement="bottom">
195
										data-placement="bottom">
196
										<label class="control-label" for="courriel_confirmation">
196
										<label class="control-label" for="courriel_confirmation">
197
											<strong class="obligatoire">*</strong>
197
											<strong class="obligatoire">*</strong>
198
											Courriel (confirmation)
198
											Courriel (confirmation)
199
										</label>
199
										</label>
200
										<div class="controls">
200
										<div class="controls">
201
											<div class="input-prepend">
201
											<div class="input-prepend">
202
												<span class="add-on">
202
												<span class="add-on">
203
													<i class="icon-envelope"></i>
203
													<i class="icon-envelope"></i>
204
												</span>
204
												</span>
205
												<input id="courriel_confirmation" name="courriel_confirmation"
205
												<input id="courriel_confirmation" name="courriel_confirmation"
206
												 	class="span11" type="text"/>
206
												 	class="span11" type="text"/>
207
											</div>
207
											</div>
208
										</div>
208
										</div>
209
									</div>
209
									</div>
210
								</div>
210
								</div>
211
								<div id="zone-prenom-nom" class="row-fluid" style="display:none;">
211
								<div id="zone-prenom-nom" class="row-fluid" style="display:none;">
212
									<div class="span6 control-group">
212
									<div class="span6 control-group">
213
										<label for="prenom" class="control-label">
213
										<label for="prenom" class="control-label">
214
											<strong class="obligatoire">*</strong>
214
											<strong class="obligatoire">*</strong>
215
											Prénom
215
											Prénom
216
										</label>
216
										</label>
217
										<input id="prenom" name="prenom" class="span12" type="text"/>
217
										<input id="prenom" name="prenom" class="span12" type="text"/>
218
									</div>
218
									</div>
219
									<div class="span6 control-group">
219
									<div class="span6 control-group">
220
										<label for="nom" class="control-label">
220
										<label for="nom" class="control-label">
221
											<strong class="obligatoire">*</strong>
221
											<strong class="obligatoire">*</strong>
222
											Nom
222
											Nom
223
										</label>
223
										</label>
224
										<div class="controls">
224
										<div class="controls">
225
											<input id="nom" name="nom"  class="span12" type="text"/>
225
											<input id="nom" name="nom"  class="span12" type="text"/>
226
										</div>
226
										</div>
227
									</div>
227
									</div>
228
								</div>
228
								</div>
229
							</fieldset>
229
							</fieldset>
230
						</div>
230
						</div>
231
					</form>
231
					</form>
232
				</div>
232
				</div>
233
			</div>
233
			</div>
234
		
234
		
235
 
235
 
236
			<!-- Fiche terrain -->
236
			<!-- Fiche terrain -->
237
			<form id="form-obs" class="form-inline" action="#" autocomplete="on">
237
			<form id="form-obs" class="form-inline" action="#" autocomplete="on">
238
				<h2 id="titre-form-obs">Fiche de terrain</h2>
238
				<h2 id="titre-form-obs">Fiche de terrain</h2>
239
				<div id="zone-fiche-terrain">
239
				<div id="zone-fiche-terrain">
240
					
240
					
241
					<fieldset id="partie-station">
241
					<fieldset id="partie-station">
242
						<legend>
242
						<legend>
243
							<strong class="obligatoire">*</strong>
243
							<strong class="obligatoire">*</strong>
244
							Géolocalisation de la plante
244
							Géolocalisation de la plante
245
						</legend>
245
						</legend>
246
						<div class="row-fluid">
246
						<div class="row-fluid">
247
							<div class="span12">
247
							<div class="span12">
248
								<div class="form-search form-horizontal">
248
								<div class="form-search form-horizontal">
249
									<div class="control-group">
249
									<div class="control-group">
250
										<input id="carte-recherche"
250
										<input id="carte-recherche"
251
											class="search-query span12 has-tooltip"
251
											class="search-query span12 has-tooltip"
252
											type="text"
252
											type="text"
253
											title="Permet de centrer la carte sur le lieu recherché. Il est nécessaire de sélectionner le lieu dans la liste déroulante."
253
											title="Il est nécessaire de sélectionner le lieu dans la liste déroulante."
254
											placeholder="Entrez un nom de ville, de lieu ou de rue..."
254
											placeholder="Entrer l'adresse postale où a été trouvée la plante"
255
											name="adresse"
255
											name="adresse"
256
											data-label="Adresse"
256
											data-label="Adresse"
257
											value=""/>
257
											value=""/>
258
									</div>
258
									</div>
259
								</div>
259
								</div>
260
							</div>
260
							</div>
261
						</div>
261
						</div>
262
						<div class="row-fluid">
262
						<div class="row-fluid" style="display:none;">
263
							<div class="span12">
263
							<div class="span12">
264
								<div id="map-canvas" class="has-tooltip"
264
								<div id="map-canvas" class="has-tooltip"
265
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
265
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
266
									représentant votre station ou bien le glisser-déposer sur
266
									représentant votre station ou bien le glisser-déposer sur
267
									le lieu souhaité."></div>
267
									le lieu souhaité."></div>
268
								</div>
268
								</div>
269
							</div>
269
							</div>
270
							<div class="row-fluid">
270
							<div class="row-fluid">
271
								<div id="info-commune" class="span12">
271
								<div id="info-commune" class="span12">
272
									<span for="marqueur-commune">Commune : </span>
272
									<span for="marqueur-commune">Commune : </span>
273
										<span id="marqueur-commune">
273
										<span id="marqueur-commune">
274
											<span id="commune-nom" class="commune-info"></span>
274
											<span id="commune-nom" class="commune-info"></span>
275
									</span>
275
									</span>
276
								</div>
276
								</div>
277
							</div>
277
							</div>
278
						<div id="coordonnees-geo" class="row-fluid" style="display:none;">
278
						<div id="coordonnees-geo" class="row-fluid" style="display:none;">
279
							<div class="form-inline">
279
							<div class="form-inline">
280
								<div id="coord-lat" class="span4 control-group">
280
								<div id="coord-lat" class="span4 control-group">
281
									<label for="latitude" class="control-label">
281
									<label for="latitude" class="control-label">
282
										<strong class="obligatoire">*</strong>
282
										<strong class="obligatoire">*</strong>
283
										Latitude
283
										Latitude
284
									</label>
284
									</label>
285
									<div class="controls">
285
									<div class="controls">
286
										<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
286
										<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
287
									</div>
287
									</div>
288
								</div>
288
								</div>
289
								<div id="coord-lng" class="span4">
289
								<div id="coord-lng" class="span4">
290
									<label for="longitude" class="control-label">
290
									<label for="longitude" class="control-label">
291
										<strong class="obligatoire">*</strong>
291
										<strong class="obligatoire">*</strong>
292
										Longitude
292
										Longitude
293
									</label>
293
									</label>
294
									<div class="controls">
294
									<div class="controls">
295
										<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
295
										<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
296
									</div>
296
									</div>
297
								</div>
297
								</div>
298
								<div class="span4">
298
								<div class="span4">
299
									<button id="geolocaliser" class="btn has-tooltip"
299
									<button id="geolocaliser" class="btn has-tooltip"
300
										title="Centre la carte sur les coordonnées de latitude et longitude saisies.">
300
										title="Centre la carte sur les coordonnées de latitude et longitude saisies.">
301
										Voir sur la carte
301
										Voir sur la carte
302
									</button>
302
									</button>
303
								</div>
303
								</div>
304
								<input id="longitude" class="input-mini" name="longitude" type="text" value="BLABLA" style="display:none;"/>
304
								<input id="longitude" class="input-mini" name="longitude" type="text" value="BLABLA" style="display:none;"/>
305
							</div>
305
							</div>
306
						</div>
306
						</div>
307
					</fieldset>
307
					</fieldset>
308
					
308
					
309
					<fieldset id="partie-date">
309
					<fieldset id="partie-date">
310
						<legend><strong class="obligatoire">*</strong>
310
						<legend><strong class="obligatoire">*</strong>
311
									Date d'observation</legend>
311
									Date d'observation</legend>
312
						<div class="row-fluid">
312
						<div class="row-fluid">
313
							<div class="span12 control-group has-tooltip">
313
							<div class="span12 control-group has-tooltip">
314
								<label class="control-label">
314
								<label class="control-label">
315
									<div class="input-prepend">
315
									<div class="input-prepend">
316
										<span id="date-icone" class="add-on"></span>
316
										<span id="date-icone" class="add-on"></span>
317
										<input id="date" class="input-small" name="date" type="text"
317
										<input id="date" class="input-small" name="date" type="text"
318
											placeholder="jj/mm/aaaa" />
318
											placeholder="jj/mm/aaaa" />
319
									</div>
319
									</div>
320
								</label>
320
								</label>
321
							</div>
321
							</div>
322
						</div>
322
						</div>
323
					</fieldset>
323
					</fieldset>
324
 
324
 
325
					<fieldset id="partie-observation">
325
					<fieldset id="partie-observation">
326
						<legend>Observation</legend>
326
						<legend>Observation</legend>
327
						<div class="row-fluid">
327
						<div class="row-fluid">
328
							<div class="span12">
328
							<div class="span12">
329
								<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
329
								<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
330
									title="Sélectionnez une espèce dans la liste déroulante par son nom latin
330
									title="Sélectionnez une espèce dans la liste déroulante par son nom latin
331
									ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
331
									ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
332
									<label class="span3">
332
									<label class="span3">
333
										<strong class="obligatoire">*</strong>
333
										<strong class="obligatoire">*</strong>
334
										Espèce commune
334
										Espèce commune
335
									</label>
335
									</label>
336
									<div id="taxon-liste-controls" class="input-prepend span8">
336
									<div id="taxon-liste-controls" class="input-prepend span8">
337
										<span class="add-on">
337
										<span class="add-on">
338
											<i class="icon-leaf"></i>
338
											<i class="icon-leaf"></i>
339
										</span>
339
										</span>
340
 
340
 
341
										<select id="taxon-liste" name="taxon-liste">
341
										<select id="taxon-liste" name="taxon-liste">
342
											<option value="" selected>Sélectionner une espèce</option>
342
											<option value="" selected>Sélectionner une espèce</option>
343
 
343
 
344
											<optgroup id="taxon-liste-noms">
344
											<optgroup id="taxon-liste-noms">
345
												<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
345
												<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
346
													<option
346
													<option
347
														class="<?=$taxon['nom_type'] ?>"
347
														class="<?=$taxon['nom_type'] ?>"
348
														value="<?=$taxon['num_nom'] ?>"
348
														value="<?=$taxon['num_nom'] ?>"
349
														title="<?=$taxon['nom_title'] ?>"
349
														title="<?=$taxon['nom_title'] ?>"
350
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
350
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
351
														>
351
														>
352
														<?=$taxon['nom_a_afficher']?>
352
														<?=$taxon['nom_a_afficher']?>
353
													</option>
353
													</option>
354
												<?php endforeach; ?>
354
												<?php endforeach; ?>
355
											</optgroup>
355
											</optgroup>
356
											<optgroup id="taxon-liste-special">
356
											<optgroup id="taxon-liste-special">
357
												<?php foreach ($taxons['speciaux'] as $taxon) :?>
357
												<?php foreach ($taxons['speciaux'] as $taxon) :?>
358
													<option
358
													<option
359
														class="<?=$taxon['nom_type'] ?>"
359
														class="<?=$taxon['nom_type'] ?>"
360
														value="<?=$taxon['num_nom'] ?>"
360
														value="<?=$taxon['num_nom'] ?>"
361
														title="<?=$taxon['nom_title'] ?>"
361
														title="<?=$taxon['nom_title'] ?>"
362
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
362
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
363
														>
363
														>
364
														<?=$taxon['nom_a_afficher']?>
364
														<?=$taxon['nom_a_afficher']?>
365
													</option>
365
													</option>
366
												<?php endforeach; ?>
366
												<?php endforeach; ?>
367
												<option value="?">Autre</option>
367
												<option value="?">Autre</option>
368
											</optgroup>
368
											</optgroup>
369
										</select>
369
										</select>
370
									</div>
370
									</div>
371
								</div>
371
								</div>
372
							</div>
372
							</div>
373
						</div>
373
						</div>
374
						<div id="taxon-input-groupe" class="row-fluid hidden">
374
						<div id="taxon-input-groupe" class="row-fluid hidden">
375
							<div class="span12">
375
							<div class="span12">
376
								<div class="control-group has-tooltip" >
376
								<div class="control-group has-tooltip" >
377
									<label for="taxon" class="control-label span3">
377
									<label for="taxon" class="control-label span3">
378
										Autre espèce
378
										Autre espèce
379
									</label>
379
									</label>
380
									<div class="controls">
380
									<div class="controls">
381
										<input id="taxon" name="taxon" type="text" class="span8"
381
										<input id="taxon" name="taxon" type="text" class="span8"
382
											placeholder="Saisissez le nom d'espèce"
382
											placeholder="Saisissez le nom d'espèce"
383
											value="<?= $nom_sci_espece_defaut; ?>" />
383
											value="<?= $nom_sci_espece_defaut; ?>" />
384
									</div>
384
									</div>
385
								</div>
385
								</div>
386
							</div>
386
							</div>
387
						</div>
387
						</div>
388
 
388
 
389
						<div class="row-fluid">
389
						<div class="row-fluid">
390
							<div class="span12 control-group has-tooltip"
390
							<div class="span12 control-group has-tooltip"
391
								title="Indiquez votre certitude vis-à-vis du nom d'espèce indiqué">
391
								title="Indiquez votre certitude vis-à-vis du nom d'espèce indiqué">
392
								<label class="span3 control-label">
392
								<label class="span3 control-label">
393
									<strong class="obligatoire">*</strong>
393
									<strong class="obligatoire">*</strong>
394
									Certitude
394
									Certitude
395
								</label>
395
								</label>
396
								<div id="certitude-controls" class="controls">
396
								<div id="certitude-controls" class="controls">
397
									<span class="span3" title="Détermination certaine">
397
									<span class="span3" title="Détermination certaine">
398
										<input type="radio" name="certitude" id="certitude-certaine" value="certain" />
398
										<input type="radio" name="certitude" id="certitude-certaine" value="certain" />
399
										<label for="certitude-certaine">Certaine</label>
399
										<label for="certitude-certaine">Certaine</label>
400
									</span>
400
									</span>
401
									<span class="span3" title="Détermination incertaine mais pas inexacte">
401
									<span class="span3" title="Détermination incertaine mais pas inexacte">
402
										<input type="radio" name="certitude" id="certitude-douteuse" value="douteux" />
402
										<input type="radio" name="certitude" id="certitude-douteuse" value="douteux" />
403
										<label for="certitude-douteuse">Douteuse</label>
403
										<label for="certitude-douteuse">Douteuse</label>
404
									</span>
404
									</span>
405
									<span class="span3" title="Détermination inconnue">
405
									<span class="span3" title="Détermination inconnue">
406
										<input type="radio" name="certitude" id="certitude-adeterminer" value="aDeterminer" />
406
										<input type="radio" name="certitude" id="certitude-adeterminer" value="aDeterminer" />
407
										<label for="certitude-adeterminer">A determiner</label>
407
										<label for="certitude-adeterminer">A determiner</label>
408
									</span>									
408
									</span>									
409
								</div>
409
								</div>
410
							</div>
410
							</div>
411
						</div>
411
						</div>
412
 
412
 
413
						<div class="row-fluid">
413
						<div class="row-fluid">
414
							<div class="span12 control-group has-tooltip"
414
							<div class="span12 control-group has-tooltip"
415
								title="Indiquez le milieu dans lequel vous avez rencontré cette espèce.">
415
								title="Indiquez le milieu dans lequel vous avez rencontré cette espèce.">
416
								<label class="span3 control-label">
416
								<label class="span3 control-label">
417
									Milieu
417
									Milieu
418
								</label>
418
								</label>
419
								<div id="milieux-controls" class="controls span8">
419
								<div id="milieux-controls" class="controls span8">
420
									<div class="input-prepend">
420
									<div class="input-prepend">
421
										<span class="add-on">
421
										<span class="add-on">
422
											<i class="icon-globe"></i>
422
											<i class="icon-globe"></i>
423
										</span>
423
										</span>
424
										<select id="milieu">
424
										<select id="milieu">
425
											<option value="fissures">Fissures</option>
425
											<option value="fissures">Fissures</option>
426
											<option value="pied d'arbre">Pied d'arbre</option>
426
											<option value="pied d'arbre">Pied d'arbre</option>
427
											<option value="mur">Mur</option>
427
											<option value="mur">Mur</option>
428
											<option value="pelouse">Pelouse</option>
428
											<option value="pelouse">Pelouse</option>
429
											<option value="plate bande">Plate bande</option>
429
											<option value="plate bande">Plate bande</option>
430
											<option value="haie">Haie</option>
430
											<option value="haie">Haie</option>
431
											<option value="chemin">Chemin</option>
431
											<option value="chemin">Chemin</option>
432
											<option value="autres">Autres</option>
432
											<option value="autres">Autres</option>
433
										</select>
433
										</select>
434
									</div>
434
									</div>
435
								</div>
435
								</div>
436
							</div>
436
							</div>
437
						</div>
437
						</div>
438
 
438
 
439
						<div id="milieu-autre-input-group" class="row-fluid hidden">
439
						<div id="milieu-autre-input-group" class="row-fluid hidden">
440
							<div class="span12">
440
							<div class="span12">
441
								<div class="control-group has-tooltip" >
441
								<div class="control-group has-tooltip" >
442
									<label for="milieu-autre" class="control-label span3">
442
									<label for="milieu-autre" class="control-label span3">
443
										Autre milieu
443
										Autre milieu
444
									</label>
444
									</label>
445
									<div class="controls">
445
									<div class="controls">
446
										<input id="milieu-autre" name="milieu-autre" type="text" class="span8"
446
										<input id="milieu-autre" name="milieu-autre" type="text" class="span8"
447
											placeholder="" />
447
											placeholder="" />
448
									</div>
448
									</div>
449
								</div>
449
								</div>
450
							</div>
450
							</div>
451
						</div>
451
						</div>
452
 
452
 
453
						<div class="row-fluid">
453
						<div class="row-fluid">
454
							<div class="span12">
454
							<div class="span12">
455
								<label for="notes">Notes</label>
455
								<label for="notes">Notes</label>
456
								<div>
456
								<div>
457
									<textarea id="notes" class="span12" rows="7" name="notes"
457
									<textarea id="notes" class="span12" rows="7" name="notes"
458
										placeholder="Champ libre"></textarea>
458
										placeholder="Champ libre"></textarea>
459
								</div>
459
								</div>
460
							</div>
460
							</div>
461
						</div>
461
						</div>
462
					</fieldset>
462
					</fieldset>
463
				</div><!-- zone-fiche-terrain-->
463
				</div><!-- zone-fiche-terrain-->
464
			</form>
464
			</form>
465
 
465
 
466
			<div id="zone-fiche-terrain-photo">
466
			<div id="zone-fiche-terrain-photo">
467
				<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>"
467
				<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>"
468
					method="post" enctype="multipart/form-data">
468
					method="post" enctype="multipart/form-data">
469
					<div class="row-fluid">
469
					<div class="row-fluid">
470
						<div class="span12">
470
						<div class="span12">
471
							<fieldset id="partie-photo">
471
							<fieldset id="partie-photo">
472
								<legend>Image(s) de cette plante</legend>
472
								<legend>Image(s) de cette plante</legend>
473
								<p class="miniature-info" class="discretion help-inline">
473
								<p class="miniature-info" class="discretion help-inline">
474
									Vous pouvez ajouter des photos. Celles-ci doivent être au format <strong>JPEG</strong> 
474
									Vous pouvez ajouter des photos. Celles-ci doivent être au format <strong>JPEG</strong> 
475
									et ne doivent pas excéder <strong>5Mo</strong> chacunes.
475
									et ne doivent pas excéder <strong>5Mo</strong> chacunes.
476
									<a target="_blank" id="lien-tuto-photo" href="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/table_commentprendreenphoto.png">
476
									<a target="_blank" id="lien-tuto-photo" href="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/table_commentprendreenphoto.png">
477
										Exemples de bonnes et mauvaises photos
477
										Exemples de bonnes et mauvaises photos
478
									</a>
478
									</a>
479
									<i class="icon-question-sign"></i>
479
									<i class="icon-question-sign"></i>
480
								</p>
480
								</p>
481
								<div id="image-obligatoire" class="alert alert-error alert-block" style="display: none;">
481
								<div id="image-obligatoire" class="alert alert-error alert-block" style="display: none;">
482
									<a class="close">×</a>
482
									<a class="close">×</a>
483
									<h4 class="alert-heading">Information : image obligatoire</h4>
483
									<h4 class="alert-heading">Information : image obligatoire</h4>
484
									<p>
484
									<p>
485
										Veuillez ajouter au moins une image
485
										Veuillez ajouter au moins une image
486
									</p>
486
									</p>
487
								</div>
487
								</div>
488
								<div id ="photos-conteneur">
488
								<div id ="photos-conteneur">
489
									<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
489
									<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
490
									<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
490
									<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
491
									<div id="miniatures"></div>
491
									<div id="miniatures"></div>
492
									<p class="miniature-msg" class="span12">&nbsp;</p>
492
									<p class="miniature-msg" class="span12">&nbsp;</p>
493
								</div>
493
								</div>
494
							</fieldset>
494
							</fieldset>
495
						</div>
495
						</div>
496
					</div>
496
					</div>
497
				</form>
497
				</form>
498
				<div class="row-fluid">
498
				<div class="row-fluid">
499
					<div class="span12 has-tooltip"
499
					<div class="span12 has-tooltip"
500
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
500
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
501
							ajouter votre observation à la liste à transmettre.">
501
							ajouter votre observation à la liste à transmettre.">
502
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
502
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
503
							Ajouter
503
							Ajouter
504
						</button>
504
						</button>
505
					</div>
505
					</div>
506
				</div>
506
				</div>
507
			</div>
507
			</div>
508
 
508
 
509
			<!-- Messages d'erreur du formulaire-->
509
			<!-- Messages d'erreur du formulaire-->
510
			<div class="row-fluid">
510
			<div class="row-fluid">
511
				<div class="zone-alerte span12">
511
				<div class="zone-alerte span12">
512
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
512
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
513
						<a class="close">×</a>
513
						<a class="close">×</a>
514
						<h4 class="alert-heading">Information : <?= $max_nb_obs; ?> observations maximum</h4>
514
						<h4 class="alert-heading">Information : <?= $max_nb_obs; ?> observations maximum</h4>
515
						<p>
515
						<p>
516
							Vous venez d'ajouter votre <?= $max_nb_obs; ?>ème observation.<br/>
516
							Vous venez d'ajouter votre <?= $max_nb_obs; ?>ème observation.<br/>
517
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
517
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
518
						</p>
518
						</p>
519
					</div>
519
					</div>
520
				</div>
520
				</div>
521
				<div class="zone-alerte span12">
521
				<div class="zone-alerte span12">
522
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
522
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
523
						<a class="close">×</a>
523
						<a class="close">×</a>
524
						<h4 class="alert-heading">Information : champs en erreur</h4>
524
						<h4 class="alert-heading">Information : champs en erreur</h4>
525
						<p>
525
						<p>
526
							Certains champs du formulaire sont mal remplis.<br/>
526
							Certains champs du formulaire sont mal remplis.<br/>
527
							Veuillez vérifier vos données.
527
							Veuillez vérifier vos données.
528
						</p>
528
						</p>
529
					</div>
529
					</div>
530
				</div>
530
				</div>
531
			</div>
531
			</div>
532
 
532
 
533
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
533
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
534
			<div id="zone-liste-obs" class="hidden">
534
			<div id="zone-liste-obs" class="hidden">
535
				<div class="row-fluid">
535
				<div class="row-fluid">
536
					<div class="span12">
536
					<div class="span12">
537
						<div class="row-fluid">
537
						<div class="row-fluid">
538
							<div class="span8">
538
							<div class="span8">
539
								<h2 id="titre-liste-obs">Liste des observations à transmettre : <span class="obs-nbre">0</span></h2>
539
								<h2 id="titre-liste-obs">Liste des observations à transmettre : <span class="obs-nbre">0</span></h2>
540
							</div>
540
							</div>
541
							<div class="span4 droite">
541
							<div class="span4 droite">
542
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
542
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
543
									type="button" disabled="disabled"
543
									type="button" disabled="disabled"
544
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
544
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
545
									Transmettre
545
									Transmettre
546
								</button>
546
								</button>
547
							</div>
547
							</div>
548
						</div>
548
						</div>
549
						<div id="liste-obs" ></div>
549
						<div id="liste-obs" ></div>
550
					</div>
550
					</div>
551
				</div>
551
				</div>
552
			</div>
552
			</div>
553
 
553
 
554
			<div class="row-fluid">
554
			<div class="row-fluid">
555
				<div class="zone-alerte span12">
555
				<div class="zone-alerte span12">
556
					<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
556
					<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
557
						<a class="close">×</a>
557
						<a class="close">×</a>
558
						<h4 class="alert-heading">Attention : aucune observation</h4>
558
						<h4 class="alert-heading">Attention : aucune observation</h4>
559
						<p>Veuillez saisir des observations pour les transmettre.</p>
559
						<p>Veuillez saisir des observations pour les transmettre.</p>
560
					</div>
560
					</div>
561
 
561
 
562
					<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;">
562
					<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;">
563
						<a class="close">×</a>
563
						<a class="close">×</a>
564
						<h4 class="alert-heading">Information : transmission des observations</h4>
564
						<h4 class="alert-heading">Information : transmission des observations</h4>
565
						<div class="alert-txt"></div>
565
						<div class="alert-txt"></div>
566
					</div>
566
					</div>
567
 
567
 
568
					<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
568
					<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
569
						<a class="close">×</a>
569
						<a class="close">×</a>
570
						<h4 class="alert-heading">Erreur : transmission des observations</h4>
570
						<h4 class="alert-heading">Erreur : transmission des observations</h4>
571
						<div class="alert-txt"></div>
571
						<div class="alert-txt"></div>
572
					</div>
572
					</div>
573
				</div>
573
				</div>
574
			</div>
574
			</div>
575
		</div>
575
		</div>
576
 
576
 
577
		<!-- Fenêtres modales -->
577
		<!-- Fenêtres modales -->
578
		<div id="chargement" class="modal-fenetre" style="display:none;">
578
		<div id="chargement" class="modal-fenetre" style="display:none;">
579
			<div id="chargement-centrage" class="modal-contenu">
579
			<div id="chargement-centrage" class="modal-contenu">
580
				<div class="progress progress-success progress-striped active">
580
				<div class="progress progress-success progress-striped active">
581
		 			<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
581
		 			<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
582
		    			<span class="sr-only">0/10 observations transmises</span>
582
		    			<span class="sr-only">0/10 observations transmises</span>
583
		  			</div>
583
		  			</div>
584
				</div>
584
				</div>
585
				<p id="chargement-txt" style="color:white;font-size:1.5em;">
585
				<p id="chargement-txt" style="color:white;font-size:1.5em;">
586
					Transfert des observations en cours...<br />
586
					Transfert des observations en cours...<br />
587
					Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
587
					Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
588
					d'observations à transférer.
588
					d'observations à transférer.
589
				</p>
589
				</p>
590
			</div>
590
			</div>
591
		</div>
591
		</div>
592
 
592
 
593
		<!-- Templates HTML -->
593
		<!-- Templates HTML -->
594
		<div id="tpl-transmission-ok" style="display:none;">
594
		<div id="tpl-transmission-ok" style="display:none;">
595
			<p class="msg">
595
			<p class="msg">
596
				Merci Beaucoup&nbsp;! Vos observations ont bien été transmises.<br />
596
				Merci Beaucoup&nbsp;! Vos observations ont bien été transmises.<br />
597
				Elles sont désormais affichées sur la carte <a href="https://www.tela-botanica.org/widget:cel:cartoPoint?projet=Bellesdemarue">Belles de ma rue</a>
597
				Elles sont désormais affichées sur la carte <a href="https://www.tela-botanica.org/widget:cel:cartoPoint?projet=Bellesdemarue">Belles de ma rue</a>
598
			</p>
598
			</p>
599
		</div>
599
		</div>
600
		<div id="tpl-transmission-ko" style="display:none;">
600
		<div id="tpl-transmission-ko" style="display:none;">
601
			<p class="msg">
601
			<p class="msg">
602
				Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
602
				Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
603
				Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
603
				Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
604
				et transmettre les suivantes.<br />
604
				et transmettre les suivantes.<br />
605
				Les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. 
605
				Les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. 
606
			</p>
606
			</p>
607
		</div>
607
		</div>
608
	</body>
608
	</body>
609
</html>
609
</html>