Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 2996 Rev 3037
1
<!DOCTYPE html>
1
<!DOCTYPE html>
2
<html lang="fr">
2
<html lang="fr">
3
	<head>
3
	<head>
4
		<title>Les arbres remarquables de Grenoble-Alpes Métropole</title>
4
		<title>Les arbres remarquables de Grenoble-Alpes Métropole</title>
5
 
5
 
6
		<meta charset="utf-8">
6
		<meta charset="utf-8">
7
 
7
 
8
		<meta name="revisit-after" content="15 days" />
8
		<meta name="revisit-after" content="15 days" />
9
		<meta name="robots" content="index,follow" />
9
		<meta name="robots" content="index,follow" />
10
		<meta name="author" content="Delphine CAUQUIL" />
10
		<meta name="author" content="Delphine CAUQUIL" />
11
		<meta name="keywords" content="Arbres remarquables, projet, saisie, observation, Frapna CEL" />
11
		<meta name="keywords" content="Arbres remarquables, projet, saisie, observation, Frapna CEL" />
12
		<meta name="description" content="Projet Arbres remarquables de Grenoble-Alpes Métropole - Widget de saisie simplifiée pour le CEL" />
12
		<meta name="description" content="Projet Arbres remarquables de Grenoble-Alpes Métropole - Widget de saisie simplifiée pour le CEL" />
13
 
13
 
14
		<!-- Viewport Mobile -->
14
		<!-- Viewport Mobile -->
15
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
15
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
16
 
16
 
17
		<!-- Favicones -->
17
		<!-- Favicones -->
18
		<!-- <link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/favicon.ico" /> -->
18
		<!-- <link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/favicon.ico" /> -->
19
 
19
 
20
		<!-- Javascript : bibliothèques -->
20
		<!-- Javascript : bibliothèques -->
21
		<!-- Google Map v3 -->
21
		<!-- Google Map v3 -->
22
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
22
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
23
		<script type="text/javascript" src="https://maps.google.com/maps/api/js?language=fr&amp;region=FR"></script>
23
		<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=<?php echo $cleGoogleMaps; ?>&language=fr&amp;region=FR"></script>
24
		<!-- Proj4js -->
24
		<!-- Proj4js -->
25
		<script type="text/javascript" src="https://resources.tela-botanica.org/proj4js/2.2.1/proj4.js"></script>
25
		<script type="text/javascript" src="https://resources.tela-botanica.org/proj4js/2.2.1/proj4.js"></script>
26
 
26
 
27
		<!-- Jquery -->
27
		<!-- Jquery -->
28
		<script src="https://code.jquery.com/jquery-1.12.1.js"></script>
28
		<script src="https://code.jquery.com/jquery-1.12.1.js"></script>
29
		<!-- Jquery UI : nécessaire pour le mini-calendrier et l'auto-complétion -->
29
		<!-- Jquery UI : nécessaire pour le mini-calendrier et l'auto-complétion -->
30
		<script src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
30
		<script src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
31
		<script src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
31
		<script src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
32
		<!-- Jquery Plugins -->
32
		<!-- Jquery Plugins -->
33
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
33
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
34
		<script src="https://resources.tela-botanica.org/jquery/validate/1.13.0/jquery.validate.min.js"></script>
34
		<script src="https://resources.tela-botanica.org/jquery/validate/1.13.0/jquery.validate.min.js"></script>
35
		<script src="https://resources.tela-botanica.org/jquery/validate/1.13.0/localization/messages_fr.js"></script>
35
		<script src="https://resources.tela-botanica.org/jquery/validate/1.13.0/localization/messages_fr.js"></script>
36
		<!-- Jquery Form :nécessaire pour l'upload des images -->
36
		<!-- Jquery Form :nécessaire pour l'upload des images -->
37
		<script src="https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
37
		<script src="https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
38
		<!-- Bootstrap -->
38
		<!-- Bootstrap -->
39
		<script src="https://resources.tela-botanica.org/bootstrap/3.2.0/js/bootstrap.min.js"></script>
39
		<script src="https://resources.tela-botanica.org/bootstrap/3.2.0/js/bootstrap.min.js"></script>
40
 
40
 
41
		<!-- Javascript : appli saisie -->
41
		<!-- Javascript : appli saisie -->
42
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
42
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
43
		<script src="<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/js/WidgetSaisieArbresRemarquables.js"></script>
43
		<script src="<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/js/WidgetSaisieArbresRemarquables.js"></script>
44
		<script src="<?=$url_base?>saisie?projet=arbres-remarquables&amp;service=taxons" type="text/javascript"></script>
44
		<script src="<?=$url_base?>saisie?projet=arbres-remarquables&amp;service=taxons" type="text/javascript"></script>
45
		<script>
45
		<script>
46
		//<![CDATA[
46
		//<![CDATA[
47
           $(document).ready(function() {
47
           $(document).ready(function() {
48
				// OMG un modèle objet !!
48
				// OMG un modèle objet !!
49
				var widget = new WidgetSaisieArbresRemarquables();
49
				var widget = new WidgetSaisieArbresRemarquables();
50
 
50
 
51
				// la variable "taxons" chargée par "service=taxons" ci-dessus n'est pas accessible dans le contexte objet
51
				// la variable "taxons" chargée par "service=taxons" ci-dessus n'est pas accessible dans le contexte objet
52
				widget.taxons = taxons;
52
				widget.taxons = taxons;
53
 
53
 
54
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
54
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
55
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
55
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
56
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
56
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
57
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
57
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
58
				// Mot-clé du widget/projet
58
				// Mot-clé du widget/projet
59
				widget.tagProjet = "WidgetSaisie,ArbresRemarquables";
59
				widget.tagProjet = "WidgetSaisie,ArbresRemarquables";
60
				// Mots-clés à ajouter aux images
60
				// Mots-clés à ajouter aux images
61
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
61
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
62
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
62
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
63
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
63
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
64
				// Mots-clés à ajouter aux observations
64
				// Mots-clés à ajouter aux observations
65
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
65
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
66
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
66
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
67
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
67
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
68
				// Précharger le formulaire avec les infos d'une observation
68
				// Précharger le formulaire avec les infos d'une observation
69
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
69
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
70
				// URL du web service réalisant l'insertion des données dans la base du CEL.
70
				// URL du web service réalisant l'insertion des données dans la base du CEL.
71
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
71
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
72
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
72
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
73
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
73
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
74
				// Code du référentiel utilisé pour les nom scientifiques.
74
				// Code du référentiel utilisé pour les nom scientifiques.
75
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
75
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
76
				// Indication de la présence d'une espèce imposée
76
				// Indication de la présence d'une espèce imposée
77
				widget.especeImposee = "<?=$espece_imposee; ?>";
77
				widget.especeImposee = "<?=$espece_imposee; ?>";
78
				// Tableau d'informations sur l'espèce imposée
78
				// Tableau d'informations sur l'espèce imposée
79
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
79
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
80
				// Nombre d'élément dans les listes d'auto-complétion
80
				// Nombre d'élément dans les listes d'auto-complétion
81
				widget.autocompletionElementsNbre = 20;
81
				widget.autocompletionElementsNbre = 20;
82
 
82
 
83
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
83
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
84
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
84
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
85
					"masque={masque}&"+
85
					"masque={masque}&"+
86
					"recherche=etendue&"+
86
					"recherche=etendue&"+
87
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
87
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
88
					"retour.tri=alpharet&"+ // tri "à la CeL"
88
					"retour.tri=alpharet&"+ // tri "à la CeL"
89
					"ns.structure=au"+"&"+
89
					"ns.structure=au"+"&"+
90
					"navigation.limite=" + widget.autocompletionElementsNbre;
90
					"navigation.limite=" + widget.autocompletionElementsNbre;
91
				// Nombre d'observations max autorisé avant transmission
91
				// Nombre d'observations max autorisé avant transmission
92
				widget.obsMaxNbre = 10;
92
				widget.obsMaxNbre = 10;
93
				// Durée d'affichage en milliseconde des messages d'informations
93
				// Durée d'affichage en milliseconde des messages d'informations
94
				widget.dureeMessage = 15000;
94
				widget.dureeMessage = 15000;
95
				// Squelette d'URL du web service de l'annuaire.
95
				// Squelette d'URL du web service de l'annuaire.
96
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
96
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
97
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
97
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
98
				widget.serviceNomCommuneUrl = "https://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
98
				widget.serviceNomCommuneUrl = "https://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
99
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
99
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
100
				widget.serviceNomCommuneUrlAlt = "https://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
100
				widget.serviceNomCommuneUrlAlt = "https://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
101
				// Squelette d'URL du web service d'eFlore fournissant l'altitude
101
				// Squelette d'URL du web service d'eFlore fournissant l'altitude
102
				widget.serviceAltitudeUrl = "https://api.tela-botanica.org/service:eflore:0.1/nasa-srtm/altitude?lon={lon}&lat={lat}";
102
				widget.serviceAltitudeUrl = "https://api.tela-botanica.org/service:eflore:0.1/nasa-srtm/altitude?lon={lon}&lat={lat}";
103
				// URL du marqueur à utiliser dans la carte Google Map
103
				// URL du marqueur à utiliser dans la carte Google Map
104
				widget.googleMapMarqueurUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/marqueurs/epingle.png";
104
				widget.googleMapMarqueurUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/marqueurs/epingle.png";
105
				// URL de l'icône du chargement en cours
105
				// URL de l'icône du chargement en cours
106
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/icones/chargement.gif";
106
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/icones/chargement.gif";
107
				// URL de l'icône du chargement en cours d'une image
107
				// URL de l'icône du chargement en cours d'une image
108
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/icones/chargement-image.gif";
108
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/icones/chargement-image.gif";
109
				// URL de l'icône du calendrier
109
				// URL de l'icône du calendrier
110
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/icones/calendrier.png";
110
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/icones/calendrier.png";
111
				// URL de l'icône pour une photo manquante
111
				// URL de l'icône pour une photo manquante
112
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/icones/pasdephoto.png";
112
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/img/icones/pasdephoto.png";
113
 
113
 
114
				// Initialisation du bousin
114
				// Initialisation du bousin
115
				widget.init();
115
				widget.init();
116
			});
116
			});
117
		//]]>
117
		//]]>
118
		</script>
118
		</script>
119
 
119
 
120
		<!-- CSS -->
120
		<!-- CSS -->
121
		<link rel="stylesheet" href="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" />
121
		<link rel="stylesheet" href="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" />
122
		<link rel="stylesheet" href="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/theme.css" />
122
		<link rel="stylesheet" href="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/theme.css" />
123
		<link rel="stylesheet" href="https://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap.min.css" />
123
		<link rel="stylesheet" href="https://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap.min.css" />
124
		<link rel="stylesheet" href="https://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap-theme.min.css" />
124
		<link rel="stylesheet" href="https://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap-theme.min.css" />
125
		<link rel="stylesheet" href="<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/css/<?=isset($_GET['style']) ? $_GET['style'] : 'arbres-remarquables'?>.css" />
125
		<link rel="stylesheet" href="<?=$url_base?>modules/saisie/squelettes/arbres-remarquables/css/<?=isset($_GET['style']) ? $_GET['style'] : 'arbres-remarquables'?>.css" />
126
 
126
 
127
		<!--  Google Analytics -->
127
		<!--  Google Analytics -->
128
		<?php if($prod): ?>
128
		<?php if($prod): ?>
129
			<?php include "analytics.html"; ?>
129
			<?php include "analytics.html"; ?>
130
		<?php endif; ?>
130
		<?php endif; ?>
131
	</head>
131
	</head>
132
 
132
 
133
	<body data-spy="scroll">
133
	<body data-spy="scroll">
134
		<div class="container">
134
		<div class="container">
135
			<div class="page-header">
135
			<div class="page-header">
136
				<h1>
136
				<h1>
137
					<img id="logo-titre" src="<?=$url_base?>/modules/saisie/squelettes/arbres-remarquables/img/logos/frapna.jpg" alt="Frapna" />
137
					<img id="logo-titre" src="<?=$url_base?>/modules/saisie/squelettes/arbres-remarquables/img/logos/frapna.jpg" alt="Frapna" />
138
					 Inventaire participatif des arbres remarquables de l'Isère
138
					 Inventaire participatif des arbres remarquables de l'Isère
139
				</h1>
139
				</h1>
140
			</div>
140
			</div>
141
			<div class="row">
141
			<div class="row">
142
				<div class="col-md-6">
142
				<div class="col-md-6">
143
					<div id="intro" class="well well-lg">
143
					<div id="intro" class="well well-lg">
144
						<a class="fermer" data-toggle="collapse" data-target="#intro-txt">
144
						<a class="fermer" data-toggle="collapse" data-target="#intro-txt">
145
							<h3 class="titre">
145
							<h3 class="titre">
146
								Le Projet «&nbsp;Inventaire des arbres remarquables&nbsp;»
146
								Le Projet «&nbsp;Inventaire des arbres remarquables&nbsp;»
147
								<span class="glyphicon glyphicon-plus-sign"></span>
147
								<span class="glyphicon glyphicon-plus-sign"></span>
148
							</h3>
148
							</h3>
149
						</a>
149
						</a>
150
						<div id="intro-txt" class="collapse in">
150
						<div id="intro-txt" class="collapse in">
151
							<p>
151
							<p>
152
								Les <a data-toggle="modal" data-target="#projet-description">arbres remarquables</a>,
152
								Les <a data-toggle="modal" data-target="#projet-description">arbres remarquables</a>,
153
								 sont pour nous, humains, à la croisée de la nature et de la culture. De la nature ils 
153
								 sont pour nous, humains, à la croisée de la nature et de la culture. De la nature ils 
154
								sont une émanation puissante et intemporelle ; leur présence nous rend palpable le rythme 
154
								sont une émanation puissante et intemporelle ; leur présence nous rend palpable le rythme 
155
								des saisons, des années et nous ouvre, jusque dans les villes, une fenêtre sur le sauvage. 
155
								des saisons, des années et nous ouvre, jusque dans les villes, une fenêtre sur le sauvage. 
156
								Leur longévité, qui peut traverser les siècles et à coté de laquelle nos vies humaines 
156
								Leur longévité, qui peut traverser les siècles et à coté de laquelle nos vies humaines 
157
								paraissent bien modestes, jalonne notre histoire comme les tilleuls de Sully ou certains 
157
								paraissent bien modestes, jalonne notre histoire comme les tilleuls de Sully ou certains 
158
								genévriers millénaires.
158
								genévriers millénaires.
159
							</p>
159
							</p>
160
							<p>
160
							<p>
161
								 Après avoir lancé l’inventaire sur le territoire de Grenoble Alpes Métropole, la 
161
								 Après avoir lancé l’inventaire sur le territoire de Grenoble Alpes Métropole, la 
162
								 <a href="http://www.frapna-38.org/" target="_blank">FRAPNA</a> élargit la possibilité de 
162
								 <a href="http://www.frapna-38.org/" target="_blank">FRAPNA</a> élargit la possibilité de 
163
								 saisie à tout le département de l'Isère, avec deux objectifs principaux : <br />
163
								 saisie à tout le département de l'Isère, avec deux objectifs principaux : <br />
164
								- la <strong>sensibilisation</strong> à ce patrimoine irremplaçable encore trop souvent ignoré ou méconnu,<br />
164
								- la <strong>sensibilisation</strong> à ce patrimoine irremplaçable encore trop souvent ignoré ou méconnu,<br />
165
								- la <strong>connaissance</strong>, car leur identification est indispensable pour qu'ils puissent être préservés.
165
								- la <strong>connaissance</strong>, car leur identification est indispensable pour qu'ils puissent être préservés.
166
							</p>
166
							</p>
167
							<p>
167
							<p>
168
								Participez à cet inventaire en recensant les arbres remarquables que vous observez en Isère à 
168
								Participez à cet inventaire en recensant les arbres remarquables que vous observez en Isère à 
169
								l'aide du formulaire de saisie ci-dessous.
169
								l'aide du formulaire de saisie ci-dessous.
170
 
170
 
171
							</p>
171
							</p>
172
						</div>
172
						</div>
173
					</div>
173
					</div>
174
				</div>
174
				</div>
175
 
175
 
176
				<div class="col-md-6">
176
				<div class="col-md-6">
177
					<div id="aide" class="well well-lg">
177
					<div id="aide" class="well well-lg">
178
						<a class="fermer" data-toggle="collapse" data-target="#aide-txt">
178
						<a class="fermer" data-toggle="collapse" data-target="#aide-txt">
179
							<h3 class="titre">
179
							<h3 class="titre">
180
								Aide
180
								Aide
181
								<span class="glyphicon glyphicon-plus-sign"></span>
181
								<span class="glyphicon glyphicon-plus-sign"></span>
182
							</h3>
182
							</h3>
183
						</a>
183
						</a>
184
						<div id="aide-txt" class="collapse in">
184
						<div id="aide-txt" class="collapse in">
185
							<p>
185
							<p>
186
								Cet outil vous permet de partager simplement vos observations avec
186
								Cet outil vous permet de partager simplement vos observations avec
187
								<a href="http://www.frapna-38.org/" target="_blank">la FRAPNA</a> et le
187
								<a href="http://www.frapna-38.org/" target="_blank">la FRAPNA</a> et le
188
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
188
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
189
								(sous <a href="http://www.tela-botanica.org/page:licence?langue=fr">licence CC-BY-SA</a>).
189
								(sous <a href="http://www.tela-botanica.org/page:licence?langue=fr">licence CC-BY-SA</a>).
190
								Identifiez-vous bien pour ensuite retrouver et gérer vos données dans
190
								Identifiez-vous bien pour ensuite retrouver et gérer vos données dans
191
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
191
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
192
								Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
192
								Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
193
								Elles apparaissent immédiatement sur les
193
								Elles apparaissent immédiatement sur les
194
								<a href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
194
								<a href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
195
							</p>
195
							</p>
196
							<p class="discretion">
196
							<p class="discretion">
197
								Pour toute question ou remarque,
197
								Pour toute question ou remarque,
198
								<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
198
								<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
199
									target="_blank"
199
									target="_blank"
200
									onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
200
									onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
201
									contactez-nous</a>
201
									contactez-nous</a>
202
							</p>
202
							</p>
203
							<p class="discretion">
203
							<p class="discretion">
204
								Une fois familiarisé avec l'interface vous pouvez cliquer sur le bouton suivant pour désactiver l'aide&nbsp;:
204
								Une fois familiarisé avec l'interface vous pouvez cliquer sur le bouton suivant pour désactiver l'aide&nbsp;:
205
								<button id="btn-aide" class="btn btn-xs btn-success">
205
								<button id="btn-aide" class="btn btn-xs btn-success">
206
									<span class="glyphicon glyphicon-question-sign icon-white"></span>
206
									<span class="glyphicon glyphicon-question-sign icon-white"></span>
207
									<span id="btn-aide-txt">Désactiver l'aide</span>
207
									<span id="btn-aide-txt">Désactiver l'aide</span>
208
								</button>
208
								</button>
209
							</p>
209
							</p>
210
						</div>
210
						</div>
211
					</div>
211
					</div>
212
				</div>
212
				</div>
213
			</div>
213
			</div>
214
			
214
			
215
			
215
			
216
			
216
			
217
			
217
			
218
 
218
 
219
			<div class="well well-lg">
219
			<div class="well well-lg">
220
				<h2>Observateur</h2>
220
				<h2>Observateur</h2>
221
				<form id="form-observateur" role="form" autocomplete="on">
221
				<form id="form-observateur" role="form" autocomplete="on">
222
					<div class="row">
222
					<div class="row">
223
						<div class="col-md-6 form-group has-tooltip" data-placement="right"
223
						<div class="col-md-6 form-group has-tooltip" data-placement="right"
224
							title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
224
							title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
225
								Si vous n'êtes pas inscrit ce n'est pas grave, vous pourrez le faire
225
								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
226
								ultérieurement. Des informations complémentaires vont vous être
227
								demandées : prénom et nom.">
227
								demandées : prénom et nom.">
228
							<label for="courriel"  title="Veuillez saisir votre adresse courriel.">
228
							<label for="courriel"  title="Veuillez saisir votre adresse courriel.">
229
								<strong class="obligatoire">*</strong>
229
								<strong class="obligatoire">*</strong>
230
								Courriel
230
								Courriel
231
							</label>
231
							</label>
232
							<div class="input-group">
232
							<div class="input-group">
233
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
233
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
234
								<input id="courriel" name="courriel" class="form-control" type="text"/>
234
								<input id="courriel" name="courriel" class="form-control" type="text"/>
235
								<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
235
								<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
236
							</div>
236
							</div>
237
						</div>
237
						</div>
238
						<div id="zone-courriel-confirmation" class="col-md-6 form-group has-feedback hidden">
238
						<div id="zone-courriel-confirmation" class="col-md-6 form-group has-feedback hidden">
239
							<label for="courriel_confirmation" title="Veuillez confirmer le courriel.">
239
							<label for="courriel_confirmation" title="Veuillez confirmer le courriel.">
240
								<strong class="obligatoire">*</strong> Courriel (confirmation)
240
								<strong class="obligatoire">*</strong> Courriel (confirmation)
241
							</label>
241
							</label>
242
							<div class="input-group">
242
							<div class="input-group">
243
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
243
								<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"/>
244
								<input id="courriel_confirmation" name="courriel_confirmation" class="form-control" type="text"/>
245
							</div>
245
							</div>
246
						</div>
246
						</div>
247
					</div>
247
					</div>
248
					<div id="zone-prenom-nom" class="row hidden">
248
					<div id="zone-prenom-nom" class="row hidden">
249
						<div class="col-md-6 form-group">
249
						<div class="col-md-6 form-group">
250
							<label for="prenom">Prénom</label>
250
							<label for="prenom">Prénom</label>
251
							<div class="input-group">
251
							<div class="input-group">
252
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
252
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
253
								<input id="prenom" name="prenom" class="form-control" type="text"/>
253
								<input id="prenom" name="prenom" class="form-control" type="text"/>
254
							</div>
254
							</div>
255
						</div>
255
						</div>
256
						<div class="col-md-6 form-group">
256
						<div class="col-md-6 form-group">
257
							<label for="nom">Nom</label>
257
							<label for="nom">Nom</label>
258
							<div class="input-group">
258
							<div class="input-group">
259
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
259
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
260
								<input id="nom" name="nom" class="form-control" type="text"/>
260
								<input id="nom" name="nom" class="form-control" type="text"/>
261
							</div>
261
							</div>
262
						</div>
262
						</div>
263
					</div>
263
					</div>
264
				</form>
264
				</form>
265
			</div>
265
			</div>
266
			<!-- Messages d'erreur du formulaire-->
266
			<!-- Messages d'erreur du formulaire-->
267
			<div class="row">
267
			<div class="row">
268
				<div class="zone-alerte col-md-6 col-md-offset-3">
268
				<div class="zone-alerte col-md-6 col-md-offset-3">
269
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
269
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
270
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
270
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
271
						<h4 class="alert-heading">Information : copier/coller</h4>
271
						<h4 class="alert-heading">Information : copier/coller</h4>
272
						<p>
272
						<p>
273
							Merci de ne pas copier/coller votre courriel.<br/>
273
							Merci de ne pas copier/coller votre courriel.<br/>
274
							La double saisie permet de vérifier l'absence d'erreurs.
274
							La double saisie permet de vérifier l'absence d'erreurs.
275
						</p>
275
						</p>
276
					</div>
276
					</div>
277
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
277
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
278
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
278
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
279
						<h4 class="alert-heading">Information : courriel introuvable</h4>
279
						<h4 class="alert-heading">Information : courriel introuvable</h4>
280
						<p>
280
						<p>
281
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
281
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
282
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
282
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
283
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
283
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
284
							il sera nécessaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
284
							il sera nécessaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
285
						</p>
285
						</p>
286
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
286
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
287
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
287
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
288
						<h4 class="alert-heading">Information sur Google Maps</h4>
288
						<h4 class="alert-heading">Information sur Google Maps</h4>
289
						<div class="contenu"></div>
289
						<div class="contenu"></div>
290
					</div>
290
					</div>
291
				</div>
291
				</div>
292
			</div>
292
			</div>
293
			
293
			
294
			
294
			
295
			
295
			
296
			
296
			
297
			
297
			
298
 
298
 
299
			<div class="well well-lg">
299
			<div class="well well-lg">
300
				<div class="row">
300
				<div class="row">
301
					<div class="col-md-12">
301
					<div class="col-md-12">
302
						<h2>Lieu du relevé</h2>
302
						<h2>Lieu du relevé</h2>
303
					</div>
303
					</div>
304
				</div>
304
				</div>
305
				<div class="row">
305
				<div class="row">
306
					<div class="col-md-6">
306
					<div class="col-md-6">
307
						<div class="row">
307
						<div class="row">
308
							<div class="col-md-3">
308
							<div class="col-md-3">
309
								<strong title="Veuillez localiser l'observation">Géolocalisation</strong>
309
								<strong title="Veuillez localiser l'observation">Géolocalisation</strong>
310
							</div>
310
							</div>
311
							<div class="col-md-9 text-right">
311
							<div class="col-md-9 text-right">
312
								<form id="form-carte-recherche" class="form-horizontal" role="form">
312
								<form id="form-carte-recherche" class="form-horizontal" role="form">
313
									<div class="form-group">
313
									<div class="form-group">
314
										<label for="carte-recherche" class="sr-only">Rechercher</label>
314
										<label for="carte-recherche" class="sr-only">Rechercher</label>
315
										<div class="col-md-12">
315
										<div class="col-md-12">
316
											<div class="input-group">
316
											<div class="input-group">
317
												<input id="carte-recherche" class="form-control has-tooltip" type="search" value=""
317
												<input id="carte-recherche" class="form-control has-tooltip" type="search" value=""
318
														title="Permet de centrer la carte sur le lieu recherché."
318
														title="Permet de centrer la carte sur le lieu recherché."
319
														placeholder="Centrer la carte sur un lieu..."/>
319
														placeholder="Centrer la carte sur un lieu..."/>
320
												<span class="input-group-addon"><span class="glyphicon glyphicon-search"></span></span>
320
												<span class="input-group-addon"><span class="glyphicon glyphicon-search"></span></span>
321
											</div>
321
											</div>
322
										</div>
322
										</div>
323
									</div>
323
									</div>
324
								</form>
324
								</form>
325
							</div>
325
							</div>
326
						</div>
326
						</div>
327
						<div class="row">
327
						<div class="row">
328
							<div class="col-md-12">
328
							<div class="col-md-12">
329
								<div id="map-canvas" class="has-tooltip"
329
								<div id="map-canvas" class="has-tooltip"
330
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
330
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
331
										représentant votre station ou bien le glisser-déposer sur
331
										représentant votre station ou bien le glisser-déposer sur
332
										le lieu souhaité."></div>
332
										le lieu souhaité."></div>
333
							</div>
333
							</div>
334
						</div>
334
						</div>
335
						<div class="row">
335
						<div class="row">
336
							<div id="info-altitude" class="col-md-5">
336
							<div id="info-altitude" class="col-md-5">
337
								<span>Altitude : </span>
337
								<span>Altitude : </span>
338
								<span id="marqueur-altitude"><span id="altitude"></span> m</span>
338
								<span id="marqueur-altitude"><span id="altitude"></span> m</span>
339
							</div>
339
							</div>
340
 
340
 
341
							<div id="info-commune" class="col-md-7">
341
							<div id="info-commune" class="col-md-7">
342
								<span>Commune : </span>
342
								<span>Commune : </span>
343
								<span id="marqueur-commune">
343
								<span id="marqueur-commune">
344
									<span id="commune-nom" class="commune-info"></span>
344
									<span id="commune-nom" class="commune-info"></span>
345
									(<span id="commune-code-insee" class="commune-info has-tooltip"
345
									(<span id="commune-code-insee" class="commune-info has-tooltip"
346
										title="Code INSEE de la commune"></span>)
346
										title="Code INSEE de la commune"></span>)
347
								</span>
347
								</span>
348
							</div>
348
							</div>
349
						</div>
349
						</div>
350
					</div>
350
					</div>
351
					<div class="col-md-6">
351
					<div class="col-md-6">
352
						<form id="form-station" class="form-horizontal" role="form" autocomplete="on">
352
						<form id="form-station" class="form-horizontal" role="form" autocomplete="on">
353
							<div class="form-group has-tooltip"
353
							<div class="form-group has-tooltip"
354
									title="Vous pouvez cliquer sur l'icône de calendrier pour
354
									title="Vous pouvez cliquer sur l'icône de calendrier pour
355
										sélectionner une date dans un calendrier.">
355
										sélectionner une date dans un calendrier.">
356
								<label for="date" class=" col-sm-4 control-label"
356
								<label for="date" class=" col-sm-4 control-label"
357
									   title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
357
									   title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
358
									<strong class="obligatoire">*</strong>
358
									<strong class="obligatoire">*</strong>
359
									Date du relevé
359
									Date du relevé
360
								</label>
360
								</label>
361
								<div class="col-sm-8">
361
								<div class="col-sm-8">
362
									<div class="input-group">
362
									<div class="input-group">
363
										<span id="date-icone" class="input-group-addon add-on"></span>
363
										<span id="date-icone" class="input-group-addon add-on"></span>
364
										<input id="date" name="date" class="form-control" type="text" placeholder="jj/mm/aaaa" />
364
										<input id="date" name="date" class="form-control" type="text" placeholder="jj/mm/aaaa" />
365
									</div>
365
									</div>
366
								</div>
366
								</div>
367
							</div>
367
							</div>
368
 
368
 
369
							
369
							
370
							<div class="row">
370
							<div class="row">
371
								<div class="col-md-12">
371
								<div class="col-md-12">
372
									<button class="afficher-coord btn-coord btn btn-default"
372
									<button class="afficher-coord btn-coord btn btn-default"
373
											data-toggle-text="Cacher les coordonnées (WGS 84 et Lambert 93)">
373
											data-toggle-text="Cacher les coordonnées (WGS 84 et Lambert 93)">
374
										Afficher les coordonnées (WGS 84 et Lambert 93)
374
										Afficher les coordonnées (WGS 84 et Lambert 93)
375
									</button>
375
									</button>
376
									<div id="coordonnees-geo" class="well hidden">
376
									<div id="coordonnees-geo" class="well hidden">
377
										<div class="row">
377
										<div class="row">
378
											<div class="col-md-4">
378
											<div class="col-md-4">
379
												<div id="coord-lat" class="form-group form-group-sm">
379
												<div id="coord-lat" class="form-group form-group-sm">
380
													<label for="latitude" class="col-sm-4 control-label">Latitude</label>
380
													<label for="latitude" class="col-sm-4 control-label">Latitude</label>
381
													<div class="col-sm-8">
381
													<div class="col-sm-8">
382
														<input id="latitude" class="form-control" name="latitude" type="text"
382
														<input id="latitude" class="form-control" name="latitude" type="text"
383
															title="Latitude (WGS 84)" value=""/>
383
															title="Latitude (WGS 84)" value=""/>
384
													</div>
384
													</div>
385
												</div>
385
												</div>
386
											</div>
386
											</div>
387
											<div class="col-md-5">
387
											<div class="col-md-5">
388
												<div id="coord-lng" class="form-group form-group-sm">
388
												<div id="coord-lng" class="form-group form-group-sm">
389
													<label for="latitude" class="col-sm-4 control-label">Longitude</label>
389
													<label for="latitude" class="col-sm-4 control-label">Longitude</label>
390
													<div class="col-sm-8">
390
													<div class="col-sm-8">
391
														<input id="longitude" class="form-control" name="longitude" type="text"
391
														<input id="longitude" class="form-control" name="longitude" type="text"
392
															title="Longitude (WGS 84)" value=""/>
392
															title="Longitude (WGS 84)" value=""/>
393
													</div>
393
													</div>
394
												</div>
394
												</div>
395
											</div>
395
											</div>
396
											<div class="col-md-2">
396
											<div class="col-md-2">
397
												<div id="coord-lng" class="form-group form-group-sm">
397
												<div id="coord-lng" class="form-group form-group-sm">
398
													<input type="button" id="geolocaliser"
398
													<input type="button" id="geolocaliser"
399
														class="btn btn-default btn-sm has-tooltip"
399
														class="btn btn-default btn-sm has-tooltip"
400
														title="Centre la carte sur les coordonnées de latitude et longitude saisies."
400
														title="Centre la carte sur les coordonnées de latitude et longitude saisies."
401
														value="Voir sur la carte"/>
401
														value="Voir sur la carte"/>
402
												</div>
402
												</div>
403
											</div>
403
											</div>
404
										</div>
404
										</div>
405
 
405
 
406
										<div class="row">
406
										<div class="row">
407
											<div class="col-md-6">
407
											<div class="col-md-6">
408
												<div id="coord-l93-x" class="form-group">
408
												<div id="coord-l93-x" class="form-group">
409
													<label for="l93-x" class="col-sm-6 control-label">X Lambert 93</label>
409
													<label for="l93-x" class="col-sm-6 control-label">X Lambert 93</label>
410
													<div class="col-sm-5">
410
													<div class="col-sm-5">
411
														<input id="l93-x" disabled type="text" class="input-sm form-control obs-chp-etendu"
411
														<input id="l93-x" disabled type="text" class="input-sm form-control obs-chp-etendu"
412
																name="coordonneeLambert93X"
412
																name="coordonneeLambert93X"
413
																data-label="Lambert 93 X"
413
																data-label="Lambert 93 X"
414
																value=""/>
414
																value=""/>
415
													</div>
415
													</div>
416
												</div>
416
												</div>
417
											</div>
417
											</div>
418
											<div class="col-md-6">
418
											<div class="col-md-6">
419
												<div id="coord-l93-y" class="form-group">
419
												<div id="coord-l93-y" class="form-group">
420
													<label for="l93-y" class="col-sm-6 control-label">Y Lambert 93</label>
420
													<label for="l93-y" class="col-sm-6 control-label">Y Lambert 93</label>
421
													<div class="col-sm-5">
421
													<div class="col-sm-5">
422
														<input id="l93-y" disabled type="text" class="input-sm form-control obs-chp-etendu"
422
														<input id="l93-y" disabled type="text" class="input-sm form-control obs-chp-etendu"
423
																name="coordonneeLambert93Y"
423
																name="coordonneeLambert93Y"
424
																data-label="Lambert 93 Y"
424
																data-label="Lambert 93 Y"
425
																value=""/>
425
																value=""/>
426
													</div>
426
													</div>
427
												</div>
427
												</div>
428
											</div>
428
											</div>
429
										</div>
429
										</div>
430
									</div>
430
									</div>
431
								</div>
431
								</div>
432
							</div>
432
							</div>
433
						</form>
433
						</form>
434
					</div>
434
					</div>
435
				</div>
435
				</div>
436
 
436
 
437
				<div class="row">
437
				<div class="row">
438
					<div class="col-md-6">
438
					<div class="col-md-6">
439
						<form id="form-obs" class="form-horizontal" role="form" autocomplete="on">
439
						<form id="form-obs" class="form-horizontal" role="form" autocomplete="on">
440
							<h2>Données biologiques</h2>
440
							<h2>Données biologiques</h2>
441
							
441
							
442
							<input id="referentiel" type="hidden" value="bdtfx" />
442
							<input id="referentiel" type="hidden" value="bdtfx" />
443
							<div id="taxon-liste-input-groupe" class="form-group has-tooltip"
443
							<div id="taxon-liste-input-groupe" class="form-group has-tooltip"
444
								title="Sélectionnez une espèce dans la liste déroulante par son nom latin
444
								title="Sélectionnez une espèce dans la liste déroulante par son nom latin
445
								ou commun. Si une espèce est absente, sélectionnez «Autre espèce»." >
445
								ou commun. Si une espèce est absente, sélectionnez «Autre espèce»." >
446
								<label for="taxon-liste" class="col-sm-4 control-label" title="Choisissez l'espèce rencontrée.">
446
								<label for="taxon-liste" class="col-sm-4 control-label" title="Choisissez l'espèce rencontrée.">
447
									<strong class="obligatoire">*</strong>
447
									<strong class="obligatoire">*</strong>
448
									Espèce
448
									Espèce
449
								</label>
449
								</label>
450
								<div class="col-sm-8">
450
								<div class="col-sm-8">
451
									<div class="input-group">
451
									<div class="input-group">
452
										<select id="taxon-liste" name="taxon-liste" class="form-control">
452
										<select id="taxon-liste" name="taxon-liste" class="form-control">
453
											<option value="" selected>Sélectionner une espèce</option>
453
											<option value="" selected>Sélectionner une espèce</option>
454
 
454
 
455
											<optgroup id="taxon-liste-noms">
455
											<optgroup id="taxon-liste-noms">
456
												<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
456
												<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
457
													<option
457
													<option
458
														class="<?=$taxon['nom_type'] ?>"
458
														class="<?=$taxon['nom_type'] ?>"
459
														value="<?=$taxon['num_nom'] ?>"
459
														value="<?=$taxon['num_nom'] ?>"
460
														title="<?=$taxon['nom_title'] ?>"
460
														title="<?=$taxon['nom_title'] ?>"
461
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
461
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
462
														>
462
														>
463
														<?=$taxon['nom_a_afficher']?>
463
														<?=$taxon['nom_a_afficher']?>
464
													</option>
464
													</option>
465
												<?php endforeach; ?>
465
												<?php endforeach; ?>
466
											</optgroup>
466
											</optgroup>
467
											<optgroup id="taxon-liste-special">
467
											<optgroup id="taxon-liste-special">
468
												<?php foreach ($taxons['speciaux'] as $taxon) :?>
468
												<?php foreach ($taxons['speciaux'] as $taxon) :?>
469
													<option
469
													<option
470
														class="<?=$taxon['nom_type'] ?>"
470
														class="<?=$taxon['nom_type'] ?>"
471
														value="<?=$taxon['num_nom'] ?>"
471
														value="<?=$taxon['num_nom'] ?>"
472
														title="<?=$taxon['nom_title'] ?>"
472
														title="<?=$taxon['nom_title'] ?>"
473
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
473
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
474
														>
474
														>
475
														<?=$taxon['nom_a_afficher']?>
475
														<?=$taxon['nom_a_afficher']?>
476
													</option>
476
													</option>
477
												<?php endforeach; ?>
477
												<?php endforeach; ?>
478
												<option value="?">Autre espèce</option>
478
												<option value="?">Autre espèce</option>
479
											</optgroup>
479
											</optgroup>
480
										</select>
480
										</select>
481
									</div>
481
									</div>
482
								</div>
482
								</div>
483
							</div>
483
							</div>
484
 
484
 
485
							<div id="taxon-input-groupe" class="form-group has-tooltip hidden"
485
							<div id="taxon-input-groupe" class="form-group has-tooltip hidden"
486
								title="Vous pouvez saisir ici un nom absent du référentiel (Ex. : 'fleur violette' ou 'Viola sp.1')." >
486
								title="Vous pouvez saisir ici un nom absent du référentiel (Ex. : 'fleur violette' ou 'Viola sp.1')." >
487
								<label for="taxon" class="col-sm-4 control-label" title="Choisissez l'espèce rencontrée.">
487
								<label for="taxon" class="col-sm-4 control-label" title="Choisissez l'espèce rencontrée.">
488
									<strong class="obligatoire">*</strong>
488
									<strong class="obligatoire">*</strong>
489
									Autre espèce
489
									Autre espèce
490
								</label>
490
								</label>
491
								<div class="col-sm-8">
491
								<div class="col-sm-8">
492
									<input id="taxon" name="taxon" type="text" class="form-control"
492
									<input id="taxon" name="taxon" type="text" class="form-control"
493
										placeholder="Autre espèce (ou indication sur la plante)"
493
										placeholder="Autre espèce (ou indication sur la plante)"
494
										value="<?= $nom_sci_espece_defaut; ?>" />
494
										value="<?= $nom_sci_espece_defaut; ?>" />
495
								</div>
495
								</div>
496
							</div>
496
							</div>
497
 
497
 
498
							<div class="form-group has-tooltip"
498
							<div class="form-group has-tooltip"
499
									title="Êtes-vous sûre de l’identification de l’espèce ?">
499
									title="Êtes-vous sûre de l’identification de l’espèce ?">
500
								<label for="certitude" class="col-sm-4 control-label">
500
								<label for="certitude" class="col-sm-4 control-label">
501
									<strong class="obligatoire">*</strong>
501
									<strong class="obligatoire">*</strong>
502
									Identification de l'espèce
502
									Identification de l'espèce
503
								</label>
503
								</label>
504
								<div class="col-sm-8">
504
								<div class="col-sm-8">
505
									<select id="certitude" class="form-control" name="certitude">
505
									<select id="certitude" class="form-control" name="certitude">
506
										<option selected value="">Sélectionner une certitude</option>
506
										<option selected value="">Sélectionner une certitude</option>
507
										<option value="Certaine">Oui</option>
507
										<option value="Certaine">Oui</option>
508
										<option value="Douteuse">À confirmer</option>
508
										<option value="Douteuse">À confirmer</option>
509
									</select>
509
									</select>
510
								</div>
510
								</div>
511
							</div>
511
							</div>
512
 
512
 
513
 
513
 
514
							<div class="form-group has-tooltip"
514
							<div class="form-group has-tooltip"
515
									title="Indiquez la classe de circonférence de l'arbre à 1,30m du sol.">
515
									title="Indiquez la classe de circonférence de l'arbre à 1,30m du sol.">
516
								<label for="circonference" class="col-sm-4 control-label">
516
								<label for="circonference" class="col-sm-4 control-label">
517
									<strong class="obligatoire">*</strong>
517
									<strong class="obligatoire">*</strong>
518
									Circonférence
518
									Circonférence
519
								</label>
519
								</label>
520
								<div class="col-sm-8">
520
								<div class="col-sm-8">
521
									<select id="circonference" class="form-control obs-chp-etendu"
521
									<select id="circonference" class="form-control obs-chp-etendu"
522
											name="arbreRemarquableClasseCirconference"
522
											name="arbreRemarquableClasseCirconference"
523
											data-label="Classe de circonférence à 1,30 m du sol (en m)">
523
											data-label="Classe de circonférence à 1,30 m du sol (en m)">
524
										<option selected value="">Sélectionner la circonférence (à 1,30m du sol)</option>
524
										<option selected value="">Sélectionner la circonférence (à 1,30m du sol)</option>
525
										<option value="Inférieure à 1 mètre">Inférieure à 1 mètre</option>
525
										<option value="Inférieure à 1 mètre">Inférieure à 1 mètre</option>
526
										<option value="Entre 1 et 2 mètres">Entre 1 et 2 mètres</option>
526
										<option value="Entre 1 et 2 mètres">Entre 1 et 2 mètres</option>
527
										<option value="Entre 2 et 3 mètres">Entre 2 et 3 mètres</option>
527
										<option value="Entre 2 et 3 mètres">Entre 2 et 3 mètres</option>
528
										<option value="Supérieure à 3m">Supérieure à 3m</option>
528
										<option value="Supérieure à 3m">Supérieure à 3m</option>
529
										<option value="Je ne sais pas">Je ne sais pas</option>
529
										<option value="Je ne sais pas">Je ne sais pas</option>
530
									</select>
530
									</select>
531
								</div>
531
								</div>
532
							</div>
532
							</div>
533
							
533
							
534
							<div class="form-group has-tooltip"
534
							<div class="form-group has-tooltip"
535
									title="Circonférence précise (si mesurée) à 1,30 m du sol (en mètre) ">
535
									title="Circonférence précise (si mesurée) à 1,30 m du sol (en mètre) ">
536
								<label for="circonferencer" class="col-sm-4 control-label">
536
								<label for="circonferencer" class="col-sm-4 control-label">
537
									Circonférence précise (si mesurée) à 1,30 m du sol (m) 
537
									Circonférence précise (si mesurée) à 1,30 m du sol (m) 
538
								</label>
538
								</label>
539
								<div class="col-sm-8">
539
								<div class="col-sm-8">
540
									<input id="circonferencer" type="number" step="0.01" min="0" class="form-control obs-chp-etendu"
540
									<input id="circonferencer" type="number" step="0.01" min="0" class="form-control obs-chp-etendu"
541
											name="arbreRemarquableCirconference"
541
											name="arbreRemarquableCirconference"
542
											data-label="Circonférence précise"
542
											data-label="Circonférence précise"
543
											value="" />
543
											value="" />
544
								</div>
544
								</div>
545
							</div>
545
							</div>
546
 
546
 
547
							<div class="form-group has-tooltip"
547
							<div class="form-group has-tooltip"
548
									title="Indiquez la hauteur.">
548
									title="Indiquez la hauteur.">
549
								<label for="hauteur" class="col-sm-4 control-label">
549
								<label for="hauteur" class="col-sm-4 control-label">
550
									Hauteur (m)
550
									Hauteur (m)
551
								</label>
551
								</label>
552
								<div class="col-sm-8 input-group" id="hauteur">
552
								<div class="col-sm-8 input-group" id="hauteur">
553
									<span class="col-sm-4">
553
									<span class="col-sm-4">
554
										<input id="hauteurNbr" type="number" step="0.01" min="0" class="form-control obs-chp-etendu"
554
										<input id="hauteurNbr" type="number" step="0.01" min="0" class="form-control obs-chp-etendu"
555
											name="arbreRemarquableHauteur"
555
											name="arbreRemarquableHauteur"
556
											data-label="Hauteur de l'arbre"
556
											data-label="Hauteur de l'arbre"
557
											value="" />
557
											value="" />
558
									</span>
558
									</span>
559
									<div class="col-sm-8">
559
									<div class="col-sm-8">
560
										<select id="hauteurPrec" class="form-control obs-chp-etendu "
560
										<select id="hauteurPrec" class="form-control obs-chp-etendu "
561
												name="arbreRemarquableHauteurPrecision">
561
												name="arbreRemarquableHauteurPrecision">
562
											<option selected value="">Préciser le mode d'évaluation</option>
562
											<option selected value="">Préciser le mode d'évaluation</option>
563
											<option value="Évaluée">Évaluée</option>
563
											<option value="Évaluée">Évaluée</option>
564
											<option value="Mesurée">Mesurée</option>
564
											<option value="Mesurée">Mesurée</option>
565
										</select>
565
										</select>
566
									</div>
566
									</div>
567
								</div>
567
								</div>
568
							</div>
568
							</div>
569
							
569
							
570
							<div class="form-group has-tooltip"
570
							<div class="form-group has-tooltip"
571
									title="Indiquez l'âge.">
571
									title="Indiquez l'âge.">
572
								<label for="age" class="col-sm-4 control-label">
572
								<label for="age" class="col-sm-4 control-label">
573
									Âge
573
									Âge
574
								</label>
574
								</label>
575
								<div class="col-sm-8">
575
								<div class="col-sm-8">
576
									<div class="input-group">
576
									<div class="input-group">
577
										<select id="age" class="form-control obs-chp-etendu col-sm-6"
577
										<select id="age" class="form-control obs-chp-etendu col-sm-6"
578
												name="arbreRemarquableAge"
578
												name="arbreRemarquableAge"
579
												data-label="Age">
579
												data-label="Age">
580
											<option selected value="">Sélectionner l'âge</option>
580
											<option selected value="">Sélectionner l'âge</option>
581
											<option value="Très vieux">Très vieux</option>
581
											<option value="Très vieux">Très vieux</option>
582
											<option value="Vieux">Vieux</option>
582
											<option value="Vieux">Vieux</option>
583
											<option value="Adulte">Adulte</option>
583
											<option value="Adulte">Adulte</option>
584
										</select>
584
										</select>
585
										<div class="input-group-btn">
585
										<div class="input-group-btn">
586
											<button class="btn btn-default" type="button" data-toggle="modal" data-target="#age-description">
586
											<button class="btn btn-default" type="button" data-toggle="modal" data-target="#age-description">
587
												<span class="glyphicon glyphicon-info-sign"></span> Aide
587
												<span class="glyphicon glyphicon-info-sign"></span> Aide
588
											</button>
588
											</button>
589
										</div>
589
										</div>
590
									</div>
590
									</div>
591
								</div>
591
								</div>
592
							</div>
592
							</div>
593
							
593
							
594
							<div class="form-group has-tooltip" title="Indiquez la santé de l'arbre.">
594
							<div class="form-group has-tooltip" title="Indiquez la santé de l'arbre.">
595
								<label for="sante" class="col-sm-4 control-label">
595
								<label for="sante" class="col-sm-4 control-label">
596
									<strong class="obligatoire">*</strong>
596
									<strong class="obligatoire">*</strong>
597
									Santé
597
									Santé
598
								</label>
598
								</label>
599
								<div class="col-sm-8">
599
								<div class="col-sm-8">
600
									<div class="input-group">
600
									<div class="input-group">
601
										<select id="sante" class="form-control obs-chp-etendu col-sm-6"
601
										<select id="sante" class="form-control obs-chp-etendu col-sm-6"
602
												name="arbreRemarquableSante"
602
												name="arbreRemarquableSante"
603
												data-label="sante">
603
												data-label="sante">
604
											<option selected value="">Sélectionner l'état de santé</option>
604
											<option selected value="">Sélectionner l'état de santé</option>
605
											<option value="En très bonne santé">En très bonne santé</option>
605
											<option value="En très bonne santé">En très bonne santé</option>
606
											<option value="En bonne santé">En bonne santé</option>
606
											<option value="En bonne santé">En bonne santé</option>
607
											<option value="État moyen">État moyen</option>
607
											<option value="État moyen">État moyen</option>
608
											<option value="Fin de vie">Fin de vie</option>
608
											<option value="Fin de vie">Fin de vie</option>
609
										</select>
609
										</select>
610
										<div class="input-group-btn">
610
										<div class="input-group-btn">
611
											<button class="btn btn-default" type="button" data-toggle="modal" data-target="#sante-description">
611
											<button class="btn btn-default" type="button" data-toggle="modal" data-target="#sante-description">
612
												<span class="glyphicon glyphicon-info-sign"></span> Aide
612
												<span class="glyphicon glyphicon-info-sign"></span> Aide
613
											</button>
613
											</button>
614
										</div>
614
										</div>
615
									</div>
615
									</div>
616
								</div>
616
								</div>
617
							</div>
617
							</div>
618
 
618
 
619
							<div class="form-group has-tooltip"
619
							<div class="form-group has-tooltip"
620
									title="Indiquez si des cavités sont présentes sur l'arbre.">
620
									title="Indiquez si des cavités sont présentes sur l'arbre.">
621
								<label for="cavites" class="col-sm-4 control-label">
621
								<label for="cavites" class="col-sm-4 control-label">
622
									<strong class="obligatoire">*</strong>
622
									<strong class="obligatoire">*</strong>
623
									Cavités
623
									Cavités
624
								</label>
624
								</label>
625
								<div class="col-sm-8">
625
								<div class="col-sm-8">
626
									<select id="cavites" class="form-control obs-chp-etendu"
626
									<select id="cavites" class="form-control obs-chp-etendu"
627
											name="arbreRemarquablePresenceCavite"
627
											name="arbreRemarquablePresenceCavite"
628
											data-label="Présence de cavités">
628
											data-label="Présence de cavités">
629
										<option selected value="">Sélectionner la présence de cavités</option>
629
										<option selected value="">Sélectionner la présence de cavités</option>
630
										<option value="Absence">Absence</option>
630
										<option value="Absence">Absence</option>
631
										<option value="Présence de cavités">Présence de cavités</option>
631
										<option value="Présence de cavités">Présence de cavités</option>
632
										<option value="Je ne sais pas">Je ne sais pas</option>
632
										<option value="Je ne sais pas">Je ne sais pas</option>
633
									</select>
633
									</select>
634
								</div>
634
								</div>
635
							</div>
635
							</div>
636
						</form>
636
						</form>
637
						<form id="form-situation" class="form-horizontal" role="form" autocomplete="on">
637
						<form id="form-situation" class="form-horizontal" role="form" autocomplete="on">
638
							<div class="form-group has-tooltip"
638
							<div class="form-group has-tooltip"
639
									title="Indiquez la situation de l'arbre remarquable.">
639
									title="Indiquez la situation de l'arbre remarquable.">
640
								<label for="situation" class="col-sm-4 control-label">
640
								<label for="situation" class="col-sm-4 control-label">
641
									<strong class="obligatoire">*</strong>
641
									<strong class="obligatoire">*</strong>
642
									Contexte, situation :
642
									Contexte, situation :
643
								</label>
643
								</label>
644
								<div id="situation-controls" class="col-sm-8">
644
								<div id="situation-controls" class="col-sm-8">
645
									<div class="btn-group dropdown">
645
									<div class="btn-group dropdown">
646
										<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
646
										<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
647
											Sélectionner une ou plusieurs situations
647
											Sélectionner une ou plusieurs situations
648
											<span class="caret"></span>
648
											<span class="caret"></span>
649
										</button>
649
										</button>
650
									
650
									
651
										<ul class="dropdown-menu col-sm-12" role="menu" aria-labelledby="dLabel">
651
										<ul class="dropdown-menu col-sm-12" role="menu" aria-labelledby="dLabel">
652
											<li class="checkbox" role="presentation">
652
											<li class="checkbox" role="presentation">
653
												<a role="menuitem">
653
												<a role="menuitem">
654
													<label>
654
													<label>
655
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre isolé"/>
655
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre isolé"/>
656
														Arbre isolé
656
														Arbre isolé
657
													</label>
657
													</label>
658
												</a>
658
												</a>
659
											</li>
659
											</li>
660
											<li class="checkbox" role="presentation">
660
											<li class="checkbox" role="presentation">
661
												<a role="menuitem">
661
												<a role="menuitem">
662
													<label>
662
													<label>
663
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre dans l'espace public"/>
663
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre dans l'espace public"/>
664
														Arbre dans l'espace public
664
														Arbre dans l'espace public
665
													</label>
665
													</label>
666
												</a>
666
												</a>
667
											</li>
667
											</li>
668
											<li class="checkbox" role="presentation">
668
											<li class="checkbox" role="presentation">
669
												<a role="menuitem">
669
												<a role="menuitem">
670
													<label>
670
													<label>
671
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre dans un jardin privé"/>
671
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre dans un jardin privé"/>
672
														Arbre dans un jardin privé
672
														Arbre dans un jardin privé
673
													</label>
673
													</label>
674
												</a>
674
												</a>
675
											</li>
675
											</li>
676
											<li class="checkbox" role="presentation">
676
											<li class="checkbox" role="presentation">
677
												<a role="menuitem">
677
												<a role="menuitem">
678
													<label>
678
													<label>
679
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre en forêt"/>
679
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre en forêt"/>
680
														Arbre en forêt
680
														Arbre en forêt
681
													</label>
681
													</label>
682
												</a>
682
												</a>
683
											</li>
683
											</li>
684
											<li class="checkbox" role="presentation">
684
											<li class="checkbox" role="presentation">
685
												<a role="menuitem">
685
												<a role="menuitem">
686
													<label>
686
													<label>
687
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre en espace agricole (champ, haie...)"/>
687
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre en espace agricole (champ, haie...)"/>
688
														Arbre en espace agricole (champ, haie...)
688
														Arbre en espace agricole (champ, haie...)
689
													</label>
689
													</label>
690
												</a>
690
												</a>
691
											</li>
691
											</li>
692
											<li class="checkbox" role="presentation">
692
											<li class="checkbox" role="presentation">
693
												<a role="menuitem">
693
												<a role="menuitem">
694
													<label>
694
													<label>
695
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre en falaise, terrain escarpé"/>
695
														<input name="situation-ch" class="cb-situation" type="checkbox" value="Arbre en falaise, terrain escarpé"/>
696
														Arbre en falaise, terrain escarpé
696
														Arbre en falaise, terrain escarpé
697
													</label>
697
													</label>
698
												</a>
698
												</a>
699
											</li>
699
											</li>
700
											<li class="checkbox" role="presentation">
700
											<li class="checkbox" role="presentation">
701
												<a role="menuitem">
701
												<a role="menuitem">
702
													<label>
702
													<label>
703
														<input id="situation-autre" name="situation-ch" class="cb-situation" type="checkbox" value="Autre"/>
703
														<input id="situation-autre" name="situation-ch" class="cb-situation" type="checkbox" value="Autre"/>
704
														Autre
704
														Autre
705
													</label>
705
													</label>
706
												</a>
706
												</a>
707
											</li>
707
											</li>
708
										</ul>
708
										</ul>
709
									</div>
709
									</div>
710
								</div>
710
								</div>
711
							</div>
711
							</div>
712
 
712
 
713
							<div id="autre-situation-id" class="form-group has-tooltip hidden" >
713
							<div id="autre-situation-id" class="form-group has-tooltip hidden" >
714
								<label for="autre-situation" class="col-sm-4 control-label">
714
								<label for="autre-situation" class="col-sm-4 control-label">
715
									Autre :
715
									Autre :
716
								</label>
716
								</label>
717
								<div class="col-sm-4">
717
								<div class="col-sm-4">
718
									<input id="autre-situation" type="text" class="form-control"
718
									<input id="autre-situation" type="text" class="form-control"
719
										name="arbreRemarquableSituationAutre"
719
										name="arbreRemarquableSituationAutre"
720
										data-label=""
720
										data-label=""
721
										value="" />
721
										value="" />
722
								</div>
722
								</div>
723
							</div>
723
							</div>
724
							<div class="row">
724
							<div class="row">
725
								<div class="col-md-12">
725
								<div class="col-md-12">
726
									<h2 class="input-group">Notes<span class="input-group-btn">
726
									<h2 class="input-group">Notes<span class="input-group-btn">
727
											<button class="btn btn-default" type="button" data-toggle="modal" data-target="#notes-description">
727
											<button class="btn btn-default" type="button" data-toggle="modal" data-target="#notes-description">
728
												<span class="glyphicon glyphicon-info-sign"></span> Aide
728
												<span class="glyphicon glyphicon-info-sign"></span> Aide
729
											</button>
729
											</button>
730
										</span></h2>
730
										</span></h2>
731
									<textarea id="notes" form="form-obs" class="form-control col-md-12" rows="7" name="notes"
731
									<textarea id="notes" form="form-obs" class="form-control col-md-12" rows="7" name="notes"
732
										placeholder="Observation d’espèces de faune ou de flore (notamment épiphytes), ressources potentielles pour la biodiversité."></textarea>
732
										placeholder="Observation d’espèces de faune ou de flore (notamment épiphytes), ressources potentielles pour la biodiversité."></textarea>
733
								</div>
733
								</div>
734
							</div>
734
							</div>
735
						</form>
735
						</form>
736
					</div>
736
					</div>
737
					
737
					
738
					
738
					
739
					
739
					
740
					
740
					
741
 
741
 
742
					<div class="col-md-6">
742
					<div class="col-md-6">
743
						<form id="form-criteres" class="form-horizontal" role="form" autocomplete="on">
743
						<form id="form-criteres" class="form-horizontal" role="form" autocomplete="on">
744
							<h2>Critères ressentis</h2>
744
							<h2>Critères ressentis</h2>
745
 
745
 
746
							<div class="form-group has-tooltip"
746
							<div class="form-group has-tooltip"
747
									title="Indiquez la situation de l'arbre remarquable.">
747
									title="Indiquez la situation de l'arbre remarquable.">
748
								<label for="esthetique-ch" class="col-sm-4 control-label">
748
								<label for="esthetique-ch" class="col-sm-4 control-label">
749
									Intérêt esthétique
749
									Intérêt esthétique
750
								</label>
750
								</label>
751
								<div id="situation-controls" class="col-sm-8">
751
								<div id="situation-controls" class="col-sm-8">
752
									<div class="btn-group dropdown">
752
									<div class="btn-group dropdown">
753
										<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
753
										<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
754
											Sélectionner le(s) type(s) d'intérêt esthétique
754
											Sélectionner le(s) type(s) d'intérêt esthétique
755
											<span class="caret"></span>
755
											<span class="caret"></span>
756
										</button>
756
										</button>
757
									
757
									
758
										<ul class="dropdown-menu col-sm-12" role="menu" aria-labelledby="dLabel">
758
										<ul class="dropdown-menu col-sm-12" role="menu" aria-labelledby="dLabel">
759
											<li class="checkbox" role="presentation">
759
											<li class="checkbox" role="presentation">
760
												<a role="menuitem">
760
												<a role="menuitem">
761
													<label>
761
													<label>
762
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Forme humaine ou animale"/>
762
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Forme humaine ou animale"/>
763
														Forme humaine ou animale
763
														Forme humaine ou animale
764
													</label>
764
													</label>
765
												</a>
765
												</a>
766
											</li>
766
											</li>
767
											<li class="checkbox" role="presentation">
767
											<li class="checkbox" role="presentation">
768
												<a role="menuitem">
768
												<a role="menuitem">
769
													<label>
769
													<label>
770
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Arbre têtard"/>
770
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Arbre têtard"/>
771
														Arbre têtard
771
														Arbre têtard
772
													</label>
772
													</label>
773
												</a>
773
												</a>
774
											</li>
774
											</li>
775
											<li class="checkbox" role="presentation">
775
											<li class="checkbox" role="presentation">
776
												<a role="menuitem">
776
												<a role="menuitem">
777
													<label>
777
													<label>
778
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Forme d’abri ou de voûte"/>
778
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Forme d’abri ou de voûte"/>
779
														Forme d’abri ou de voûte
779
														Forme d’abri ou de voûte
780
													</label>
780
													</label>
781
												</a>
781
												</a>
782
											</li>
782
											</li>
783
											<li class="checkbox" role="presentation">
783
											<li class="checkbox" role="presentation">
784
												<a role="menuitem">
784
												<a role="menuitem">
785
													<label>
785
													<label>
786
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Aspect enlacé, soudé"/>
786
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Aspect enlacé, soudé"/>
787
														Aspect enlacé, soudé
787
														Aspect enlacé, soudé
788
													</label>
788
													</label>
789
												</a>
789
												</a>
790
											</li>
790
											</li>
791
											<li class="checkbox" role="presentation">
791
											<li class="checkbox" role="presentation">
792
												<a role="menuitem">
792
												<a role="menuitem">
793
													<label>
793
													<label>
794
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Aspect tortueux, tourmenté"/>
794
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Aspect tortueux, tourmenté"/>
795
														Aspect tortueux, tourmenté
795
														Aspect tortueux, tourmenté
796
													</label>
796
													</label>
797
												</a>
797
												</a>
798
											</li>
798
											</li>
799
											<li class="checkbox" role="presentation">
799
											<li class="checkbox" role="presentation">
800
												<a role="menuitem">
800
												<a role="menuitem">
801
													<label>
801
													<label>
802
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Port pleureur"/>
802
														<input name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Port pleureur"/>
803
														Port pleureur
803
														Port pleureur
804
													</label>
804
													</label>
805
												</a>
805
												</a>
806
											</li>
806
											</li>
807
											<li class="checkbox" role="presentation">
807
											<li class="checkbox" role="presentation">
808
												<a role="menuitem">
808
												<a role="menuitem">
809
													<label>
809
													<label>
810
														<input id="esthetique-autre" name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Autre"/>
810
														<input id="esthetique-autre" name="esthetique-ch" class="cb-esthetique" type="checkbox" value="Autre"/>
811
														Autre
811
														Autre
812
													</label>
812
													</label>
813
												</a>
813
												</a>
814
											</li>
814
											</li>
815
										</ul>
815
										</ul>
816
									</div>
816
									</div>
817
								</div>
817
								</div>
818
							</div>
818
							</div>
819
 
819
 
820
							<div id="autre-esthetique-id" class="form-group has-tooltip hidden" >
820
							<div id="autre-esthetique-id" class="form-group has-tooltip hidden" >
821
								<label for="autre-esthetique" class="col-sm-4 control-label">
821
								<label for="autre-esthetique" class="col-sm-4 control-label">
822
									Autre :
822
									Autre :
823
								</label>
823
								</label>
824
								<div class="col-sm-4">
824
								<div class="col-sm-4">
825
									<input id="autre-esthetique" type="text" class="form-control"
825
									<input id="autre-esthetique" type="text" class="form-control"
826
										name="arbreRemarquableEsthetique"
826
										name="arbreRemarquableEsthetique"
827
										data-label=""
827
										data-label=""
828
										value="" />
828
										value="" />
829
								</div>
829
								</div>
830
							</div>
830
							</div>
831
							
831
							
832
							
832
							
833
							<div class="form-group">
833
							<div class="form-group">
834
								<label for="historique" class="col-sm-4 control-label">
834
								<label for="historique" class="col-sm-4 control-label">
835
								L’arbre a-t-il un intérêt historique / patrimonial ?
835
								L’arbre a-t-il un intérêt historique / patrimonial ?
836
								</label>
836
								</label>
837
									<textarea id="historique" class="col-sm-7 obs-chp-etendu text-area" rows="2" name="arbreRemarquableHistorique"
837
									<textarea id="historique" class="col-sm-7 obs-chp-etendu text-area" rows="2" name="arbreRemarquableHistorique"
838
										placeholder="Laisser vide si inconnu."></textarea>
838
										placeholder="Laisser vide si inconnu."></textarea>
839
								
839
								
840
							</div>
840
							</div>
841
						</form>
841
						</form>
842
						<form id="form-remarquable" class="form-horizontal" role="form" autocomplete="on">
842
						<form id="form-remarquable" class="form-horizontal" role="form" autocomplete="on">
843
						<!-- Type remarquable -->
843
						<!-- Type remarquable -->
844
							<div class="row-fluid">
844
							<div class="row-fluid">
845
								<div class="form-group"> 
845
								<div class="form-group"> 
846
									<label class="col-sm-4 control-label pointer">
846
									<label class="col-sm-4 control-label pointer">
847
										<span class="has-tooltip pointer">
847
										<span class="has-tooltip pointer">
848
											<strong class="obligatoire">*Pourquoi cet individu vous semble-t-il remarquable ?</strong>
848
											<strong class="obligatoire">*Pourquoi cet individu vous semble-t-il remarquable ?</strong>
849
										</span>
849
										</span>
850
									</label>
850
									</label>
851
									<div class="col-sm-8 control-group">
851
									<div class="col-sm-8 control-group">
852
										<!-- Intérêt esthétique -->
852
										<!-- Intérêt esthétique -->
853
										<div class="input-group">
853
										<div class="input-group">
854
											<label for="remarquable-esthetique">
854
											<label for="remarquable-esthetique">
855
												<input type="checkbox" id="remarquable-esthetique" class="cb-remarquable" name="remarquable-ch" value="esthétique" data-titre="esthétique" />
855
												<input type="checkbox" id="remarquable-esthetique" class="cb-remarquable" name="remarquable-ch" value="esthétique" data-titre="esthétique" />
856
												Intérêt esthétique
856
												Intérêt esthétique
857
								
857
								
858
											</label>
858
											</label>
859
										</div>
859
										</div>
860
										<!-- Intérêt historique local -->
860
										<!-- Intérêt historique local -->
861
										<div class="input-group">
861
										<div class="input-group">
862
											<label for="remarquable-historique">
862
											<label for="remarquable-historique">
863
												<input type="checkbox" id="remarquable-historique" class="cb-remarquable" name="remarquable-ch" value="historique" data-titre="historique" />
863
												<input type="checkbox" id="remarquable-historique" class="cb-remarquable" name="remarquable-ch" value="historique" data-titre="historique" />
864
												Intérêt historique local
864
												Intérêt historique local
865
												
865
												
866
											</label>
866
											</label>
867
										</div>
867
										</div>
868
										<!-- Intérêt biologique, refuge de biodiversité -->
868
										<!-- Intérêt biologique, refuge de biodiversité -->
869
										<div class="input-group">
869
										<div class="input-group">
870
											<label for="remarquable-biologique">
870
											<label for="remarquable-biologique">
871
												<input type="checkbox" id="remarquable-biologique" class="cb-remarquable" name="remarquable-ch" value="biologique" data-titre="biologique" />
871
												<input type="checkbox" id="remarquable-biologique" class="cb-remarquable" name="remarquable-ch" value="biologique" data-titre="biologique" />
872
												Intérêt biologique, refuge de biodiversité
872
												Intérêt biologique, refuge de biodiversité
873
												<input class="has-tooltip hidden" type="text" id="remarquable-biologique-commentaire"
873
												<input class="has-tooltip hidden" type="text" id="remarquable-biologique-commentaire"
874
													placeholder="commentaire optionnel" 
874
													placeholder="commentaire optionnel" 
875
												/>
875
												/>
876
											</label>
876
											</label>
877
										</div>
877
										</div>
878
										<!-- Grand âge -->
878
										<!-- Grand âge -->
879
										<div class="input-group">
879
										<div class="input-group">
880
											<label for="remarquable-age">
880
											<label for="remarquable-age">
881
												<input type="checkbox" id="remarquable-age" class="cb-remarquable" name="remarquable-ch" value="age" data-titre="age" />
881
												<input type="checkbox" id="remarquable-age" class="cb-remarquable" name="remarquable-ch" value="age" data-titre="age" />
882
												Grand âge
882
												Grand âge
883
												<input class="has-tooltip hidden" type="text" id="remarquable-age-commentaire"
883
												<input class="has-tooltip hidden" type="text" id="remarquable-age-commentaire"
884
													placeholder="commentaire optionnel" 
884
													placeholder="commentaire optionnel" 
885
												/>
885
												/>
886
											</label>
886
											</label>
887
										</div>
887
										</div>
888
										<!-- Taille importante -->
888
										<!-- Taille importante -->
889
										<div class="input-group">
889
										<div class="input-group">
890
											<label for="remarquable-taille">
890
											<label for="remarquable-taille">
891
												<input type="checkbox" id="remarquable-taille" class="cb-remarquable" name="remarquable-ch" value="taille" data-titre="taille" />
891
												<input type="checkbox" id="remarquable-taille" class="cb-remarquable" name="remarquable-ch" value="taille" data-titre="taille" />
892
												Taille importante
892
												Taille importante
893
												<input class="has-tooltip hidden" type="text" id="remarquable-taille-commentaire"
893
												<input class="has-tooltip hidden" type="text" id="remarquable-taille-commentaire"
894
													placeholder="commentaire optionnel" 
894
													placeholder="commentaire optionnel" 
895
												/>
895
												/>
896
											</label>
896
											</label>
897
										</div>
897
										</div>
898
										<!-- Autre -->
898
										<!-- Autre -->
899
										<div class="input-group">
899
										<div class="input-group">
900
											<label for="remarquable-autre">
900
											<label for="remarquable-autre">
901
												<input type="checkbox" id="remarquable-autre" class="cb-remarquable" name="remarquable-ch" value="autre" data-titre="autre" />
901
												<input type="checkbox" id="remarquable-autre" class="cb-remarquable" name="remarquable-ch" value="autre" data-titre="autre" />
902
												Autre
902
												Autre
903
												<input class="has-tooltip hidden" type="text" id="remarquable-autre-commentaire"
903
												<input class="has-tooltip hidden" type="text" id="remarquable-autre-commentaire"
904
													placeholder="commentaire optionnel" 
904
													placeholder="commentaire optionnel" 
905
												/>
905
												/>
906
											</label>
906
											</label>
907
										</div>
907
										</div>
908
									</div>
908
									</div>
909
								</div>
909
								</div>
910
							</div>
910
							</div>
911
						</form>
911
						</form>
912
						<form id="form-remarquabilite" class="form-horizontal" role="form" autocomplete="on">
912
						<form id="form-remarquabilite" class="form-horizontal" role="form" autocomplete="on">
913
							<div class="form-group has-tooltip"
913
							<div class="form-group has-tooltip"
914
									title="Quel est le degré de remarquabilité de cet arbre ?">
914
									title="Quel est le degré de remarquabilité de cet arbre ?">
915
								<label for="remarquabilite" class="col-sm-4 control-label">
915
								<label for="remarquabilite" class="col-sm-4 control-label">
916
									<strong class="obligatoire">*</strong>
916
									<strong class="obligatoire">*</strong>
917
									Selon vous, quel est le degré de remarquabilité de cet arbre ?
917
									Selon vous, quel est le degré de remarquabilité de cet arbre ?
918
								</label>
918
								</label>
919
								<div class="col-sm-8">
919
								<div class="col-sm-8">
920
									<div class="input-group">
920
									<div class="input-group">
921
										<select id="remarquabilite" class="form-control obs-chp-etendu"
921
										<select id="remarquabilite" class="form-control obs-chp-etendu"
922
												name="arbreRemarquableRemarquabilite"
922
												name="arbreRemarquableRemarquabilite"
923
												data-label="Remarquabilite">
923
												data-label="Remarquabilite">
924
											<option selected value="">Sélectionner le degré de remarquabilité</option>
924
											<option selected value="">Sélectionner le degré de remarquabilité</option>
925
											<option value="Arbre exceptionnel">Arbre exceptionnel</option>
925
											<option value="Arbre exceptionnel">Arbre exceptionnel</option>
926
											<option value="Arbre remarquable">Arbre remarquable</option>
926
											<option value="Arbre remarquable">Arbre remarquable</option>
927
											<option value="Arbre d'intérêt local">Arbre d'intérêt local</option>
927
											<option value="Arbre d'intérêt local">Arbre d'intérêt local</option>
928
										</select>
928
										</select>
929
										<div class="input-group-btn">
929
										<div class="input-group-btn">
930
											<button class="btn btn-default" type="button" data-toggle="modal" data-target="#remarq-description">
930
											<button class="btn btn-default" type="button" data-toggle="modal" data-target="#remarq-description">
931
												<span class="glyphicon glyphicon-info-sign"></span> Aide
931
												<span class="glyphicon glyphicon-info-sign"></span> Aide
932
											</button>
932
											</button>
933
										</div>
933
										</div>
934
									</div>
934
									</div>
935
								</div>
935
								</div>
936
							</div>
936
							</div>
937
						</form>
937
						</form>
938
 
938
 
939
						<div class="row">
939
						<div class="row">
940
							<form id="form-upload" class="form form-horizontal" role="form" action="<?= $url_ws_upload ?>"
940
							<form id="form-upload" class="form form-horizontal" role="form" action="<?= $url_ws_upload ?>"
941
								method="post" enctype="multipart/form-data">
941
								method="post" enctype="multipart/form-data">
942
								<div class="col-md-12">
942
								<div class="col-md-12">
943
									<h2>Image(s) de l'arbre</h2>
943
									<h2>Image(s) de l'arbre</h2>
944
									<strong>Ajouter une image</strong>
944
									<strong>Ajouter une image</strong>
945
									<p class="miniature-info discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacune.</p>
945
									<p class="miniature-info discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacune.</p>
946
									<div id ="photos-conteneur" class="form-group">
946
									<div id ="photos-conteneur" class="form-group">
947
										<div class="col-sm-12">
947
										<div class="col-sm-12">
948
											<input type="file" id="fichier" name="fichier" class="form-control import-image" accept="image/jpeg" />
948
											<input type="file" id="fichier" name="fichier" class="form-control import-image" accept="image/jpeg" />
949
											<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
949
											<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
950
										</div>
950
										</div>
951
										<div id="miniatures"></div>
951
										<div id="miniatures"></div>
952
										<p class="miniature-msg col-md-12">&nbsp;</p>
952
										<p class="miniature-msg col-md-12">&nbsp;</p>
953
									</div>
953
									</div>
954
								</div>
954
								</div>
955
							</form>
955
							</form>
956
						</div>
956
						</div>
957
					</div>
957
					</div>
958
				</div>
958
				</div>
959
 
959
 
960
				<div class="row">
960
				<div class="row">
961
					<div class="col-md-12 centre has-tooltip"
961
					<div class="col-md-12 centre has-tooltip"
962
						title="Une fois les champs remplis, cliquez sur ce bouton pour
962
						title="Une fois les champs remplis, cliquez sur ce bouton pour
963
							ajouter votre observation à la liste à transmettre. N'oubliez pas de cliquer sur le bouton transmettre pour envoyer vos observations.">
963
							ajouter votre observation à la liste à transmettre. N'oubliez pas de cliquer sur le bouton transmettre pour envoyer vos observations.">
964
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
964
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
965
							Créer
965
							Créer
966
						</button>
966
						</button>
967
					</div>
967
					</div>
968
				</div>
968
				</div>
969
			</div>
969
			</div>
970
 
970
 
971
			<!-- Messages d'erreur du formulaire-->
971
			<!-- Messages d'erreur du formulaire-->
972
			<div class="row">
972
			<div class="row">
973
				<div class="zone-alerte col-md-6 col-md-offset-3">
973
				<div class="zone-alerte col-md-6 col-md-offset-3">
974
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
974
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
975
						<a class="close">×</a>
975
						<a class="close">×</a>
976
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
976
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
977
						<p>
977
						<p>
978
							Vous venez d'ajouter votre 10ème observation.<br/>
978
							Vous venez d'ajouter votre 10ème observation.<br/>
979
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
979
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
980
						</p>
980
						</p>
981
					</div>
981
					</div>
982
				</div>
982
				</div>
983
				<div class="zone-alerte col-md-6 col-md-offset-3">
983
				<div class="zone-alerte col-md-6 col-md-offset-3">
984
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
984
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
985
						<a class="close">×</a>
985
						<a class="close">×</a>
986
						<h4 class="alert-heading">Information : champs en erreur</h4>
986
						<h4 class="alert-heading">Information : champs en erreur</h4>
987
						<p>
987
						<p>
988
							Certains champs du formulaire sont mal remplis.<br/>
988
							Certains champs du formulaire sont mal remplis.<br/>
989
							Veuillez vérifier vos données.
989
							Veuillez vérifier vos données.
990
						</p>
990
						</p>
991
					</div>
991
					</div>
992
				</div>
992
				</div>
993
			</div>
993
			</div>
994
 
994
 
995
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
995
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
996
			<div id="zone-liste-obs" class="row">
996
			<div id="zone-liste-obs" class="row">
997
				<div class="col-md-12">
997
				<div class="col-md-12">
998
					<div class="well well-lg">
998
					<div class="well well-lg">
999
						<div class="row">
999
						<div class="row">
1000
							<div class="col-md-8">
1000
							<div class="col-md-8">
1001
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
1001
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
1002
							</div>
1002
							</div>
1003
							<div class="col-md-4 text-right">
1003
							<div class="col-md-4 text-right">
1004
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
1004
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
1005
									type="button" disabled="disabled"
1005
									type="button" disabled="disabled"
1006
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
1006
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
1007
									Transmettre
1007
									Transmettre
1008
								</button>
1008
								</button>
1009
							</div>
1009
							</div>
1010
						</div>
1010
						</div>
1011
						<div id="liste-obs" ></div>
1011
						<div id="liste-obs" ></div>
1012
						<div class="row">
1012
						<div class="row">
1013
							<div class="zone-alerte col-md-6 col-md-offset-3">
1013
							<div class="zone-alerte col-md-6 col-md-offset-3">
1014
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
1014
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
1015
									<a class="close">×</a>
1015
									<a class="close">×</a>
1016
									<h4 class="alert-heading">Attention : aucune observation</h4>
1016
									<h4 class="alert-heading">Attention : aucune observation</h4>
1017
									<p>Veuillez saisir des observations pour les transmettre.</p>
1017
									<p>Veuillez saisir des observations pour les transmettre.</p>
1018
								</div>
1018
								</div>
1019
 
1019
 
1020
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
1020
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
1021
									<a class="close">×</a>
1021
									<a class="close">×</a>
1022
									<h4 class="alert-heading">Information : transmission des observations</h4>
1022
									<h4 class="alert-heading">Information : transmission des observations</h4>
1023
									<div class="alert-txt"></div>
1023
									<div class="alert-txt"></div>
1024
								</div>
1024
								</div>
1025
 
1025
 
1026
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
1026
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
1027
									<a class="close">×</a>
1027
									<a class="close">×</a>
1028
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
1028
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
1029
									<div class="alert-txt"></div>
1029
									<div class="alert-txt"></div>
1030
								</div>
1030
								</div>
1031
							</div>
1031
							</div>
1032
						</div>
1032
						</div>
1033
 
1033
 
1034
					</div>
1034
					</div>
1035
				</div>
1035
				</div>
1036
			</div>
1036
			</div>
1037
 
1037
 
1038
			<footer class="row">
1038
			<footer class="row">
1039
				<p class="col-md-12 ">Réalisation &amp; hébergement : <a href="http://www.tela-botanica.org" target="_blank">Tela Botanica</a> 2014</p>
1039
				<p class="col-md-12 ">Réalisation &amp; hébergement : <a href="http://www.tela-botanica.org" target="_blank">Tela Botanica</a> 2014</p>
1040
			</footer>
1040
			</footer>
1041
 
1041
 
1042
			<!-- Templates HTML -->
1042
			<!-- Templates HTML -->
1043
			<div id="tpl-transmission-ok" style="display:none;">
1043
			<div id="tpl-transmission-ok" style="display:none;">
1044
				<p class="msg">
1044
				<p class="msg">
1045
					Vos observations ont bien été transmises.<br />
1045
					Vos observations ont bien été transmises.<br />
1046
					Elles sont désormais consultables à travers les différents outils de visualisation
1046
					Elles sont désormais consultables à travers les différents outils de visualisation
1047
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
1047
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
1048
					<a href="http://www.tela-botanica.org/appli:pictoflora">Pictoflora</a>,
1048
					<a href="http://www.tela-botanica.org/appli:pictoflora">Pictoflora</a>,
1049
					<a href="http://www.tela-botanica.org/appli:del">Identiplante</a>,
1049
					<a href="http://www.tela-botanica.org/appli:del">Identiplante</a>,
1050
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
1050
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
1051
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
1051
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
1052
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en Ligne</a>.<br />
1052
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en Ligne</a>.<br />
1053
					N'oubliez pas qu'il est nécessaire de
1053
					N'oubliez pas qu'il est nécessaire de
1054
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
1054
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
1055
					au préalable, si ce n'est pas déjà fait.
1055
					au préalable, si ce n'est pas déjà fait.
1056
				</p>
1056
				</p>
1057
			</div>
1057
			</div>
1058
			<div id="tpl-transmission-ko" style="display:none;">
1058
			<div id="tpl-transmission-ko" style="display:none;">
1059
				<p class="msg">
1059
				<p class="msg">
1060
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
1060
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
1061
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
1061
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
1062
					et transmettre les suivantes.<br />
1062
					et transmettre les suivantes.<br />
1063
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
1063
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
1064
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
1064
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
1065
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
1065
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
1066
								  target="_blank"
1066
								  target="_blank"
1067
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
1067
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
1068
								  le formulaire de signalement d'erreurs</a>.
1068
								  le formulaire de signalement d'erreurs</a>.
1069
				</p>
1069
				</p>
1070
			</div>
1070
			</div>
1071
 
1071
 
1072
			<!-- Fenêtres modales -->
1072
			<!-- Fenêtres modales -->
1073
			<div id="chargement" class="modal-fenetre" style="display:none;">
1073
			<div id="chargement" class="modal-fenetre" style="display:none;">
1074
				<div id="chargement-centrage" class="modal-contenu">
1074
				<div id="chargement-centrage" class="modal-contenu">
1075
					<div class="progress">
1075
					<div class="progress">
1076
						<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="">
1076
						<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="">
1077
							<span class="sr-only">0/10 observations transmises</span>
1077
							<span class="sr-only">0/10 observations transmises</span>
1078
						</div>
1078
						</div>
1079
					</div>
1079
					</div>
1080
 
1080
 
1081
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
1081
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
1082
						Transfert des observations en cours...<br />
1082
						Transfert des observations en cours...<br />
1083
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
1083
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
1084
						d'observations à transférer.
1084
						d'observations à transférer.
1085
					</p>
1085
					</p>
1086
				</div>
1086
				</div>
1087
			</div>
1087
			</div>
1088
 
1088
 
1089
			<div id="projet-description" class="modal fade" tabindex="-1" role="dialog"
1089
			<div id="projet-description" class="modal fade" tabindex="-1" role="dialog"
1090
				 aria-labelledby="projet-description-titre" aria-hidden="true">
1090
				 aria-labelledby="projet-description-titre" aria-hidden="true">
1091
				<div class="modal-dialog">
1091
				<div class="modal-dialog">
1092
					<div class="modal-content">
1092
					<div class="modal-content">
1093
						<div class="modal-header">
1093
						<div class="modal-header">
1094
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1094
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1095
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1095
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1096
							</button>
1096
							</button>
1097
							<h1 id="projet-description-titre" class="modal-title">Les arbres remarquables</h1>
1097
							<h1 id="projet-description-titre" class="modal-title">Les arbres remarquables</h1>
1098
						</div>
1098
						</div>
1099
						<div class="modal-body">
1099
						<div class="modal-body">
1100
							<div class="dsc-imgs">
1100
							<div class="dsc-imgs">
1101
								<img src="<?=$url_base?>/modules/saisie/squelettes/arbres-remarquables/img/dsc/arbre_1.jpg" alt="Illustration d'un arbre remarquable"/>
1101
								<img src="<?=$url_base?>/modules/saisie/squelettes/arbres-remarquables/img/dsc/arbre_1.jpg" alt="Illustration d'un arbre remarquable"/>
1102
							</div>
1102
							</div>
1103
							<div class="dsc-infos text-justify">
1103
							<div class="dsc-infos text-justify">
1104
								<h2>Qu'est-ce qu'un arbre remarquable&nbsp;?</h2>
1104
								<h2>Qu'est-ce qu'un arbre remarquable&nbsp;?</h2>
1105
								<p>
1105
								<p>
1106
									Parmi les arbres que nous côtoyons, certains sujets suscitent une émotion particulière de par 
1106
									Parmi les arbres que nous côtoyons, certains sujets suscitent une émotion particulière de par 
1107
									leur taille imposante, leur forme, leur grand âge, leur rareté botanique, leur capacité à offrir 
1107
									leur taille imposante, leur forme, leur grand âge, leur rareté botanique, leur capacité à offrir 
1108
									des refuges à la faune, leur histoire… <br />
1108
									des refuges à la faune, leur histoire… <br />
1109
									La notion de « remarquabilité » comporte une part de subjectivité liée à l’appréciation 
1109
									La notion de « remarquabilité » comporte une part de subjectivité liée à l’appréciation 
1110
									personnelle et une part de relativité (un arbre paraît d'autant plus remarquable que son 
1110
									personnelle et une part de relativité (un arbre paraît d'autant plus remarquable que son 
1111
									environnement est banal).
1111
									environnement est banal).
1112
								</p>
1112
								</p>
1113
 
1113
 
1114
								<h2>Des rescapés de la gestion humaine</h2>
1114
								<h2>Des rescapés de la gestion humaine</h2>
1115
								<p>
1115
								<p>
1116
									Ces « anciens » nous rappellent que les arbres ont une capacité à vivre beaucoup plus longtemps 
1116
									Ces « anciens » nous rappellent que les arbres ont une capacité à vivre beaucoup plus longtemps 
1117
									que les limites que nous leur imposons généralement. Des rescapés en quelque sorte !<br />
1117
									que les limites que nous leur imposons généralement. Des rescapés en quelque sorte !<br />
1118
									Les forestiers récoltent les arbres alors qu'ils n'ont pas atteint la moitié de leur vie ; 
1118
									Les forestiers récoltent les arbres alors qu'ils n'ont pas atteint la moitié de leur vie ; 
1119
									hors de forêts, l'arrachement des haies et l'urbanisation laissent peu d'occasion aux arbres de 
1119
									hors de forêts, l'arrachement des haies et l'urbanisation laissent peu d'occasion aux arbres de 
1120
									vieillir.
1120
									vieillir.
1121
								</p>
1121
								</p>
1122
 
1122
 
1123
								<h2>Pourquoi est-il important de les recenser&nbsp;?</h2>
1123
								<h2>Pourquoi est-il important de les recenser&nbsp;?</h2>
1124
								<p>
1124
								<p>
1125
									Outre les considérations morales et philosophiques qui doivent nous inciter à les protéger, 
1125
									Outre les considérations morales et philosophiques qui doivent nous inciter à les protéger, 
1126
									les vieux arbres représentent un écosystème particulier : écorces décollées, branches mortes, 
1126
									les vieux arbres représentent un écosystème particulier : écorces décollées, branches mortes, 
1127
									cavités sont autant de milieux de vie pour des espèces d'insectes, champignons, oiseaux, 
1127
									cavités sont autant de milieux de vie pour des espèces d'insectes, champignons, oiseaux, 
1128
									de mammifères…<br />
1128
									de mammifères…<br />
1129
									Les gestions agricoles et forestières plus intensives ont pour conséquence la raréfaction des 
1129
									Les gestions agricoles et forestières plus intensives ont pour conséquence la raréfaction des 
1130
									arbres âgés ; elles menacent toute la vie qui leur est associée.<br />
1130
									arbres âgés ; elles menacent toute la vie qui leur est associée.<br />
1131
									Pour la biodiversité, l'identification et la protection des vieux arbres est cruciale ; d'un 
1131
									Pour la biodiversité, l'identification et la protection des vieux arbres est cruciale ; d'un 
1132
									point de vu paysager, ces arbres représentent des éléments remarquables auxquels les habitants 
1132
									point de vu paysager, ces arbres représentent des éléments remarquables auxquels les habitants 
1133
									sont attachés.
1133
									sont attachés.
1134
								</p>
1134
								</p>
1135
								<p class="bg-success text-center">
1135
								<p class="bg-success text-center">
1136
									<strong>
1136
									<strong>
1137
										Merci de transmettre vos observations
1137
										Merci de transmettre vos observations
1138
									</strong>
1138
									</strong>
1139
								</p>
1139
								</p>
1140
							</div>
1140
							</div>
1141
						</div>
1141
						</div>
1142
						<div class="modal-footer dsc-clean">
1142
						<div class="modal-footer dsc-clean">
1143
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1143
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1144
						</div>
1144
						</div>
1145
					</div>
1145
					</div>
1146
				</div>
1146
				</div>
1147
			</div>
1147
			</div>
1148
 
1148
 
1149
			<div id="age-description" class="modal fade" tabindex="-1" role="dialog"
1149
			<div id="age-description" class="modal fade" tabindex="-1" role="dialog"
1150
				 aria-labelledby="age-description-titre" aria-hidden="true">
1150
				 aria-labelledby="age-description-titre" aria-hidden="true">
1151
				<div class="modal-dialog">
1151
				<div class="modal-dialog">
1152
					<div class="modal-content">
1152
					<div class="modal-content">
1153
						<div class="modal-header">
1153
						<div class="modal-header">
1154
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1154
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1155
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1155
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1156
							</button>
1156
							</button>
1157
						</div>
1157
						</div>
1158
						<div class="modal-body">
1158
						<div class="modal-body">
1159
							<p>
1159
							<p>
1160
								Le comptage des cernes de croissance est une manière aisée de connaître l'âge d'un arbre une fois abattu 
1160
								Le comptage des cernes de croissance est une manière aisée de connaître l'âge d'un arbre une fois abattu 
1161
								mais sur un individu vivant c'est beaucoup plus difficile à estimer.<br />
1161
								mais sur un individu vivant c'est beaucoup plus difficile à estimer.<br />
1162
								La taille, notamment, n'est pas toujours un critère (les genévriers thurifères qui poussent en falaise 
1162
								La taille, notamment, n'est pas toujours un critère (les genévriers thurifères qui poussent en falaise 
1163
								n’atteignent pas de grandes dimension tout en pouvant être âgés). <br />
1163
								n’atteignent pas de grandes dimension tout en pouvant être âgés). <br />
1164
								Quelques signes peuvent vous aider :
1164
								Quelques signes peuvent vous aider :
1165
							</p>
1165
							</p>
1166
							<table class="table table-bordered">
1166
							<table class="table table-bordered">
1167
								<tr>
1167
								<tr>
1168
									<td>Très vieux</td>
1168
									<td>Très vieux</td>
1169
									<td><strong>Période de retraite</strong><br />
1169
									<td><strong>Période de retraite</strong><br />
1170
										Porte-t-il des signes de grand âge ?<br />
1170
										Porte-t-il des signes de grand âge ?<br />
1171
										<i>Ex : contreforts marqués, dessèchement des feuilles à la cime</i>
1171
										<i>Ex : contreforts marqués, dessèchement des feuilles à la cime</i>
1172
									</td>
1172
									</td>
1173
								</tr>
1173
								</tr>
1174
								<tr>
1174
								<tr>
1175
									<td>Vieux</td>
1175
									<td>Vieux</td>
1176
									<td><strong>Période de sénescence - Post reproduction</strong><br />
1176
									<td><strong>Période de sénescence - Post reproduction</strong><br />
1177
										Porte-t-il des signes de vieillissement ?<br />
1177
										Porte-t-il des signes de vieillissement ?<br />
1178
										<i>Ex : arrêt de fructification, apparition de contreforts</i>
1178
										<i>Ex : arrêt de fructification, apparition de contreforts</i>
1179
									</td>
1179
									</td>
1180
								</tr>
1180
								</tr>
1181
								<tr>
1181
								<tr>
1182
									<td>Adulte</td>
1182
									<td>Adulte</td>
1183
									<td><strong>Période de maturité</strong><br />
1183
									<td><strong>Période de maturité</strong><br />
1184
										Porte-t-il des fruits ?
1184
										Porte-t-il des fruits ?
1185
									</td>
1185
									</td>
1186
								</tr>
1186
								</tr>
1187
							</table>
1187
							</table>
1188
						</div>
1188
						</div>
1189
						<div class="modal-footer dsc-clean">
1189
						<div class="modal-footer dsc-clean">
1190
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1190
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1191
						</div>
1191
						</div>
1192
					</div>
1192
					</div>
1193
				</div>
1193
				</div>
1194
			</div>
1194
			</div>
1195
			
1195
			
1196
			<div id="sante-description" class="modal fade" tabindex="-1" role="dialog"
1196
			<div id="sante-description" class="modal fade" tabindex="-1" role="dialog"
1197
				 aria-labelledby="age-description-titre" aria-hidden="true">
1197
				 aria-labelledby="age-description-titre" aria-hidden="true">
1198
				<div class="modal-dialog">
1198
				<div class="modal-dialog">
1199
					<div class="modal-content">
1199
					<div class="modal-content">
1200
						<div class="modal-header">
1200
						<div class="modal-header">
1201
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1201
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1202
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1202
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1203
							</button>
1203
							</button>
1204
						</div>
1204
						</div>
1205
						<div class="modal-body">
1205
						<div class="modal-body">
1206
							<table class="table table-bordered">
1206
							<table class="table table-bordered">
1207
								<tr>
1207
								<tr>
1208
									<td>En très bonne santé</td>
1208
									<td>En très bonne santé</td>
1209
									<td>Arbre sain et vigoureux.</td>
1209
									<td>Arbre sain et vigoureux.</td>
1210
								</tr>
1210
								</tr>
1211
								<tr>
1211
								<tr>
1212
									<td>En bonne santé</td>
1212
									<td>En bonne santé</td>
1213
									<td>Au plus quelques atteintes (petites blessures, petites branches sèches).</td>
1213
									<td>Au plus quelques atteintes (petites blessures, petites branches sèches).</td>
1214
								</tr>
1214
								</tr>
1215
								<tr>
1215
								<tr>
1216
									<td>État moyen</td>
1216
									<td>État moyen</td>
1217
									<td>L'arbre a subi la foudre, des élagages, des brûlures, des gerçures de froid, la maladie…</td>
1217
									<td>L'arbre a subi la foudre, des élagages, des brûlures, des gerçures de froid, la maladie…</td>
1218
								</tr>
1218
								</tr>
1219
								<tr>
1219
								<tr>
1220
									<td>Fin de vie</td>
1220
									<td>Fin de vie</td>
1221
									<td>Atteintes pouvant affecter la solidité : cavité(s) importante(s), grande proportion de branches mortes ; système racinaire fortement endommagé...</td>
1221
									<td>Atteintes pouvant affecter la solidité : cavité(s) importante(s), grande proportion de branches mortes ; système racinaire fortement endommagé...</td>
1222
								</tr>
1222
								</tr>
1223
							</table>
1223
							</table>
1224
						</div>
1224
						</div>
1225
						<div class="modal-footer dsc-clean">
1225
						<div class="modal-footer dsc-clean">
1226
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1226
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1227
						</div>
1227
						</div>
1228
					</div>
1228
					</div>
1229
				</div>
1229
				</div>
1230
			</div>
1230
			</div>
1231
			
1231
			
1232
			<div id="remarq-description" class="modal fade" tabindex="-1" role="dialog"
1232
			<div id="remarq-description" class="modal fade" tabindex="-1" role="dialog"
1233
				 aria-labelledby="age-description-titre" aria-hidden="true">
1233
				 aria-labelledby="age-description-titre" aria-hidden="true">
1234
				<div class="modal-dialog">
1234
				<div class="modal-dialog">
1235
					<div class="modal-content">
1235
					<div class="modal-content">
1236
						<div class="modal-header">
1236
						<div class="modal-header">
1237
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1237
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1238
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1238
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1239
							</button>
1239
							</button>
1240
						</div>
1240
						</div>
1241
						<div class="modal-body">
1241
						<div class="modal-body">
1242
							<table class="table table-bordered">
1242
							<table class="table table-bordered">
1243
								<tr>
1243
								<tr>
1244
									<td>Arbre exceptionnel</td>
1244
									<td>Arbre exceptionnel</td>
1245
									<td>Le caractère exceptionnel de l'arbre le place à une échelle nationale.</td>
1245
									<td>Le caractère exceptionnel de l'arbre le place à une échelle nationale.</td>
1246
								</tr>
1246
								</tr>
1247
								<tr>
1247
								<tr>
1248
									<td>Arbre remarquable </td>
1248
									<td>Arbre remarquable </td>
1249
									<td>L'arbre est remarquable à une échelle régionale.</td>
1249
									<td>L'arbre est remarquable à une échelle régionale.</td>
1250
								</tr>
1250
								</tr>
1251
								<tr>
1251
								<tr>
1252
									<td>Arbre exceptionnel</td>
1252
									<td>Arbre exceptionnel</td>
1253
									<td>Arbre d’intérêt principalement local (histoire locale, légende locale, paysage local...)</td>
1253
									<td>Arbre d’intérêt principalement local (histoire locale, légende locale, paysage local...)</td>
1254
								</tr>
1254
								</tr>
1255
							</table>
1255
							</table>
1256
						</div>
1256
						</div>
1257
						<div class="modal-footer dsc-clean">
1257
						<div class="modal-footer dsc-clean">
1258
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1258
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1259
						</div>
1259
						</div>
1260
					</div>
1260
					</div>
1261
				</div>
1261
				</div>
1262
			</div>
1262
			</div>
1263
			
1263
			
1264
			<div id="notes-description" class="modal fade" tabindex="-1" role="dialog"
1264
			<div id="notes-description" class="modal fade" tabindex="-1" role="dialog"
1265
				 aria-labelledby="projet-description-titre" aria-hidden="true">
1265
				 aria-labelledby="projet-description-titre" aria-hidden="true">
1266
				<div class="modal-dialog">
1266
				<div class="modal-dialog">
1267
					<div class="modal-content">
1267
					<div class="modal-content">
1268
						<div class="modal-header">
1268
						<div class="modal-header">
1269
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1269
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
1270
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1270
								<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
1271
							</button>
1271
							</button>
1272
							<h1 id="projet-description-titre" class="modal-title">Notes</h1>
1272
							<h1 id="projet-description-titre" class="modal-title">Notes</h1>
1273
							<p>Observation d’espèces de faune ou de flore (notamment épiphytes), ressources potentielles pour la biodiversité. </p>
1273
							<p>Observation d’espèces de faune ou de flore (notamment épiphytes), ressources potentielles pour la biodiversité. </p>
1274
						</div>
1274
						</div>
1275
						<div class="modal-body">
1275
						<div class="modal-body">
1276
							<div class="dsc-infos text-justify">
1276
							<div class="dsc-infos text-justify">
1277
								<h2>Qu'est-ce qu'une plante épiphyte&nbsp;?</h2>
1277
								<h2>Qu'est-ce qu'une plante épiphyte&nbsp;?</h2>
1278
								<p>
1278
								<p>
1279
									Il s'agit d'une plante qui pousse en se servant d'autres plantes comme support. Il ne s'agit 
1279
									Il s'agit d'une plante qui pousse en se servant d'autres plantes comme support. Il ne s'agit 
1280
									pas de plantes parasites mais de plantes qui trouvent un substrat favorable sur l'arbre, soit dans 
1280
									pas de plantes parasites mais de plantes qui trouvent un substrat favorable sur l'arbre, soit dans 
1281
									des cavités remplies de terreau, soit sur l'écorce du tronc.
1281
									des cavités remplies de terreau, soit sur l'écorce du tronc.
1282
								</p>
1282
								</p>
1283
							</div>
1283
							</div>
1284
							<div class="dsc-imgs">
1284
							<div class="dsc-imgs">
1285
								<img src="<?=$url_base?>/modules/saisie/squelettes/arbres-remarquables/img/dsc/arbre_2.jpg" 
1285
								<img src="<?=$url_base?>/modules/saisie/squelettes/arbres-remarquables/img/dsc/arbre_2.jpg" 
1286
								alt="Plantes épiphytes By pfly (flickr.com) [CC BY-SA 2.0 (http://creativecommons.org/licenses/by-sa/2.0)], via Wikimedia Commons"/>
1286
								alt="Plantes épiphytes By pfly (flickr.com) [CC BY-SA 2.0 (http://creativecommons.org/licenses/by-sa/2.0)], via Wikimedia Commons"/>
1287
								<p>By pfly (flickr.com) [CC BY-SA 2.0 (http://creativecommons.org/licenses/by-sa/2.0)], via Wikimedia Commons</p>
1287
								<p>By pfly (flickr.com) [CC BY-SA 2.0 (http://creativecommons.org/licenses/by-sa/2.0)], via Wikimedia Commons</p>
1288
							</div>
1288
							</div>
1289
						</div>
1289
						</div>
1290
						<div class="modal-footer dsc-clean">
1290
						<div class="modal-footer dsc-clean">
1291
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1291
							<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Fermer</button>
1292
						</div>
1292
						</div>
1293
					</div>
1293
					</div>
1294
				</div>
1294
				</div>
1295
			</div>
1295
			</div>
1296
 
1296
 
1297
 
1297
 
1298
		</div>
1298
		</div>
1299
	</body>
1299
	</body>
1300
</html>
1300
</html>