Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 2863 Rev 2864
1
<!DOCTYPE html>
1
<!DOCTYPE html>
2
<html>
2
<html>
3
	<head>
3
	<head>
4
		<title>Saisie simplifiée du CEL - messicoles</title>
4
		<title>Saisie simplifiée du CEL - messicoles</title>
5
 
5
 
6
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
6
		<meta http-equiv="content-type" content="text/html; 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="Tela Botanica" />
10
		<meta name="author" content="Tela Botanica" />
11
		<meta name="keywords" content="Tela Botanica, CEL" />
11
		<meta name="keywords" content="Tela Botanica, CEL" />
12
		<meta name="description" content="Widget de saisie simplifiée pour le CEL" />
12
		<meta name="description" content="Widget de saisie simplifiée pour le CEL" />
13
 
13
 
14
		<!-- OpenGraph pour Facebook, Pinterest, Google+ -->
14
		<!-- OpenGraph pour Facebook, Pinterest, Google+ -->
15
		<meta property="og:type" content="website" />
15
		<meta property="og:type" content="website" />
16
		<meta property="og:title" content="Saisie rapide d'observations - messicoles" />
16
		<meta property="og:title" content="Saisie rapide d'observations - messicoles" />
17
		<meta property="og:site_name" content="Tela Botanica" />
17
		<meta property="og:site_name" content="Tela Botanica" />
18
		<meta property="og:description" content="Saisissez et partagez facilement vos observations de plantes sauvages grâce au Widget de saisie du Carnet en Ligne (Licence CC-BY-SA)" />
18
		<meta property="og:description" content="Saisissez et partagez facilement vos observations de plantes sauvages grâce au Widget de saisie du Carnet en Ligne (Licence CC-BY-SA)" />
19
		<meta property="og:image" content="http://resources.tela-botanica.org/tb/img/256x256/carre_englobant.png" />
19
		<meta property="og:image" content="http://resources.tela-botanica.org/tb/img/256x256/carre_englobant.png" />
20
		<meta property="og:image:type" content="image/png" /> 
20
		<meta property="og:image:type" content="image/png" /> 
21
		<meta property="og:image:width" content="256" /> 
21
		<meta property="og:image:width" content="256" /> 
22
		<meta property="og:image:height" content="256" />
22
		<meta property="og:image:height" content="256" />
23
		<meta property="og:locale" content="fr_FR" />
23
		<meta property="og:locale" content="fr_FR" />
24
 
24
 
25
		<!-- Viewport Mobile -->
25
		<!-- Viewport Mobile -->
26
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
26
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
27
 
27
 
28
		<!-- Favicones -->
28
		<!-- Favicones -->
29
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
29
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
30
 
30
 
31
		<!-- Javascript : bibliothèques -->
31
		<!-- Javascript : bibliothèques -->
32
		<!-- Google Map v3 -->
32
		<!-- Google Map v3 -->
33
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?language=fr&amp;region=FR"></script>
33
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?language=fr&amp;region=FR"></script>
34
		<!-- Jquery -->
34
		<!-- Jquery -->
35
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
35
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
36
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
36
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
37
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
37
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
38
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
38
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
39
		<!-- Jquery Plugins -->
39
		<!-- Jquery Plugins -->
40
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
40
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
41
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
41
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
42
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
42
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
43
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
43
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
44
		<!-- Jquery Form :nécessaire pour l'upload des images -->
44
		<!-- Jquery Form :nécessaire pour l'upload des images -->
45
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
45
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
46
		<!-- Bootstrap -->
46
		<!-- Bootstrap -->
47
		<script type="text/javascript" src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
47
		<script type="text/javascript" src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
48
 
48
 
49
		<!-- Javascript : appli saisie -->
49
		<!-- Javascript : appli saisie -->
50
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
50
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
51
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/messicoles/js/WidgetSaisieMessicoles.js"></script>
51
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/messicoles/js/WidgetSaisieMessicoles.js"></script>
52
		<script src="<?=$url_base?>saisie?projet=messicoles&amp;service=taxons" type="text/javascript"></script>
52
		<script src="<?=$url_base?>saisie?projet=messicoles&amp;service=taxons" type="text/javascript"></script>
53
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/configurations/messicoles_nnr.js"></script>
53
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/configurations/messicoles_nnr.js"></script>
54
		<script type="text/javascript">
54
		<script type="text/javascript">
55
		//<![CDATA[
55
		//<![CDATA[
56
           $(document).ready(function() {
56
           $(document).ready(function() {
57
				// Un objet sauvage apparaît
57
				// Un objet sauvage apparaît
58
				var widget = new WidgetSaisieMessicoles();
58
				var widget = new WidgetSaisieMessicoles();
59
 
59
 
60
				// la variable "taxons" chargée par "service=taxons" ci-dessus n'est pas accessible dans le contexte objet
60
				// la variable "taxons" chargée par "service=taxons" ci-dessus n'est pas accessible dans le contexte objet
61
				widget.taxons = taxons;
61
				widget.taxons = taxons;
62
 
62
 
63
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
63
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
64
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
64
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
65
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
65
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
66
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
66
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
67
				// Mot-clé du widget/projet
67
				// Mot-clé du widget/projet
68
				widget.tagProjet = "WidgetSaisie";
68
				widget.tagProjet = "WidgetSaisie";
69
				// Mots-clés à ajouter aux images
69
				// Mots-clés à ajouter aux images
70
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
70
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
71
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
71
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
72
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
72
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
73
				// Mots-clés à ajouter aux observations
73
				// Mots-clés à ajouter aux observations
74
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
74
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
75
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
75
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
76
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
76
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
77
				// Précharger le formulaire avec les infos d'une observation
77
				// Précharger le formulaire avec les infos d'une observation
78
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
78
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
79
				// URL du web service réalisant l'insertion des données dans la base du CEL.
79
				// URL du web service réalisant l'insertion des données dans la base du CEL.
80
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
80
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
81
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
81
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
82
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
82
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
83
				// Code du référentiel utilisé pour les nom scientifiques.
83
				// Code du référentiel utilisé pour les nom scientifiques.
84
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
84
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
85
				// Indication de la présence d'une espèce imposée
85
				// Indication de la présence d'une espèce imposée
86
				widget.especeImposee = "<?=$espece_imposee; ?>";
86
				widget.especeImposee = "<?=$espece_imposee; ?>";
87
				// Tableau d'informations sur l'espèce imposée
87
				// Tableau d'informations sur l'espèce imposée
88
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
88
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
89
				// Nombre d'élément dans les listes d'auto-complétion
89
				// Nombre d'élément dans les listes d'auto-complétion
90
				widget.autocompletionElementsNbre = 20;
90
				widget.autocompletionElementsNbre = 20;
91
				// Indication de la présence d'un référentiel imposé
91
				// Indication de la présence d'un référentiel imposé
92
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
92
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
93
				// URL du web service permettant l'auto-complétion des noms scientifiques
93
				// URL du web service permettant l'auto-complétion des noms scientifiques
94
				widget.serviceAutocompletionNomSciUrl = "<?=$url_ws_autocompletion_ns?>?"+
94
				widget.serviceAutocompletionNomSciUrl = "<?=$url_ws_autocompletion_ns?>?"+
95
					"masque={masque}&"+
95
					"masque={masque}&"+
96
					"recherche=etendue&"+
96
					"recherche=etendue&"+
97
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
97
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
98
					"ns.structure=au"+"&"+
98
					"ns.structure=au"+"&"+
99
					"navigation.limite=" + widget.autocompletionElementsNbre;
99
					"navigation.limite=" + widget.autocompletionElementsNbre;
100
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
100
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
101
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
101
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
102
					"masque={masque}&"+
102
					"masque={masque}&"+
103
					"recherche=etendue&"+
103
					"recherche=etendue&"+
104
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
104
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
105
					"retour.tri=alpharet&"+ // tri "à la CeL"
105
					"retour.tri=alpharet&"+ // tri "à la CeL"
106
					"ns.structure=au"+"&"+
106
					"ns.structure=au"+"&"+
107
					"navigation.limite=" + widget.autocompletionElementsNbre;
107
					"navigation.limite=" + widget.autocompletionElementsNbre;
108
				// Nombre d'observations max autorisé avant transmission
108
				// Nombre d'observations max autorisé avant transmission
109
				widget.obsMaxNbre = 10;
109
				widget.obsMaxNbre = 10;
110
				// Durée d'affichage en milliseconde des messages d'informations
110
				// Durée d'affichage en milliseconde des messages d'informations
111
				widget.dureeMessage = 15000;
111
				widget.dureeMessage = 15000;
112
				// Squelette d'URL du web service de l'annuaire.
112
				// Squelette d'URL du web service de l'annuaire.
113
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
113
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
114
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
114
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
115
				widget.serviceNomCommuneUrl = "http://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
115
				widget.serviceNomCommuneUrl = "http://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
116
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
116
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
117
				widget.serviceNomCommuneUrlAlt = "http://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
117
				widget.serviceNomCommuneUrlAlt = "http://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
118
				// URL du marqueur à utiliser dans la carte Google Map
118
				// URL du marqueur à utiliser dans la carte Google Map
119
				widget.googleMapMarqueurUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/marqueurs/debut.png";
119
				widget.googleMapMarqueurUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/marqueurs/debut.png";
120
				// URL de l'icône du chargement en cours
120
				// URL de l'icône du chargement en cours
121
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/icones/chargement.gif";
121
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/icones/chargement.gif";
122
				// URL de l'icône du chargement en cours d'une image
122
				// URL de l'icône du chargement en cours d'une image
123
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/icones/chargement-image.gif";
123
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/icones/chargement-image.gif";
124
				// URL de l'icône du calendrier
124
				// URL de l'icône du calendrier
125
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/icones/calendrier.png";
125
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/icones/calendrier.png";
126
				// URL de l'icône pour une photo manquante
126
				// URL de l'icône pour une photo manquante
127
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/icones/pasdephoto.png";
127
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/messicoles/img/icones/pasdephoto.png";
128
 
128
 
129
				// Initialisation du bousin
129
				// Initialisation du bousin
130
				widget.init();
130
				widget.init();
131
			});
131
			});
132
		//]]>
132
		//]]>
133
		</script>
133
		</script>
134
 
134
 
135
		<!-- CSS -->
135
		<!-- CSS -->
136
		<link href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" media="screen" />
136
		<link href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" media="screen" />
137
		<link href="http://resources.tela-botanica.org/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
137
		<link href="http://resources.tela-botanica.org/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
138
		<link href="http://resources.tela-botanica.org/bootstrap/2.0.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
138
		<link href="http://resources.tela-botanica.org/bootstrap/2.0.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
139
		<link href="<?=$url_base?>modules/saisie/squelettes/messicoles/css/<?=isset($_GET['style']) ? $_GET['style'] : 'messicoles'?>.css" rel="stylesheet" type="text/css" media="screen" />
139
		<link href="<?=$url_base?>modules/saisie/squelettes/messicoles/css/<?=isset($_GET['style']) ? $_GET['style'] : 'messicoles'?>.css" rel="stylesheet" type="text/css" media="screen" />
140
 
140
 
141
		<!--  Google Analytics -->
141
		<!--  Google Analytics -->
142
		<?php if($prod): ?>
142
		<?php if($prod): ?>
143
			<?php include "analytics.html"; ?>
143
			<?php include "analytics.html"; ?>
144
		<?php endif; ?>
144
		<?php endif; ?>
145
	</head>
145
	</head>
146
 
146
 
147
	<body data-spy="scroll">
147
	<body data-spy="scroll">
148
		<div class="container">
148
		<div class="container">
149
			<div class="row-fluid">
149
			<div class="row-fluid">
150
				<div class="span6 page-header">
150
				<div class="span6 page-header">
151
					<div class="row">
151
					<div class="row">
152
						<div class="span6">
152
						<div class="span6">
153
							<h1>
153
							<h1>
154
								<?php if($logo != 'defaut' && $logo != '0') { ?>
154
								<?php if($logo != 'defaut' && $logo != '0') { ?>
155
									<img id="logo-titre" class="span1" src="<?= $logo ?>" alt="Logo" />
155
									<img id="logo-titre" class="span1" src="<?= $logo ?>" alt="Logo" />
156
								<?php } else if($logo == 'defaut') { ?>
156
								<?php } else if($logo == 'defaut') { ?>
157
									<img id="logo-titre" class="span1" src="http://resources.tela-botanica.org/tb/img/256x256/logo_sans_mots.png" alt="Tela Botanica" />
157
									<img id="logo-titre" class="span1" src="http://resources.tela-botanica.org/tb/img/256x256/logo_sans_mots.png" alt="Tela Botanica" />
158
								<?php } ?>
158
								<?php } ?>
159
								<?php if($titre != 'defaut') { ?>
159
								<?php if($titre != 'defaut') { ?>
160
									<?= $titre; ?>
160
									<?= $titre; ?>
161
								<?php } else { ?>
161
								<?php } else { ?>
162
									Ajout rapide d'observations
162
									Ajout rapide d'observations
163
								<?php } ?>
163
								<?php } ?>
164
							</h1>
164
							</h1>
165
						</div>
165
						</div>
166
					</div>
166
					</div>
167
					<div class="row">
167
					<div class="row">
168
						<div class="span6">
168
						<div class="span6">
169
							<p>
169
							<p>
170
								Cet outil vous permet de partager simplement vos observations avec le
170
								Cet outil vous permet de partager simplement vos observations avec le
171
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a> (sous <a href="http://www.tela-botanica.org/page:licence?langue=fr">licence CC-BY-SA</a>).
171
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a> (sous <a href="http://www.tela-botanica.org/page:licence?langue=fr">licence CC-BY-SA</a>).
172
								Identifiez-vous bien pour ensuite retrouver et gérer vos données dans
172
								Identifiez-vous bien pour ensuite retrouver et gérer vos données dans
173
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
173
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
174
								Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
174
								Créez jusqu'à 10 observations (avec 10Mo max d'images) puis partagez-les avec le bouton 'transmettre'.
175
								Elles apparaissent immédiatement sur les <a href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
175
								Elles apparaissent immédiatement sur les <a href="http://www.tela-botanica.org/site:botanique">cartes et galeries photos </a> du site.
176
							</p>
176
							</p>
177
							<p class="discretion">
177
							<p class="discretion">
178
								Pour toute question ou remarque,
178
								Pour toute question ou remarque,
179
								<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
179
								<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
180
								  target="_blank"
180
								  target="_blank"
181
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
181
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
182
								  contactez-nous</a>
182
								  contactez-nous</a>
183
 
183
 
184
							</p>
184
							</p>
185
							<p class="discretion">
185
							<p class="discretion">
186
								Une fois familiarisé avec l'interface vous pouvez cliquer sur ce bouton pour désactiver l'aide.
186
								Une fois familiarisé avec l'interface vous pouvez cliquer sur ce bouton pour désactiver l'aide.
187
								<button id="btn-aide" class="btn btn-mini btn-success">
187
								<button id="btn-aide" class="btn btn-mini btn-success">
188
									<span class="icon-question-sign icon-white"></span>
188
									<span class="icon-question-sign icon-white"></span>
189
									<span id="btn-aide-txt" >Désactiver l'aide</span>
189
									<span id="btn-aide-txt" >Désactiver l'aide</span>
190
								</button>
190
								</button>
191
							</p>
191
							</p>
192
						</div>
192
						</div>
193
					</div>
193
					</div>
194
				</div>
194
				</div>
195
 
195
 
196
				<div class="span6">
196
				<div class="span6">
197
					<div class="well">
197
					<div class="well">
198
						<h2>Observateur</h2>
198
						<h2>Observateur</h2>
199
						<form id="form-observateur" action="#" class="" autocomplete="on">
199
						<form id="form-observateur" action="#" class="" autocomplete="on">
200
							<div class="row-fluid">
200
							<div class="row-fluid">
201
								<div class="span6 has-tooltip" data-placement="right"
201
								<div class="span6 has-tooltip" data-placement="right"
202
									title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
202
									title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
203
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
203
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
204
										ultérieurement. Des informations complémentaires vont vous être
204
										ultérieurement. Des informations complémentaires vont vous être
205
										demandées : prénom et nom.">
205
										demandées : prénom et nom.">
206
									<label for="courriel"
206
									<label for="courriel"
207
										title="Veuillez saisir votre adresse courriel.">
207
										title="Veuillez saisir votre adresse courriel.">
208
										<strong class="obligatoire">*</strong> Courriel
208
										<strong class="obligatoire">*</strong> Courriel
209
									</label>
209
									</label>
210
									<div class="input-prepend">
210
									<div class="input-prepend">
211
										<span class="add-on">
211
										<span class="add-on">
212
											<i class="icon-envelope"></i>
212
											<i class="icon-envelope"></i>
213
										</span>
213
										</span>
214
										<input id="courriel" class="input-large" name="courriel" type="text"/>
214
										<input id="courriel" class="input-large" name="courriel" type="text"/>
215
										<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
215
										<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
216
									</div>
216
									</div>
217
								</div>
217
								</div>
218
								<div id="zone-courriel-confirmation" class="span6 hidden">
218
								<div id="zone-courriel-confirmation" class="span6 hidden">
219
									<label for="courriel_confirmation"
219
									<label for="courriel_confirmation"
220
										title="Veuillez saisir confirmer le courriel.">
220
										title="Veuillez saisir confirmer le courriel.">
221
										<strong class="obligatoire">*</strong> Courriel (confirmation)
221
										<strong class="obligatoire">*</strong> Courriel (confirmation)
222
									</label>
222
									</label>
223
									<div class="input-prepend">
223
									<div class="input-prepend">
224
										<span class="add-on">
224
										<span class="add-on">
225
											<i class="icon-envelope"></i>
225
											<i class="icon-envelope"></i>
226
										</span><input id="courriel_confirmation" class="input-large" name="courriel_confirmation" type="text"/>
226
										</span><input id="courriel_confirmation" class="input-large" name="courriel_confirmation" type="text"/>
227
									</div>
227
									</div>
228
								</div>
228
								</div>
229
							</div>
229
							</div>
230
							<div id="zone-prenom-nom" class="row-fluid hidden">
230
							<div id="zone-prenom-nom" class="row-fluid hidden">
231
								<div class="span6">
231
								<div class="span6">
232
									<label for="prenom">Prénom</label>
232
									<label for="prenom">Prénom</label>
233
									<div>
233
									<div>
234
										<input id="prenom" name="prenom" class="span3" type="text"/>
234
										<input id="prenom" name="prenom" class="span3" type="text"/>
235
									</div>
235
									</div>
236
								</div>
236
								</div>
237
								<div class="span6">
237
								<div class="span6">
238
									<label for="nom">Nom</label>
238
									<label for="nom">Nom</label>
239
									<div>
239
									<div>
240
										<input id="nom" name="nom"  class="span3" type="text"/>
240
										<input id="nom" name="nom"  class="span3" type="text"/>
241
									</div>
241
									</div>
242
								</div>
242
								</div>
243
							</div>
243
							</div>
244
						</form>
244
						</form>
245
					</div>
245
					</div>
246
				</div>
246
				</div>
247
			</div>
247
			</div>
248
			<!-- Messages d'erreur du formulaire-->
248
			<!-- Messages d'erreur du formulaire-->
249
			<div class="row">
249
			<div class="row">
250
				<div class="zone-alerte span6 offset3">
250
				<div class="zone-alerte span6 offset3">
251
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
251
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
252
						<a class="close">×</a>
252
						<a class="close">×</a>
253
						<h4 class="alert-heading">Information : copier/coller</h4>
253
						<h4 class="alert-heading">Information : copier/coller</h4>
254
						<p>
254
						<p>
255
							Merci de ne pas copier/coller votre courriel.<br/>
255
							Merci de ne pas copier/coller votre courriel.<br/>
256
							La double saisie permet de vérifier l'absence d'erreurs.
256
							La double saisie permet de vérifier l'absence d'erreurs.
257
						</p>
257
						</p>
258
					</div>
258
					</div>
259
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
259
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
260
						<a class="close">×</a>
260
						<a class="close">×</a>
261
						<h4 class="alert-heading">Information : courriel introuvable</h4>
261
						<h4 class="alert-heading">Information : courriel introuvable</h4>
262
						<p>
262
						<p>
263
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
263
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
264
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
264
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
265
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
265
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
266
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
266
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
267
						</p>
267
						</p>
268
					</div>
268
					</div>
269
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
269
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
270
						<a class="close">×</a>
270
						<a class="close">×</a>
271
						<h4 class="alert-heading">Information sur Google Maps</h4>
271
						<h4 class="alert-heading">Information sur Google Maps</h4>
272
						<div class="contenu"></div>
272
						<div class="contenu"></div>
273
					</div>
273
					</div>
274
				</div>
274
				</div>
275
			</div>
275
			</div>
276
			<div class="row-fluid">
276
			<div class="row-fluid">
277
				<div class="span12">
277
				<div class="span12">
278
					<div class="well">
278
					<div class="well">
279
						<div class="row-fluid">
279
						<div class="row-fluid">
280
							<!-- 1e colonne : date, lieu, geoloc -->
280
							<!-- 1e colonne : date, lieu, geoloc -->
281
							<div class="span6">
281
							<div class="span6">
282
								<div>
282
								<div>
283
									<div class="row-fluid">
283
									<div class="row-fluid">
284
										<!-- DATE-->
284
										<!-- DATE-->
285
										<h2>Date du relevé</h2>
285
										<h2>Date du relevé</h2>
286
										<div class="span12 control-group">
286
										<div class="span12 control-group">
287
											<form id="form-date" action="#" autocomplete="on">
287
											<form id="form-date" action="#" autocomplete="on">
288
												<label for="date" class="has-tooltip"
288
												<label for="date" class="has-tooltip"
289
													title="Veuillez indiquer la date du relevé au format jj/mm/aaaa. Vous pouvez
289
													title="Veuillez indiquer la date du relevé au format jj/mm/aaaa. Vous pouvez
290
													cliquer sur l'icône de calendrier pour sélectionner une date">
290
													cliquer sur l'icône de calendrier pour sélectionner une date">
291
													<strong class="obligatoire">*</strong>
291
													<strong class="obligatoire">*</strong>
292
													Date du relevé
292
													Date du relevé
293
												</label>
293
												</label>
294
												<div class="input-prepend">
294
												<div class="input-prepend">
295
													<span id="date-icone" class="add-on"></span><input id="date"
295
													<span id="date-icone" class="add-on"></span><input id="date"
296
														class="input-small" name="date" type="text"
296
														class="input-small" name="date" type="text"
297
														placeholder="jj/mm/aaaa" />
297
														placeholder="jj/mm/aaaa" />
298
												</div>
298
												</div>
299
												<div id="date-obligatoire" class="alert alert-error alert-block" style="display: none;">
299
												<div id="date-obligatoire" class="alert alert-error alert-block" style="display: none;">
300
													<a class="close">×</a>
300
													<a class="close">×</a>
301
													<h4 class="alert-heading">Information : date de saisie obligatoire</h4>
301
													<h4 class="alert-heading">Information : date de saisie obligatoire</h4>
302
													<p>
302
													<p>
303
														Veuillez renseigner la date de saisie pour cette estpèce.
303
														Veuillez renseigner la date de saisie pour cette estpèce.
304
													</p>
304
													</p>
305
												</div>
305
												</div>
306
											</form>
306
											</form>
307
										</div>
307
										</div>
308
										<!-- LIEU -->
308
										<!-- LIEU -->
309
										<h2>Lieu du relevé</h2>
309
										<h2>Lieu du relevé</h2>
310
										<!-- Type de culture -->
310
										<!-- Type de culture -->
311
										<div class="control-group">
311
										<div class="control-group">
312
											<label class="has-tooltip" 
312
											<label class="has-tooltip" 
313
											title="Vous pouvez sélectionner un type de culture parmi la liste ou en saisir un manuellement via l'option Autres">
313
											title="Vous pouvez sélectionner un type de culture parmi la liste ou en saisir un manuellement via l'option Autres">
314
												Type de culture
314
												Type de culture
315
											</label>
315
											</label>
316
											<!-- Céréale -->										
316
											<!-- Céréale -->										
317
											<label for="culture-cereale-radio" class="radio culture">
317
											<label for="culture-cereale-radio" class="radio culture">
318
												<input type="radio" id="culture-cereale-radio" name="type-culture" value="cereale" data-titre="céréale" />
318
												<input type="radio" id="culture-cereale-radio" name="type-culture" value="cereale" data-titre="céréale" />
319
												Céréale
319
												Céréale
320
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
320
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
321
												</i>
321
												</i>
322
											</label>
322
											</label>
323
											<div class="popover-html-content" data-for="culture-cereale-radio">
323
											<div class="popover-html-content" data-for="culture-cereale-radio">
324
												<h5>Céréale</h5>
324
												<h5>Céréale</h5>
325
												Une description du champ de céréales<br/>
325
												Une description du champ de céréales<br/>
326
												...
326
												...
327
											</div>
327
											</div>
328
											<!-- Friche -->										
328
											<!-- Friche -->										
329
											<label for="culture-friche-radio" class="radio culture">
329
											<label for="culture-friche-radio" class="radio culture">
330
												<input type="radio" id="culture-friche-radio" name="type-culture" value="friche" data-titre="friche" />
330
												<input type="radio" id="culture-friche-radio" name="type-culture" value="friche" data-titre="friche" />
331
												Friche
331
												Friche
332
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
332
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
333
												</i>
333
												</i>
334
											</label>
334
											</label>
335
											<div class="popover-html-content" data-for="culture-friche-radio">
335
											<div class="popover-html-content" data-for="culture-friche-radio">
336
												<h5>Friche</h5>
336
												<h5>Friche</h5>
337
												Une description du champ de Friche<br/>
337
												Une description du champ de Friche<br/>
338
												...
338
												...
339
											</div>
339
											</div>
340
											<!-- Légumineuse -->										
340
											<!-- Légumineuse -->										
341
											<label for="culture-legumineuse-radio" class="radio culture">
341
											<label for="culture-legumineuse-radio" class="radio culture">
342
												<input type="radio" id="culture-legumineuse-radio" name="type-culture" value="legumineuse" data-titre="légumineuse" />
342
												<input type="radio" id="culture-legumineuse-radio" name="type-culture" value="legumineuse" data-titre="légumineuse" />
343
												Légumineuse
343
												Légumineuse
344
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
344
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
345
												</i>
345
												</i>
346
											</label>
346
											</label>
347
											<div class="popover-html-content" data-for="culture-legumineuse-radio">
347
											<div class="popover-html-content" data-for="culture-legumineuse-radio">
348
												<h5>Légumineuse</h5>
348
												<h5>Légumineuse</h5>
349
												Une description du champ de Légumineuse<br/>
349
												Une description du champ de Légumineuse<br/>
350
												...
350
												...
351
											</div>
351
											</div>
352
											<!-- Vigne -->										
352
											<!-- Vigne -->										
353
											<label for="culture-vigne-radio" class="radio culture">
353
											<label for="culture-vigne-radio" class="radio culture">
354
												<input type="radio" id="culture-vigne-radio" name="type-culture" value="vigne" data-titre="vigne" />
354
												<input type="radio" id="culture-vigne-radio" name="type-culture" value="vigne" data-titre="vigne" />
355
												Vigne
355
												Vigne
356
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
356
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
357
												</i>
357
												</i>
358
											</label>
358
											</label>
359
											<div class="popover-html-content" data-for="culture-vigne-radio">
359
											<div class="popover-html-content" data-for="culture-vigne-radio">
360
												<h5>Vigne</h5>
360
												<h5>Vigne</h5>
361
												Une description du champ de Vigne<br/>
361
												Une description du champ de Vigne<br/>
362
												...
362
												...
363
											</div>
363
											</div>
364
											<!-- Verger -->										
364
											<!-- Verger -->										
365
											<label for="culture-verger-radio" class="radio culture">
365
											<label for="culture-verger-radio" class="radio culture">
366
												<input type="radio" id="culture-verger-radio" name="type-culture" value="verger" data-titre="verger" />
366
												<input type="radio" id="culture-verger-radio" name="type-culture" value="verger" data-titre="verger" />
367
												Verger
367
												Verger
368
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
368
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
369
												</i>
369
												</i>
370
											</label>
370
											</label>
371
											<div class="popover-html-content" data-for="culture-verger-radio">
371
											<div class="popover-html-content" data-for="culture-verger-radio">
372
												<h5>Verger</h5>
372
												<h5>Verger</h5>
373
												Une description du champ de Verger<br/>
373
												Une description du champ de Verger<br/>
374
												...
374
												...
375
											</div>
375
											</div>
376
											<!-- Autres -->										
376
											<!-- Autres -->										
377
											<label for="culture-autres-radio" class="radio culture">
377
											<label for="culture-autres-radio" class="radio culture">
378
												<input type="radio" id="culture-autres-radio" name="type-culture" value="autres" data-titre="autres" />
378
												<input type="radio" id="culture-autres-radio" name="type-culture" value="autres" data-titre="autres" />
379
												Autres
379
												Autres
380
												<input type="text" id="culture-autres-input" name="culture-autres" style="display: none;" />
380
												<input type="text" id="culture-autres-input" name="culture-autres" style="display: none;" />
381
											</label>
381
											</label>
382
										</div>
382
										</div>
383
										<!-- Géolocalisation -->
383
										<!-- Géolocalisation -->
384
										<h2>Géolocalisation</h2>
-
 
385
										<div class="row-fluid">
384
										<div class="row-fluid">
-
 
385
											<div class="span4">
-
 
386
												<h2>Géolocalisation</h2>
-
 
387
											</div>
386
											<div class="span12 droite">
388
											<div class="span8 droite">
387
												<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
389
												<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
388
													<div class="control-group">
390
													<div class="control-group">
389
														<label for="carte-recherche">Rechercher</label>
391
														<label for="carte-recherche">Rechercher</label>
390
														<input id="carte-recherche" class="search-query has-tooltip" type="text" value=""
392
														<input id="carte-recherche" class="search-query has-tooltip" type="text" value=""
391
															title="Permet de centrer la carte sur le lieu recherché."
393
															title="Permet de centrer la carte sur le lieu recherché."
392
															placeholder="Ex: France, Paris, Rue de Rivoli..."/>
394
															placeholder="Ex: France, Paris, Rue de Rivoli..."/>
393
													</div>
395
													</div>
394
												</form>
396
												</form>
395
											</div>
397
											</div>
396
										</div>
398
										</div>
397
										<div class="row-fluid">
399
										<div class="row-fluid">
398
											<div class="span12">
400
											<div class="span12">
399
												<div id="map-canvas" class="has-tooltip"
401
												<div id="map-canvas" class="has-tooltip"
400
													title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
402
													title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
401
														représentant votre station ou bien le glisser-déposer sur
403
														représentant votre station ou bien le glisser-déposer sur
402
														le lieu souhaité."></div>
404
														le lieu souhaité."></div>
403
											</div>
405
											</div>
404
										</div>
406
										</div>
405
										<!-- Coordonnées -->
407
										<!-- Coordonnées -->
406
										<div class="row-fluid">
408
										<div class="row-fluid">
407
											<label for="coordonnees-geo" class="span7">
409
											<label for="coordonnees-geo" class="span7">
408
												<a href="#" class="afficher-coord">Afficher</a>
410
												<a href="#" class="afficher-coord">Afficher</a>
409
												<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
411
												<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
410
												les coordonnées géographiques
412
												les coordonnées géographiques
411
												<span id="lat-lon-info" class="info has-tooltip"
413
												<span id="lat-lon-info" class="info has-tooltip"
412
													title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
414
													title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
413
													(WGS84)
415
													(WGS84)
414
												</span>
416
												</span>
415
											</label>
417
											</label>
416
											<div id="info-commune" class="span5">
418
											<div id="info-commune" class="span5">
417
												<span for="marqueur-commune">Commune : </span>
419
												<span for="marqueur-commune">Commune : </span>
418
												<span id="marqueur-commune">
420
												<span id="marqueur-commune">
419
													<span id="commune-nom" class="commune-info"></span>
421
													<span id="commune-nom" class="commune-info"></span>
420
													(<span id="commune-code-insee" class="commune-info has-tooltip"
422
													(<span id="commune-code-insee" class="commune-info has-tooltip"
421
														title="Code INSEE de la commune"></span>)
423
														title="Code INSEE de la commune"></span>)
422
												</span>
424
												</span>
423
											</div>
425
											</div>
424
										</div>
426
										</div>
425
										<!-- Formulaire Station -->
427
										<!-- Formulaire Station -->
426
										<form id="form-station" class="control-group" action="#" enctype="multipart/form-data" autocomplete="on">
428
										<form id="form-station" class="control-group" action="#" enctype="multipart/form-data" autocomplete="on">
427
											<div id="coordonnees-geo" class="well" style="display:none;">
429
											<div id="coordonnees-geo" class="well" style="display:none;">
428
												<div class="row-fluid form-inline">
430
												<div class="row-fluid form-inline">
429
													<div id="coord-lat" class="span4">
431
													<div id="coord-lat" class="span4">
430
														<label for="latitude">Latitude</label>
432
														<label for="latitude">Latitude</label>
431
														<div>
433
														<div>
432
															<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
434
															<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
433
														</div>
435
														</div>
434
													</div>
436
													</div>
435
													<div id="coord-lng" class="span4">
437
													<div id="coord-lng" class="span4">
436
														<label for="longitude">Longitude</label>
438
														<label for="longitude">Longitude</label>
437
														<div>
439
														<div>
438
															<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
440
															<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
439
														</div>
441
														</div>
440
													</div>
442
													</div>
441
													<div class="span1">
443
													<div class="span1">
442
														<div>
444
														<div>
443
															<input id="geolocaliser" type="button" value="Voir sur la carte"
445
															<input id="geolocaliser" type="button" value="Voir sur la carte"
444
																class="has-tooltip"
446
																class="has-tooltip"
445
																title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
447
																title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
446
														</div>
448
														</div>
447
													</div>
449
													</div>
448
												</div>
450
												</div>
449
											</div>
451
											</div>
450
											<div class="row-fluid">
452
											<div class="row-fluid">
451
												<div class="span4 has-tooltip"
453
												<div class="span4 has-tooltip"
452
													title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
454
													title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
453
													<label for="lieudit">Lieu-dit</label>
455
													<label for="lieudit">Lieu-dit</label>
454
													<div>
456
													<div>
455
														<input type="text" id="lieudit" class="span2" name="lieudit"/>
457
														<input type="text" id="lieudit" class="span2" name="lieudit"/>
456
													</div>
458
													</div>
457
												</div>
459
												</div>
458
												<div class="span4 has-tooltip"
460
												<div class="span4 has-tooltip"
459
													title="Lieu précis de l'observation définissant une unité écologique homogène (ex: le pré derrière la maison)." >
461
													title="Lieu précis de l'observation définissant une unité écologique homogène (ex: le pré derrière la maison)." >
460
													<label for="station">Station</label>
462
													<label for="station">Station</label>
461
													<div>
463
													<div>
462
														<input type="text" id="station" class="span2" name="station"/>
464
														<input type="text" id="station" class="span2" name="station"/>
463
													</div>
465
													</div>
464
												</div>
466
												</div>
465
												<div class="span4 has-tooltip"
467
												<div class="span4 has-tooltip"
466
													title="Type d'habitat plus ou moins standardisé dans les codes Corine ou Catminat (ex: prairie humide).">
468
													title="Type d'habitat plus ou moins standardisé dans les codes Corine ou Catminat (ex: prairie humide).">
467
													<label for="milieu">Milieu</label>
469
													<label for="milieu">Milieu</label>
468
													<div>
470
													<div>
469
														<input type="text" id="milieu" class="span2" name="milieu" />
471
														<input type="text" id="milieu" class="span2" name="milieu" />
470
													</div>
472
													</div>
471
												</div>
473
												</div>
472
											</div>
474
											</div>
473
										</form>
475
										</form>
474
									</div>
476
									</div>
475
								</div>
477
								</div>
476
							</div>
478
							</div>
477
							<!-- 2e colonne : observation -->
479
							<!-- 2e colonne : observation -->
478
							<div class="span6">
480
							<div class="span6">
479
								<form id="form-obs" action="#" autocomplete="on">
481
								<form id="form-obs" action="#" autocomplete="on">
480
									<h2>Observation</h2>
482
									<h2>Observation</h2>
481
									<div class="row-fluid">
483
									<div class="row-fluid">
482
										<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
484
										<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
483
											title="Sélectionnez une espèce dans la liste déroulante par son nom latin
485
											title="Sélectionnez une espèce dans la liste déroulante par son nom latin
484
											ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
486
											ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
485
											<label>
487
											<label>
486
												<strong class="obligatoire">*</strong>
488
												<strong class="obligatoire">*</strong>
487
												Espèces communes
489
												Espèces communes
488
											</label>
490
											</label>
489
											<span class="input-prepend">
491
											<span class="input-prepend">
490
												<span id="espece-icone" class="add-on">
492
												<span id="espece-icone" class="add-on">
491
													<i class="icon-leaf"></i>
493
													<i class="icon-leaf"></i>
492
												</span>
494
												</span>
493
												<select id="taxon-liste" name="taxon-liste" class="form-control">
495
												<select id="taxon-liste" name="taxon-liste" class="form-control">
494
													<option value="" selected>Sélectionner une espèce</option>
496
													<option value="" selected>Sélectionner une espèce</option>
495
													<optgroup id="taxon-liste-noms">
497
													<optgroup id="taxon-liste-noms">
496
														<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
498
														<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
497
															<option
499
															<option
498
																class="<?=$taxon['nom_type'] ?>"
500
																class="<?=$taxon['nom_type'] ?>"
499
																value="<?=$taxon['num_nom'] ?>"
501
																value="<?=$taxon['num_nom'] ?>"
500
																title="<?=$taxon['nom_title'] ?>"
502
																title="<?=$taxon['nom_title'] ?>"
501
																data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
503
																data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
502
																>
504
																>
503
																<?=$taxon['nom_a_afficher']?>
505
																<?=$taxon['nom_a_afficher']?>
504
															</option>
506
															</option>
505
														<?php endforeach; ?>
507
														<?php endforeach; ?>
506
													</optgroup>
508
													</optgroup>
507
													<optgroup id="taxon-liste-special">
509
													<optgroup id="taxon-liste-special">
508
														<?php foreach ($taxons['speciaux'] as $taxon) :?>
510
														<?php foreach ($taxons['speciaux'] as $taxon) :?>
509
															<option
511
															<option
510
																class="<?=$taxon['nom_type'] ?>"
512
																class="<?=$taxon['nom_type'] ?>"
511
																value="<?=$taxon['num_nom'] ?>"
513
																value="<?=$taxon['num_nom'] ?>"
512
																title="<?=$taxon['nom_title'] ?>"
514
																title="<?=$taxon['nom_title'] ?>"
513
																data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
515
																data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
514
																>
516
																>
515
																<?=$taxon['nom_a_afficher']?>
517
																<?=$taxon['nom_a_afficher']?>
516
															</option>
518
															</option>
517
														<?php endforeach; ?>
519
														<?php endforeach; ?>
518
													</optgroup>
520
													</optgroup>
519
													<option id="taxon-option-autre" value="?">Autre espèce</option>
521
													<option id="taxon-option-autre" value="?">Autre espèce</option>
520
												</select>
522
												</select>
521
											</span>
523
											</span>
522
										</div>
524
										</div>
523
									</div>
525
									</div>
524
									<div class="row-fluid">
526
									<div class="row-fluid">
525
										<div id="taxon-input-groupe" class="span8 has-tooltip"
527
										<div id="taxon-input-groupe" class="span8 has-tooltip"
526
											title="Sélectionnez une espèce dans la liste déroulante pour lier
528
											title="Sélectionnez une espèce dans la liste déroulante pour lier
527
												votre nom au référentiel selectionné. Si vous
529
												votre nom au référentiel selectionné. Si vous
528
												le désirez vous pouvez aussi saisir un nom absent du référentiel
530
												le désirez vous pouvez aussi saisir un nom absent du référentiel
529
												(Ex. : 'fleur violette' ou 'viola sinensis???')." 
531
												(Ex. : 'fleur violette' ou 'viola sinensis???')." 
530
												hidden >
532
												hidden >
531
											<label for="taxon" title="Choisissez une espèce">
533
											<label for="taxon" title="Choisissez une espèce">
532
												<strong class="obligatoire">*</strong>
534
												<strong class="obligatoire">*</strong>
533
												Espèce <?= $referentiel_impose ? '('.$ns_referentiel.')' : '' ?> <em>(ou indication sur la plante)</em>
535
												Espèce <?= $referentiel_impose ? '('.$ns_referentiel.')' : '' ?> <em>(ou indication sur la plante)</em>
534
											</label>
536
											</label>
535
											<div class="input-prepend">
537
											<div class="input-prepend">
536
												<span class="add-on">
538
												<span class="add-on">
537
													<i class="icon-leaf"></i>
539
													<i class="icon-leaf"></i>
538
												</span><input type="text" id="taxon" name="taxon" value="<?= $nom_sci_espece_defaut; ?>" data="numNomSel" />
540
												</span><input type="text" id="taxon" name="taxon" value="<?= $nom_sci_espece_defaut; ?>" data="numNomSel" />
539
											</div>
541
											</div>
540
										</div>
542
										</div>
541
										<p class="alert alert-warning" id="avertissement-non-messicole" style="display: none;">
543
										<p class="alert alert-warning" id="avertissement-non-messicole" style="display: none;">
542
											<strong>Attention:</strong> cette espèce n'est
544
											<strong>Attention:</strong> cette espèce n'est
543
											pas considérée comme messicole !
545
											pas considérée comme messicole !
544
										</p>
546
										</p>
545
									</div>
547
									</div>
546
									<!-- Identification -->
548
									<!-- Identification -->
547
									<div class="row-fluid">
549
									<div class="row-fluid">
548
										<div class="span12">
550
										<div class="span12">
549
											<label for="identification-liste">Identification</label>
551
											<label for="identification-liste">Identification</label>
550
											<div>
552
											<div>
551
												<select name="identification-liste" id="identification-liste">
553
												<select name="identification-liste" id="identification-liste">
552
													<option value="" selected>Sélectionner une identification</option>
554
													<option value="" selected>Sélectionner une identification</option>
553
													<option value="certaine" data-titre="certaine">Certaine</option>
555
													<option value="certaine" data-titre="certaine">Certaine</option>
554
													<option value="douteuse" data-titre="douteuse">Douteuse</option>
556
													<option value="douteuse" data-titre="douteuse">Douteuse</option>
555
													<option value="adeterminer" data-titre="à déterminer">A déterminer</option>
557
													<option value="adeterminer" data-titre="à déterminer">A déterminer</option>
556
												</select>
558
												</select>
557
											</div>
559
											</div>
558
										</div>
560
										</div>
559
									</div>
561
									</div>
560
									<!-- Abondance -->
562
									<!-- Abondance -->
561
									<div class="row-fluid">
563
									<div class="row-fluid">
562
										<div class="span12">
564
										<div class="span12">
563
											<label for="abondance-liste">
565
											<label for="abondance-liste">
564
												<strong class="obligatoire">*</strong>
566
												<strong class="obligatoire">*</strong>
565
												Abondance
567
												Abondance
566
											</label>
568
											</label>
567
											<div>
569
											<div>
568
												<select name="abondance-liste" id="abondance-liste">
570
												<select name="abondance-liste" id="abondance-liste">
569
													<option value="" class="a-masquer" selected>Sélectionner une abondance</option>
571
													<option value="" class="a-masquer" selected>Sélectionner une abondance</option>
570
													<option value="1" data-titre="1 à 10 espèces">1 à 10</option>
572
													<option value="1" data-titre="1 à 10 espèces">1 à 10</option>
571
													<option value="10" data-titre="10 à 100 espèces">10 à 100</option>
573
													<option value="10" data-titre="10 à 100 espèces">10 à 100</option>
572
													<option value="100" data-titre="100 à 1000 espèces">100 à 1000</option>
574
													<option value="100" data-titre="100 à 1000 espèces">100 à 1000</option>
573
												</select>
575
												</select>
574
											</div>
576
											</div>
575
										</div>
577
										</div>
576
									</div>
578
									</div>
577
									<!-- Zone du champ -->
579
									<!-- Zone du champ -->
578
									<div class="row-fluid">
580
									<div class="row-fluid">
579
										<div class="span12 control-group">
581
										<div class="span12 control-group">
580
											<strong class="obligatoire">*</strong>
582
											<strong class="obligatoire">*</strong>
581
											Zone du champ
583
											Zone du champ
582
											<!-- Bordure -->										
584
											<!-- Bordure -->										
583
											<label for="bordure" class="checkbox">
585
											<label for="bordure" class="checkbox">
584
												<input type="checkbox" id="bordure" name="zone-champ[]" value="bordure" data-titre="bordure" />
586
												<input type="checkbox" id="bordure" name="zone-champ[]" value="bordure" data-titre="bordure" />
585
												Bordure
587
												Bordure
586
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
588
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
587
												</i>
589
												</i>
588
											</label>
590
											</label>
589
											<div class="popover-html-content" data-for="bordure">
591
											<div class="popover-html-content" data-for="bordure">
590
												<h5>Bordure</h5>
592
												<h5>Bordure</h5>
591
												Une description de la zone Bordure<br/>
593
												Une description de la zone Bordure<br/>
592
												...
594
												...
593
											</div>
595
											</div>
594
											<!-- Cœur du champ -->										
596
											<!-- Cœur du champ -->										
595
											<label for="coeur-champ" class="checkbox">
597
											<label for="coeur-champ" class="checkbox">
596
												<input type="checkbox" id="coeur-champ" name="zone-champ[]" value="coeur" data-titre="cœur" />
598
												<input type="checkbox" id="coeur-champ" name="zone-champ[]" value="coeur" data-titre="cœur" />
597
												Cœur du champ
599
												Cœur du champ
598
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
600
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
599
												</i>
601
												</i>
600
											</label>
602
											</label>
601
											<div class="popover-html-content" data-for="coeur-champ">
603
											<div class="popover-html-content" data-for="coeur-champ">
602
												<h5>Cœur du champ</h5>
604
												<h5>Cœur du champ</h5>
603
												Une description de la zone Cœur du champ<br/>
605
												Une description de la zone Cœur du champ<br/>
604
												...
606
												...
605
											</div>
607
											</div>
606
											<!-- Zone délaissée -->										
608
											<!-- Zone délaissée -->										
607
											<label for="zone-delaissee" class="checkbox">
609
											<label for="zone-delaissee" class="checkbox">
608
												<input type="checkbox" id="zone-delaissee" name="zone-champ[]" value="zone-delaissee" data-titre="zone délaissée" />
610
												<input type="checkbox" id="zone-delaissee" name="zone-champ[]" value="zone-delaissee" data-titre="zone délaissée" />
609
												Zone délaissée
611
												Zone délaissée
610
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
612
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
611
												</i>
613
												</i>
612
											</label>
614
											</label>
613
											<div class="popover-html-content" data-for="zone-delaissee">
615
											<div class="popover-html-content" data-for="zone-delaissee">
614
												<h5>Zone délaissée</h5>
616
												<h5>Zone délaissée</h5>
615
												Une description de la Zone délaissée<br/>
617
												Une description de la Zone délaissée<br/>
616
												...
618
												...
617
											</div>
619
											</div>
618
										</div>
620
										</div>
619
									</div>
621
									</div>
620
									<div class="row-fluid">
622
									<div class="row-fluid">
621
										<div class="span12">
623
										<div class="span12">
622
											<label for="notes">Notes</label>
624
											<label for="notes">Notes</label>
623
											<div>
625
											<div>
624
												<textarea id="notes" class="span6" rows="7" name="notes"
626
												<textarea id="notes" class="span6" rows="7" name="notes"
625
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
627
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
626
											</div>
628
											</div>
627
										</div>
629
										</div>
628
									</div>
630
									</div>
629
								</form>
631
								</form>
630
								<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>"
632
								<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>"
631
									method="post" enctype="multipart/form-data">
633
									method="post" enctype="multipart/form-data">
632
									<h2>Image(s) de cette plante</h2>
634
									<h2>Image(s) de cette plante</h2>
633
									<strong>Ajouter une image</strong>
635
									<strong>Ajouter une image</strong>
634
									<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacune.</p>
636
									<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacune.</p>
635
									<div id="image-obligatoire" class="alert alert-error alert-block" style="display: none;">
637
									<div id="image-obligatoire" class="alert alert-error alert-block" style="display: none;">
636
										<a class="close">×</a>
638
										<a class="close">×</a>
637
										<h4 class="alert-heading">Information : image obligatoire</h4>
639
										<h4 class="alert-heading">Information : image obligatoire</h4>
638
										<p>
640
										<p>
639
											Votre identification n'est pas certaine.
641
											Votre identification n'est pas certaine.
640
											<br>
642
											<br>
641
											Veuillez ajouter au moins une image.
643
											Veuillez ajouter au moins une image.
642
										</p>
644
										</p>
643
									</div>
645
									</div>
644
									<div id ="photos-conteneur">
646
									<div id ="photos-conteneur">
645
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
647
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
646
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
648
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
647
										<div id="miniatures">
649
										<div id="miniatures">
648
										</div>
650
										</div>
649
										<p class="miniature-msg" class="span12">&nbsp;</p>
651
										<p class="miniature-msg" class="span12">&nbsp;</p>
650
									</div>
652
									</div>
651
								</form>
653
								</form>
652
							</div>
654
							</div>
653
							<div class="row-fluid">
655
							<div class="row-fluid">
654
								<div class="span12 centre has-tooltip"
656
								<div class="span12 centre has-tooltip"
655
									title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
657
									title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
656
										ajouter votre observation à la liste à transmettre.">
658
										ajouter votre observation à la liste à transmettre.">
657
									<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
659
									<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
658
										Créer
660
										Créer
659
									</button>
661
									</button>
660
								</div>
662
								</div>
661
							</div>
663
							</div>
662
						</div>
664
						</div>
663
					</div>
665
					</div>
664
				</div>
666
				</div>
665
			</div>
667
			</div>
666
			<!-- Messages d'erreur du formulaire-->
668
			<!-- Messages d'erreur du formulaire-->
667
			<div class="row">
669
			<div class="row">
668
				<div class="zone-alerte span6 offset3">
670
				<div class="zone-alerte span6 offset3">
669
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
671
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
670
						<a class="close">×</a>
672
						<a class="close">×</a>
671
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
673
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
672
						<p>
674
						<p>
673
							Vous venez d'ajouter votre 10ème observation.<br/>
675
							Vous venez d'ajouter votre 10ème observation.<br/>
674
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
676
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
675
						</p>
677
						</p>
676
					</div>
678
					</div>
677
				</div>
679
				</div>
678
				<div class="zone-alerte span6 offset3">
680
				<div class="zone-alerte span6 offset3">
679
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
681
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
680
						<a class="close">×</a>
682
						<a class="close">×</a>
681
						<h4 class="alert-heading">Information : champs en erreur</h4>
683
						<h4 class="alert-heading">Information : champs en erreur</h4>
682
						<p>
684
						<p>
683
							Certains champs du formulaire sont mal remplis.<br/>
685
							Certains champs du formulaire sont mal remplis.<br/>
684
							Veuillez vérifier vos données.
686
							Veuillez vérifier vos données.
685
						</p>
687
						</p>
686
					</div>
688
					</div>
687
				</div>
689
				</div>
688
			</div>
690
			</div>
689
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
691
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
690
			<div id="zone-liste-obs" class="row-fluid">
692
			<div id="zone-liste-obs" class="row-fluid">
691
				<div class="span12">
693
				<div class="span12">
692
					<div class="well">
694
					<div class="well">
693
						<div class="row-fluid">
695
						<div class="row-fluid">
694
							<div class="span8">
696
							<div class="span8">
695
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
697
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
696
							</div>
698
							</div>
697
							<div class="span4 droite">
699
							<div class="span4 droite">
698
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
700
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
699
									type="button" disabled="disabled"
701
									type="button" disabled="disabled"
700
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
702
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
701
									Transmettre
703
									Transmettre
702
								</button>
704
								</button>
703
							</div>
705
							</div>
704
						</div>
706
						</div>
705
						<div id="liste-obs" ></div>
707
						<div id="liste-obs" ></div>
706
						<div class="row">
708
						<div class="row">
707
							<div class="zone-alerte span6 offset3">
709
							<div class="zone-alerte span6 offset3">
708
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
710
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
709
									<a class="close">×</a>
711
									<a class="close">×</a>
710
									<h4 class="alert-heading">Attention : aucune observation</h4>
712
									<h4 class="alert-heading">Attention : aucune observation</h4>
711
									<p>Veuillez saisir des observations pour les transmettres.</p>
713
									<p>Veuillez saisir des observations pour les transmettres.</p>
712
								</div>
714
								</div>
713
 
715
 
714
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
716
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
715
									<a class="close">×</a>
717
									<a class="close">×</a>
716
									<h4 class="alert-heading">Information : transmission des observations</h4>
718
									<h4 class="alert-heading">Information : transmission des observations</h4>
717
									<div class="alert-txt"></div>
719
									<div class="alert-txt"></div>
718
								</div>
720
								</div>
719
 
721
 
720
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
722
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
721
									<a class="close">×</a>
723
									<a class="close">×</a>
722
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
724
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
723
									<div class="alert-txt"></div>
725
									<div class="alert-txt"></div>
724
								</div>
726
								</div>
725
							</div>
727
							</div>
726
						</div>
728
						</div>
727
 
729
 
728
					</div>
730
					</div>
729
				</div>
731
				</div>
730
			</div>
732
			</div>
731
 
733
 
732
			<footer class="row-fluid">
734
			<footer class="row-fluid">
733
				<p class="span12">&copy; Tela Botanica 2015</p>
735
				<p class="span12">&copy; Tela Botanica 2015</p>
734
			</footer>
736
			</footer>
735
 
737
 
736
			<!-- Fenêtres modales -->
738
			<!-- Fenêtres modales -->
737
			<div id="chargement" class="modal-fenetre" style="display:none;">
739
			<div id="chargement" class="modal-fenetre" style="display:none;">
738
				<div id="chargement-centrage" class="modal-contenu">
740
				<div id="chargement-centrage" class="modal-contenu">
739
					<div class="progress progress-striped active">
741
					<div class="progress progress-striped active">
740
			 			<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
742
			 			<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
741
			    			<span class="sr-only">0/10 observations transmises</span>
743
			    			<span class="sr-only">0/10 observations transmises</span>
742
			  			</div>
744
			  			</div>
743
					</div>
745
					</div>
744
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
746
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
745
						Transfert des observations en cours...<br />
747
						Transfert des observations en cours...<br />
746
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
748
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
747
						d'observations à transférer.
749
						d'observations à transférer.
748
					</p>
750
					</p>
749
				</div>
751
				</div>
750
			</div>
752
			</div>
751
 
753
 
752
			<!-- Templates HTML -->
754
			<!-- Templates HTML -->
753
			<div id="tpl-transmission-ok" style="display:none;">
755
			<div id="tpl-transmission-ok" style="display:none;">
754
				<p class="msg">
756
				<p class="msg">
755
					Vos observations ont bien été transmises.<br />
757
					Vos observations ont bien été transmises.<br />
756
					Elles sont désormais consultables à travers les différents outils de visualisation
758
					Elles sont désormais consultables à travers les différents outils de visualisation
757
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
759
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
758
					<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
760
					<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
759
					<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
761
					<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
760
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
762
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
761
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
763
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
762
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
764
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
763
					N'oubliez pas qu'il est nécessaire de
765
					N'oubliez pas qu'il est nécessaire de
764
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
766
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
765
					au préalable, si ce n'est pas déjà fait.
767
					au préalable, si ce n'est pas déjà fait.
766
				</p>
768
				</p>
767
			</div>
769
			</div>
768
			<div id="tpl-transmission-ko" style="display:none;">
770
			<div id="tpl-transmission-ko" style="display:none;">
769
				<p class="msg">
771
				<p class="msg">
770
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
772
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
771
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
773
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
772
					et transmettre les suivantes.<br />
774
					et transmettre les suivantes.<br />
773
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
775
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
774
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
776
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
775
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
777
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
776
								  target="_blank"
778
								  target="_blank"
777
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
779
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
778
								  le formulaire de signalement d'erreurs</a>.
780
								  le formulaire de signalement d'erreurs</a>.
779
				</p>
781
				</p>
780
			</div>
782
			</div>
781
		</div>
783
		</div>
782
	</body>
784
	</body>
783
</html>
785
</html>