Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 1463 Rev 1475
1
<!DOCTYPE html>
1
<!DOCTYPE html>
2
<html>
2
<html>
3
	<head>
3
	<head>
4
		<title>Saisie simplifiée du CEL</title>
4
		<title>Saisie simplifiée du CEL</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
		<meta http-equiv="Content-style-type" content="text/css" />
7
		<meta http-equiv="Content-style-type" content="text/css" />
8
		<meta http-equiv="Content-script-type" content="text/javascript" />
8
		<meta http-equiv="Content-script-type" content="text/javascript" />
9
		<meta http-equiv="Content-language" content="fr" />
9
		<meta http-equiv="Content-language" content="fr" />
10
		
10
		
11
		<meta name="revisit-after" content="15 days" />
11
		<meta name="revisit-after" content="15 days" />
12
        <meta name="robots" content="index,follow" />
12
        <meta name="robots" content="index,follow" />
13
        <meta name="author" content="Jean-Pascal MILCENT" />
13
        <meta name="author" content="Jean-Pascal MILCENT" />
14
        <meta name="keywords" content="Tela Botanica, CEL" />
14
        <meta name="keywords" content="Tela Botanica, CEL" />
15
        <meta name="description" content="Widget de saisie simplifiée pour le CEL" />
15
        <meta name="description" content="Widget de saisie simplifiée pour le CEL" />
16
 
16
 
17
		<!-- Viewport Mobile -->
17
		<!-- Viewport Mobile -->
18
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
18
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
19
		
19
		
20
		<!-- Favicones -->
20
		<!-- Favicones -->
21
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/defaut/img/favicon.ico" />
21
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/defaut/img/favicon.ico" />
22
		
22
		
23
		<!-- Javascript : bibliothèques -->
23
		<!-- Javascript : bibliothèques -->
24
		<!-- Google Map v3 -->
24
		<!-- Google Map v3 -->
25
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
25
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
26
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>	
26
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>	
27
		
27
		
28
		<!-- Jquery -->
28
		<!-- Jquery -->
29
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.js"></script>
29
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.js"></script>
30
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
30
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
31
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/js/jquery-ui-1.8.18.custom.min.js"></script>
31
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/js/jquery-ui-1.8.18.custom.min.js"></script>
32
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/js/jquery.ui.datepicker-fr.js"></script>
32
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/js/jquery.ui.datepicker-fr.js"></script>
33
		<!-- Jquery Plugins -->
33
		<!-- Jquery Plugins -->
34
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
34
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
35
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.0.2/js/validate/1.9.0/jquery.validate.min.js"></script>
35
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.0.2/js/validate/1.9.0/jquery.validate.min.js"></script>
36
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/messages_fr.js"></script>
36
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/messages_fr.js"></script>
37
		<!-- Jquery Form :nécessaire pour l'upload des images -->
37
		<!-- Jquery Form :nécessaire pour l'upload des images -->
38
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/form/2.95/jquery.form.min.js"></script>
38
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/form/2.95/jquery.form.min.js"></script>
39
		
39
		
40
		<!-- Bootstrap -->
40
		<!-- Bootstrap -->
41
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.0.2/js/bootstrap.min.js"></script>
41
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.0.2/js/bootstrap.min.js"></script>
42
		
42
		
43
		<!-- Javascript : appli saisie -->
43
		<!-- Javascript : appli saisie -->
44
		<script type="text/javascript">
44
		<script type="text/javascript">
45
		//<![CDATA[
45
		//<![CDATA[
46
			// La présence du parametre 'debug' dans l'URL enclenche le dégogage
46
			// La présence du parametre 'debug' dans l'URL enclenche le dégogage
47
			var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
47
			var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
48
			// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
48
			// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
49
			var HTML5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
49
			var HTML5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
50
			// Mot-clé du widget/projet
50
			// Mot-clé du widget/projet
51
			var TAG_PROJET = "WidgetSaisie";
51
			var TAG_PROJET = "WidgetSaisie";
52
			// Mots-clés à ajouter aux images
52
			// Mots-clés à ajouter aux images
53
			var TAG_IMG = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
53
			var TAG_IMG = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
54
			TAG_IMG = <?=isset($_GET['tag']) ? "'".$_GET['projet']."'" : 'TAG_IMG' ?>;
54
			TAG_IMG = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."'" : 'TAG_IMG' ?>;
55
			// Mots-clés à ajouter aux observations
55
			// Mots-clés à ajouter aux observations
56
			var TAG_OBS = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
56
			var TAG_OBS = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
57
			TAG_OBS = <?=isset($_GET['projet']) ? "'".$_GET['projet']."'" : 'TAG_OBS' ?>;
57
			TAG_OBS = <?=isset($_GET['projet']) ? "'".$_GET['projet']."'" : 'TAG_OBS' ?>;
58
			// URL du web service réalisant l'insertion des données dans la base du CEL.
58
			// URL du web service réalisant l'insertion des données dans la base du CEL.
59
			var SERVICE_SAISIE_URL = "<?=$url_ws_saisie?>";
59
			var SERVICE_SAISIE_URL = "<?=$url_ws_saisie?>";
60
			// Code du référentiel utilisé pour les nom scientifiques.
60
			// Code du référentiel utilisé pour les nom scientifiques.
61
			var NOM_SCI_REFERENTIEL = "<?=$ns_referentiel?>";
61
			var NOM_SCI_REFERENTIEL = "<?=$ns_referentiel?>";
62
			// Code de la version du référentiel utilisé pour les nom scientifiques.
62
			// Code de la version du référentiel utilisé pour les nom scientifiques.
63
			var NOM_SCI_VERSION = "<?=$ns_version?>";
63
			var NOM_SCI_VERSION = "<?=$ns_version?>";
64
			// Indication de la présence d'une espèce imposée
64
			// Indication de la présence d'une espèce imposée
65
			var ESPECE_IMPOSEE = "<?=$espece_imposee; ?>";
65
			var ESPECE_IMPOSEE = "<?=$espece_imposee; ?>";
66
			// Tableau d'informations sur l'espèce imposée
66
			// Tableau d'informations sur l'espèce imposée
67
			var INFOS_ESPECE_IMPOSEE = <?=$infos_espece; ?>;
67
			var INFOS_ESPECE_IMPOSEE = <?=$infos_espece; ?>;
68
			// Nombre d'élément dans les listes d'auto-complétion
68
			// Nombre d'élément dans les listes d'auto-complétion
69
			var AUTOCOMPLETION_ELEMENTS_NBRE = 20;
69
			var AUTOCOMPLETION_ELEMENTS_NBRE = 20;
70
			// URL du web service permettant l'auto-complétion des noms scientifiques.
70
			// URL du web service permettant l'auto-complétion des noms scientifiques.
71
			var SERVICE_AUTOCOMPLETION_NOM_SCI_URL = "<?=$url_ws_autocompletion_ns?>?"+
71
			var SERVICE_AUTOCOMPLETION_NOM_SCI_URL = "<?=$url_ws_autocompletion_ns?>?"+
72
					"masque={masque}&"+
72
					"masque={masque}&"+
73
					"recherche=etendue&"+
73
					"recherche=etendue&"+
74
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
74
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
75
					"version.projet="+NOM_SCI_VERSION+"&"+
75
					"version.projet="+NOM_SCI_VERSION+"&"+
76
					"ns.structure=au"+"&"+
76
					"ns.structure=au"+"&"+
77
					"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
77
					"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
78
			// Nombre d'observations max autorisé avant transmission
78
			// Nombre d'observations max autorisé avant transmission
79
			var OBS_MAX_NBRE = 10;
79
			var OBS_MAX_NBRE = 10;
80
			// Durée d'affichage en milliseconde des messages d'informations
80
			// Durée d'affichage en milliseconde des messages d'informations
81
			var DUREE_MESSAGE = 15000;
81
			var DUREE_MESSAGE = 15000;
82
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
82
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
83
			var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
83
			var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
84
			// URL du marqueur à utiliser dans la carte Google Map
84
			// URL du marqueur à utiliser dans la carte Google Map
85
			var GOOGLE_MAP_MARQUEUR_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/marqueurs/epingle.png";
85
			var GOOGLE_MAP_MARQUEUR_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/marqueurs/epingle.png";
86
			// URL de l'icône du chargement en cours
86
			// URL de l'icône du chargement en cours
87
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
87
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
88
			// URL de l'icône du calendrier
88
			// URL de l'icône du calendrier
89
			var CALENDRIER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
89
			var CALENDRIER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
90
			// URL de l'icône du calendrier
90
			// URL de l'icône du calendrier
91
			var PAS_DE_PHOTO_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
91
			var PAS_DE_PHOTO_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
92
		//]]>
92
		//]]>
93
		</script>
93
		</script>
94
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/defaut.js"></script>
94
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/defaut.js"></script>
95
			
95
			
96
		<!-- CSS -->
96
		<!-- CSS -->
97
		<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css" media="screen" />
97
		<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css" media="screen" />
98
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
98
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
99
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
99
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
100
		<link href="<?=$url_base?>modules/saisie/squelettes/defaut/css/<?=isset($_GET['style']) ? $_GET['style'] : 'defaut'?>.css" rel="stylesheet" type="text/css" media="screen" />
100
		<link href="<?=$url_base?>modules/saisie/squelettes/defaut/css/<?=isset($_GET['style']) ? $_GET['style'] : 'defaut'?>.css" rel="stylesheet" type="text/css" media="screen" />
101
	</head>
101
	</head>
102
 
102
 
103
	<body data-spy="scroll">
103
	<body data-spy="scroll">
104
		<div class="container">
104
		<div class="container">
105
			<div class="row-fluid">
105
			<div class="row-fluid">
106
				<div class="span6 page-header">
106
				<div class="span6 page-header">
107
					<div class="row">
107
					<div class="row">
108
						<div class="span6">
108
						<div class="span6">
109
							<h1><img class="span1" src="<?=$url_base?>/modules/saisie/squelettes/defaut/img/logos/tela_botanica.png" alt="Tela Botanica" /> Outil de saisie simplifiée (CEL)</h1>
109
							<h1><img class="span1" src="<?=$url_base?>/modules/saisie/squelettes/defaut/img/logos/tela_botanica.png" alt="Tela Botanica" /> Outil de saisie simplifiée (CEL)</h1>
110
						</div>
110
						</div>
111
					</div>
111
					</div>
112
					<div class="row">
112
					<div class="row">
113
						<div class="span6">
113
						<div class="span6">
114
							<p>
114
							<p>
115
								Ce widget de saisie vous permet de partager simplement vos observations avec le 
115
								Ce widget de saisie vous permet de partager simplement vos observations avec le 
116
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>.
116
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>.
117
								Complétez les champs, créez jusqu'à 10 observations (bouton "créer") puis partagez-les (bouton "transmettre"). 
117
								Complétez les champs, créez jusqu'à 10 observations (bouton "créer") puis partagez-les (bouton "transmettre"). 
118
								Retrouvez ensuite facilement ces observations dans 
118
								Retrouvez ensuite facilement ces observations dans 
119
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
119
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
120
							</p>
120
							</p>
121
							<p class="discretion">
121
							<p class="discretion">
122
								Une fois familiarisé avec l'interface vous pouvez cliquer sur ce bouton pour désactiver l'aide.
122
								Une fois familiarisé avec l'interface vous pouvez cliquer sur ce bouton pour désactiver l'aide.
123
								<button id="btn-aide" class="btn btn-mini btn-success">
123
								<button id="btn-aide" class="btn btn-mini btn-success">
124
									<span class="icon-question-sign icon-white"></span>
124
									<span class="icon-question-sign icon-white"></span>
125
									<span id="btn-aide-txt" >Désactiver l'aide</span>
125
									<span id="btn-aide-txt" >Désactiver l'aide</span>
126
								</button> 
126
								</button> 
127
							</p>
127
							</p>
128
						</div>
128
						</div>
129
					</div>
129
					</div>
130
				</div>
130
				</div>
131
				
131
				
132
				<div class="span6">
132
				<div class="span6">
133
					<div class="well">
133
					<div class="well">
134
						<h2>Observateur</h2>
134
						<h2>Observateur</h2>
135
						<form id="form-observateur" action="#" class="" autocomplete="on">
135
						<form id="form-observateur" action="#" class="" autocomplete="on">
136
							<div class="row-fluid">
136
							<div class="row-fluid">
137
								<div class="span6" rel="tooltip" data-placement="right"
137
								<div class="span6" rel="tooltip" data-placement="right"
138
									title="Saisissez votre courriel avec lequel vous être inscrit à Tela Botanica.
138
									title="Saisissez votre courriel avec lequel vous être inscrit à Tela Botanica.
139
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire 
139
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire 
140
										ultérieurement. Des informations complémentaires vont vous être 
140
										ultérieurement. Des informations complémentaires vont vous être 
141
										demandées : prénom et nom.">
141
										demandées : prénom et nom.">
142
									<label for="courriel"  
142
									<label for="courriel"  
143
										title="Veuillez saisir votre adresse courriel.">
143
										title="Veuillez saisir votre adresse courriel.">
144
										<strong class="obligatoire">*</strong> Courriel
144
										<strong class="obligatoire">*</strong> Courriel
145
									</label>
145
									</label>
146
									<div class="input-prepend">
146
									<div class="input-prepend">
147
										<span class="add-on">
147
										<span class="add-on">
148
											<i class="icon-envelope"></i>
148
											<i class="icon-envelope"></i>
149
										</span>
149
										</span>
150
										<input id="courriel" class="input-medium" name="courriel" type="text"/>
150
										<input id="courriel" class="input-medium" name="courriel" type="text"/>
151
										<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
151
										<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
152
									</div>
152
									</div>
153
								</div>
153
								</div>
154
								<div id="zone-courriel-confirmation" class="span6 hidden">
154
								<div id="zone-courriel-confirmation" class="span6 hidden">
155
									<label for="courriel_confirmation"  
155
									<label for="courriel_confirmation"  
156
										title="Veuillez saisir confirmer votre adresse courriel.">
156
										title="Veuillez saisir confirmer votre adresse courriel.">
157
										<strong class="obligatoire">*</strong> Courriel (confirmation)
157
										<strong class="obligatoire">*</strong> Courriel (confirmation)
158
									</label>
158
									</label>
159
									<div class="input-prepend">
159
									<div class="input-prepend">
160
										<span class="add-on">
160
										<span class="add-on">
161
											<i class="icon-envelope"></i>
161
											<i class="icon-envelope"></i>
162
										</span><input id="courriel_confirmation" class="input-medium" name="courriel_confirmation" type="text"/>
162
										</span><input id="courriel_confirmation" class="input-medium" name="courriel_confirmation" type="text"/>
163
									</div>
163
									</div>
164
								</div>
164
								</div>
165
							</div>
165
							</div>
166
							<div id="zone-prenom-nom" class="row-fluid hidden">
166
							<div id="zone-prenom-nom" class="row-fluid hidden">
167
								<div class="span6">
167
								<div class="span6">
168
									<label for="prenom">Prénom</label>
168
									<label for="prenom">Prénom</label>
169
									<div>
169
									<div>
170
										<input id="prenom" name="prenom" class="span3" type="text"/>
170
										<input id="prenom" name="prenom" class="span3" type="text"/>
171
									</div>
171
									</div>
172
								</div>
172
								</div>
173
								<div class="span6">
173
								<div class="span6">
174
									<label for="nom">Nom</label>
174
									<label for="nom">Nom</label>
175
									<div>
175
									<div>
176
										<input id="nom" name="nom"  class="span3" type="text"/>
176
										<input id="nom" name="nom"  class="span3" type="text"/>
177
									</div>
177
									</div>
178
								</div>
178
								</div>
179
							</div>
179
							</div>
180
						</form>
180
						</form>
181
					</div>
181
					</div>
182
				</div>
182
				</div>
183
			</div>
183
			</div>
184
			<!-- Messages d'erreur du formulaire-->
184
			<!-- Messages d'erreur du formulaire-->
185
			<div class="row">
185
			<div class="row">
186
				<div class="zone-alerte span6 offset3">
186
				<div class="zone-alerte span6 offset3">
187
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
187
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
188
						<a class="close">×</a>
188
						<a class="close">×</a>
189
						<h4 class="alert-heading">Information : copier/coller</h4>
189
						<h4 class="alert-heading">Information : copier/coller</h4>
190
						<p>
190
						<p>
191
							Merci de ne pas copier/coller votre courriel.<br/>
191
							Merci de ne pas copier/coller votre courriel.<br/>
192
							La double saisie permet de vérifier l'absence d'erreurs.
192
							La double saisie permet de vérifier l'absence d'erreurs.
193
						</p>
193
						</p>
194
					</div>
194
					</div>
195
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
195
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
196
						<a class="close">×</a>
196
						<a class="close">×</a>
197
						<h4 class="alert-heading">Information : courriel introuvable</h4>
197
						<h4 class="alert-heading">Information : courriel introuvable</h4>
198
						<p>
198
						<p>
199
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
199
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
200
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
200
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
201
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>, 
201
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>, 
202
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
202
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
203
						</p>
203
						</p>
204
					</div>
204
					</div>
205
				</div>
205
				</div>
206
			</div>
206
			</div>
207
			<div class="row-fluid">
207
			<div class="row-fluid">
208
				<div class="span12">
208
				<div class="span12">
209
					<div class="well">
209
					<div class="well">
210
						<div class="row-fluid">
210
						<div class="row-fluid">
211
							<div class="span6">
211
							<div class="span6">
212
								<div>
212
								<div>
213
									<div class="row-fluid">
213
									<div class="row-fluid">
214
										<div class="span12">
214
										<div class="span12">
215
											<h2>Lieu du relevé</h2>
215
											<h2>Lieu du relevé</h2>
216
										</div>
216
										</div>
217
									</div>
217
									</div>
218
									<div class="row-fluid">
218
									<div class="row-fluid">
219
										<div class="span4">
219
										<div class="span4">
220
											<label for="map_canvas" title="Veuillez localiser l'observation">
220
											<label for="map_canvas" title="Veuillez localiser l'observation">
221
												<strong class="obligatoire">*</strong> 
221
												<strong class="obligatoire">*</strong> 
222
												Géolocalisation
222
												Géolocalisation
223
											</label>
223
											</label>
224
										</div>
224
										</div>
225
										<div class="span8 droite">
225
										<div class="span8 droite">
226
											<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
226
											<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
227
												<div class="control-group">
227
												<div class="control-group">
228
													<label for="carte-recherche">Rechercher</label>
228
													<label for="carte-recherche">Rechercher</label>
229
													<input id="carte-recherche" class="search-query" type="text" value=""
229
													<input id="carte-recherche" class="search-query" type="text" value=""
230
														rel="tooltip"
230
														rel="tooltip"
231
														title="Permet de centrer la carte sur le lieu recherché."
231
														title="Permet de centrer la carte sur le lieu recherché."
232
														placeholder="Centrer la carte sur un lieu..."/>
232
														placeholder="Centrer la carte sur un lieu..."/>
233
												</div>
233
												</div>
234
											</form>
234
											</form>
235
										</div>
235
										</div>
236
									</div>
236
									</div>
237
									<div class="row-fluid">
237
									<div class="row-fluid">
238
										<div class="span12">
238
										<div class="span12">
239
											<div id="map-canvas" rel="tooltip" 
239
											<div id="map-canvas" rel="tooltip" 
240
												title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
240
												title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
241
													représentant votre station ou bien le glisser-déposer sur 
241
													représentant votre station ou bien le glisser-déposer sur 
242
													le lieu souhaité."></div>
242
													le lieu souhaité."></div>
243
										</div>
243
										</div>
244
									</div>
244
									</div>
245
									<div class="row-fluid">
245
									<div class="row-fluid">
246
										<label for="coordonnees-geo" class="span7">
246
										<label for="coordonnees-geo" class="span7">
247
											<a href="#" class="afficher-coord">Afficher</a>
247
											<a href="#" class="afficher-coord">Afficher</a>
248
											<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
248
											<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
249
											les coordonnées géographiques
249
											les coordonnées géographiques
250
											<span id="lat-lon-info" class="info" 
250
											<span id="lat-lon-info" class="info" 
251
												rel="tooltip" 
251
												rel="tooltip" 
252
												title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
252
												title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
253
												(WGS84)
253
												(WGS84)
254
											</span>
254
											</span>
255
										</label>
255
										</label>
256
										<div id="info-commune" class="span5">
256
										<div id="info-commune" class="span5">
257
								    		<span for="marqueur-commune">Commune : </span>
257
								    		<span for="marqueur-commune">Commune : </span>
258
								    		<span id="marqueur-commune">
258
								    		<span id="marqueur-commune">
259
								    			<span id="commune-nom" class="commune-info"></span>
259
								    			<span id="commune-nom" class="commune-info"></span>
260
								    			(<span id="commune-code-insee" class="commune-info" 
260
								    			(<span id="commune-code-insee" class="commune-info" 
261
								    				rel="tooltip" 
261
								    				rel="tooltip" 
262
								    				title="Code INSEE de la commune"></span>)
262
								    				title="Code INSEE de la commune"></span>)
263
								    		</span>
263
								    		</span>
264
							    		</div>
264
							    		</div>
265
									</div>
265
									</div>
266
									<form id="form-station" class="control-group" action="#" enctype="multipart/form-data" autocomplete="on">
266
									<form id="form-station" class="control-group" action="#" enctype="multipart/form-data" autocomplete="on">
267
										<div id="coordonnees-geo" class="well" style="display:none;">
267
										<div id="coordonnees-geo" class="well" style="display:none;">
268
											<div class="row-fluid form-inline">
268
											<div class="row-fluid form-inline">
269
												<div id="coord-lat" class="span4">				
269
												<div id="coord-lat" class="span4">				
270
													<label for="latitude">Latitude</label>
270
													<label for="latitude">Latitude</label>
271
													<div>
271
													<div>
272
														<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
272
														<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
273
													</div>
273
													</div>
274
												</div>
274
												</div>
275
												<div id="coord-lng" class="span4">
275
												<div id="coord-lng" class="span4">
276
													<label for="longitude">Longitude</label>
276
													<label for="longitude">Longitude</label>
277
													<div>
277
													<div>
278
														<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
278
														<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
279
													</div>
279
													</div>
280
												</div>
280
												</div>
281
												<div class="span1">
281
												<div class="span1">
282
													<div>
282
													<div>
283
														<input id="geolocaliser" type="button" value="Voir sur la carte" 
283
														<input id="geolocaliser" type="button" value="Voir sur la carte" 
284
															rel="tooltip"
284
															rel="tooltip"
285
															title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
285
															title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
286
													</div>
286
													</div>
287
												</div>
287
												</div>
288
									    	</div>
288
									    	</div>
289
										</div>
289
										</div>
290
										<div class="row-fluid">
290
										<div class="row-fluid">
291
											<div class="span4" rel="tooltip" 
291
											<div class="span4" rel="tooltip" 
292
												title="Le lieu-dit est la dénomination administrative du lieu 
292
												title="Le lieu-dit est la dénomination administrative du lieu 
293
													que l’on peut trouver sur une carte au 1/25 000, sur le 
293
													que l’on peut trouver sur une carte au 1/25 000, sur le 
294
													cadastre ou au dire des habitants locaux." >
294
													cadastre ou au dire des habitants locaux." >
295
												<label for="lieudit">Lieu-dit</label>
295
												<label for="lieudit">Lieu-dit</label>
296
												<div>
296
												<div>
297
													<input type="text" id="lieudit" class="span2" name="lieudit"/>
297
													<input type="text" id="lieudit" class="span2" name="lieudit"/>
298
												</div>
298
												</div>
299
											</div>
299
											</div>
300
											<div class="span4" rel="tooltip" 
300
											<div class="span4" rel="tooltip" 
301
												title="La station est la dénomination qui caractérise le lieu 
301
												title="La station est la dénomination qui caractérise le lieu 
302
													de la collecte d’un point de vue écologique. Il est 
302
													de la collecte d’un point de vue écologique. Il est 
303
													recommandéde choisir une station qui soit homogène dans 
303
													recommandéde choisir une station qui soit homogène dans 
304
													sa composition floristique afin de refléter le plus 
304
													sa composition floristique afin de refléter le plus 
305
													fidèlement possible son identité sous l’angle 
305
													fidèlement possible son identité sous l’angle 
306
													phytosociologique. Exemple : zone humide située au centre 
306
													phytosociologique. Exemple : zone humide située au centre 
307
													du près. " >
307
													du près. " >
308
												<label for="station">Station</label>
308
												<label for="station">Station</label>
309
												<div>
309
												<div>
310
													<input type="text" id="station" class="span2" name="station"/>
310
													<input type="text" id="station" class="span2" name="station"/>
311
												</div>
311
												</div>
312
											</div>
312
											</div>
313
											<div class="span4" rel="tooltip" 
313
											<div class="span4" rel="tooltip" 
314
												title="Le milieu est un terme générique caractérisant la 
314
												title="Le milieu est un terme générique caractérisant la 
315
													station. On peut se référer pour cela à des codes comme 
315
													station. On peut se référer pour cela à des codes comme 
316
													Corine Biotope ou le nom d’une unité phytosociologique. 
316
													Corine Biotope ou le nom d’une unité phytosociologique. 
317
													Exemple : prairie humide">
317
													Exemple : prairie humide">
318
												<label for="milieux">Milieu</label>
318
												<label for="milieux">Milieu</label>
319
												<div>
319
												<div>
320
													<input type="text" id="milieu" class="span2" name="milieu" />
320
													<input type="text" id="milieu" class="span2" name="milieu" />
321
												</div>
321
												</div>
322
											</div>
322
											</div>
323
										</div>
323
										</div>
324
									</form>
324
									</form>
325
								</div>
325
								</div>
326
							</div>
326
							</div>
327
							<div class="span6">
327
							<div class="span6">
328
								<form id="form-obs" action="#" autocomplete="on">
328
								<form id="form-obs" action="#" autocomplete="on">
329
									<h2>Observations</h2> 
329
									<h2>Observations</h2> 
330
									<div class="row-fluid">
330
									<div class="row-fluid">
331
										<div class="span4" rel="tooltip" 
331
										<div class="span4" rel="tooltip" 
332
											title="Vous pouvez cliquer sur l'icône de calendrier pour 
332
											title="Vous pouvez cliquer sur l'icône de calendrier pour 
333
												sélectionner une date dans un calendrier.">
333
												sélectionner une date dans un calendrier.">
334
											<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
334
											<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
335
												<strong class="obligatoire">*</strong> Date du relevé
335
												<strong class="obligatoire">*</strong> Date du relevé
336
											</label>
336
											</label>
337
											<div class="input-prepend">
337
											<div class="input-prepend">
338
												<span id="date-icone" class="add-on"></span><input id="date" 
338
												<span id="date-icone" class="add-on"></span><input id="date" 
339
													class="input-small" name="date" type="text" 
339
													class="input-small" name="date" type="text" 
340
													placeholder="jj/mm/aaaa" />
340
													placeholder="jj/mm/aaaa" />
341
											</div>
341
											</div>
342
										</div>
342
										</div>
343
										<div id="taxon-input-groupe" class="span8" rel="tooltip" 
343
										<div id="taxon-input-groupe" class="span8" rel="tooltip" 
344
											title="Sélectionnez une espèce dans la liste déroulante pour lier 
344
											title="Sélectionnez une espèce dans la liste déroulante pour lier 
345
												votre nom au référentiel <?=$ns_referentiel?>. Si vous rechargez 
345
												votre nom au référentiel <?=$ns_referentiel?>. Si vous rechargez 
346
												la page le nom présent dans le champ ne sera plus lié au référentiel, il sera 
346
												la page le nom présent dans le champ ne sera plus lié au référentiel, il sera 
347
												nécessaire de le sélectionner à nouveau dans la liste. Si vous
347
												nécessaire de le sélectionner à nouveau dans la liste. Si vous
348
												le désirez vous pouvez aussi saisir un nom absent du référentiel 
348
												le désirez vous pouvez aussi saisir un nom absent du référentiel 
349
												(Ex. : Rosa sp.)." >
349
												(Ex. : Rosa sp.)." >
350
											<label for="taxon" title="Choisissez une espèce">
350
											<label for="taxon" title="Choisissez une espèce">
351
												<strong class="obligatoire">*</strong> 
351
												<strong class="obligatoire">*</strong> 
352
												Espèce
352
												Espèce
353
											</label>
353
											</label>
354
											<div class="input-prepend">
354
											<div class="input-prepend">
355
												<span class="add-on">
355
												<span class="add-on">
356
													<i class="icon-leaf"></i>
356
													<i class="icon-leaf"></i>
357
												</span><input type="text" id="taxon" name="taxon" value="<?= $nom_sci_espece_defaut; ?>" />
357
												</span><input type="text" id="taxon" name="taxon" value="<?= $nom_sci_espece_defaut; ?>" />
358
											</div>
358
											</div>
359
										</div>
359
										</div>
360
									</div>
360
									</div>
361
									<div class="row-fluid">
361
									<div class="row-fluid">
362
										<div class="span12">
362
										<div class="span12">
363
											<label for="notes">Commentaires</label>
363
											<label for="notes">Commentaires</label>
364
											<div>
364
											<div>
365
												<textarea id="notes" class="span6" rows="7" name="notes" 
365
												<textarea id="notes" class="span6" rows="7" name="notes" 
366
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
366
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
367
											</div>
367
											</div>
368
										</div>
368
										</div>
369
									</div>
369
									</div>
370
								</form>
370
								</form>
371
								<form id="form-upload" class="form-horizontal" action="<?=$url_base?>saisie?projet=sauvages&amp;service=upload-image" 
371
								<form id="form-upload" class="form-horizontal" action="<?=$url_base?>saisie?projet=sauvages&amp;service=upload-image" 
372
									method="post" enctype="multipart/form-data">
372
									method="post" enctype="multipart/form-data">
373
									<div rel="tooltip" 
373
									<div rel="tooltip" 
374
										title="Ajouter une photo de votre observation. Elle doit être au 
374
										title="Ajouter une photo de votre observation. Elle doit être au 
375
											format JPEG et ne doit pas excéder 5Mo.">
375
											format JPEG et ne doit pas excéder 5Mo.">
376
										<label>Photo</label>
376
										<label>Photo</label>
377
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
377
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
378
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
378
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
379
										<p id="miniature-info" class="discretion help-inline">La photo doit être au format JPEG et ne doit pas excéder 5Mo.</p>
379
										<p id="miniature-info" class="discretion help-inline">La photo doit être au format JPEG et ne doit pas excéder 5Mo.</p>
380
										<div id="miniature"></div>
380
										<div id="miniature"></div>
381
										<button id="effacer-miniature" type="button" style="display:none;">Effacer</button>
381
										<button id="effacer-miniature" type="button" style="display:none;">Effacer</button>
382
										<p id="miniature-msg" class="span12">&nbsp;</p>
382
										<p id="miniature-msg" class="span12">&nbsp;</p>
383
									</div>
383
									</div>
384
								</form>
384
								</form>
385
							</div>
385
							</div>
386
							<div class="row-fluid">
386
							<div class="row-fluid">
387
								<div class="span12 centre" rel="tooltip" 
387
								<div class="span12 centre" rel="tooltip" 
388
									title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour 
388
									title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour 
389
										ajouter votre observation à la liste à transmettre.">
389
										ajouter votre observation à la liste à transmettre.">
390
									<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
390
									<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
391
										Créer
391
										Créer
392
									</button>
392
									</button>
393
								</div>
393
								</div>
394
							</div>
394
							</div>
395
						</div>
395
						</div>
396
					</div>
396
					</div>
397
				</div>	
397
				</div>	
398
			</div>
398
			</div>
399
			<!-- Messages d'erreur du formulaire-->
399
			<!-- Messages d'erreur du formulaire-->
400
			<div class="row">
400
			<div class="row">
401
				<div class="zone-alerte span6 offset3">
401
				<div class="zone-alerte span6 offset3">
402
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
402
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
403
						<a class="close">×</a>
403
						<a class="close">×</a>
404
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
404
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
405
						<p>
405
						<p>
406
							Vous venez d'ajouter votre 10ème observation.<br/>
406
							Vous venez d'ajouter votre 10ème observation.<br/>
407
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
407
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
408
						</p>
408
						</p>
409
					</div>
409
					</div>
410
				</div>
410
				</div>
411
				<div class="zone-alerte span6 offset3">
411
				<div class="zone-alerte span6 offset3">
412
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
412
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
413
						<a class="close">×</a>
413
						<a class="close">×</a>
414
						<h4 class="alert-heading">Information : champs en erreur</h4>
414
						<h4 class="alert-heading">Information : champs en erreur</h4>
415
						<p>
415
						<p>
416
							Certains champs du formulaire sont mal remplis.<br/>
416
							Certains champs du formulaire sont mal remplis.<br/>
417
							Veuillez vérifier vos données.
417
							Veuillez vérifier vos données.
418
						</p>
418
						</p>
419
					</div>
419
					</div>
420
				</div>
420
				</div>
421
			</div>
421
			</div>
422
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
422
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
423
			<div id="zone-liste-obs" class="row-fluid">
423
			<div id="zone-liste-obs" class="row-fluid">
424
				<div class="span12">
424
				<div class="span12">
425
					<div class="well">
425
					<div class="well">
426
						<div class="row-fluid">
426
						<div class="row-fluid">
427
							<div class="span8">
427
							<div class="span8">
428
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
428
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
429
							</div>
429
							</div>
430
							<div class="span4 droite">
430
							<div class="span4 droite">
431
								<button id="transmettre-obs" class="btn btn-primary btn-large" 
431
								<button id="transmettre-obs" class="btn btn-primary btn-large" 
432
									type="button" disabled="disabled" rel="tooltip"
432
									type="button" disabled="disabled" rel="tooltip"
433
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">										
433
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">										
434
									Transmettre
434
									Transmettre
435
								</button>
435
								</button>
436
							</div>
436
							</div>
437
						</div>
437
						</div>
438
						<div id="liste-obs" ></div>
438
						<div id="liste-obs" ></div>
439
						<div class="row">
439
						<div class="row">
440
							<div class="zone-alerte span6 offset3">
440
							<div class="zone-alerte span6 offset3">
441
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
441
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
442
									<a class="close">×</a>
442
									<a class="close">×</a>
443
									<h4 class="alert-heading">Attention : aucune observation</h4>
443
									<h4 class="alert-heading">Attention : aucune observation</h4>
444
									<p>Veuillez saisir des observations pour les transmettres.</p>
444
									<p>Veuillez saisir des observations pour les transmettres.</p>
445
								</div>
445
								</div>
446
								
446
								
447
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
447
								<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
448
									<a class="close">×</a>
448
									<a class="close">×</a>
449
									<h4 class="alert-heading">Information : transmission des observations</h4>
449
									<h4 class="alert-heading">Information : transmission des observations</h4>
450
									<div class="alert-txt"></div>
450
									<div class="alert-txt"></div>
451
								</div>
451
								</div>
452
								
452
								
453
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
453
								<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
454
									<a class="close">×</a>
454
									<a class="close">×</a>
455
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
455
									<h4 class="alert-heading">Erreur : transmission des observations</h4>
456
									<div class="alert-txt"></div>
456
									<div class="alert-txt"></div>
457
								</div>
457
								</div>
458
							</div>
458
							</div>
459
						</div>
459
						</div>
460
						
460
						
461
					</div>
461
					</div>
462
				</div>
462
				</div>
463
			</div>
463
			</div>
464
			
464
			
465
			<footer class="row-fluid">
465
			<footer class="row-fluid">
466
				<p class="span12">&copy; Tela Botanica 2012</p>
466
				<p class="span12">&copy; Tela Botanica 2012</p>
467
			</footer>
467
			</footer>
468
		
468
		
469
			<!-- Fenêtres modales -->
469
			<!-- Fenêtres modales -->
470
			<div id="chargement" class="modal-fenetre" style="display:none;">			
470
			<div id="chargement" class="modal-fenetre" style="display:none;">			
471
				<div id="chargement-centrage" class="modal-contenu">
471
				<div id="chargement-centrage" class="modal-contenu">
472
					<img id="chargement-img" 
472
					<img id="chargement-img" 
473
						src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif" 
473
						src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif" 
474
						alt="Transfert en cours..."/>
474
						alt="Transfert en cours..."/>
475
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
475
					<p id="chargement-txt" style="color:white;font-size:1.5em;">
476
						Transfert des observations en cours...<br />
476
						Transfert des observations en cours...<br />
477
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre 
477
						Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre 
478
						d'observation à transférer.
478
						d'observation à transférer.
479
					</p>
479
					</p>
480
				</div>
480
				</div>
481
			</div>
481
			</div>
482
			
482
			
483
			<!-- Templates HTML -->
483
			<!-- Templates HTML -->
484
			<div id="tpl-transmission-ok" style="display:none;">
484
			<div id="tpl-transmission-ok" style="display:none;">
485
				<p class="msg">
485
				<p class="msg">
486
					Vos observations ont bien été transmises.<br />
486
					Vos observations ont bien été transmises.<br />
487
					Elles sont désormais consultables à travers les différents outils de visualisation 
487
					Elles sont désormais consultables à travers les différents outils de visualisation 
488
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>, 
488
					du réseau (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>, 
489
					<a href="http://www.tela-botanica.org/page:cel_galerie">galerie d'images</a>, 
489
					<a href="http://www.tela-botanica.org/page:cel_galerie">galerie d'images</a>, 
490
					<a href="http://www.tela-botanica.org/widget:cel:carto">cartographie (widget)</a>...)<br />
490
					<a href="http://www.tela-botanica.org/widget:cel:carto">cartographie (widget)</a>...)<br />
491
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous 
491
					Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous 
492
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
492
					connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
493
					N'oubliez pas qu'il est nécessaire de 
493
					N'oubliez pas qu'il est nécessaire de 
494
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
494
					<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
495
					au préalable, si ce n'est pas déjà fait.
495
					au préalable, si ce n'est pas déjà fait.
496
				</p>
496
				</p>
497
			</div>
497
			</div>
498
			<div id="tpl-transmission-ko" style="display:none;">
498
			<div id="tpl-transmission-ko" style="display:none;">
499
				<p class="msg">
499
				<p class="msg">
500
					Une erreur est survenue lors de la transmission de vos observations.<br />
500
					Une erreur est survenue lors de la transmission de vos observations.<br />
501
					Vous pouvez signaler le dysfonctionnement à 
501
					Vous pouvez signaler le dysfonctionnement à 
502
					<a class="courriel-erreur" href="mailto:">cel@tela-botanica.org</a>.
502
					<a class="courriel-erreur" href="mailto:">cel_remarques@tela-botanica.org</a>.
503
				</p>
503
				</p>
504
			</div>
504
			</div>
505
			
505
			
506
			<!-- Stats : Google Analytics-->
506
			<!-- Stats : Google Analytics-->
507
			<script type="text/javascript">
507
			<script type="text/javascript">
508
				//<![CDATA[
508
				//<![CDATA[
509
				var _gaq = _gaq || [];
509
				var _gaq = _gaq || [];
510
				_gaq.push(['_setAccount', 'UA-20092557-1']);
510
				_gaq.push(['_setAccount', 'UA-20092557-1']);
511
				_gaq.push(['_trackPageview']);
511
				_gaq.push(['_trackPageview']);
512
				
512
				
513
				(function() {
513
				(function() {
514
				  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
514
				  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
515
				  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
515
				  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
516
				  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
516
				  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
517
				})();
517
				})();
518
				//]]>
518
				//]]>
519
			</script>
519
			</script>
520
		</div>
520
		</div>
521
	</body>
521
	</body>
522
</html>
522
</html>