Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 2850 Rev 2851
1
<!DOCTYPE html>
1
<!DOCTYPE html>
2
<html>
2
<html>
3
	<head>
3
	<head>
4
	
4
	
5
		<title>Messicoles</title>
5
		<title>Messicoles</title>
6
 
6
 
7
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
7
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
8
		<meta http-equiv="Content-style-type" content="text/css" />
8
		<meta http-equiv="Content-style-type" content="text/css" />
9
		<meta http-equiv="Content-script-type" content="text/javascript" />
9
		<meta http-equiv="Content-script-type" content="text/javascript" />
10
		<meta http-equiv="Content-language" content="fr" />
10
		<meta http-equiv="Content-language" content="fr" />
11
 
11
 
12
		<meta name="revisit-after" content="15 days" />
12
		<meta name="revisit-after" content="15 days" />
13
		<meta name="robots" content="index,follow" />
13
		<meta name="robots" content="index,follow" />
14
		<meta name="author" content="Tela Botanica" />
14
		<meta name="author" content="Tela Botanica" />
15
		<meta name="keywords" content="Messicoles, Tela Botanica, CEL" />
15
		<meta name="keywords" content="Messicoles, Tela Botanica, CEL" />
16
		<meta name="description" content="Widget de saisie pour le projet Messicoles" />
16
		<meta name="description" content="Widget de saisie pour le projet Messicoles" />
17
 
17
 
18
		<!-- OpenGraph pour Facebook, Pinterest, Google+ -->
18
		<!-- OpenGraph pour Facebook, Pinterest, Google+ -->
19
		<meta property="og:type" content="website" />
19
		<meta property="og:type" content="website" />
20
		<meta property="og:title" content="Saisie rapide d'observations" />
20
		<meta property="og:title" content="Saisie rapide d'observations" />
21
		<meta property="og:site_name" content="Tela Botanica" />
21
		<meta property="og:site_name" content="Tela Botanica" />
22
		<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)" />
22
		<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)" />
23
		<meta property="og:image" content="http://resources.tela-botanica.org/tb/img/256x256/carre_englobant.png" />
23
		<meta property="og:image" content="http://resources.tela-botanica.org/tb/img/256x256/carre_englobant.png" />
24
		<meta property="og:image:type" content="image/png" /> 
24
		<meta property="og:image:type" content="image/png" /> 
25
		<meta property="og:image:width" content="256" /> 
25
		<meta property="og:image:width" content="256" /> 
26
		<meta property="og:image:height" content="256" />
26
		<meta property="og:image:height" content="256" />
27
		<meta property="og:locale" content="fr_FR" />
27
		<meta property="og:locale" content="fr_FR" />
28
 
28
 
29
		<!-- Viewport Mobile -->
29
		<!-- Viewport Mobile -->
30
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
30
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
31
 
31
 
32
		<!-- Favicones -->
32
		<!-- Favicones -->
33
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
33
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
34
 
34
 
35
		<!-- Javascript : bibliothèques -->
35
		<!-- Javascript : bibliothèques -->
36
		<!-- Google Map v3 -->
36
		<!-- Google Map v3 -->
37
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
37
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?language=fr&amp;region=FR"></script>
38
		<!-- Jquery -->
38
		<!-- Jquery -->
39
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
39
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
40
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
40
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
41
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
41
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
42
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
42
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
43
		<!-- Jquery Plugins -->
43
		<!-- Jquery Plugins -->
44
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
44
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
45
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
45
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
46
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
46
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
47
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
47
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
48
		<!-- Jquery Form :nécessaire pour l'upload des images -->
48
		<!-- Jquery Form :nécessaire pour l'upload des images -->
49
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
49
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
50
		<!-- Bootstrap -->
50
		<!-- Bootstrap -->
51
		<script type="text/javascript" src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
51
		<script type="text/javascript" src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
52
		
52
		
53
 
53
 
54
 
54
 
55
 
55
 
56
 
56
 
57
		<!-- Javascript : appli saisie -->
57
		<!-- Javascript : appli saisie -->
58
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
58
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
59
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/messicoles/js/WidgetSaisieMessicoles.js"></script>
59
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/messicoles/js/WidgetSaisieMessicoles.js"></script>
60
		<script type="text/javascript">
60
		<script type="text/javascript">
61
		//<![CDATA[
61
		//<![CDATA[
62
           $(document).ready(function() {
62
           $(document).ready(function() {
63
           
63
           
64
				// Héritage
64
				// Héritage
65
				var widget = new WidgetSaisieMessicoles();
65
				var widget = new WidgetSaisieMessicoles();
66
 
66
 
67
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
67
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
68
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
68
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
69
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
69
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
70
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
70
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
71
				// Mot-clé du widget/projet
71
				// Mot-clé du widget/projet
72
				widget.tagProjet = "WidgetSaisie";
72
				widget.tagProjet = "WidgetSaisie";
73
				// Mots-clés à ajouter aux images
73
				// Mots-clés à ajouter aux images
74
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
74
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
75
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
75
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
76
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
76
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
77
				// Mots-clés à ajouter aux observations
77
				// Mots-clés à ajouter aux observations
78
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
78
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
79
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
79
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
80
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
80
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
81
				// Précharger le formulaire avec les infos d'une observation
81
				// Précharger le formulaire avec les infos d'une observation
82
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
82
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
83
				// URL du web service réalisant l'insertion des données dans la base du CEL.
83
				// URL du web service réalisant l'insertion des données dans la base du CEL.
84
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
84
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
85
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
85
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
86
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
86
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
87
				// Code du référentiel utilisé pour les nom scientifiques.
87
				// Code du référentiel utilisé pour les nom scientifiques.
88
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
88
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
89
				// Indication de la présence d'une espèce imposée
89
				// Indication de la présence d'une espèce imposée
90
				widget.especeImposee = "<?=$espece_imposee; ?>";
90
				widget.especeImposee = "<?=$espece_imposee; ?>";
91
				// Tableau d'informations sur l'espèce imposée
91
				// Tableau d'informations sur l'espèce imposée
92
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
92
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
93
				// Nombre d'élément dans les listes d'auto-complétion
93
				// Nombre d'élément dans les listes d'auto-complétion
94
				widget.autocompletionElementsNbre = 20;
94
				widget.autocompletionElementsNbre = 20;
95
				// Indication de la présence d'un référentiel imposé
95
				// Indication de la présence d'un référentiel imposé
96
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
96
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
97
				// URL du web service permettant l'auto-complétion des noms scientifiques
97
				// URL du web service permettant l'auto-complétion des noms scientifiques
98
				widget.serviceAutocompletionNomSciUrl = "<?=$url_ws_autocompletion_ns?>?"+
98
				widget.serviceAutocompletionNomSciUrl = "<?=$url_ws_autocompletion_ns?>?"+
99
					"masque={masque}&"+
99
					"masque={masque}&"+
100
					"recherche=etendue&"+
100
					"recherche=etendue&"+
101
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
101
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
102
					"ns.structure=au"+"&"+
102
					"ns.structure=au"+"&"+
103
					"navigation.limite=" + widget.autocompletionElementsNbre;
103
					"navigation.limite=" + widget.autocompletionElementsNbre;
104
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
104
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
105
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
105
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
106
					"masque={masque}&"+
106
					"masque={masque}&"+
107
					"recherche=etendue&"+
107
					"recherche=etendue&"+
108
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
108
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
109
					"retour.tri=alpharet&"+ // tri "à la CeL"
109
					"retour.tri=alpharet&"+ // tri "à la CeL"
110
					"ns.structure=au"+"&"+
110
					"ns.structure=au"+"&"+
111
					"navigation.limite=" + widget.autocompletionElementsNbre;
111
					"navigation.limite=" + widget.autocompletionElementsNbre;
112
				// Nombre d'observations max autorisé avant transmission
112
				// Nombre d'observations max autorisé avant transmission
113
				widget.obsMaxNbre = 10;
113
				widget.obsMaxNbre = 10;
114
				// Durée d'affichage en milliseconde des messages d'informations
114
				// Durée d'affichage en milliseconde des messages d'informations
115
				widget.dureeMessage = 15000;
115
				widget.dureeMessage = 15000;
116
				// Squelette d'URL du web service de l'annuaire.
116
				// Squelette d'URL du web service de l'annuaire.
117
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
117
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
118
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
118
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
119
				widget.serviceNomCommuneUrl = "http://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
119
				widget.serviceNomCommuneUrl = "http://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
120
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
120
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
121
				widget.serviceNomCommuneUrlAlt = "http://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
121
				widget.serviceNomCommuneUrlAlt = "http://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
122
				// URL du marqueur à utiliser dans la carte Google Map
122
				// URL du marqueur à utiliser dans la carte Google Map
123
				widget.googleMapMarqueurUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/marqueurs/epingle.png";
123
				widget.googleMapMarqueurUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/marqueurs/epingle.png";
124
				// URL de l'icône du chargement en cours
124
				// URL de l'icône du chargement en cours
125
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
125
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
126
				// URL de l'icône du chargement en cours d'une image
126
				// URL de l'icône du chargement en cours d'une image
127
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement-image.gif";
127
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement-image.gif";
128
				// URL de l'icône du calendrier
128
				// URL de l'icône du calendrier
129
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
129
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
130
				// URL de l'icône pour une photo manquante
130
				// URL de l'icône pour une photo manquante
131
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
131
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
132
 
132
 
133
				// Initialisation du bousin
133
				// Initialisation du bousin
134
				widget.init();
134
				widget.init();
135
			});
135
			});
136
		//]]>
136
		//]]>
137
		</script>
137
		</script>
138
 
138
 
139
		<!-- CSS -->
139
		<!-- CSS -->
140
		<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" />
140
		<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" />
141
		<link href="http://resources.tela-botanica.org/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
141
		<link href="http://resources.tela-botanica.org/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
142
		<link href="http://resources.tela-botanica.org/bootstrap/2.0.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
142
		<link href="http://resources.tela-botanica.org/bootstrap/2.0.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
143
		<link href="<?=$url_base?>modules/saisie/squelettes/messicoles/css/<?=isset($_GET['style']) ? $_GET['style'] : 'messicoles'?>.css" rel="stylesheet" type="text/css" media="screen" />
143
		<link href="<?=$url_base?>modules/saisie/squelettes/messicoles/css/<?=isset($_GET['style']) ? $_GET['style'] : 'messicoles'?>.css" rel="stylesheet" type="text/css" media="screen" />
144
 
144
 
145
		<!--  Google Analytics -->
145
		<!--  Google Analytics -->
146
		<?php if($prod): ?>
146
		<?php if($prod): ?>
147
			<?php include "analytics.html"; ?>
147
			<?php include "analytics.html"; ?>
148
		<?php endif; ?>
148
		<?php endif; ?>
149
	</head>
149
	</head>
150
 
150
 
151
	<body data-spy="scroll">
151
	<body data-spy="scroll">
152
		<div class="container">
152
		<div class="container">
153
		
153
		
154
			<!-- Observateur -->
154
			<!-- Observateur -->
155
			<div class="row-fluid">
155
			<div class="row-fluid">
156
				<div class="span12">
156
				<div class="span12">
157
					<div class="well">
157
					<div class="well">
158
						<form id="form-observateur" action="#" class="" autocomplete="on">
158
						<form id="form-observateur" action="#" class="" autocomplete="on">
159
						<h2 id="titre-form-observateur">Observateur</h2>
159
						<h2 id="titre-form-observateur">Observateur</h2>
160
							<div class="row-fluid">
160
							<div class="row-fluid">
161
								<div class="span6 has-tooltip" data-placement="right"
161
								<div class="span6 has-tooltip" data-placement="right"
162
									title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
162
									title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
163
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
163
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
164
										ultérieurement. Des informations complémentaires vont vous être
164
										ultérieurement. Des informations complémentaires vont vous être
165
										demandées : prénom et nom.">
165
										demandées : prénom et nom.">
166
									<label for="courriel"
166
									<label for="courriel"
167
										title="Veuillez saisir votre adresse courriel.">
167
										title="Veuillez saisir votre adresse courriel.">
168
										<strong class="obligatoire">*</strong> 
168
										<strong class="obligatoire">*</strong> 
169
										Courriel
169
										Courriel
170
									</label>
170
									</label>
171
									<div class="input-prepend">
171
									<div class="input-prepend">
172
										<span class="add-on"><i class="icon-envelope"></i></span>
172
										<span class="add-on"><i class="icon-envelope"></i></span>
173
										<input id="courriel" class="input-large" name="courriel" type="text"/>
173
										<input id="courriel" class="input-large" name="courriel" type="text"/>
174
										<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
174
										<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
175
									</div>
175
									</div>
176
								</div>
176
								</div>
177
								<div id="zone-courriel-confirmation" class="span6 hidden">
177
								<div id="zone-courriel-confirmation" class="span6 hidden">
178
									<label for="courriel_confirmation"
178
									<label for="courriel_confirmation"
179
										title="Veuillez saisir confirmer le courriel.">
179
										title="Veuillez saisir confirmer le courriel.">
180
										<strong class="obligatoire">*</strong> 
180
										<strong class="obligatoire">*</strong> 
181
										Courriel (confirmation)
181
										Courriel (confirmation)
182
									</label>
182
									</label>
183
									<div class="input-prepend">
183
									<div class="input-prepend">
184
										<span class="add-on">
184
										<span class="add-on">
185
											<i class="icon-envelope"></i>
185
											<i class="icon-envelope"></i>
186
										</span><input id="courriel_confirmation" class="input-large" name="courriel_confirmation" type="text"/>
186
										</span><input id="courriel_confirmation" class="input-large" name="courriel_confirmation" type="text"/>
187
									</div>
187
									</div>
188
								</div>
188
								</div>
189
							</div>
189
							</div>
190
							<div id="zone-prenom-nom" class="row-fluid hidden">
190
							<div id="zone-prenom-nom" class="row-fluid hidden">
191
								<div class="span6">
191
								<div class="span6">
192
									<label for="prenom">Prénom</label>
192
									<label for="prenom">Prénom</label>
193
									<div>
193
									<div>
194
										<input id="prenom" name="prenom" class="span3" type="text"/>
194
										<input id="prenom" name="prenom" class="span3" type="text"/>
195
									</div>
195
									</div>
196
								</div>
196
								</div>
197
								<div class="span6">
197
								<div class="span6">
198
									<label for="nom">Nom</label>
198
									<label for="nom">Nom</label>
199
									<div>
199
									<div>
200
										<input id="nom" name="nom"  class="span3" type="text"/>
200
										<input id="nom" name="nom"  class="span3" type="text"/>
201
									</div>
201
									</div>
202
								</div>
202
								</div>
203
							</div>
203
							</div>
204
						</form>
204
						</form>
205
					</div>
205
					</div>
206
				</div>
206
				</div>
207
			</div>
207
			</div>
208
			
208
			
209
			
209
			
210
			<!-- Messages d'erreur du formulaire-->
210
			<!-- Messages d'erreur du formulaire-->
211
			<div class="row">
211
			<div class="row">
212
				<div class="zone-alerte span6 offset3">
212
				<div class="zone-alerte span6 offset3">
213
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
213
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
214
						<a class="close">×</a>
214
						<a class="close">×</a>
215
						<h4 class="alert-heading">Information : copier/coller</h4>
215
						<h4 class="alert-heading">Information : copier/coller</h4>
216
						<p>
216
						<p>
217
							Merci de ne pas copier/coller votre courriel.<br/>
217
							Merci de ne pas copier/coller votre courriel.<br/>
218
							La double saisie permet de vérifier l'absence d'erreurs.
218
							La double saisie permet de vérifier l'absence d'erreurs.
219
						</p>
219
						</p>
220
					</div>
220
					</div>
221
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
221
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
222
						<a class="close">×</a>
222
						<a class="close">×</a>
223
						<h4 class="alert-heading">Information : courriel introuvable</h4>
223
						<h4 class="alert-heading">Information : courriel introuvable</h4>
224
						<p>
224
						<p>
225
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
225
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
226
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
226
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
227
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
227
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
228
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
228
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
229
						</p>
229
						</p>
230
					</div>
230
					</div>
231
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
231
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
232
						<a class="close">×</a>
232
						<a class="close">×</a>
233
						<h4 class="alert-heading">Information sur Google Maps</h4>
233
						<h4 class="alert-heading">Information sur Google Maps</h4>
234
						<div class="contenu"></div>
234
						<div class="contenu"></div>
235
					</div>
235
					</div>
236
				</div>
236
				</div>
237
			</div>
237
			</div>
238
			
238
			
239
			
239
			
240
			
240
			
241
			<!-- Fiche terrain -->
241
			<!-- Fiche terrain -->
242
			<div class="row-fluid">
242
			<div class="row-fluid">
243
				<div class="span12">
243
				<div class="span12">
244
					<div class="well">
244
					<div class="well">
245
					
245
					
246
						<!-- Formulaire Relevé -->
246
						<!-- Formulaire Relevé -->
247
						<form id="form-releve" class="form" action="#" autocomplete="on">
247
						<form id="form-releve" class="form" action="#" autocomplete="on">
248
						
248
						
249
							<!-- Titre Relevé -->
249
							<!-- Titre Relevé -->
250
							<h2 id="titre-form-releve">Relevé</h2>
250
							<h2 id="titre-form-releve">Relevé</h2>
251
					
251
					
252
							<!-- Date du relevé -->
252
							<!-- Date du relevé -->
253
							<div class="span12 has-tooltip"
253
							<div class="span12 has-tooltip"
254
								title="Vous pouvez cliquer sur l'icône de calendrier pour
254
								title="Vous pouvez cliquer sur l'icône de calendrier pour
255
									sélectionner une date dans un calendrier.">
255
									sélectionner une date dans un calendrier.">
256
								<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
256
								<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
257
									<h4>Date du relevé</h4>
257
									<h4>Date du relevé</h4>
258
								</label>
258
								</label>
259
								<div class="input-prepend">
259
								<div class="input-prepend">
260
									<span id="date-icone" class="add-on"></span><input id="date"
260
									<span id="date-icone" class="add-on"></span><input id="date"
261
										class="input-small" name="date" type="text"
261
										class="input-small" name="date" type="text"
262
										placeholder="jj/mm/aaaa" />
262
										placeholder="jj/mm/aaaa" />
263
								</div>
263
								</div>
264
							</div>
264
							</div>
265
					
265
					
266
							<!-- Lieu du relevé -->
266
							<!-- Lieu du relevé -->
267
							<div class="span12 has-tooltip control-group"
267
							<div class="span12 has-tooltip control-group"
268
								title="Vous pouvez sélectionner un type de culture parmi la liste ou en saisir un manuellement via l'option Autres">
268
								title="Vous pouvez sélectionner un type de culture parmi la liste ou en saisir un manuellement via l'option Autres">
269
								<label for="type_culture" title="Veuillez indiquer le type de culture">
269
								<label for="type_culture" title="Veuillez indiquer le type de culture">
270
									<h4>Lieu du relevé</h4>
270
									<h4>Lieu du relevé</h4>
271
								</label>
271
								</label>
272
								<!-- Céréale -->										
272
								<!-- Céréale -->										
273
								<label for="cereale" class="radio">
273
								<label for="cereale" class="radio">
274
									<input type="radio" id="cereale" name="type-culture" value="cereale" />
274
									<input type="radio" id="cereale" name="type-culture" value="cereale" />
275
									Céréale	<img src="img/icones/aide.png">
275
									Céréale	<img src="img/icones/aide.png">
276
								</label>
276
								</label>
277
								<!-- Friche -->										
277
								<!-- Friche -->										
278
								<label for="friche" class="radio">
278
								<label for="friche" class="radio">
279
									<input type="radio" id="friche" name="type-culture" value="friche" />
279
									<input type="radio" id="friche" name="type-culture" value="friche" />
280
									Friche	<img src="img/icones/aide.png">
280
									Friche	<img src="img/icones/aide.png">
281
								</label>
281
								</label>
282
								<!-- Légumineuse -->										
282
								<!-- Légumineuse -->										
283
								<label for="legumineuse" class="radio">
283
								<label for="legumineuse" class="radio">
284
									<input type="radio" id="legumineuse" name="type-culture" value="legumineuse" />
284
									<input type="radio" id="legumineuse" name="type-culture" value="legumineuse" />
285
									Légumineuse	<img src="img/icones/aide.png">
285
									Légumineuse	<img src="img/icones/aide.png">
286
								</label>
286
								</label>
287
								<!-- Vigne -->										
287
								<!-- Vigne -->										
288
								<label for="vigne" class="radio">
288
								<label for="vigne" class="radio">
289
									<input type="radio" id="friche" name="type-culture" value="vigne" />
289
									<input type="radio" id="friche" name="type-culture" value="vigne" />
290
									Vigne <img src="img/icones/aide.png">
290
									Vigne <img src="img/icones/aide.png">
291
								</label>
291
								</label>
292
								<!-- Verger -->										
292
								<!-- Verger -->										
293
								<label for="verger" class="radio">
293
								<label for="verger" class="radio">
294
									<input type="radio" id="verger" name="type-culture" value="verger" />
294
									<input type="radio" id="verger" name="type-culture" value="verger" />
295
									Verger <img src="img/icones/aide.png">
295
									Verger <img src="img/icones/aide.png">
296
								</label>
296
								</label>
297
								<!-- Autres -->										
297
								<!-- Autres -->										
298
								<label for="autres" class="radio">
298
								<label for="autres" class="radio">
299
									<input type="radio" id="autres" name="type-culture" value="autres" />
299
									<input type="radio" id="autres" name="type-culture" value="autres" />
300
									Autres <img src="img/icones/aide.png">
300
									Autres <img src="img/icones/aide.png">
301
									<input type="text" id="culture-autres" name="culture-autres">
301
									<input type="text" id="culture-autres" name="culture-autres">
302
								</label>
302
								</label>
303
 
303
 
304
								<!-- Définition de la culture (photo) -->
304
								<!-- Définition de la culture (photo) -->
305
								<div class="span12 has-tooltip droite">
305
								<div class="span12 has-tooltip droite">
306
									<img id="test" src="" alt="">
306
									<img id="test" src="" alt="">
307
								</div>
307
								</div>
308
								
308
								
309
							</div>
309
							</div>
310
					
310
					
311
						</form>
311
						</form>
312
							
312
							
313
							
313
							
314
										
314
										
315
						<!-- Formulaire Observations -->	
315
						<!-- Formulaire Observations -->	
316
						<form id="form-observations" class="form" action="#" autocomplete="on"> 
316
						<form id="form-observations" class="form" action="#" autocomplete="on"> 
317
							
317
							
318
							<!-- Titre Observations -->		
318
							<!-- Titre Observations -->		
319
							<h2 id="titre-form-obervations">Observations</h2>
319
							<h2 id="titre-form-obervations">Observations</h2>
320
						
320
						
321
							<!-- Espèce -->
321
							<!-- Espèce -->
322
							<div id="taxon-input-groupe" class="span8 has-tooltip"
322
							<div id="taxon-input-groupe" class="span8 has-tooltip"
323
								title="Sélectionnez une espèce dans la liste déroulante pour lier
323
								title="Sélectionnez une espèce dans la liste déroulante pour lier
324
									votre nom au référentiel selectionné. Si vous
324
									votre nom au référentiel selectionné. Si vous
325
									le désirez vous pouvez aussi saisir un nom absent du référentiel
325
									le désirez vous pouvez aussi saisir un nom absent du référentiel
326
									(Ex. : 'fleur violette' ou 'viola sinensis???')." >
326
									(Ex. : 'fleur violette' ou 'viola sinensis???')." >
327
								<label for="taxon" title="Choisissez une espèce">
327
								<label for="taxon" title="Choisissez une espèce">
328
									<strong class="obligatoire">
328
									<strong class="obligatoire">
329
										<h4>Espèce</h4>
329
										<h4>Espèce</h4>
330
									</strong>
330
									</strong>
331
								</label>
331
								</label>
332
								<div class="input-prepend">
332
								<div class="input-prepend">
333
									<span class="add-on">
333
									<span class="add-on">
334
										<i class="icon-leaf"></i>
334
										<i class="icon-leaf"></i>
335
									</span><input type="text" id="taxon" name="taxon" value="<?= $nom_sci_espece_defaut; ?>" />
335
									</span><input type="text" id="taxon" name="taxon" value="<?= $nom_sci_espece_defaut; ?>" />
336
								</div>
336
								</div>
337
								<?php if(!$referentiel_impose && !$espece_imposee) : ?>
337
								<?php if(!$referentiel_impose && !$espece_imposee) : ?>
338
								<div class="row-fluid">
338
								<div class="row-fluid">
339
									<div class="has-tooltip"
339
									<div class="has-tooltip"
340
										title="Sélectionnez le référentiel associé à votre relevé">
340
										title="Sélectionnez le référentiel associé à votre relevé">
341
										<label for="referentiel" title="Réferentiel">
341
										<label for="referentiel" title="Réferentiel">
342
											<h4>Référentiel</h4>
342
											<h4>Référentiel</h4>
343
										</label>
343
										</label>
344
										<span class="input-prepend">
344
										<span class="input-prepend">
345
											<span id="referentiel-icone" class="add-on"><i class="icon-book"></i></span>
345
											<span id="referentiel-icone" class="add-on"><i class="icon-book"></i></span>
346
											<select id="referentiel" autocomplete="off">
346
											<select id="referentiel" autocomplete="off">
347
												<option value="bdtfx" selected="selected" title="Trachéophytes de France métropolitaine">Métropole (BDTFX)</option>
347
												<option value="bdtfx" selected="selected" title="Trachéophytes de France métropolitaine">Métropole (BDTFX)</option>
348
												<option value="bdtxa" title="Trachéophytes des Antilles">Antilles françaises (BDTXA)</option>
348
												<option value="bdtxa" title="Trachéophytes des Antilles">Antilles françaises (BDTXA)</option>
349
												<option value="bdtre" title="Trachéophytes de La Réunion">Réunion (BDTRE)</option>
349
												<option value="bdtre" title="Trachéophytes de La Réunion">Réunion (BDTRE)</option>
350
												<option value="isfan" title="Afrique du Nord">Afrique du Nord (ISFAN)</option>
350
												<option value="isfan" title="Afrique du Nord">Afrique du Nord (ISFAN)</option>
351
												<option value="apd" title="Afrique de l'Ouest et du Centre">Afrique de l'Ouest et du Centre (APD)</option>
351
												<option value="apd" title="Afrique de l'Ouest et du Centre">Afrique de l'Ouest et du Centre (APD)</option>
352
												<option value="lbf" title="Liban">Liban (LBF)</option>
352
												<option value="lbf" title="Liban">Liban (LBF)</option>
353
												<option value="autre" title="Autre/Inconnu">Autre/Inconnu</option>
353
												<option value="autre" title="Autre/Inconnu">Autre/Inconnu</option>
354
											</select>
354
											</select>
355
										</span>
355
										</span>
356
									</div>
356
									</div>
357
								</div>
357
								</div>
358
							<?php endif; ?>
358
							<?php endif; ?>
359
							</div>
359
							</div>
360
 
360
 
361
							<!-- Identification -->
361
							<!-- Identification -->
362
							<div class="row-fluid">
362
							<div class="row-fluid">
363
								<div class="span12 control-group has-tooltip"
363
								<div class="span12 control-group has-tooltip"
364
									title="Indiquez votre certitude vis-à-vis du nom d'espèce indiqué">
364
									title="Indiquez votre certitude vis-à-vis du nom d'espèce indiqué">
365
									<label class="span12 control-label">
365
									<label class="span12 control-label">
366
										<h4>Identification</h4>
366
										<h4>Identification</h4>
367
									</label>
367
									</label>
368
									<div id="certitude-controls" class="controls">
368
									<div id="certitude-controls" class="controls">
369
										<span class="span12" title="Détermination certaine">
369
										<span class="span12" title="Détermination certaine">
370
											<input type="radio" name="certitude" id="certitude-certaine" value="certain" />
370
											<input type="radio" name="certitude" id="certitude-certaine" value="certain" />
371
											<label for="certitude-certaine">Certaine</label>																	
371
											<label for="certitude-certaine">Certaine</label>																	
372
										</span>
372
										</span>
373
										<span class="span12" title="Détermination incertaine mais pas inexacte">
373
										<span class="span12" title="Détermination incertaine mais pas inexacte">
374
											<input type="radio" name="certitude" id="certitude-douteuse" value="douteux" />
374
											<input type="radio" name="certitude" id="certitude-douteuse" value="douteux" />
375
											<label for="certitude-douteuse">Douteuse</label>
375
											<label for="certitude-douteuse">Douteuse</label>
376
										</span>
376
										</span>
377
										<span class="span12" title="Détermination inconnue">
377
										<span class="span12" title="Détermination inconnue">
378
											<input type="radio" name="certitude" id="certitude-adeterminer" value="aDeterminer" />
378
											<input type="radio" name="certitude" id="certitude-adeterminer" value="aDeterminer" />
379
											<label for="certitude-adeterminer">A determiner</label>
379
											<label for="certitude-adeterminer">A determiner</label>
380
										</span>									
380
										</span>									
381
									</div>
381
									</div>
382
								</div>
382
								</div>
383
							</div>
383
							</div>
384
		
384
		
385
							<!-- Abondance -->
385
							<!-- Abondance -->
386
							<div class="row-fluid">
386
							<div class="row-fluid">
387
								<div class="span12 control-group has-tooltip"
387
								<div class="span12 control-group has-tooltip"
388
									title="Indiquez l'abondance du nom d'espèce indiqué">
388
									title="Indiquez l'abondance du nom d'espèce indiqué">
389
									<label class="span12 control-label">
389
									<label class="span12 control-label">
390
										<h4>Abondance</h4>
390
										<h4>Abondance</h4>
391
									</label>
391
									</label>
392
									<div id="abondance-controls" class="controls">
392
									<div id="abondance-controls" class="controls">
393
										<span class="span12" title="Abondance faible">
393
										<span class="span12" title="Abondance faible">
394
											<input type="radio" name="abondance" id="abondance-certaine" value="certain" />
394
											<input type="radio" name="abondance" id="abondance-certaine" value="certain" />
395
											<label for="abondance-certaine">1 à 10 spécimens</label>
395
											<label for="abondance-certaine">1 à 10 spécimens</label>
396
										</span>
396
										</span>
397
										<span class="span12" title="Abondance modérée">
397
										<span class="span12" title="Abondance modérée">
398
											<input type="radio" name="abondance" id="abondance-douteuse" value="douteux" />
398
											<input type="radio" name="abondance" id="abondance-douteuse" value="douteux" />
399
											<label for="abondance-douteuse">10 à 100 spécimens</label>
399
											<label for="abondance-douteuse">10 à 100 spécimens</label>
400
										</span>
400
										</span>
401
										<span class="span12" title="Détermination inconnue">
401
										<span class="span12" title="Détermination inconnue">
402
											<input type="radio" name="abondance" id="abondance-adeterminer" value="aDeterminer" />
402
											<input type="radio" name="abondance" id="abondance-adeterminer" value="aDeterminer" />
403
											<label for="abondance-adeterminer">100 à 1000 spécimens</label>
403
											<label for="abondance-adeterminer">100 à 1000 spécimens</label>
404
										</span>									
404
										</span>									
405
									</div>
405
									</div>
406
								</div>
406
								</div>
407
							</div>
407
							</div>
408
 
408
 
409
							<!-- Zone du champs -->
409
							<!-- Zone du champs -->
410
							<div class="row-fluid">
410
							<div class="row-fluid">
411
								<div class="span12 control-group has-tooltip"
411
								<div class="span12 control-group has-tooltip"
412
								title="Indiquez la ou les zone(s) du champs où l'espèce saisie a été observée">
412
								title="Indiquez la ou les zone(s) du champs où l'espèce saisie a été observée">
413
									<label class="span12 control-label">
413
									<label class="span12 control-label">
414
										<h4>Zone du champs</h4>
414
										<h4>Zone du champs</h4>
415
									</label>
415
									</label>
416
									<div id="zoneChamps-controls" class="controls">
416
									<div id="zoneChamps-controls" class="controls">
417
										<!-- Bordure -->
417
										<!-- Bordure -->
418
										<div class="checkbox" for="bordure">
418
										<div class="checkbox" for="bordure">
419
											<input type="checkbox" name="zoneChamps" id="bordure" value="bordure" />
419
											<input type="checkbox" name="zoneChamps" id="bordure" value="bordure" />
420
											<label for="bordure">Bordure</label>
420
											<label for="bordure">Bordure</label>
421
											<img src="img/icones/aide.png">
421
											<img src="img/icones/aide.png">
422
										</span>
422
										</span>
423
										<!-- Coeur-->
423
										<!-- Coeur-->
424
										<span class="checkbox">
424
										<span class="checkbox">
425
											<input type="checkbox" name="zoneChamps" id="coeur" value="coeur" />
425
											<input type="checkbox" name="zoneChamps" id="coeur" value="coeur" />
426
											<label for="coeur">Coeur du champs</label>
426
											<label for="coeur">Coeur du champs</label>
427
											<img src="img/icones/aide.png">
427
											<img src="img/icones/aide.png">
428
										</span>
428
										</span>
429
										<!-- Délaissée -->
429
										<!-- Délaissée -->
430
										<span class="checkbox">
430
										<span class="checkbox">
431
											<input type="checkbox" name="zoneChamps" id="delaissee" value="delaissee" />
431
											<input type="checkbox" name="zoneChamps" id="delaissee" value="delaissee" />
432
											<label for="delaissee">Zone délaissée</label>
432
											<label for="delaissee">Zone délaissée</label>
433
											<img class="aide" src="img/icones/aide.png">
433
											<img class="aide" src="img/icones/aide.png">
434
										</span>
434
										</span>
435
									</div>							
435
									</div>							
436
								</div>
436
								</div>
437
							</div>
437
							</div>
438
		
438
		
439
							<!-- Notes -->
439
							<!-- Notes -->
440
							<div class="row-fluid">
440
							<div class="row-fluid">
441
								<div class="span12">
441
								<div class="span12">
442
									<label for="notes"><h4>Notes</h4></label>
442
									<label for="notes"><h4>Notes</h4></label>
443
									<div>
443
									<div>
444
										<textarea id="notes" class="span6" rows="7" name="notes"
444
										<textarea id="notes" class="span6" rows="7" name="notes"
445
											placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
445
											placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
446
									</div>
446
									</div>
447
								</div>
447
								</div>
448
							</div>
448
							</div>
449
						</form>
449
						</form>
450
							
450
							
451
						<!--Photos -->
451
						<!--Photos -->
452
						<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>"
452
						<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>"
453
							method="post" enctype="multipart/form-data">
453
							method="post" enctype="multipart/form-data">
454
							<h2>Image(s) de cette plante</h2>
454
							<h2>Image(s) de cette plante</h2>
455
							<strong>Ajouter une image</strong>
455
							<strong>Ajouter une image</strong>
456
							<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
456
							<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
457
							<div id ="photos-conteneur">
457
							<div id ="photos-conteneur">
458
								<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
458
								<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
459
								<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
459
								<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
460
								<div id="miniatures">
460
								<div id="miniatures">
461
								</div>
461
								</div>
462
								<p class="miniature-msg" class="span12">&nbsp;</p>
462
								<p class="miniature-msg" class="span12">&nbsp;</p>
463
							</div>
463
							</div>
464
						</form>
464
						</form>
465
							
465
							
466
						<!-- Bouton créer -->			
466
						<!-- Bouton créer -->			
467
						<div class="row-fluid">
467
						<div class="row-fluid">
468
							<div class="span12 centre has-tooltip"
468
							<div class="span12 centre has-tooltip"
469
								title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
469
								title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
470
									ajouter votre observation à la liste à transmettre.">
470
									ajouter votre observation à la liste à transmettre.">
471
								<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
471
								<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
472
									Créer
472
									Créer
473
								</button>
473
								</button>
474
							</div>
474
							</div>
475
						</div>
475
						</div>
476
							
476
							
477
					</div>
477
					</div>
478
				</div>
478
				</div>
479
			</div>
479
			</div>
480
			<!-- Fin -->
480
			<!-- Fin -->
481
			
481
			
482
			
482
			
483
			
483
			
484
			<!-- Messages d'erreur du formulaire-->
484
			<!-- Messages d'erreur du formulaire-->
485
			<div class="row">
485
			<div class="row">
486
				<div class="zone-alerte span6 offset3">
486
				<div class="zone-alerte span6 offset3">
487
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
487
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
488
						<a class="close">×</a>
488
						<a class="close">×</a>
489
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
489
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
490
						<p>
490
						<p>
491
							Vous venez d'ajouter votre 10ème observation.<br/>
491
							Vous venez d'ajouter votre 10ème observation.<br/>
492
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
492
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
493
						</p>
493
						</p>
494
					</div>
494
					</div>
495
				</div>
495
				</div>
496
				<div class="zone-alerte span6 offset3">
496
				<div class="zone-alerte span6 offset3">
497
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
497
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
498
						<a class="close">×</a>
498
						<a class="close">×</a>
499
						<h4 class="alert-heading">Information : champs en erreur</h4>
499
						<h4 class="alert-heading">Information : champs en erreur</h4>
500
						<p>
500
						<p>
501
							Certains champs du formulaire sont mal remplis.<br/>
501
							Certains champs du formulaire sont mal remplis.<br/>
502
							Veuillez vérifier vos données.
502
							Veuillez vérifier vos données.
503
						</p>
503
						</p>
504
					</div>
504
					</div>
505
				</div>
505
				</div>
506
			</div>
506
			</div>
507
			
507
			
508
			
508
			
509
			
509
			
510
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
510
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
511
			<div id="zone-liste-obs" class="row-fluid">
511
			<div id="zone-liste-obs" class="row-fluid">
512
				<div class="span12">
512
				<div class="span12">
513
					<div class="well">
513
					<div class="well">
514
						<div class="row-fluid">
514
						<div class="row-fluid">
515
							<div class="span8">
515
							<div class="span8">
516
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
516
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
517
							</div>
517
							</div>
518
							<div class="span4 droite">
518
							<div class="span4 droite">
519
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
519
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
520
									type="button" disabled="disabled"
520
									type="button" disabled="disabled"
521
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
521
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
522
									Transmettre
522
									Transmettre
523
								</button>
523
								</button>
524
							</div>
524
							</div>
525
						</div>
525
						</div>
526
						<div id="liste-obs" ></div>
526
						<div id="liste-obs" ></div>
527
						<div class="row">
527
						<div class="row">
528
							<div class="zone-alerte span6 offset3">
528
							<div class="zone-alerte span6 offset3">
529
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
529
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
530
									<a class="close">×</a>
530
									<a class="close">×</a>
531
									<h4 class="alert-heading">Attention : aucune observation</h4>
531
									<h4 class="alert-heading">Attention : aucune observation</h4>
532
									<p>Veuillez saisir des observations pour les transmettres.</p>
532
									<p>Veuillez saisir des observations pour les transmettres.</p>
533
								</div>
533
								</div>
534
 
534
 
535
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
535
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
536
									<a class="close">×</a>
536
									<a class="close">×</a>
537
									<h4 class="alert-heading">Information : transmission des observations</h4>
537
									<h4 class="alert-heading">Information : transmission des observations</h4>
538
									<div class="alert-txt"></div>
538
									<div class="alert-txt"></div>
539
								</div>
539
								</div>
540
 
540
 
541
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
541
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
542
									<a class="close">×</a>
542
									<a class="close">×</a>
543
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
543
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
544
									<div class="alert-txt"></div>
544
									<div class="alert-txt"></div>
545
								</div>
545
								</div>
546
							</div>
546
							</div>
547
						</div>
547
						</div>
548
 
548
 
549
					</div>
549
					</div>
550
				</div>
550
				</div>
551
			</div>
551
			</div>
552
 
552
 
553
			<!-- Footer -->
553
			<!-- Footer -->
554
			<footer class="row-fluid">
554
			<footer class="row-fluid">
555
				<p class="span12">&copy; Tela Botanica 2015</p>
555
				<p class="span12">&copy; Tela Botanica 2015</p>
556
			</footer>
556
			</footer>
557
 
557
 
558
			<!-- Fenêtres modales -->
558
			<!-- Fenêtres modales -->
559
			<div id="chargement" class="modal-fenetre" style="display:none;">
559
			<div id="chargement" class="modal-fenetre" style="display:none;">
560
				<div id="chargement-centrage" class="modal-contenu">
560
				<div id="chargement-centrage" class="modal-contenu">
561
					<div class="progress progress-striped active">
561
					<div class="progress progress-striped active">
562
			 			<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
562
			 			<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
563
			    			<span class="sr-only">0/10 observations transmises</span>
563
			    			<span class="sr-only">0/10 observations transmises</span>
564
			  			</div>
564
			  			</div>
565
					</div>
565
					</div>
566
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
566
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
567
						Transfert des observations en cours...<br />
567
						Transfert des observations en cours...<br />
568
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
568
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
569
						d'observations à transférer.
569
						d'observations à transférer.
570
					</p>
570
					</p>
571
				</div>
571
				</div>
572
			</div>
572
			</div>
573
 
573
 
574
			<!-- Templates HTML -->
574
			<!-- Templates HTML -->
575
			<div id="tpl-transmission-ok" style="display:none;">
575
			<div id="tpl-transmission-ok" style="display:none;">
576
				<p class="msg">
576
				<p class="msg">
577
					Vos observations ont bien été transmises.<br />
577
					Vos observations ont bien été transmises.<br />
578
					Elles sont désormais consultables à travers les différents outils de visualisation
578
					Elles sont désormais consultables à travers les différents outils de visualisation
579
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
579
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
580
					<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
580
					<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
581
					<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
581
					<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
582
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
582
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
583
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
583
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
584
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
584
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
585
					N'oubliez pas qu'il est nécessaire de
585
					N'oubliez pas qu'il est nécessaire de
586
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
586
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
587
					au préalable, si ce n'est pas déjà fait.
587
					au préalable, si ce n'est pas déjà fait.
588
				</p>
588
				</p>
589
			</div>
589
			</div>
590
			<div id="tpl-transmission-ko" style="display:none;">
590
			<div id="tpl-transmission-ko" style="display:none;">
591
				<p class="msg">
591
				<p class="msg">
592
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
592
					Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
593
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
593
					Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
594
					et transmettre les suivantes.<br />
594
					et transmettre les suivantes.<br />
595
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
595
					Néanmoins, les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. <br />
596
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
596
					Si le problème persiste, vous pouvez signaler le dysfonctionnement sur
597
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
597
					<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
598
								  target="_blank"
598
								  target="_blank"
599
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
599
								  onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
600
								  le formulaire de signalement d'erreurs</a>.
600
								  le formulaire de signalement d'erreurs</a>.
601
				</p>
601
				</p>
602
			</div>
602
			</div>
603
		</div>
603
		</div>
604
	</body>
604
	</body>
605
</html>
605
</html>