Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 2360 Rev 2366
1
<!DOCTYPE html>
1
<!DOCTYPE html>
2
<html lang="fr">
2
<html lang="fr">
3
	<head>
3
	<head>
4
		<title>Arbres têtards : saisie d'observations</title>
4
		<title>Arbres têtards : saisie d'observations</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="Jean-Pascal MILCENT" />
10
		<meta name="author" content="Jean-Pascal MILCENT" />
11
		<meta name="keywords" content="Arbres têtards, projet, saisie, observation, Gentiana, CEL" />
11
		<meta name="keywords" content="Arbres têtards, projet, saisie, observation, Gentiana, CEL" />
12
		<meta name="description" content="Projet Arbres têtards de Gentiana - Widget de saisie simplifiée pour le CEL" />
12
		<meta name="description" content="Projet Arbres têtards de Gentiana - 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-tetards/img/favicon.ico" />
18
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/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="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
23
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
24
 
24
 
25
		<!-- Jquery -->
25
		<!-- Jquery -->
26
		<script src="http://resources.tela-botanica.org/jquery/1.7.1/jquery-1.7.1.min.js"></script>
26
		<script src="http://resources.tela-botanica.org/jquery/1.7.1/jquery-1.7.1.min.js"></script>
27
		<!-- Jquery UI : nécessaire pour le mini-calendrier et l'auto-complétion -->
27
		<!-- Jquery UI : nécessaire pour le mini-calendrier et l'auto-complétion -->
28
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/js/jquery-ui-1.8.18.custom.min.js"></script>
28
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/js/jquery-ui-1.8.18.custom.min.js"></script>
29
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/js/jquery.ui.datepicker-fr.js"></script>
29
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/js/jquery.ui.datepicker-fr.js"></script>
30
		<!-- Jquery Plugins -->
30
		<!-- Jquery Plugins -->
31
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
31
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
32
		<script src="http://resources.tela-botanica.org/jquery/validate/1.9.0/jquery.validate.min.js"></script>
32
		<script src="http://resources.tela-botanica.org/jquery/validate/1.9.0/jquery.validate.min.js"></script>
33
		<script src="http://resources.tela-botanica.org/jquery/validate/1.9.0/messages_fr.js"></script>
33
		<script src="http://resources.tela-botanica.org/jquery/validate/1.9.0/messages_fr.js"></script>
34
		<!-- Jquery Form :nécessaire pour l'upload des images -->
34
		<!-- Jquery Form :nécessaire pour l'upload des images -->
35
		<script src="http://resources.tela-botanica.org/jquery/form/2.95/jquery.form.min.js"></script>
35
		<script src="http://resources.tela-botanica.org/jquery/form/2.95/jquery.form.min.js"></script>
36
 
36
 
37
		<!-- Bootstrap -->
37
		<!-- Bootstrap -->
38
		<script src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
38
		<script src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
39
		<script src="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/js/bootstrap-modalmanager.js"></script>
39
		<script src="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/js/bootstrap-modalmanager.js"></script>
40
		<script src="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/js/bootstrap-modal.js"></script>
40
		<script src="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/js/bootstrap-modal.js"></script>
-
 
41
 
-
 
42
		<!-- Proj4js -->
-
 
43
		<script type="text/javascript" src="http://resources.tela-botanica.org/proj4js/2.2.1/proj4.js"></script>
41
 
44
 
-
 
45
		<!-- Javascript : appli saisie -->
42
		<!-- Javascript : appli saisie -->
46
		<script src="<?=$url_base?>saisie?projet=arbres-tetards&amp;service=taxons" type="text/javascript"></script>
43
		<script>
47
		<script>
44
		//<![CDATA[
48
		//<![CDATA[
45
			// Précharger le formulaire avec les infos d'une observation
49
			// Précharger le formulaire avec les infos d'une observation
46
			var OBS_ID = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
50
			var OBS_ID = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
47
			// La présence du parametre 'debug' dans l'URL enclenche le dégogage
51
			// La présence du parametre 'debug' dans l'URL enclenche le dégogage
48
			var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
52
			var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
49
 
53
 
50
			// Mot-clé du widget/projet
54
			// Mot-clé du widget/projet
51
			var TAG_PROJET = "WidgetSaisie,ArbresTetards";
55
			var TAG_PROJET = "WidgetSaisie,ArbresTetards";
52
			// Mots-clés à ajouter aux images
56
			// Mots-clés à ajouter aux images
53
			var TAG_IMG = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
57
			var TAG_IMG = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
54
			var SEPARATION_TAG_IMG = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
58
			var SEPARATION_TAG_IMG = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
55
			TAG_IMG = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + SEPARATION_TAG_IMG + TAG_IMG" : 'TAG_IMG' ?>;
59
			TAG_IMG = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + SEPARATION_TAG_IMG + TAG_IMG" : 'TAG_IMG' ?>;
56
			// Mots-clés à ajouter aux observations
60
			// Mots-clés à ajouter aux observations
57
			var TAG_OBS = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
61
			var TAG_OBS = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
58
			var SEPARATION_TAG_OBS = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
62
			var SEPARATION_TAG_OBS = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
59
			TAG_OBS = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + SEPARATION_TAG_OBS + TAG_OBS" : 'TAG_OBS' ?>;
63
			TAG_OBS = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + SEPARATION_TAG_OBS + TAG_OBS" : 'TAG_OBS' ?>;
60
 
64
 
61
			// Code du référentiel utilisé pour les nom scientifiques (de la forme nom:code).
65
			// Code du référentiel utilisé pour les nom scientifiques (de la forme nom:code).
62
			var NOM_SCI_REFERENTIEL = "<?=$ns_referentiel?>";
66
			var NOM_SCI_REFERENTIEL = "<?=$ns_referentiel?>";
63
			// Nom du référentiel utilisé pour les nom scientifiques.
67
			// Nom du référentiel utilisé pour les nom scientifiques.
64
			var NOM_SCI_PROJET = "<?=$ns_projet?>";
68
			var NOM_SCI_PROJET = "<?=$ns_projet?>";
65
 
69
 
66
			// Indication de la présence d'une espèce imposée
70
			// Indication de la présence d'une espèce imposée
67
			var ESPECE_IMPOSEE = "<?=$espece_imposee; ?>";
71
			var ESPECE_IMPOSEE = "<?=$espece_imposee; ?>";
68
			// Tableau d'informations sur l'espèce imposée
72
			// Tableau d'informations sur l'espèce imposée
69
			var INFOS_ESPECE_IMPOSEE = <?=$infos_espece; ?>;
73
			var INFOS_ESPECE_IMPOSEE = <?=$infos_espece; ?>;
70
 
74
 
71
			// Indication des version utilisées de chaque référentiel
75
			// Indication des version utilisées de chaque référentiel
72
			var PROJETS_VERSIONS = <?=json_encode($projets_versions)?>;
76
			var PROJETS_VERSIONS = <?=json_encode($projets_versions)?>;
73
			// Nombre d'élément dans les listes d'auto-complétion
77
			// Nombre d'élément dans les listes d'auto-complétion
74
			var AUTOCOMPLETION_ELEMENTS_NBRE = 20;
78
			var AUTOCOMPLETION_ELEMENTS_NBRE = 20;
75
			// URL du web service permettant l'auto-complétion des noms scientifiques.
79
			// URL du web service permettant l'auto-complétion des noms scientifiques.
76
			var SERVICE_AUTOCOMPLETION_NOM_SCI_URL_TPL = "<?=$url_ws_autocompletion_ns_tpl?>?"+
80
			var SERVICE_AUTOCOMPLETION_NOM_SCI_URL_TPL = "<?=$url_ws_autocompletion_ns_tpl?>?"+
77
					"masque={masque}&"+
81
					"masque={masque}&"+
78
					"recherche=etendue&"+
82
					"recherche=etendue&"+
79
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
83
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
80
					"retour.tri=alpharet&"+ // tri "à la CeL"
84
					"retour.tri=alpharet&"+ // tri "à la CeL"
81
					"ns.structure=au"+"&"+
85
					"ns.structure=au"+"&"+
82
					"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
86
					"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
83
 
87
 
84
			// Nombre d'observations max autorisé avant transmission
88
			// Nombre d'observations max autorisé avant transmission
85
			var OBS_MAX_NBRE = 10;
89
			var OBS_MAX_NBRE = 10;
86
			// Durée d'affichage en milliseconde des messages d'informations
90
			// Durée d'affichage en milliseconde des messages d'informations
87
			var DUREE_MESSAGE = 15000;
91
			var DUREE_MESSAGE = 15000;
88
 
92
 
89
			// URL du web service permettant de récupérer les infos d'une observation du CEL.
93
			// URL du web service permettant de récupérer les infos d'une observation du CEL.
90
			var SERVICE_OBS_URL = "<?=$url_ws_obs?>";
94
			var SERVICE_OBS_URL = "<?=$url_ws_obs?>";
91
			// URL du web service réalisant l'insertion des données dans la base du CEL.
95
			// URL du web service réalisant l'insertion des données dans la base du CEL.
92
			var SERVICE_SAISIE_URL = "<?=$url_ws_saisie?>";
96
			var SERVICE_SAISIE_URL = "<?=$url_ws_saisie?>";
93
			// Squelette d'URL du web service de l'annuaire.
97
			// Squelette d'URL du web service de l'annuaire.
94
			var SERVICE_ANNUAIRE_ID_URL = "<?=$url_ws_annuaire?>";
98
			var SERVICE_ANNUAIRE_ID_URL = "<?=$url_ws_annuaire?>";
95
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
99
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
96
			var SERVICE_NOM_COMMUNE_URL = "http://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
100
			var SERVICE_NOM_COMMUNE_URL = "http://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
-
 
101
			// Squelette d'URL du web service d'eFlore fournissant l'altitude
-
 
102
			var SERVICE_ALTITUDE_URL = "http://api.tela-botanica.org/service:eflore:0.1/nasa-srtm/altitude?lon={lon}&lat={lat}";
97
 
103
 
98
			// URL du marqueur à utiliser dans la carte Google Map
104
			// URL du marqueur à utiliser dans la carte Google Map
99
			var GOOGLE_MAP_MARQUEUR_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/marqueurs/epingle.png";
105
			var GOOGLE_MAP_MARQUEUR_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/marqueurs/epingle.png";
100
			// URL de l'icône du chargement en cours
106
			// URL de l'icône du chargement en cours
101
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/icones/chargement.gif";
107
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/icones/chargement.gif";
102
			// URL de l'icône du chargement en cours d'une image
108
			// URL de l'icône du chargement en cours d'une image
103
			var CHARGEMENT_IMAGE_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/icones/chargement-image.gif";
109
			var CHARGEMENT_IMAGE_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/icones/chargement-image.gif";
104
			// URL de l'icône du calendrier
110
			// URL de l'icône du calendrier
105
			var CALENDRIER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/icones/calendrier.png";
111
			var CALENDRIER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/icones/calendrier.png";
106
			// URL de l'icône du calendrier
112
			// URL de l'icône du calendrier
107
			var PAS_DE_PHOTO_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/icones/pasdephoto.png";
113
			var PAS_DE_PHOTO_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/arbres-tetards/img/icones/pasdephoto.png";
108
 
114
 
109
		//]]>
115
		//]]>
110
		</script>
116
		</script>
111
		<script src="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/js/arbres-tetards.js"></script>
117
		<script src="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/js/arbres-tetards.js"></script>
112
 
118
 
113
		<!-- CSS -->
119
		<!-- CSS -->
114
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" />
120
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" />
115
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap.min.css" />
121
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap.min.css" />
116
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap-responsive.min.css" />
122
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap-responsive.min.css" />
117
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/css/bootstrap-modal.css" />
123
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/css/bootstrap-modal.css" />
118
		<link rel="stylesheet" href="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/css/<?=isset($_GET['style']) ? $_GET['style'] : 'arbres-tetards'?>.css" />
124
		<link rel="stylesheet" href="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/css/<?=isset($_GET['style']) ? $_GET['style'] : 'arbres-tetards'?>.css" />
119
 
125
 
120
	</head>
126
	</head>
121
 
127
 
122
	<body data-spy="scroll">
128
	<body data-spy="scroll">
123
		<div class="container">
129
		<div class="container">
124
			<div class="row-fluid page-header">
130
			<div class="row-fluid page-header">
125
				<div>
131
				<div>
126
					<h1>
132
					<h1>
127
						<img id="logo-titre" class="span1" src="<?=$url_base?>/modules/saisie/squelettes/arbres-tetards/img/logos/gentiana.png" alt="Gentiana" />
133
						<img id="logo-titre" class="span1" src="<?=$url_base?>/modules/saisie/squelettes/arbres-tetards/img/logos/gentiana.png" alt="Gentiana" />
128
						Arbres têtards de l'Isère
134
						Arbres têtards de l'Isère
129
					</h1>
135
					</h1>
130
				</div>
136
				</div>
131
			</div>
137
			</div>
132
			<div class="row-fluid">
138
			<div class="row-fluid">
133
				<div class="span6">
139
				<div class="span6">
134
					<div class="row-fluid">
140
					<div class="row-fluid">
135
						<div id="intro" class ="well collapse in">
141
						<div id="intro" class ="well collapse in">
136
							<a class="fermer" data-toggle="collapse" data-target="#intro">
142
							<a class="fermer" data-toggle="collapse" data-target="#intro">
137
								<h3 class="titre">
143
								<h3 class="titre">
138
									Le projet
144
									Le projet
139
									<i class="icone icon-plus-sign"></i>
145
									<i class="icone icon-plus-sign"></i>
140
								</h3>
146
								</h3>
141
							</a>
147
							</a>
142
							<p>
148
							<p>
143
								Les arbres têtards (trognes), sont des arbres taillés exploités depuis des siècles
149
								Les arbres têtards (trognes), sont des arbres taillés exploités depuis des siècles
144
								pour leurs branches ou leurs feuilles.
150
								pour leurs branches ou leurs feuilles.
145
							</p>
151
							</p>
146
							<p>
152
							<p>
147
								La taille consiste à couper la tête de l’arbre à environ 2m du sol. Les branches
153
								La taille consiste à couper la tête de l’arbre à environ 2m du sol. Les branches
148
								repoussent en couronne au sommet du tronc et sont taillées au même endroit tous
154
								repoussent en couronne au sommet du tronc et sont taillées au même endroit tous
149
								les 5 à 12 ans. De nombreuses espèces de feuillus peuvent être taillées en têtard,
155
								les 5 à 12 ans. De nombreuses espèces de feuillus peuvent être taillées en têtard,
150
								les plus fréquentes sont les saules, les frênes, les peupliers et aussi les muriers.
156
								les plus fréquentes sont les saules, les frênes, les peupliers et aussi les muriers.
151
							</p>
157
							</p>
152
							<p>
158
							<p>
153
								Ces arbres, témoins d’anciennes pratiques agricoles, embellissent le paysage,
159
								Ces arbres, témoins d’anciennes pratiques agricoles, embellissent le paysage,
154
								retiennent les berges, participent au maintien des zones humides et abritent de
160
								retiennent les berges, participent au maintien des zones humides et abritent de
155
								nombreuses espèces végétales et animales dont beaucoup sont menacées.<br />
161
								nombreuses espèces végétales et animales dont beaucoup sont menacées.<br />
156
								Victimes de la modernisation de l’agriculture et de l’urbanisation des zones
162
								Victimes de la modernisation de l’agriculture et de l’urbanisation des zones
157
								rurales, ces arbres remarquables disparaissent !
163
								rurales, ces arbres remarquables disparaissent !
158
							</p>
164
							</p>
159
							<p>
165
							<p>
160
								C’est pourquoi <a href="http://www.gentiana.org/" target="_blank">Gentiana</a>
166
								C’est pourquoi <a href="http://www.gentiana.org/" target="_blank">Gentiana</a>
161
								a lancé un programme de suivi, de sauvegarde et de restauration des arbres têtards
167
								a lancé un programme de suivi, de sauvegarde et de restauration des arbres têtards
162
								en Isère. Ce projet a pour but de mieux faire connaître ces arbres, de les entretenir,
168
								en Isère. Ce projet a pour but de mieux faire connaître ces arbres, de les entretenir,
163
								de restaurer les arbres à l’abandon et d’en replanter.
169
								de restaurer les arbres à l’abandon et d’en replanter.
164
							</p>
170
							</p>
165
							<p>
171
							<p>
166
								La première chose à faire est un état des lieux des arbres têtards sur tout le
172
								La première chose à faire est un état des lieux des arbres têtards sur tout le
167
								département de l’Isère.<br />
173
								département de l’Isère.<br />
168
								<strong>Nous avons besoin de vous pour améliorer notre connaissance !</strong><br />
174
								<strong>Nous avons besoin de vous pour améliorer notre connaissance !</strong><br />
169
								Vous pouvez nous aider en nous signalant les arbres têtards que vous connaissez
175
								Vous pouvez nous aider en nous signalant les arbres têtards que vous connaissez
170
								à l’aide du formulaire suivant.
176
								à l’aide du formulaire suivant.
171
							</p>
177
							</p>
172
						</div>
178
						</div>
173
					</div>
179
					</div>
174
				</div>
180
				</div>
175
 
181
 
176
				<div class="span6">
182
				<div class="span6">
177
					<div class="row-fluid">
183
					<div class="row-fluid">
178
						<div id="aide" class="well collapse in">
184
						<div id="aide" class="well collapse in">
179
							<a class="fermer" data-toggle="collapse" data-target="#aide">
185
							<a class="fermer" data-toggle="collapse" data-target="#aide">
180
								<h3 class="titre">
186
								<h3 class="titre">
181
									Aide
187
									Aide
182
									<i class="icone icon-plus-sign"></i>
188
									<i class="icone icon-plus-sign"></i>
183
								</h3>
189
								</h3>
184
							</a>
190
							</a>
185
							<p>
191
							<p>
186
								Cet outil vous permet de partager simplement vos observations avec
192
								Cet outil vous permet de partager simplement vos observations avec
187
								<a href="http://www.gentiana.org/" target="_blank">Gentiana</a> et le
193
								<a href="http://www.gentiana.org/" target="_blank">Gentiana</a> et le
188
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
194
								<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>).
195
								(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
196
								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>.
197
								<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'.
198
								Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
193
								Elles apparaissent immédiatement sur les
199
								Elles apparaissent immédiatement sur les
194
								<a href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
200
								<a href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
195
							</p>
201
							</p>
196
							<p class="discretion">
202
							<p class="discretion">
197
								Pour toute question ou remarque,
203
								Pour toute question ou remarque,
198
								<a href="<?= $url_remarques ?>?email=cel_remarques@tela-botanica.org&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
204
								<a href="<?= $url_remarques ?>?email=cel_remarques@tela-botanica.org&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
199
									target="_blank"
205
									target="_blank"
200
									onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
206
									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>
207
									contactez-nous</a>
202
							</p>
208
							</p>
203
							<p class="discretion">
209
							<p class="discretion">
204
								Une fois familiarisé avec l'interface vous pouvez cliquer sur ce bouton pour désactiver l'aide.
210
								Une fois familiarisé avec l'interface vous pouvez cliquer sur ce bouton pour désactiver l'aide.
205
								<button id="btn-aide" class="btn btn-mini btn-success">
211
								<button id="btn-aide" class="btn btn-mini btn-success">
206
									<span class="icon-question-sign icon-white"></span>
212
									<span class="icon-question-sign icon-white"></span>
207
									<span id="btn-aide-txt" >Désactiver l'aide</span>
213
									<span id="btn-aide-txt" >Désactiver l'aide</span>
208
								</button>
214
								</button>
209
							</p>
215
							</p>
210
						</div>
216
						</div>
211
					</div>
217
					</div>
212
				</div>
218
				</div>
213
			</div>
219
			</div>
214
			<div class="row-fluid">
220
			<div class="row-fluid">
215
				<div class="well">
221
				<div class="well">
216
					<h2>Observateur</h2>
222
					<h2>Observateur</h2>
217
					<form id="form-observateur" action="#" class="" autocomplete="on">
223
					<form id="form-observateur" action="#" class="" autocomplete="on">
218
						<div class="row-fluid">
224
						<div class="row-fluid">
219
							<div class="span6 control-group has-tooltip" data-placement="right"
225
							<div class="span6 control-group has-tooltip" data-placement="right"
220
								title="Saisissez le courriel avec lequel vous être inscrit à Tela Botanica.
226
								title="Saisissez le courriel avec lequel vous être inscrit à Tela Botanica.
221
									Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
227
									Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
222
									ultérieurement. Des informations complémentaires vont vous être
228
									ultérieurement. Des informations complémentaires vont vous être
223
									demandées : prénom et nom.">
229
									demandées : prénom et nom.">
224
								<label for="courriel"  class="control-label"
230
								<label for="courriel"  class="control-label"
225
									title="Veuillez saisir votre adresse courriel.">
231
									title="Veuillez saisir votre adresse courriel.">
226
									<strong class="obligatoire">*</strong> Courriel
232
									<strong class="obligatoire">*</strong> Courriel
227
								</label>
233
								</label>
228
								<div class="input-prepend">
234
								<div class="input-prepend">
229
									<span class="add-on">
235
									<span class="add-on">
230
										<i class="icon-envelope"></i>
236
										<i class="icon-envelope"></i>
231
									</span>
237
									</span>
232
									<input id="courriel" name="courriel" type="text"/>
238
									<input id="courriel" name="courriel" type="text"/>
233
									<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
239
									<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
234
								</div>
240
								</div>
235
							</div>
241
							</div>
236
							<div id="zone-courriel-confirmation" class="span6 control-group hidden">
242
							<div id="zone-courriel-confirmation" class="span6 control-group hidden">
237
								<label for="courriel_confirmation" class="control-label"
243
								<label for="courriel_confirmation" class="control-label"
238
									title="Veuillez saisir confirmer le courriel.">
244
									title="Veuillez saisir confirmer le courriel.">
239
									<strong class="obligatoire">*</strong> Courriel (confirmation)
245
									<strong class="obligatoire">*</strong> Courriel (confirmation)
240
								</label>
246
								</label>
241
								<div class="input-prepend">
247
								<div class="input-prepend">
242
									<span class="add-on">
248
									<span class="add-on">
243
										<i class="icon-envelope"></i>
249
										<i class="icon-envelope"></i>
244
									</span>
250
									</span>
245
									<input id="courriel_confirmation" name="courriel_confirmation" type="text"/>
251
									<input id="courriel_confirmation" name="courriel_confirmation" type="text"/>
246
								</div>
252
								</div>
247
							</div>
253
							</div>
248
						</div>
254
						</div>
249
						<div id="zone-prenom-nom" class="row-fluid hidden">
255
						<div id="zone-prenom-nom" class="row-fluid hidden">
250
							<div class="span6">
256
							<div class="span6">
251
								<label for="prenom">Prénom</label>
257
								<label for="prenom">Prénom</label>
252
								<div>
258
								<div>
253
									<input id="prenom" name="prenom" type="text"/>
259
									<input id="prenom" name="prenom" type="text"/>
254
								</div>
260
								</div>
255
							</div>
261
							</div>
256
							<div class="span6">
262
							<div class="span6">
257
								<label for="nom">Nom</label>
263
								<label for="nom">Nom</label>
258
								<div>
264
								<div>
259
									<input id="nom" name="nom"  type="text"/>
265
									<input id="nom" name="nom"  type="text"/>
260
								</div>
266
								</div>
261
							</div>
267
							</div>
262
						</div>
268
						</div>
263
					</form>
269
					</form>
264
				</div>
270
				</div>
265
			</div>
271
			</div>
266
			<!-- Messages d'erreur du formulaire-->
272
			<!-- Messages d'erreur du formulaire-->
267
			<div class="row">
273
			<div class="row">
268
				<div class="zone-alerte span6 offset3">
274
				<div class="zone-alerte span6 offset3">
269
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
275
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
270
						<a class="close">×</a>
276
						<a class="close">×</a>
271
						<h4 class="alert-heading">Information : copier/coller</h4>
277
						<h4 class="alert-heading">Information : copier/coller</h4>
272
						<p>
278
						<p>
273
							Merci de ne pas copier/coller votre courriel.<br/>
279
							Merci de ne pas copier/coller votre courriel.<br/>
274
							La double saisie permet de vérifier l'absence d'erreurs.
280
							La double saisie permet de vérifier l'absence d'erreurs.
275
						</p>
281
						</p>
276
					</div>
282
					</div>
277
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
283
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
278
						<a class="close">×</a>
284
						<a class="close">×</a>
279
						<h4 class="alert-heading">Information : courriel introuvable</h4>
285
						<h4 class="alert-heading">Information : courriel introuvable</h4>
280
						<p>
286
						<p>
281
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
287
							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/>
288
							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>,
289
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
284
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
290
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
285
						</p>
291
						</p>
286
					</div>
292
					</div>
287
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
293
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
288
						<a class="close">×</a>
294
						<a class="close">×</a>
289
						<h4 class="alert-heading">Information sur Google Map</h4>
295
						<h4 class="alert-heading">Information sur Google Map</h4>
290
						<div class="contenu"></div>
296
						<div class="contenu"></div>
291
					</div>
297
					</div>
292
				</div>
298
				</div>
293
			</div>
299
			</div>
294
			<div class="row-fluid">
300
			<div class="row-fluid">
295
				<div class="span12">
301
				<div class="span12">
296
					<div class="well">
302
					<div class="well">
297
						<div class="row-fluid">
303
						<div class="row-fluid">
-
 
304
							<div class="span12">
-
 
305
								<h2>Lieu du relevé</h2>
-
 
306
							</div>
-
 
307
						</div>
-
 
308
						<div class="row-fluid">
298
							<div class="span6">
309
							<div class="span6">
-
 
310
								<div class="row-fluid">
-
 
311
									<div class="span4">
-
 
312
										<label for="map_canvas" title="Veuillez localiser l'observation">
-
 
313
											Géolocalisation
-
 
314
										</label>
299
								<div>
315
									</div>
300
									<div class="row-fluid">
316
									<div class="span8 droite">
-
 
317
										<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
301
										<div class="span12">
318
											<div class="control-group">
302
											<h2>Lieu du relevé</h2>
319
												<label for="carte-recherche">Rechercher</label>
-
 
320
												<input id="carte-recherche" class="search-query has-tooltip" type="text" value=""
-
 
321
													title="Permet de centrer la carte sur le lieu recherché."
-
 
322
													placeholder="Centrer la carte sur un lieu..."/>
303
										</div>
323
											</div>
-
 
324
										</form>
304
									</div>
325
									</div>
-
 
326
								</div>
-
 
327
								<div class="row-fluid">
-
 
328
									<div class="span12">
-
 
329
										<div id="map-canvas" class="has-tooltip"
-
 
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
-
 
332
												le lieu souhaité."></div>
-
 
333
									</div>
-
 
334
								</div>
-
 
335
								<div class="row-fluid">
-
 
336
									<div id="info-altitude" class="span5">
-
 
337
										<span for="marqueur-altitude">Altitude : </span>
-
 
338
										<span id="marqueur-altitude"><span id="altitude"></span> m</span>
-
 
339
									</div>
-
 
340
 
-
 
341
									<div id="info-commune" class="span7">
-
 
342
										<span for="marqueur-commune">Commune : </span>
-
 
343
										<span id="marqueur-commune">
-
 
344
											<span id="commune-nom" class="commune-info"></span>
-
 
345
											(<span id="commune-code-insee" class="commune-info has-tooltip"
-
 
346
												title="Code INSEE de la commune"></span>)
-
 
347
										</span>
-
 
348
									</div>
-
 
349
								</div>
-
 
350
							</div>
-
 
351
							<div class="span6">
-
 
352
								<form id="form-station" action="#" enctype="multipart/form-data" autocomplete="on">
305
									<div class="row-fluid">
353
									<div class="row-fluid">
-
 
354
										<div class="span12 control-group has-tooltip"
-
 
355
											title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
306
										<div class="span4">
356
											<label class="control-label">
307
											<label for="map_canvas" title="Veuillez localiser l'observation">
357
												<strong class="obligatoire">*</strong>
308
												Géolocalisation
358
												Lieu-dit
-
 
359
												<input type="text" id="lieudit" name="lieudit"/>
309
											</label>
360
											</label>
310
										</div>
361
										</div>
311
										<div class="span8 droite">
-
 
312
											<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
-
 
313
												<div class="control-group">
-
 
314
													<label for="carte-recherche">Rechercher</label>
-
 
315
													<input id="carte-recherche" class="search-query has-tooltip" type="text" value=""
-
 
316
														title="Permet de centrer la carte sur le lieu recherché."
-
 
317
														placeholder="Centrer la carte sur un lieu..."/>
-
 
318
												</div>
-
 
319
											</form>
-
 
320
										</div>
-
 
321
									</div>
362
									</div>
-
 
363
 
322
									<div class="row-fluid">
364
									<div class="row-fluid">
-
 
365
										<div class="span12 control-group has-tooltip"
-
 
366
											title="Sélectionnez une ou plusieurs situations correspondant au site.">
323
										<div class="span12">
367
											<label class="span2 control-label">
-
 
368
												Situation(s)
-
 
369
											</label>
324
											<div id="map-canvas" class="has-tooltip"
370
											<div id="milieux-controls" class="controls">
-
 
371
												<div class="input-prepend">
-
 
372
													<div class="btn-group">
325
												title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
373
														<button class="btn dropdown-toggle" data-toggle="dropdown">
-
 
374
															<i class="icon-globe"></i>
326
													représentant votre station ou bien le glisser-déposer sur
375
															Sélectionner une ou plusieurs situations
327
													le lieu souhaité."></div>
376
															<span class="caret"></span>
-
 
377
														</button>
-
 
378
														<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
-
 
379
															<li>
-
 
380
																<label class="checkbox">
-
 
381
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="séparation de parcelle"/>
-
 
382
																	Séparation de parcelle
-
 
383
																</label>
-
 
384
															</li>
-
 
385
															<li>
-
 
386
																<label class="checkbox">
-
 
387
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="proximité de bâtiment"/>
-
 
388
																	Proximité de bâtiment
-
 
389
																</label>
-
 
390
															</li>
-
 
391
															<li>
-
 
392
																<label class="checkbox">
-
 
393
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="plein champ"/>
-
 
394
																	Plein champ
-
 
395
																</label>
-
 
396
															</li>
-
 
397
															<li>
-
 
398
																<label class="checkbox">
-
 
399
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="jardin de particulier"/>
-
 
400
																	Jardin de particulier
-
 
401
																</label>
-
 
402
															</li>
-
 
403
															<li>
-
 
404
																<label class="checkbox">
-
 
405
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="bord de cours d'eau"/>
-
 
406
																	Bord de cours d'eau
-
 
407
																</label>
-
 
408
															</li>
-
 
409
															<li>
-
 
410
																<label class="checkbox">
-
 
411
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="bord de chemin"/>
-
 
412
																	Bord de chemin
-
 
413
																</label>
-
 
414
															</li>
-
 
415
															<li>
-
 
416
																<label class="checkbox">
-
 
417
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="intégré à une haie"/>
-
 
418
																	Intégré à une haie
-
 
419
																</label>
-
 
420
															</li>
-
 
421
															<li>
-
 
422
																<label class="checkbox">
-
 
423
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="en forêt"/>
-
 
424
																	En forêt
-
 
425
																</label>
-
 
426
															</li>
-
 
427
															<li>
-
 
428
																<label class="checkbox">
-
 
429
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="en zone humide"/>
-
 
430
																	En zone humide
-
 
431
																</label>
-
 
432
															</li>
-
 
433
														</ul>
-
 
434
													</div>
-
 
435
												</div>
-
 
436
											</div>
328
										</div>
437
										</div>
329
									</div>
438
									</div>
-
 
439
 
330
									<div class="row-fluid">
440
									<div class="row-fluid">
331
										<label class="span7 control-label">
441
										<label class="span12 control-label">
332
											<a href="#" class="afficher-coord">Afficher</a>
442
											<a href="#" class="afficher-coord btn">Afficher les coordonnées (WGS 84 et Lambert 93)</a>
333
											<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
443
											<a href="#" class="afficher-coord btn" style="display:none;">Cacher les coordonnées (WGS 84 et Lambert 93)</a>
334
											les coordonnées géographiques
-
 
335
											<span id="lat-lon-info" class="info has-tooltip"
-
 
336
												title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
-
 
337
												(WGS84)
-
 
338
											</span>
-
 
339
										</label>
444
										</label>
340
										<div id="info-commune" class="span5">
-
 
341
											<span for="marqueur-commune">Commune : </span>
-
 
342
											<span id="marqueur-commune">
-
 
343
												<span id="commune-nom" class="commune-info"></span>
-
 
344
												(<span id="commune-code-insee" class="commune-info has-tooltip"
-
 
345
								    				title="Code INSEE de la commune"></span>)
-
 
346
											</span>
-
 
347
										</div>
-
 
348
									</div>
445
									</div>
349
									<form id="form-station" action="#" enctype="multipart/form-data" autocomplete="on">
-
 
350
										<div id="coordonnees-geo" class="well" style="display:none;">
446
									<div id="coordonnees-geo" class="well" style="display:none;">
351
											<div class="row-fluid form-inline">
-
 
352
												<div id="coord-lat" class="span4">
-
 
353
													<label for="latitude">Latitude</label>
-
 
354
													<div>
-
 
355
														<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
-
 
356
													</div>
-
 
357
												</div>
-
 
358
												<div id="coord-lng" class="span4">
-
 
359
													<label for="longitude">Longitude</label>
-
 
360
													<div>
-
 
361
														<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
-
 
362
													</div>
-
 
363
												</div>
-
 
364
												<div class="span1">
-
 
365
													<div>
-
 
366
														<input id="geolocaliser" type="button" value="Voir sur la carte"
-
 
367
															class="has-tooltip"
-
 
368
															title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
-
 
369
													</div>
-
 
370
												</div>
-
 
371
									    	</div>
-
 
372
										</div>
-
 
373
										<div class="row-fluid">
447
										<div class="row-fluid">
374
											<div class="span6 control-group has-tooltip"
448
											<div id="coord-lat" class="span4">
375
												title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
-
 
376
												<label class="control-label">
449
												<label>Latitude
377
													Lieu-dit
450
													<input id="latitude" class="input-mini" name="latitude" type="text"
378
													<input type="text" id="lieudit" class="" name="lieudit"/>
451
														title="Latitude (WGS 84)" value=""/>
379
												</label>
452
												</label>
380
											</div>
453
											</div>
381
											<div class="span6 control-group has-tooltip"
454
											<div id="coord-lng" class="span4">
382
												title="Lieu précis de l'observation définissant une unité écologique homogène (ex: le pré derrière la maison)." >
-
 
383
												<label class="control-label">
455
												<label>Longitude
384
													Station
456
													<input id="longitude" class="input-mini" name="longitude" type="text"
385
													<input type="text" id="station" class="" name="station"/>
457
														title="Longitude (WGS 84)" value=""/>
386
												</label>
458
												</label>
387
											</div>
459
											</div>
-
 
460
											<div class="span1">
-
 
461
												<input id="geolocaliser" type="button" value="Voir sur la carte"
-
 
462
													class="btn has-tooltip"
-
 
463
													title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
-
 
464
											</div>
388
										</div>
465
										</div>
389
 
-
 
390
										<div class="row-fluid">
466
										<div class="row-fluid form-inline">
391
											<div class="span12 control-group" >
467
											<div id="coord-l93-x" class="span4">
392
												<label class="span12 control-label">
468
												<label >X Lambert 93
-
 
469
													<input id="l93-x" disabled type="text" class="input-mini obs-chp-etendu"
393
													<strong class="obligatoire">*</strong>
470
															name="coordonneeLambert93X"
-
 
471
															data-label="Lambert 93 X"
394
													Milieu
472
															value=""/>
395
													<select id="milieu" class="span8" name="milieu">
473
												</label>
396
														<option selected value="">Sélectionnez un milieu</option>
474
											</div>
397
														<?php foreach ($milieux as $milieu => $description) : ?>
475
											<div id="coord-l93-y" class="span4">
398
														<option value="<?=strtolower($milieu)?>">
476
												<label>Y Lambert 93
399
															<?=$milieu?> <?=($description != '') ? "($description)" : '' ?>
477
													<input id="l93-y" disabled type="text" class="input-mini obs-chp-etendu"
400
														</option>
478
															name="coordonneeLambert93Y"
401
														<?php endforeach; ?>
479
															data-label="Lambert 93 Y"
402
														<option value="">Autre : préciser dans les commentaires.</option>
-
 
403
													</select>
480
															value=""/>
404
												</label>
481
												</label>
405
											</div>
482
											</div>
406
										</div>
483
										</div>
-
 
484
									</div>
-
 
485
								</form>
-
 
486
							</div>
-
 
487
						</div>
-
 
488
 
-
 
489
						<div class="row-fluid">
-
 
490
							<div class="span6">
-
 
491
								<form id="form-obs" class="form-horizontal" action="#" autocomplete="on">
-
 
492
									<h2>Arbre observé</h2>
407
 
493
									<input id="referentiel" type="hidden" value="bdtfx" />
408
 
494
 
-
 
495
									<div class="row-fluid">
-
 
496
										<div class="span12 control-group has-tooltip"
409
										<div class="row-fluid">
497
												title="Vous pouvez cliquer sur l'icône de calendrier pour
-
 
498
													sélectionner une date dans un calendrier.">
-
 
499
											<label for="date"class="control-label"  title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
-
 
500
												<strong class="obligatoire">*</strong>
410
											<div class="span12 control-group has-tooltip"
501
												Date du relevé
-
 
502
											</label>
-
 
503
											<div class="controls">
-
 
504
												<div class="input-prepend">
-
 
505
													<span id="date-icone" class="add-on"></span>
-
 
506
													<input id="date" name="date" type="text" placeholder="jj/mm/aaaa" />
-
 
507
												</div>
-
 
508
											</div>
-
 
509
										</div>
-
 
510
									</div>
-
 
511
 
-
 
512
									<div class="row-fluid">
-
 
513
										<div class="span12">
-
 
514
											<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
-
 
515
												title="Sélectionnez une espèce dans la liste déroulante par son nom latin
411
												title="Indiquez la surface en m² de la station au sein de laquelle la plante est présente.">
516
												ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
412
												<label class="span12 control-label">
-
 
413
													<strong class="obligatoire">*</strong>
-
 
414
													Surface de la station
-
 
415
													<select id="station-surface" class="span8 obs-chp-etendu" name="stationSurface"
-
 
416
															data-label="Surface couverte dans la station">
-
 
417
														<option selected value="">Sélectionnez une surface</option>
-
 
418
														<option value="0-5">&lt;5 m²</option>
-
 
419
														<option value="5-10">5-10 m²</option>
-
 
420
														<option value="10-50">10-50 m²</option>
-
 
421
														<option value="50-100">50-100 m²</option>
-
 
422
														<option value="100-500">100-500 m²</option>
-
 
423
														<option value="500-1000">500-1000 m²</option>
517
												<label for="taxon-liste" class="control-label" title="Choisissez l'espèce rencontrée.">
424
														<option value="1000+">&gt; 1000 m²</option>
518
													<strong class="obligatoire">*</strong>
-
 
519
													Espèces
-
 
520
												</label>
-
 
521
												<div class="controls">
-
 
522
													<div class="input-prepend ">
-
 
523
														<span class="add-on">
-
 
524
															<i class="icon-leaf"></i>
-
 
525
														</span>
-
 
526
 
-
 
527
														<select id="taxon-liste" name="taxon-liste">
-
 
528
															<option value="" selected>Sélectionner une espèce</option>
-
 
529
 
-
 
530
															<optgroup id="taxon-liste-noms">
-
 
531
																<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
-
 
532
																	<option
-
 
533
																		class="<?=$taxon['nom_type'] ?>"
-
 
534
																		value="<?=$taxon['num_nom'] ?>"
-
 
535
																		title="<?=$taxon['nom_title'] ?>"
-
 
536
																		data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
-
 
537
																		>
-
 
538
																		<?=$taxon['nom_a_afficher']?>
-
 
539
																	</option>
-
 
540
																<?php endforeach; ?>
-
 
541
															</optgroup>
-
 
542
															<optgroup id="taxon-liste-special">
-
 
543
																<?php foreach ($taxons['speciaux'] as $taxon) :?>
-
 
544
																	<option
-
 
545
																		class="<?=$taxon['nom_type'] ?>"
-
 
546
																		value="<?=$taxon['num_nom'] ?>"
-
 
547
																		title="<?=$taxon['nom_title'] ?>"
-
 
548
																		data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
-
 
549
																		>
-
 
550
																		<?=$taxon['nom_a_afficher']?>
-
 
551
																	</option>
-
 
552
																<?php endforeach; ?>
-
 
553
																<option value="?">Autre espèce</option>
-
 
554
															</optgroup>
-
 
555
														</select>
425
													</select>
556
													</div>
426
												</label>
557
												</div>
427
											</div>
-
 
428
										</div>
558
											</div>
429
 
559
										</div>
430
 
560
									</div>
-
 
561
									<div id="taxon-input-groupe" class="row-fluid hidden">
-
 
562
										<div class="span12">
-
 
563
											<div class="control-group has-tooltip"
-
 
564
												title="Sélectionnez une espèce dans la liste déroulante pour lier
431
										<div class="row-fluid">
565
													votre nom au référentiel. Si vous le désirez vous pouvez aussi saisir
-
 
566
													un nom absent du référentiel (Ex. : 'fleur violette' ou 'Viola sp.1')." >
-
 
567
												<label for="taxon" class="control-label" title="Choisissez l'espèce rencontrée.">
432
											<div class="span12">
568
													<strong class="obligatoire">*</strong>
-
 
569
													Autre espèce
433
												<label for="milieuCommentaire">Commentaires sur le milieu</label>
570
												</label>
434
												<div>
571
												<div class="controls">
435
													<textarea id="milieu-commentaire" class="span12 obs-chp-etendu" rows="7"
572
													<input id="taxon" name="taxon" type="text" class="span12"
436
														name="milieuCommentaire" data-label="Commentaires sur le milieu"
573
														placeholder="Autre espèce (ou indication sur la plante)"
437
														placeholder="Vous pouvez éventuellement ajouter des informations complémentaires concernant le milieu"></textarea>
574
														value="<?= $nom_sci_espece_defaut; ?>" />
438
												</div>
575
												</div>
439
											</div>
576
											</div>
440
										</div>
577
										</div>
441
									</form>
-
 
442
								</div>
578
									</div>
443
							</div>
-
 
444
							<div class="span6">
-
 
445
								<form id="form-obs" action="#" autocomplete="on">
-
 
446
									<h2>Observation</h2>
-
 
447
									<input id="referentiel" type="hidden" value="bdtfx" />
-
 
448
 
579
 
449
									<div class="row-fluid">
580
									<div class="row-fluid">
450
										<div id="taxon-input-groupe" class="span8 has-tooltip"
581
										<div class="span12 control-group has-tooltip"
451
											title="Sélectionnez une espèce dans la liste déroulante pour lier
-
 
452
												votre nom au référentiel selectionné. Si vous
-
 
453
												le désirez vous pouvez aussi saisir un nom absent du référentiel
-
 
454
												(Ex. : 'fleur violette' ou 'viola sinensis???')." >
582
												title="Indiquez la certitude de votre détermination.">
455
											<label class="span12 control-label">Espèce
583
											<label for="certitude" class="control-label">
456
												<div class="input-prepend">
-
 
457
													<span class="add-on"><i class="icon-leaf"></i></span>
-
 
458
													<input type="text" id="taxon" name="taxon" value="<?= $nom_sci_espece_defaut; ?>" />
584
												<strong class="obligatoire">*</strong>
459
												</div>
585
												Identification de l'arbre
-
 
586
											</label>
-
 
587
											<div class="controls">
-
 
588
												<select id="certitude" class="span12" name="certitude">
-
 
589
													<option selected value="">Sélectionnez une certitude</option>
-
 
590
													<option value="certaine">Certaine</option>
-
 
591
													<option value="douteuse">Douteuse</option>
-
 
592
													<option value="A déterminer">À déterminer</option>
-
 
593
												</select>
460
											</label>
594
											</div>
461
										</div>
595
										</div>
462
									</div>
596
									</div>
463
 
597
 
464
									<div class="row-fluid">
598
									<div class="row-fluid">
465
										<div class="span12 control-group has-tooltip"
599
										<div class="span12 control-group has-tooltip"
466
												title="Vous pouvez cliquer sur l'icône de calendrier pour
600
												title="Indiquez le type de formation de l'arbre ou des arbres têtards.">
467
													sélectionner une date dans un calendrier.">
601
											<label for="formation" class="control-label">
468
											<label class="span12 control-label"  title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
-
 
469
												<strong class="obligatoire">*</strong>
602
												<strong class="obligatoire">*</strong>
-
 
603
												Formation
-
 
604
											</label>
-
 
605
											<div class="controls">
-
 
606
												<select id="formation" class="span12 obs-chp-etendu"
-
 
607
														name="arbreTetardFormation"
-
 
608
														data-label="Type de formation">
-
 
609
													<option selected value="">Sélectionnez une formation</option>
-
 
610
													<option value="alignement">Arbres d'alignement</option>
-
 
611
													<option value="isolé">Arbre isolé</option>
470
												Date du relevé
612
												</select>
-
 
613
											</div>
-
 
614
										</div>
-
 
615
									</div>
-
 
616
									<div id="aligne-nbre-groupe" class="row-fluid form-inline hidden">
471
												<div class="input-prepend">
617
										<div class="span12">
-
 
618
											<div class="control-group has-tooltip"
-
 
619
												title="Indiquez le nombre d'arbres têtards alignés." >
472
													<span id="date-icone" class="add-on"></span>
620
												<label for="aligne-nbre" class="control-label">
-
 
621
													<strong class="obligatoire">*</strong>
-
 
622
													Nombre d'arbres
-
 
623
												</label>
-
 
624
												<div class="controls">
473
													<input id="date" name="date" type="text" placeholder="jj/mm/aaaa" />
625
													<input id="aligne-nbre" type="number" class="span2 obs-chp-etendu"
-
 
626
														name="arbreTetardAligneNbre"
-
 
627
														data-label="Nombre d'arbres d'alignement"
-
 
628
														value="" />
474
												</div>
629
												</div>
-
 
630
											</div>
-
 
631
										</div>
-
 
632
									</div>
-
 
633
 
-
 
634
									<div class="row-fluid">
-
 
635
										<div class="span12 control-group has-tooltip"
-
 
636
												title="Indiquez si des cavités sont présentes sur l'arbre.">
-
 
637
											<label for="cavites" class="control-label">
-
 
638
												Cavités
475
											</label>
639
											</label>
-
 
640
											<div class="controls">
-
 
641
												<select id="cavites" class="span12 obs-chp-etendu"
-
 
642
														name="arbreTetardPresenceCavite"
-
 
643
														data-label="Présence de cavités">
-
 
644
													<option selected value="">Sélectionnez la présence de cavités</option>
-
 
645
													<option value="aucune">Aucune</option>
-
 
646
													<option value="petite">Oui, petite(s)</option>
-
 
647
													<option value="grande">Oui, grande(s)</option>
-
 
648
												</select>
-
 
649
											</div>
476
										</div>
650
										</div>
477
									</div>
651
									</div>
478
 
652
 
479
									<div class="row-fluid">
653
									<div class="row-fluid">
480
										<div class="span12 control-group has-tooltip"
654
										<div class="span12 control-group has-tooltip"
481
												title="Indiquez ici le pourcentage de recouvrement par la plante sur la surface de la station.">
655
												title="Indiquez la circonférence à 1m du sol.">
482
											<label class="span12 control-label">
656
											<label for="circonference" class="control-label">
483
												<strong class="obligatoire">*</strong>
657
												Circonférence
-
 
658
											</label>
484
												Recouvrement par la plante de la surface de la station
659
											<div class="controls">
485
												<select id="recouvrement" class="span8 obs-chp-etendu" name="recouvrement"
660
												<select id="circonference" class="span12 obs-chp-etendu"
486
														data-label="Recouvrement au sein de la surface couverte dans la station">
661
														name="arbreTetardCirconferenceA1m"
487
													<option selected value="">Sélectionnez un recouvrement</option>
662
														data-label="Circonférence à 1 m du sol">
488
													<option value="+">&lt;1 %</option>
663
													<option selected value="">Sélectionnez la circonférence (à 1m du sol)</option>
489
													<option value="1">1-5 %</option>
664
													<option value="0-0,5">0 à 0,5m</option>
490
													<option value="2">5-25 %</option>
665
													<option value="0,5-2">0,5 à 2m</option>
491
													<option value="3">25-50 %</option>
666
													<option value="2-3">2 à 3m</option>
492
													<option value="4">50-75 %</option>
-
 
493
													<option value="5">75-100 %</option>
667
													<option value="+3">&gt; à 3m</option>
494
												</select>
668
												</select>
-
 
669
											</div>
-
 
670
										</div>
-
 
671
									</div>
-
 
672
 
-
 
673
									<div class="row-fluid">
-
 
674
										<div class="span12 control-group has-tooltip"
-
 
675
												title="Indiquez la hauteur de la tête.">
-
 
676
											<label for="hauteur-tete" class="control-label">
-
 
677
												Hauteur de la tête
495
											</label>
678
											</label>
-
 
679
											<div class="controls">
-
 
680
												<select id="hauteur-tete" class="span12 obs-chp-etendu"
-
 
681
														name="arbreTetardHauteurTete"
-
 
682
														data-label="Hauteur de la tête">
-
 
683
													<option selected value="">Sélectionnez la hauteur</option>
-
 
684
													<option value="0-1,5">0 à 1,5m</option>
-
 
685
													<option value="1,5-3">1,5 à 3m</option>
-
 
686
													<option value="+3">&gt; à 3m</option>
-
 
687
												</select>
-
 
688
											</div>
496
										</div>
689
										</div>
497
									</div>
690
									</div>
498
 
691
 
499
									<div class="row-fluid">
692
									<div class="row-fluid">
500
										<div class="span12">
693
										<div class="span12">
501
											<label for="notes">Notes</label>
694
											<label for="presence-sp">Espèces présentes sur l'arbre (végétale ou animale)</label>
502
											<div>
695
											<div>
503
												<textarea id="notes" class="span12" rows="7" name="notes"
696
												<textarea id="presence-sp" class="span12 obs-chp-etendu" rows="7"
-
 
697
													name="arbreTetardPresenceSp"
-
 
698
													data-label="Présence d'espèces sur l'arbre"
504
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
699
													placeholder="Vous pouvez éventuellement indiquez des informations du type : Champignons ; Lierre ; Mousses ; Lichens ; Autre plante... Larve d'insecte saproxylique ; Galerie dans le bois ; Pelote de réjection ; Nid ; Crotte ; Trou"></textarea>
-
 
700
											</div>
-
 
701
										</div>
-
 
702
									</div>
-
 
703
								</form>
-
 
704
							</div>
-
 
705
							<div class="span6">
-
 
706
								<form id="form-gestion" class="form-horizontal" action="#" autocomplete="on">
-
 
707
									<h2>Gestion de l'arbre</h2>
-
 
708
 
-
 
709
									<div class="row-fluid">
-
 
710
										<div class="span12 control-group has-tooltip"
-
 
711
												title="Indiquez le type de taille de l'arbre.">
-
 
712
											<label for="taille-type" class="control-label">
-
 
713
												Type de taille
-
 
714
											</label>
-
 
715
											<div class="controls">
-
 
716
												<select id="taille-type" class="span12 obs-chp-etendu"
-
 
717
														name="arbreTetardTailleType"
-
 
718
														data-label="Type de taille">
-
 
719
													<option selected value="">Sélectionnez le type de taille</option>
-
 
720
													<option value="trogne">Trogne</option>
-
 
721
													<option value="tête de chat">Tête de chat</option>
-
 
722
													<option value="émonde">Émonde</option>
-
 
723
													<option value="autre">Autre, précisez le type de taille dans les notes</option>
-
 
724
												</select>
-
 
725
											</div>
-
 
726
										</div>
-
 
727
									</div>
-
 
728
 
-
 
729
									<div class="row-fluid">
-
 
730
										<div class="span12 control-group has-tooltip"
-
 
731
												title="Indiquez le type d’entretien de l'arbre, en précisant la périodicité des coupes.">
-
 
732
											<label for="entretient" class="control-label">
-
 
733
												Type d'entretient
-
 
734
											</label>
-
 
735
											<div class="controls">
-
 
736
												<select id="entretient" class="span12 obs-chp-etendu"
-
 
737
														name="arbreTetardEntretientCoupe"
-
 
738
														data-label="Type d'entretient">
-
 
739
													<option selected value="">Sélectionnez la périodicité des coupes d'entretient</option>
-
 
740
													<option value="récente">Coupe récente (< 5 ans ; branches de diamètre < 10cm)</option>
-
 
741
													<option value="ancienne">Ancienne (5 à 10 ans ; diamètre des branches entre 10 et 15 cm )</option>
-
 
742
													<option value="non entretenu">Non entretenu ( diamètre des branches > 15 cm)</option>
-
 
743
												</select>
505
											</div>
744
											</div>
506
										</div>
745
										</div>
507
									</div>
746
									</div>
-
 
747
 
-
 
748
									<div class="row-fluid">
-
 
749
										<div class="span12 control-group has-tooltip"
-
 
750
												title="Indiquez l'état sanitaire de l'arbre têtard.">
-
 
751
											<label for="etat-sanitaire" class="control-label">
-
 
752
												État sanitaire
-
 
753
											</label>
-
 
754
											<div class="controls">
-
 
755
												<select id="etat-sanitaire" class="span12 obs-chp-etendu"
-
 
756
														name="arbreTetardEtatSanitaire"
-
 
757
														data-label="État sanitaire">
-
 
758
													<option selected value="">Sélectionnez l'état sanitaire</option>
-
 
759
													<option value="mort">Mort</option>
-
 
760
													<option value="dépérissant">Dépérissant</option>
-
 
761
													<option value="bon">Bon état général</option>
-
 
762
												</select>
-
 
763
											</div>
-
 
764
										</div>
508
 
765
									</div>
-
 
766
								</form>
-
 
767
 
-
 
768
								<div>
-
 
769
									<h2>Notes</h2>
-
 
770
									<textarea id="notes" form="form-obs" class="span12" rows="7" name="notes"
-
 
771
										placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation"></textarea>
-
 
772
								</div>
509
								</form>
773
 
510
								<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>?projet=<?=isset($_GET['projet']) ? $_GET['projet'] : 'defaut'?>"
774
								<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>?projet=<?=isset($_GET['projet']) ? $_GET['projet'] : 'defaut'?>"
511
									method="post" enctype="multipart/form-data">
775
									method="post" enctype="multipart/form-data">
512
									<h2>Image(s) de cette plante</h2>
776
									<h2>Image(s) de l'arbre</h2>
513
									<strong>Ajouter une image</strong>
777
									<strong>Ajouter une image</strong>
514
									<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
778
									<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
515
									<div id ="photos-conteneur">
779
									<div id ="photos-conteneur">
516
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
780
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
517
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
781
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
518
										<div id="miniatures">
782
										<div id="miniatures">
519
										</div>
783
										</div>
520
										<p class="miniature-msg" class="span12">&nbsp;</p>
784
										<p class="miniature-msg" class="span12">&nbsp;</p>
521
									</div>
785
									</div>
522
								</form>
786
								</form>
523
							</div>
787
							</div>
-
 
788
						</div>
-
 
789
 
524
							<div class="row-fluid">
790
						<div class="row-fluid">
-
 
791
 
-
 
792
						</div>
-
 
793
 
-
 
794
						<div class="row-fluid">
525
								<div class="span12 centre has-tooltip"
795
							<div class="span12 centre has-tooltip"
526
									title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
796
								title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
527
										ajouter votre observation à la liste à transmettre.">
797
									ajouter votre observation à la liste à transmettre.">
528
									<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
798
								<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
529
										Créer
799
									Créer
530
									</button>
800
								</button>
531
								</div>
-
 
532
							</div>
801
							</div>
533
						</div>
802
						</div>
534
					</div>
803
					</div>
535
				</div>
804
				</div>
536
			</div>
805
			</div>
537
 
806
 
538
			<!-- Messages d'erreur du formulaire-->
807
			<!-- Messages d'erreur du formulaire-->
539
			<div class="row">
808
			<div class="row">
540
				<div class="zone-alerte span6 offset3">
809
				<div class="zone-alerte span6 offset3">
541
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
810
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
542
						<a class="close">×</a>
811
						<a class="close">×</a>
543
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
812
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
544
						<p>
813
						<p>
545
							Vous venez d'ajouter votre 10ème observation.<br/>
814
							Vous venez d'ajouter votre 10ème observation.<br/>
546
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
815
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
547
						</p>
816
						</p>
548
					</div>
817
					</div>
549
				</div>
818
				</div>
550
				<div class="zone-alerte span6 offset3">
819
				<div class="zone-alerte span6 offset3">
551
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
820
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
552
						<a class="close">×</a>
821
						<a class="close">×</a>
553
						<h4 class="alert-heading">Information : champs en erreur</h4>
822
						<h4 class="alert-heading">Information : champs en erreur</h4>
554
						<p>
823
						<p>
555
							Certains champs du formulaire sont mal remplis.<br/>
824
							Certains champs du formulaire sont mal remplis.<br/>
556
							Veuillez vérifier vos données.
825
							Veuillez vérifier vos données.
557
						</p>
826
						</p>
558
					</div>
827
					</div>
559
				</div>
828
				</div>
560
			</div>
829
			</div>
561
 
830
 
562
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
831
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
563
			<div id="zone-liste-obs" class="row-fluid">
832
			<div id="zone-liste-obs" class="row-fluid">
564
				<div class="span12">
833
				<div class="span12">
565
					<div class="well">
834
					<div class="well">
566
						<div class="row-fluid">
835
						<div class="row-fluid">
567
							<div class="span8">
836
							<div class="span8">
568
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
837
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
569
							</div>
838
							</div>
570
							<div class="span4 droite">
839
							<div class="span4 droite">
571
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
840
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
572
									type="button" disabled="disabled"
841
									type="button" disabled="disabled"
573
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
842
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
574
									Transmettre
843
									Transmettre
575
								</button>
844
								</button>
576
							</div>
845
							</div>
577
						</div>
846
						</div>
578
						<div id="liste-obs" ></div>
847
						<div id="liste-obs" ></div>
579
						<div class="row">
848
						<div class="row">
580
							<div class="zone-alerte span6 offset3">
849
							<div class="zone-alerte span6 offset3">
581
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
850
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
582
									<a class="close">×</a>
851
									<a class="close">×</a>
583
									<h4 class="alert-heading">Attention : aucune observation</h4>
852
									<h4 class="alert-heading">Attention : aucune observation</h4>
584
									<p>Veuillez saisir des observations pour les transmettres.</p>
853
									<p>Veuillez saisir des observations pour les transmettres.</p>
585
								</div>
854
								</div>
586
 
855
 
587
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
856
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
588
									<a class="close">×</a>
857
									<a class="close">×</a>
589
									<h4 class="alert-heading">Information : transmission des observations</h4>
858
									<h4 class="alert-heading">Information : transmission des observations</h4>
590
									<div class="alert-txt"></div>
859
									<div class="alert-txt"></div>
591
								</div>
860
								</div>
592
 
861
 
593
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
862
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
594
									<a class="close">×</a>
863
									<a class="close">×</a>
595
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
864
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
596
									<div class="alert-txt"></div>
865
									<div class="alert-txt"></div>
597
								</div>
866
								</div>
598
							</div>
867
							</div>
599
						</div>
868
						</div>
600
 
869
 
601
					</div>
870
					</div>
602
				</div>
871
				</div>
603
			</div>
872
			</div>
604
 
873
 
605
			<footer class="row-fluid">
874
			<footer class="row-fluid">
606
				<p class="span12">&copy; Tela Botanica 2014</p>
875
				<p class="span12">&copy; Tela Botanica 2014</p>
607
			</footer>
876
			</footer>
608
 
877
 
609
			<!-- Fenêtres modales -->
878
			<!-- Fenêtres modales -->
610
			<div id="chargement" class="modal-fenetre" style="display:none;">
879
			<div id="chargement" class="modal-fenetre" style="display:none;">
611
				<div id="chargement-centrage" class="modal-contenu">
880
				<div id="chargement-centrage" class="modal-contenu">
612
					<div class="progress progress-striped active">
881
					<div class="progress progress-striped active">
613
						<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
882
						<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
614
							<span class="sr-only">0/10 observations transmises</span>
883
							<span class="sr-only">0/10 observations transmises</span>
615
						</div>
884
						</div>
616
					</div>
885
					</div>
617
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
886
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
618
						Transfert des observations en cours...<br />
887
						Transfert des observations en cours...<br />
619
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
888
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
620
						d'observations à transférer.
889
						d'observations à transférer.
621
					</p>
890
					</p>
622
				</div>
891
				</div>
623
			</div>
892
			</div>
624
 
893
 
625
			<!-- Templates HTML -->
894
			<!-- Templates HTML -->
626
			<div id="tpl-transmission-ok" style="display:none;">
895
			<div id="tpl-transmission-ok" style="display:none;">
627
				<p class="msg">
896
				<p class="msg">
628
					Vos observations ont bien été transmises.<br />
897
					Vos observations ont bien été transmises.<br />
629
					Elles sont désormais consultables à travers les différents outils de visualisation
898
					Elles sont désormais consultables à travers les différents outils de visualisation
630
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
899
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
631
					<a href="http://www.tela-botanica.org/page:cel_galerie">galeries d'images</a>,
900
					<a href="http://www.tela-botanica.org/page:cel_galerie">galeries d'images</a>,
632
					<a href="http://www.tela-botanica.org/appli:test:del">identiplante</a>,
901
					<a href="http://www.tela-botanica.org/appli:test:del">identiplante</a>,
633
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
902
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
634
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
903
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
635
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
904
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
636
					N'oubliez pas qu'il est nécessaire de
905
					N'oubliez pas qu'il est nécessaire de
637
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
906
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
638
					au préalable, si ce n'est pas déjà fait.
907
					au préalable, si ce n'est pas déjà fait.
639
				</p>
908
				</p>
640
			</div>
909
			</div>
641
			<div id="tpl-transmission-ko" style="display:none;">
910
			<div id="tpl-transmission-ko" style="display:none;">
642
				<p class="msg">
911
				<p class="msg">
643
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
912
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
644
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
913
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
645
					et transmettre les suivantes.<br />
914
					et transmettre les suivantes.<br />
646
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
915
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
647
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
916
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
648
					<a href="<?= $url_remarques ?>?email=cel_remarques@tela-botanica.org&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
917
					<a href="<?= $url_remarques ?>?email=cel_remarques@tela-botanica.org&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
649
								  target="_blank"
918
								  target="_blank"
650
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
919
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
651
								  le formulaire de signalement d'erreurs</a>.
920
								  le formulaire de signalement d'erreurs</a>.
652
				</p>
921
				</p>
653
			</div>
922
			</div>
654
 
923
 
655
			<!-- Fenêtres modales -->
924
			<!-- Fenêtres modales -->
656
			<div id="projet-description" class="modal hide fade modal-fullscreen" tabindex="-1" role="dialog"
925
			<div id="projet-description" class="modal hide fade modal-fullscreen" tabindex="-1" role="dialog"
657
				 aria-labelledby="projet-description-titre" aria-hidden="true">
926
				 aria-labelledby="projet-description-titre" aria-hidden="true">
658
				<div class="modal-header">
927
				<div class="modal-header">
659
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
928
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
660
					<h1 id="projet-description-titre">Les arbres têtards</h1>
929
					<h1 id="projet-description-titre">Les arbres têtards</h1>
661
				</div>
930
				</div>
662
				<div class="modal-body">
931
				<div class="modal-body">
663
 
932
 
664
				</div>
933
				</div>
665
				<div class="modal-footer dsc-clean">
934
				<div class="modal-footer dsc-clean">
666
					<button class="btn" data-dismiss="modal" aria-hidden="true">Fermer</button>
935
					<button class="btn" data-dismiss="modal" aria-hidden="true">Fermer</button>
667
				</div>
936
				</div>
668
			</div>
937
			</div>
669
 
938
 
670
			<!-- Stats : Google Analytics-->
939
			<!-- Stats : Google Analytics-->
671
			<script>
940
			<script>
672
				//<![CDATA[
941
				//<![CDATA[
673
				var _gaq = _gaq || [];
942
				var _gaq = _gaq || [];
674
				_gaq.push(['_setAccount', 'UA-20092557-1']);
943
				_gaq.push(['_setAccount', 'UA-20092557-1']);
675
				_gaq.push(['_trackPageview']);
944
				_gaq.push(['_trackPageview']);
676
 
945
 
677
				(function() {
946
				(function() {
678
				  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
947
				  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
679
				  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
948
				  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
680
				  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
949
				  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
681
				})();
950
				})();
682
				//]]>
951
				//]]>
683
			</script>
952
			</script>
684
		</div>
953
		</div>
685
	</body>
954
	</body>
686
</html>
955
</html>