Subversion Repositories eFlore/Applications.cel

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
1526 jpm 1
<!DOCTYPE html>
2
<html lang="fr">
3
	<head>
1537 jpm 4
		<title>Florilèges</title>
1526 jpm 5
		<meta charset="utf-8">
6
 
7
		<meta name="author" content="Jean-Pascal MILCENT, Aurélien PERONNET" />
8
		<meta name="keywords" content="Florilege, Tela Botanica, CEL" />
9
		<meta name="description" content="Widget de saisie du projet Florilege" />
10
 
11
		<!-- Viewport Mobile -->
12
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
13
 
14
		<!-- Favicones -->
1537 jpm 15
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/florileges/img/favicon.ico" />
1526 jpm 16
 
17
		<!-- Javascript : bibliothèques -->
18
		<!-- Google Map v3 -->
19
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
20
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
21
 
22
		<!-- Jquery -->
1577 jpm 23
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.js"></script>
1526 jpm 24
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
25
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.10.2/js/jquery-ui-1.10.2.custom.min.js"></script>
26
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.10.2/js/jquery.ui.datepicker-fr.min.js"></script>
27
		<!-- Jquery Plugins -->
28
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
29
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.11.1/jquery.validate.min.js"></script>
1562 jpm 30
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.11.1/additional-methods.min.js"></script>
1526 jpm 31
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.11.1/messages_fr.js"></script>
32
		<!-- Jquery Form :nécessaire pour l'upload des images -->
33
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/form/3.32/jquery.form.min.js"></script>
34
 
35
		<!-- Bootstrap -->
36
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/bootstrap/2.3.1/js/bootstrap.min.js"></script>
37
 
38
		<!-- Javascript : appli saisie -->
1537 jpm 39
		<script src="<?=$url_base?>saisie?projet=sauvages&amp;service=taxons" type="text/javascript"></script>
1526 jpm 40
		<script type="text/javascript">
41
		//<![CDATA[
42
			// La présence du parametre 'debug' dans l'URL enclenche le dégogage
43
			var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
44
			// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
45
			var HTML5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
46
			// Mot-clé du widget/projet
1587 jpm 47
			var TAG_PROJET = "WidgetFlorileges,Sauvages";
1526 jpm 48
			// Mots-clés à ajouter aux images
49
			var TAG_IMG = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
50
			TAG_IMG = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."'" : 'TAG_IMG' ?>;
51
			// Mots-clés à ajouter aux observations
52
			var TAG_OBS = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
53
			TAG_OBS = <?=isset($_GET['projet']) ? "'".$_GET['projet']."'" : 'TAG_OBS' ?>;
54
			// URL du web service réalisant l'insertion des données dans la base du CEL.
1580 jpm 55
			// Précharger le formulaire avec les infos d'une observation
56
			var OBS_ID = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
1526 jpm 57
			var SERVICE_SAISIE_URL = "<?=$url_ws_saisie?>";
1580 jpm 58
			// URL du web service permettant de récupérer les infos d'une observation du CEL.
59
			var SERVICE_OBS_URL = "<?=$url_ws_obs?>";
1526 jpm 60
			// Code du référentiel utilisé pour les nom scientifiques (de la forme nom:code).
61
			var NOM_SCI_REFERENTIEL = "<?=$ns_referentiel?>";
62
			// Nom du référentiel utilisé pour les nom scientifiques.
63
			var NOM_SCI_PROJET = "<?=$ns_projet?>";
64
			// Code de la version du référentiel utilisé pour les nom scientifiques.
65
			var NOM_SCI_VERSION = "<?=$ns_version?>";
1537 jpm 66
			// Indication de la présence d'une espèce imposée
67
			var ESPECE_IMPOSEE = "<?=$espece_imposee; ?>";
68
			// Tableau d'informations sur l'espèce imposée
69
			var INFOS_ESPECE_IMPOSEE = <?=$infos_espece; ?>;
1526 jpm 70
			// Nombre d'élément dans les listes d'auto-complétion
71
			var AUTOCOMPLETION_ELEMENTS_NBRE = 20;
72
			// Indication de la présence d'un référentiel imposé
73
			var REFERENTIEL_IMPOSE = "<?=$referentiel_impose; ?>";
74
			// Indication des version utilisées de chaque référentiel
75
			var PROJETS_VERSIONS = <?=json_encode($projets_versions)?>;
76
			// URL du web service permettant l'auto-complétion des noms scientifiques.
77
			var SERVICE_AUTOCOMPLETION_NOM_SCI_URL = "<?=$url_ws_autocompletion_ns?>?"+
78
					"masque={masque}&"+
79
					"recherche=etendue&"+
80
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
81
					//"version.projet="+NOM_SCI_VERSION+"&"+
82
					"ns.structure=au"+"&"+
83
					"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
84
			// URL du web service permettant l'auto-complétion des noms scientifiques.
85
			var SERVICE_AUTOCOMPLETION_NOM_SCI_URL_TPL = "<?=$url_ws_autocompletion_ns_tpl?>?"+
86
					"masque={masque}&"+
87
					"recherche=etendue&"+
88
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
89
					//"version.projet="+NOM_SCI_VERSION+"&"+
90
					"ns.structure=au"+"&"+
91
					"navigation.limite="+AUTOCOMPLETION_ELEMENTS_NBRE;
92
			// Nombre d'observations max autorisé avant transmission
93
			var OBS_MAX_NBRE = 10;
94
			// Durée d'affichage en milliseconde des messages d'informations
95
			var DUREE_MESSAGE = 15000;
1537 jpm 96
			// Squelette d'URL du web service de l'annuaire.
97
			var SERVICE_ANNUAIRE_ID_URL = "<?=$url_ws_annuaire?>";
1526 jpm 98
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
99
			var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}";
100
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
101
			var SERVICE_NOM_COMMUNE_URL_ALT = "http://www.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
102
			// URL du marqueur à utiliser dans la carte Google Map
1577 jpm 103
			var GOOGLE_MAP_MARQUEUR_DEBUT_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/marqueurs/debut.png";
104
			// URL de l'icône de fin de rue
105
			var GOOGLE_MAP_MARQUEUR_FIN_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/marqueurs/fin.png";
1526 jpm 106
			// URL de l'icône du chargement en cours
1537 jpm 107
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/florileges/img/icones/chargement.gif";
1526 jpm 108
			// URL de l'icône du chargement en cours d'une image
1537 jpm 109
			var CHARGEMENT_IMAGE_URL = "<?=$url_base?>modules/saisie/squelettes/florileges/img/icones/chargement-image.gif";
1526 jpm 110
			// URL de l'icône du calendrier
1537 jpm 111
			var CALENDRIER_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/florileges/img/icones/calendrier.png";
1526 jpm 112
			// URL de l'icône du calendrier
1537 jpm 113
			var PAS_DE_PHOTO_ICONE_URL = "<?=$url_base?>modules/saisie/squelettes/florileges/img/icones/pas_de_photo.png";
1526 jpm 114
		//]]>
115
		</script>
1537 jpm 116
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/florileges/js/florileges.js"></script>
1526 jpm 117
 
118
		<!-- CSS -->
119
		<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.10.2/css/smoothness/jquery-ui-1.10.2.custom.css" rel="stylesheet" type="text/css" media="screen" />
120
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.3.1/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
121
		<link href="http://www.tela-botanica.org/commun/bootstrap/2.3.1/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
1537 jpm 122
		<link href="<?=$url_base?>modules/saisie/squelettes/florileges/css/<?=isset($_GET['style']) ? $_GET['style'] : 'florileges'?>.css" rel="stylesheet" type="text/css" media="screen" />
1526 jpm 123
	</head>
124
 
125
	<body data-spy="scroll">
126
		<div class="container">
1564 jpm 127
			<div class="row-fluid entete">
1540 jpm 128
				<div class="span7">
1537 jpm 129
					<div class="well intro">
130
						<h1>Florilèges</h1>
131
						<p>
132
							Bienvenue sur l'interface de saisie en ligne des données
133
							"Florilèges"-RUES. Cette interface vous permet d'enregistrer vos
134
							observations de terrain et de les partager simplement
135
							(sous <a href="http://creativecommons.org/licenses/by-sa/2.0/fr/">licence CC-BY-SA</a>)
1562 jpm 136
							avec <a href="http://www.plante-et-cite.fr">Plante &amp; Cité</a>,
1537 jpm 137
							<a href="http://www.tela-botanica.org/site:accueil">le réseau Tela Botanica</a>
138
							et <a href="http://sauvagesdemarue.mnhn.fr">le programme Sauvage de ma Rue</a>.
139
						</p>
140
						<p>
141
							En vous identifiant, vous pourrez retrouver et consulter l'ensemble de
142
							vos observations dans <a href="http://www.tela-botanica.org/appli:cel">le Carnet en ligne</a>.<br />
143
							Renseignez tout d'abord les caractéristiques et l'itinéraire technique mis en place
144
							sur le site des relevés, puis détaillez ensuite les espèces observées sur ce site.
145
							Ajoutez chaque observation à la liste à transmettre à l'aide du bouton
146
							«&nbsp;Créer&nbsp;».
147
						</p>
148
						<p>
149
							L'interface de saisie vous permet de renseigner jusqu'à 10 observations à des dates
150
							différentes pour un même site.
151
							Partagez-les avec le bouton «&nbsp;Transmettre&nbsp;».
152
							Elles apparaissent immédiatement sur
153
							<a href="http://www.tela-botanica.org/site:botanique?langue=fr">la carte</a> et
154
							<a href="http://www.tela-botanica.org/site:botanique?langue=fr">la galerie photos</a>
155
							du projet.
156
						</p>
157
						<p>
158
							Pour toute question, <a href="mailto:contact@florileges.info">contactez les animateurs du programme Florilèges</a>.
159
						</p>
160
						<p class="discretion">
1608 jpm 161
							Un aide interactive est à votre disposition sur l'interface.
1537 jpm 162
							Une fois familiarisé, vous pouvez cliquer sur le bouton suivant pour la désactiver :
163
							<button id="btn-aide" class="btn btn-mini btn-success">
164
								<span class="icon-question-sign icon-white"></span>
165
								<span id="btn-aide-txt" >Désactiver l'aide</span>
166
							</button>
167
						</p>
1526 jpm 168
					</div>
169
				</div>
170
 
1540 jpm 171
				<div class="span5">
172
					<div class="well forcer-colonne">
1526 jpm 173
						<h2>Observateur</h2>
174
						<form id="form-observateur" action="#" class="" autocomplete="on">
175
							<div class="row-fluid">
1608 jpm 176
								<div class="span6 control-group has-tooltip" data-placement="bottom"
1526 jpm 177
									title="Saisissez le courriel avec lequel vous être inscrit à Tela Botanica.
178
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
179
										ultérieurement. Des informations complémentaires vont vous être
180
										demandées : prénom et nom.">
1540 jpm 181
										<label class="control-label" for="courriel">
182
											<strong class="obligatoire">*</strong>
183
											Courriel
184
										</label>
185
										<div class="controls">
186
											<div class="input-prepend">
187
												<span class="add-on">
188
													<i class="icon-envelope"></i>
189
												</span>
190
												<input id="courriel" name="courriel" class="span11" type="text"/>
191
												<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
192
											</div>
193
										</div>
194
 
1526 jpm 195
								</div>
1608 jpm 196
								<div id="zone-courriel-confirmation" class="span6 hidden control-group has-tooltip"
197
									data-placement="bottom"
198
									title="Saisissez à nouveau votre courriel afin de le confirmer. Le
199
										copier/coller est désactivé pour éviter les erreurs.">
1540 jpm 200
									<label class="control-label" for="courriel_confirmation">
1537 jpm 201
										<strong class="obligatoire">*</strong>
202
										Courriel (confirmation)
1526 jpm 203
									</label>
1540 jpm 204
									<div class="controls">
205
										<div class="input-prepend">
206
											<span class="add-on">
207
												<i class="icon-envelope"></i>
208
											</span>
209
											<input id="courriel_confirmation" name="courriel_confirmation"
210
											 	class="span11" type="text"/>
211
										</div>
1526 jpm 212
									</div>
213
								</div>
214
							</div>
215
							<div id="zone-prenom-nom" class="row-fluid hidden">
1560 jpm 216
								<div class="span6 control-group">
1563 jpm 217
									<label for="prenom" class="control-label">
1560 jpm 218
										<strong class="obligatoire">*</strong>
1540 jpm 219
										Prénom
220
									</label>
221
									<input id="prenom" name="prenom" class="span12" type="text"/>
1526 jpm 222
								</div>
1560 jpm 223
								<div class="span6 control-group">
1563 jpm 224
									<label for="nom" class="control-label">
1560 jpm 225
										<strong class="obligatoire">*</strong>
1540 jpm 226
										Nom
227
									</label>
1560 jpm 228
									<div class="controls">
229
										<input id="nom" name="nom"  class="span12" type="text"/>
230
									</div>
1526 jpm 231
								</div>
232
							</div>
1540 jpm 233
							<div id="zone-personne-complement" class="forcer-colonne">
1537 jpm 234
								<div class="row-fluid">
1608 jpm 235
									<div class="span6 control-group has-tooltip"
236
										title="Précisez l'entreprise, l'association, l'école, ... au nom de
237
										laquelle vous participez.">
1560 jpm 238
										<label for="structure" class="control-label">
239
											<strong class="obligatoire">*</strong>
1540 jpm 240
											Structure
241
										</label>
1560 jpm 242
										<div class="controls">
1567 jpm 243
											<input id="structure" name="personneStructure" class="span12 obs-chp-etendu"
244
												type="text" data-label="Structure de l'observateur"/>
1560 jpm 245
										</div>
1537 jpm 246
									</div>
1608 jpm 247
									<div class="span6 control-group has-tooltip"
248
										title="Précisez le service de la structure au nom de laquelle vous participez.">
1560 jpm 249
										<label for="service" class="control-label">
250
											<strong class="obligatoire">*</strong>
1540 jpm 251
											Service
252
										</label>
1560 jpm 253
										<div class="controls">
1567 jpm 254
											<input id="service" name="personneService" class="span12 obs-chp-etendu"
255
												type="text" data-label="Service de l'observateur"/>
1560 jpm 256
										</div>
1537 jpm 257
									</div>
258
								</div>
259
								<div class="row-fluid">
1608 jpm 260
									<div class="span12 has-tooltip" title="Indiquez l'intitulé de votre poste
261
										ou votre mission principale.">
1540 jpm 262
										<label for="fonction">
263
											Fonction
264
										</label>
1567 jpm 265
										<input id="fonction" name="personneFonction" class="span12 obs-chp-etendu"
266
											type="text" data-label="Fonction de l'observateur"/>
1537 jpm 267
									</div>
268
								</div>
269
							</div>
1526 jpm 270
						</form>
271
					</div>
272
				</div>
273
			</div>
274
			<!-- Messages d'erreur du formulaire-->
1537 jpm 275
			<div class="row-fluid">
1526 jpm 276
				<div class="zone-alerte span6 offset3">
277
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
278
						<a class="close">×</a>
279
						<h4 class="alert-heading">Information : copier/coller</h4>
280
						<p>
281
							Merci de ne pas copier/coller votre courriel.<br/>
282
							La double saisie permet de vérifier l'absence d'erreurs.
283
						</p>
284
					</div>
285
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
286
						<a class="close">×</a>
287
						<h4 class="alert-heading">Information : courriel introuvable</h4>
288
						<p>
289
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
290
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
291
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
292
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
293
						</p>
294
					</div>
1577 jpm 295
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
296
						<a class="close">×</a>
297
						<h4 class="alert-heading">Information sur Google Map</h4>
298
						<div class="contenu"></div>
299
					</div>
1526 jpm 300
				</div>
301
			</div>
302
			<div class="row-fluid">
303
				<div class="span12">
1560 jpm 304
					<form id="form-site">
305
						<div class="well">
306
							<div class="row-fluid">
307
								<div class="span4">
308
									<div class="row-fluid">
309
										<div class="span12">
310
											<h2>Site</h2>
1526 jpm 311
										</div>
312
									</div>
313
									<div class="row-fluid">
1608 jpm 314
										<div class="span12 control-group has-tooltip"
315
											title="Nom du site d'étude (quartier, rue, ...)." >
1560 jpm 316
											<label for="station" class="control-label">
317
												<strong class="obligatoire">*</strong>
318
												Nom
1526 jpm 319
											</label>
1560 jpm 320
											<div class="controls">
321
												<input id="station" class="span12" name="station" type="text"/>
322
											</div>
1526 jpm 323
										</div>
1560 jpm 324
									</div>
325
									<div class="forcer-colonne well control-group">
326
										<div class="row-fluid">
327
											<div class="span12">
328
												<label for="map_canvas" class="control-label"
329
														title="Veuillez localiser l'observation">
330
													<strong class="obligatoire">*</strong>
331
													Géolocalisation
332
												</label>
1577 jpm 333
												<div class="row-fluid">
334
													<div class="span12">
335
														<ul class="unstyled liste_indication_geolocalisation">
336
															<li class="indication_geolocalisation">Étape 1/4 : Entrez le nom de la rue et de la ville dans l'espace de recherche ci-dessous</li>
337
															<li class="indication_geolocalisation">Étape 2/4 : Placez le drapeau vert au début de la portion de rue étudiée</li>
338
															<li class="indication_geolocalisation">Étape 3/4 : Placez le drapeau rouge à la fin de la portion de rue étudiée, si vous vous êtes trompé, vous pouvez redéplacer le drapeau vert</li>
339
															<li class="indication_geolocalisation">Étape 4/4 : Voilà ! Votre zone d'étude est localisée ! Vous pouvez passer à la saisie de l'observation.</li>
340
														</ul>
341
													</div>
342
												</div>
1560 jpm 343
												<div class="form-search form-horizontal">
344
													<div class="control-group">
1577 jpm 345
														<input id="carte-recherche"
1608 jpm 346
															class="search-query span12 obs-chp-etendu has-tooltip"
1587 jpm 347
															type="text"
1560 jpm 348
															title="Permet de centrer la carte sur le lieu recherché. Il est nécessaire de sélectionner le lieu dans la liste déroulante."
1577 jpm 349
															placeholder="Entrez un nom de ville, de lieu ou de rue..."
350
															name="adresse"
351
															data-label="Adresse"
352
															value=""/>
1560 jpm 353
													</div>
354
												</div>
355
											</div>
356
										</div>
357
										<div class="row-fluid">
358
											<div class="span12">
1608 jpm 359
												<div id="map-canvas" class="has-tooltip"
1560 jpm 360
													title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
361
														représentant votre station ou bien le glisser-déposer sur
362
														le lieu souhaité."></div>
363
											</div>
364
										</div>
365
										<div id="coordonnees-geo-affichage" class="row-fluid">
366
											<label for="coordonnees-geo" class="span6">
367
												<a class="afficher-coord btn">
368
													<span class="afficher-coord-action">Afficher</span>
369
													<span class="afficher-coord-action" style="display:none;">Cacher</span>
370
													coordonnées
1608 jpm 371
													<span id="lat-lon-info" class="info has-tooltip"
1560 jpm 372
														title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
373
														(WGS84)
374
													</span>
375
												</a>
376
											</label>
377
											<div id="info-commune" class="span6">
378
												<span for="marqueur-commune">Commune : </span>
379
												<span id="marqueur-commune">
380
													<span id="commune-nom" class="commune-info"></span>
1608 jpm 381
													(<span id="commune-code-insee" class="commune-info has-tooltip"
1560 jpm 382
														title="Code INSEE de la commune"></span>)
383
												</span>
384
											</div>
385
										</div>
386
										<div id="coordonnees-geo" class="row-fluid" style="display:none;">
387
											<div class="form-inline">
388
												<div id="coord-lat" class="span4 control-group">
389
													<label for="latitude" class="control-label">
390
														<strong class="obligatoire">*</strong>
391
														Latitude
392
													</label>
393
													<div class="controls">
394
														<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
395
													</div>
396
												</div>
397
												<div id="coord-lng" class="span4">
398
													<label for="longitude" class="control-label">
399
														<strong class="obligatoire">*</strong>
400
														Longitude
401
													</label>
402
													<div class="controls">
403
														<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
404
													</div>
405
												</div>
406
												<div class="span4">
1608 jpm 407
													<button id="geolocaliser" class="btn has-tooltip"
1560 jpm 408
														title="Centre la carte sur les coordonnées de latitude et longitude saisies.">
409
														Voir sur la carte
410
													</button>
1526 jpm 411
												</div>
1560 jpm 412
											</div>
1526 jpm 413
										</div>
414
									</div>
1560 jpm 415
								</div>
416
								<div class="span4">
1526 jpm 417
									<div class="row-fluid">
418
										<div class="span12">
1560 jpm 419
											<h2>Typologie du site</h2>
1526 jpm 420
										</div>
421
									</div>
1560 jpm 422
									<div class="row-fluid">
1608 jpm 423
										<div class="span12 control-group has-tooltip"
424
											title="Précisez la typologie du site." >
1560 jpm 425
											<label for="typo-urbaine" class="control-label">
426
												<strong class="obligatoire">*</strong>
427
												Typologie
428
											</label>
429
											<div class="controls">
1567 jpm 430
												<select id="typo-urbaine" class="span12 obs-chp-etendu" name="typoUrbaine"
431
													data-label="Typologie">
1560 jpm 432
													<option selected value="">Sélectionnez une typologie</option>
433
													<option>centre ville</option>
434
													<option>faubourg</option>
435
													<option>quartier résidentiel</option>
436
													<option>zone commerciale</option>
437
													<option>zone d'activités</option>
438
												</select>
439
											</div>
1537 jpm 440
										</div>
1526 jpm 441
									</div>
1560 jpm 442
									<div class="row-fluid">
1608 jpm 443
										<div class="span12 control-group has-tooltip"
444
											title="Indiquez le type de revêtement au sol." >
1560 jpm 445
											<label for="revetement-sol" class="control-label">
446
												<strong class="obligatoire">*</strong>
1614 jpm 447
												Revêtement au sol
1560 jpm 448
											</label>
449
											<div class="controls">
1567 jpm 450
												<select id="revetement-sol" class="span12 obs-chp-etendu" name="revetementSol"
1614 jpm 451
													data-label="Revêtement au sol">
452
													<option selected value="">Sélectionnez le revêtement au sol</option>
1560 jpm 453
													<option>asphalte et enrobés</option>
454
													<option>pavés</option>
455
													<option>stabilisés, aires sablées</option>
456
													<option>graviers</option>
457
													<option>terre</option>
458
												</select>
1537 jpm 459
											</div>
1560 jpm 460
										</div>
1540 jpm 461
									</div>
1560 jpm 462
									<div class="row-fluid">
1608 jpm 463
										<div class="span12 has-tooltip"
464
											title="Évaluez la densité de zones végétalisés autour du site (haie, aménagement paysager, parcs et jardins, ...)." >
1560 jpm 465
											<label>
466
												Présence de zones végétalisés
1580 jpm 467
												<select id="presence-zone-vegetalise" class="obs-chp-etendu slider"
1567 jpm 468
													name="presenceZoneVegetalise" data-label="Présence de zones végétalisés">
1560 jpm 469
													<option selected value=""></option>
1580 jpm 470
													<option value="nulle">nulle</option>
471
													<option value="faible">faible</option>
472
													<option value="moyenne">moyenne</option>
473
													<option value="importante">importante</option>
1560 jpm 474
												</select>
475
											</label>
476
										</div>
1537 jpm 477
									</div>
1560 jpm 478
									<div class="row-fluid">
1608 jpm 479
										<div class="span12 has-tooltip"
480
											title="Indiquez la hauteur des bâtiments avoisinants (en étages)." >
1560 jpm 481
											<label>
482
												Hauteur des bâtiments
1580 jpm 483
												<select id="hauteur-batiment-avoisinant" class="obs-chp-etendu slider"
1567 jpm 484
													name="hauteurBatimentAvoisinant" data-label="Hauteur des bâtiments">
1560 jpm 485
													<option selected value=""></option>
1580 jpm 486
													<option value="0">0</option>
487
													<option value="1">1</option>
488
													<option value="2">2</option>
489
													<option value="3">3</option>
490
													<option value="4">4</option>
491
													<option value="5 et +">5 et +</option>
1560 jpm 492
												</select>
493
											</label>
494
										</div>
1537 jpm 495
									</div>
496
								</div>
1560 jpm 497
								<div class="span4">
498
									<div class="row-fluid">
499
										<div class="span12">
500
											<h2>Itinéraire technique</h2>
501
										</div>
1537 jpm 502
									</div>
1560 jpm 503
									<div class="row-fluid">
1608 jpm 504
										<div class="span12 control-group has-tooltip"
1614 jpm 505
											title="Évaluez l'intensité de gestion du site." >
1560 jpm 506
											<label for="intensite-gestion" class="control-label">
507
												<strong class="obligatoire">*</strong>
508
												Intensité de gestion
509
											</label>
510
											<div class="controls">
1567 jpm 511
												<select id="intensite-gestion" class="span12 obs-chp-etendu"
512
													name="intensiteGestion" data-label="Intensité de gestion">
1560 jpm 513
													<option selected value="">Sélectionnez l'intensité</option>
514
													<option>extensive</option>
515
													<option>intermédiaire</option>
516
													<option>intensive</option>
517
												</select>
1526 jpm 518
											</div>
1537 jpm 519
										</div>
1560 jpm 520
									</div>
521
									<div class="row-fluid">
522
										<div class="span12">
523
											<div class="row-fluid">
1608 jpm 524
												<div class="span12 control-group has-tooltip"
525
													title="Évaluez la fréquence d'utilisation de produits phytosanitaires sur le site." >
1560 jpm 526
													<label for="periodicite-traitement-phyto" class="control-label">
527
														<strong class="obligatoire">*</strong>
528
														Utilisation de produits phytosanitaires
529
													</label>
530
													<div class="controls">
1580 jpm 531
														<select id="periodicite-traitement-phyto"
532
															class="obs-chp-etendu slider"
1567 jpm 533
															name="periodiciteTraitementPhyto"
534
															data-label="Utilisation de produits phytosanitaires">
1560 jpm 535
															<option selected value=""></option>
536
															<option value="régulière">régulière</option>
537
															<option value="occasionnelle">occasionnelle</option>
538
															<option value="rare">rare</option>
539
															<option value="jamais">jamais</option>
540
														</select>
1537 jpm 541
													</div>
1560 jpm 542
												</div>
1526 jpm 543
											</div>
1560 jpm 544
											<div id="datp-zone" class="row-fluid hidden">
1608 jpm 545
												<div class="span12 has-tooltip"
546
														title="Indiquez la date approximative de l'arrêt des traitements.
1560 jpm 547
														Vous pouvez cliquer sur l'icône de calendrier pour
548
														sélectionner une date dans un calendrier.">
549
													<label title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
550
														Date d'arrêt des traitements
551
														<div class="input-prepend">
552
															<span id="date-arret-traitement-phyto-icone" class="add-on"></span>
1567 jpm 553
															<input id="date-arret-traitement-phyto" class="input-small obs-chp-etendu"
554
																name="dateArretTraitementPhyto" type="text"
555
																placeholder="jj/mm/aaaa"
556
																data-label="Date d'arrêt des traitements"/>
1560 jpm 557
														</div>
558
													</label>
559
												</div>
560
											</div>
1537 jpm 561
										</div>
562
									</div>
1560 jpm 563
									<div class="row-fluid">
1608 jpm 564
										<div class="span12 control-group has-tooltip"
1567 jpm 565
											title="Description de l'itinéraire de gestion (type de traitement,
566
											matériel utilisé, fréquence de passage, ...)." >
1560 jpm 567
											<label for="itineraire-gestion" class="control-label">
568
												<strong class="obligatoire">*</strong>
569
												Description de l'itinéraire de gestion
570
											</label>
571
											<div class="controls">
1567 jpm 572
												<textarea id="itineraire-gestion" class="span12 obs-chp-etendu"
573
													rows="7" name="itineraireGestion"
574
													data-label="Description de l'itinéraire de gestion"></textarea>
1560 jpm 575
											</div>
576
										</div>
1537 jpm 577
									</div>
578
								</div>
579
							</div>
580
						</div>
1560 jpm 581
					</form>
1537 jpm 582
				</div>
583
			</div>
584
			<div class="row-fluid">
585
				<div class="span12 well">
586
					<div class="row-fluid">
1560 jpm 587
						<div class="span3">
1537 jpm 588
							<h2 id="obs-titre">Observations</h2>
589
						</div>
1560 jpm 590
						<div class="span9">
1540 jpm 591
							<form id="form-date" class="form-inline">
1608 jpm 592
								<div class="span5 control-group has-tooltip"
1540 jpm 593
									title="Vous pouvez cliquer sur l'icône de calendrier pour
1560 jpm 594
									sélectionner une date dans un calendrier. La date doit être au format :
595
									jj/mm/aaaa">
596
									<label class="control-label">
597
										<strong class="obligatoire">*</strong>
1540 jpm 598
										Date du relevé
599
										<div class="input-prepend">
600
											<span id="date-icone" class="add-on"></span>
601
											<input id="date" class="input-small" name="date" type="text"
602
												placeholder="jj/mm/aaaa" />
603
										</div>
604
									</label>
605
								</div>
1608 jpm 606
								<div class="span7 control-group has-tooltip"
1540 jpm 607
									title="Date approximative de la dernière intervention." >
1560 jpm 608
									<label class="span12 control-label">
609
										<strong class="obligatoire">*</strong>
1540 jpm 610
										Dernière intervention
1567 jpm 611
										<select id="date-derniere-intervention" class="span8 obs-chp-etendu"
612
											name="dateDerniereIntervention" data-label="Dernière intervention">
1560 jpm 613
											<option selected value="">Sélectionnez la date d'intervention</option>
1540 jpm 614
											<option value="inconnue">ne sais pas</option>
615
											<option>plus de 3 ans</option>
616
											<option>entre 1 et 3 ans</option>
617
											<option>moins d'1 an</option>
618
											<option>au cours du dernier semestre</option>
619
											<option>au cours du dernier trimestre</option>
620
											<option>au cours des 30 derniers jours</option>
621
											<option>au cours des 7 derniers jours</option>
622
										</select>
623
									</label>
624
								</div>
625
							</form>
626
						</div>
1537 jpm 627
					</div>
1540 jpm 628
					<form id="form-obs" autocomplete="on">
1537 jpm 629
						<div class="row-fluid">
1577 jpm 630
							<div class="span6">
631
								<div class="well">
632
									<div class="row-fluid">
633
										<div class="span12">
1608 jpm 634
											<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
1577 jpm 635
												title="Sélectionnez une espèce dans la liste déroulante par son nom latin
1608 jpm 636
												ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
1577 jpm 637
												<label class="control-label" for="taxon-liste" title="Choisissez l'espèce rencontrée.">
638
													<strong class="obligatoire">*</strong>
639
													Espèces les plus communes
640
												</label>
641
												<div class="controls">
642
													<div class="input-prepend ">
643
														<span class="add-on">
644
															<i class="icon-leaf"></i>
645
														</span>
1613 jpm 646
 
1577 jpm 647
														<select id="taxon-liste" class="span10" name="taxon-liste">
648
															<option value="" selected>Sélectionner une espèce</option>
1613 jpm 649
 
650
															<optgroup id="taxon-liste-noms">
651
																<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
652
																	<option
653
																		class="<?=$taxon['nom_type'] ?>"
654
																		value="<?=$taxon['num_nom'] ?>"
655
																		title="<?=$taxon['nom_title'] ?>"
656
																		data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
657
																		>
658
																		<?=$taxon['nom_a_afficher']?>
659
																	</option>
660
																<?php endforeach; ?>
661
															</optgroup>
662
															<optgroup id="taxon-liste-special">
663
																<?php foreach ($taxons['speciaux'] as $taxon) :?>
664
																	<option
665
																		class="<?=$taxon['nom_type'] ?>"
666
																		value="<?=$taxon['num_nom'] ?>"
667
																		title="<?=$taxon['nom_title'] ?>"
668
																		data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
669
																		>
670
																		<?=$taxon['nom_a_afficher']?>
671
																	</option>
672
																<?php endforeach; ?>
673
																<option value="?">Autre espèce</option>
674
															</optgroup>
1577 jpm 675
														</select>
676
													</div>
1526 jpm 677
												</div>
1540 jpm 678
											</div>
1537 jpm 679
										</div>
680
									</div>
1577 jpm 681
									<div id="taxon-input-groupe" class="row-fluid hidden">
682
										<div class="span12">
1608 jpm 683
											<div class="control-group has-tooltip"
1577 jpm 684
												title="Sélectionnez une espèce dans la liste déroulante pour lier
685
													votre nom au référentiel. Si vous le désirez vous pouvez aussi saisir
1608 jpm 686
													un nom absent du référentiel (Ex. : 'fleur violette' ou 'Viola sp.1')." >
1577 jpm 687
												<label for="taxon" class="control-label" title="Choisissez l'espèce rencontrée.">
688
													Autre espèce
689
												</label>
690
												<div class="controls">
691
													<input id="taxon" name="taxon" type="text" class="span12"
692
														placeholder="Autre espèce (ou indication sur la plante)"
693
														value="<?= $nom_sci_espece_defaut; ?>" />
694
												</div>
1540 jpm 695
											</div>
1537 jpm 696
										</div>
697
									</div>
1577 jpm 698
									<div class="row-fluid">
1608 jpm 699
										<div class="span12 control-group has-tooltip"
700
											title="Sélectionnez un ou plusieurs milieux dans lesquels l'espèce est présente sur le site.">
1577 jpm 701
											<label class="span2 control-label">
702
												<strong class="obligatoire">*</strong>
703
												Milieux
704
											</label>
705
											<div id="milieux-controls" class="controls">
706
												<div class="input-prepend">
707
													<div class="btn-group">
708
														<button class="btn dropdown-toggle" data-toggle="dropdown">
709
															<i class="icon-globe"></i>
710
															Sélectionner un ou plusieurs milieux
711
															<span class="caret"></span>
712
														</button>
713
														<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
714
															<li>
715
																<label class="checkbox">
716
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="chemin"/>
717
																	chemin
718
																</label>
719
															</li>
720
															<li>
721
																<label class="checkbox">
722
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="fissures"/>
723
																	fissures
724
																</label>
725
															</li>
726
															<li>
727
																<label class="checkbox">
728
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="haie"/>
729
																	haie
730
																</label>
731
															</li>
732
															<li>
733
																<label class="checkbox">
734
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="mur"/>
735
																	mur
736
																</label>
737
															</li>
738
															<li>
739
																<label class="checkbox">
740
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="pelouse"/>
741
																	pelouse
742
																</label>
743
															</li>
744
															<li>
745
																<label class="checkbox">
746
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="pied d'arbre"/>
747
																	pied d'arbre
748
																</label>
749
															</li>
750
															<li>
751
																<label class="checkbox">
752
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="plate bande"/>
753
																	plate bande
754
																</label>
755
															</li>
756
														</ul>
757
													</div>
1560 jpm 758
												</div>
1526 jpm 759
											</div>
760
										</div>
1537 jpm 761
									</div>
1577 jpm 762
 
763
									<div class="row-fluid">
1608 jpm 764
										<div class="span12 control-group has-tooltip"
765
											title="Indiquez la hauteur maximum en centimètre de la plante sur le site.">
1577 jpm 766
											<label class="control-label">
767
												<strong class="obligatoire">*</strong>
768
												Hauteur max. (en cm) de la plante
769
												<input id="hauteur-plante" class="span2 obs-chp-etendu"
770
													name="hauteurPlante"
771
													type="number" min="0" step="5"
772
													data-label="Hauteur max. (en cm) de la plante"/>
773
											</label>
774
										</div>
1537 jpm 775
									</div>
1577 jpm 776
 
777
									<div class="row-fluid">
778
										<div class="span12">
779
											<label for="notes">Commentaires</label>
780
											<div>
781
												<textarea id="notes" class="span12" rows="7" name="notes"
782
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
783
											</div>
1537 jpm 784
										</div>
785
									</div>
786
								</div>
1526 jpm 787
							</div>
788
							<div class="span6">
1537 jpm 789
								<div class="well">
790
									<div class="row-fluid">
1608 jpm 791
										<div class="span12 control-group has-tooltip"
792
											title="Évaluez la résistance/résilience de l'espèce face aux traitements utilisés sur ce site." >
1560 jpm 793
											<label class="control-label">
794
												<strong class="obligatoire">*</strong>
1537 jpm 795
												Résistance/Résilience
1560 jpm 796
											</label>
797
											<div class="controls">
1580 jpm 798
												<select id="resistance-traitement-phyto"
799
													class="obs-chp-etendu slider"
800
													name="resistanceTraitementPhyto"
801
													data-label="Résistance/Résilience">
1560 jpm 802
													<option selected value=""></option>
1580 jpm 803
													<option value="pas de traitement">pas de traitement</option>
804
													<option value="faible">faible</option>
805
													<option value="intermédiaire">intermédiaire</option>
806
													<option value="forte">forte</option>
807
													<option value="très forte">très forte</option>
1537 jpm 808
												</select>
1560 jpm 809
											</div>
1526 jpm 810
										</div>
1537 jpm 811
									</div>
812
 
1526 jpm 813
									<div class="row-fluid">
1608 jpm 814
										<div class="span12 has-tooltip"
815
											title="Évaluez la vitesse de croissance de l'espèce sur ce site." >
1537 jpm 816
											<label>
817
												Croissance
1580 jpm 818
												<select id="vitesse-croissance"
819
													class="obs-chp-etendu slider"
820
													name="vitesseCroissance"
1567 jpm 821
												 	data-label="Croissance">
1560 jpm 822
													<option selected value=""></option>
1580 jpm 823
													<option value="nulle">nulle</option>
824
													<option value="lente">lente</option>
825
													<option value="moyenne">moyenne</option>
826
													<option value="rapide">rapide</option>
827
													<option value="trop rapide">trop rapide</option>
1537 jpm 828
												</select>
1526 jpm 829
											</label>
830
										</div>
1537 jpm 831
									</div>
832
								</div>
833
								<div class="well">
834
									<div class="row-fluid">
1608 jpm 835
										<div class="span12 has-tooltip"
1537 jpm 836
											title="Perception globale de l'espèce par l'équipe technique.">
837
											<label class="span4">
838
												Perceptions par l'équipe
1526 jpm 839
											</label>
840
											<div class="input-prepend">
1537 jpm 841
												<div class="btn-group">
842
													<button class="btn dropdown-toggle" data-toggle="dropdown">
1540 jpm 843
														<i class="icon-eye-open"></i>
1537 jpm 844
														Sélectionner une ou plusieurs perceptions
845
														<span class="caret"></span>
846
													</button>
847
													<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
848
														<li>
849
															<label class="checkbox">
1577 jpm 850
																<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="inconnue"/>
1537 jpm 851
																ne connaissais pas la plante avant l'étude
852
															</label>
853
														</li>
854
														<li>
855
															<label class="checkbox">
1577 jpm 856
																<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="discrète"/>
1537 jpm 857
																discrète ne pose pas de problème
858
															</label>
859
														</li>
860
														<li>
861
															<label class="checkbox">
1577 jpm 862
																<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="esthétique"/>
1537 jpm 863
																visible et esthétique
864
															</label>
865
														</li>
866
														<li>
867
															<label class="checkbox">
1577 jpm 868
																<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="gênante"/>
1537 jpm 869
																gênante, difficile à gérer
870
															</label>
871
														</li>
872
														<li>
873
															<label class="checkbox">
1577 jpm 874
																<input name="perceptionTechnicien[]" class="cb-perception-technicien" type="checkbox" value="envahissante"/>
1537 jpm 875
																envahissante, cause des dégâts
876
															</label>
877
														</li>
878
													</ul>
879
												</div>
1526 jpm 880
											</div>
881
										</div>
882
									</div>
1537 jpm 883
 
1526 jpm 884
									<div class="row-fluid">
1608 jpm 885
										<div class="span12 has-tooltip"
886
											title="Évaluez la mauvaise perception des riverains vis à vis de cette espèce." >
1537 jpm 887
											<label>
888
												Mauvaise perception par les riverains ?
1567 jpm 889
												<select id="perception-riverain-mauvaise" class="obs-chp-etendu"
890
													name="perceptionRiverainMauvaise" data-label="Mauvaise perception par les riverains ?">
1537 jpm 891
													<option>inconnue</option>
892
													<option>oui</option>
893
													<option>non</option>
894
												</select>
895
											</label>
1526 jpm 896
										</div>
897
									</div>
1537 jpm 898
								</div>
899
							</div>
900
						</div>
1560 jpm 901
					</form>
1537 jpm 902
 
1560 jpm 903
					<form id="form-upload" class="form-horizontal" action="<?=$url_base?>saisie?projet=sauvages&amp;service=upload-image"
904
						method="post" enctype="multipart/form-data">
905
						<div class="row-fluid">
906
							<div class="span12 well">
1608 jpm 907
								<strong>Ajoutez des images</strong>
1560 jpm 908
								<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
909
								<div id ="photos-conteneur">
1577 jpm 910
									<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
911
									<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
1562 jpm 912
									<div id="miniatures"></div>
913
									<p class="miniature-msg" class="span12">&nbsp;</p>
1537 jpm 914
								</div>
1526 jpm 915
							</div>
1537 jpm 916
						</div>
1560 jpm 917
					</form>
918
					<div class="row-fluid">
1608 jpm 919
						<div class="span12 centre has-tooltip"
1560 jpm 920
							title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
921
								ajouter votre observation à la liste à transmettre.">
922
							<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
923
								Créer
924
							</button>
925
						</div>
1537 jpm 926
					</div>
1560 jpm 927
 
1537 jpm 928
				</div>
1560 jpm 929
			</div>
1537 jpm 930
 
1560 jpm 931
			<!-- Messages d'erreur du formulaire-->
932
			<div class="row-fluid">
933
				<div class="zone-alerte span6 offset3">
934
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
935
						<a class="close">×</a>
936
						<h4 class="alert-heading">Information : 10 observations maximum</h4>
937
						<p>
938
							Vous venez d'ajouter votre 10ème observation.<br/>
939
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
940
						</p>
1540 jpm 941
					</div>
1560 jpm 942
				</div>
943
				<div class="zone-alerte span6 offset3">
944
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
945
						<a class="close">×</a>
946
						<h4 class="alert-heading">Information : champs en erreur</h4>
947
						<p>
948
							Certains champs du formulaire sont mal remplis.<br/>
949
							Veuillez vérifier vos données.
950
						</p>
1540 jpm 951
					</div>
952
				</div>
1577 jpm 953
				<div class="zone-alerte span6 offset3">
954
					<div id="dialogue-form-invalide-rue" class="alert alert-warning alert-block" style="display: none;">
955
						<a class="close">×</a>
956
						<h4 class="alert-heading">Information : champs en erreur</h4>
957
						<p>
958
							Le coordonnées du début et de la fin de la rue n'ont pas été géoréférencé.<br/>
959
							Veuillez suivre les étapes indiquées dans le champ « Géolocalisation ».
960
						</p>
961
					</div>
962
				</div>
1560 jpm 963
			</div>
1540 jpm 964
 
1560 jpm 965
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
1564 jpm 966
			<div id="zone-liste-obs" class="row-fluid hidden">
1560 jpm 967
				<div class="span12">
968
					<div class="well">
969
						<div class="row-fluid">
970
							<div class="span8">
971
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
972
							</div>
973
							<div class="span4 droite">
1608 jpm 974
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
975
									type="button" disabled="disabled"
1560 jpm 976
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
977
									Transmettre
978
								</button>
979
							</div>
980
						</div>
981
						<div id="liste-obs" ></div>
1526 jpm 982
					</div>
1537 jpm 983
				</div>
1526 jpm 984
			</div>
1560 jpm 985
 
1567 jpm 986
			<div class="row-fluid">
987
				<div class="zone-alerte span6 offset3">
988
					<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
989
						<a class="close">×</a>
990
						<h4 class="alert-heading">Attention : aucune observation</h4>
991
						<p>Veuillez saisir des observations pour les transmettres.</p>
992
					</div>
993
 
994
					<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;"">
995
						<a class="close">×</a>
996
						<h4 class="alert-heading">Information : transmission des observations</h4>
997
						<div class="alert-txt"></div>
998
					</div>
999
 
1000
					<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
1001
						<a class="close">×</a>
1002
						<h4 class="alert-heading">Erreur : transmission des observations</h4>
1003
						<div class="alert-txt"></div>
1004
					</div>
1005
				</div>
1006
			</div>
1007
 
1008
 
1560 jpm 1009
			<footer class="row-fluid">
1010
				<p class="span12">&copy; Tela Botanica 2013</p>
1011
			</footer>
1012
		</div>
1526 jpm 1013
 
1560 jpm 1014
		<!-- Fenêtres modales -->
1015
		<div id="chargement" class="modal-fenetre" style="display:none;">
1016
			<div id="chargement-centrage" class="modal-contenu">
1017
				<img id="chargement-img"
1018
					src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif"
1019
					alt="Transfert en cours..."/>
1020
				<p id="chargement-txt" style="color:white;font-size:1.5em;">
1021
					Transfert des observations en cours...<br />
1022
					Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
1023
					d'observations à transférer.
1526 jpm 1024
				</p>
1025
			</div>
1560 jpm 1026
		</div>
1027
 
1028
		<!-- Templates HTML -->
1029
		<div id="tpl-transmission-ok" style="display:none;">
1030
			<p class="msg">
1031
				Vos observations ont bien été transmises.<br />
1032
				Elles sont désormais consultables à travers les différents outils de visualisation
1033
				du réseau Tela Botanica (<a href="http://www.tela-botanica.org/site:botanique">eFlore</a>,
1034
				<a href="http://www.tela-botanica.org/appli:pictoflora">galeries d'images</a>,
1035
				<a href="http://www.tela-botanica.org/appli:identiplante">identiplante</a>,
1036
				<a href="http://www.tela-botanica.org/widget:cel:cartoPoint">cartographie (widget)</a>...)<br />
1037
				Si vous souhaitez les modifier ou les supprimer, vous pouvez les retrouver en vous
1038
				connectant à votre <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>.<br />
1039
				N'oubliez pas qu'il est nécessaire de
1040
				<a href="http://www.tela-botanica.org/page:inscription">s'inscrire à Tela Botanica</a>
1041
				au préalable, si ce n'est pas déjà fait.
1042
			</p>
1043
		</div>
1044
		<div id="tpl-transmission-ko" style="display:none;">
1045
			<p class="msg">
1046
				Une erreur est survenue lors de la transmission de vos observations.<br />
1047
				Vous pouvez signaler le dysfonctionnement à
1048
				<a class="courriel-erreur" href="mailto:">cel_remarques@tela-botanica.org</a>.
1049
			</p>
1050
		</div>
1051
 
1052
		<!-- Stats : Google Analytics-->
1053
		<script type="text/javascript">
1054
			//<![CDATA[
1055
			var _gaq = _gaq || [];
1056
			_gaq.push(['_setAccount', 'UA-20092557-1']);
1057
			_gaq.push(['_trackPageview']);
1526 jpm 1058
 
1560 jpm 1059
			(function() {
1060
			  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
1061
			  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
1062
			  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
1063
			})();
1064
			//]]>
1065
		</script>
1526 jpm 1066
	</body>
1067
</html>