Subversion Repositories eFlore/Applications.cel

Rev

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

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