Subversion Repositories eFlore/Applications.cel

Rev

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

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