Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 3047 Rev 3048
1
<!DOCTYPE html>
1
<!DOCTYPE html>
2
<html lang="fr">
2
<html lang="fr">
3
	<head>
3
	<head>
4
		<title>Belles de ma rue</title>
4
		<title>Belles de ma rue</title>
5
		<meta charset="utf-8">
5
		<meta charset="utf-8">
6
 
6
 
7
		<meta name="author" content="Delphine Cauquil" />
7
		<meta name="author" content="Delphine Cauquil" />
8
		<meta name="keywords" content="Belles de ma rue, CEL, Tela Botanica, Saint-Gilles" />
8
		<meta name="keywords" content="Belles de ma rue, CEL, Tela Botanica, Saint-Gilles" />
9
		<meta name="description" content="Widget de saisie pour le projet Belles de ma rue" />
9
		<meta name="description" content="Widget de saisie pour le projet Belles de ma rue" />
10
 
10
 
11
		<!-- Viewport Mobile -->
11
		<!-- Viewport Mobile -->
12
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
12
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
13
 
13
 
14
		<!-- Favicones -->
14
		<!-- Favicones -->
15
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/favicon.ico" />
15
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/favicon.ico" />
16
 
16
 
17
		<!-- Javascript : bibliothèques -->
17
		<!-- Javascript : bibliothèques -->
18
		<!-- Google Map v3 -->
18
		<!-- Google Map v3 -->
19
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=<?php echo $cleGoogleMaps; ?>&language=fr&amp;region=FR"></script>
19
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=<?php echo $cleGoogleMaps; ?>&language=fr&amp;region=FR"></script>
20
		<!-- Jquery -->
20
		<!-- Jquery -->
21
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
21
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
22
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
22
		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
23
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
23
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
24
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
24
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
25
		<!-- Jquery Plugins -->
25
		<!-- Jquery Plugins -->
26
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
26
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
27
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
27
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
28
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
28
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
29
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
29
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
30
		<!-- Jquery Form :nécessaire pour l'upload des images -->
30
		<!-- Jquery Form :nécessaire pour l'upload des images -->
31
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
31
		<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
32
		<!-- Bootstrap -->
32
		<!-- Bootstrap -->
33
		<script type="text/javascript" src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
33
		<script type="text/javascript" src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
34
 
34
 
35
		<!-- Javascript : appli saisie -->
35
		<!-- Javascript : appli saisie -->
36
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
36
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/defaut/js/WidgetSaisie.js"></script>
37
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/bellesdemarue/js/WidgetSaisieBellesdemarue.js"></script>
37
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/bellesdemarue/js/WidgetSaisieBellesdemarue.js"></script>
38
		<script src="<?=$url_base?>saisie?projet=bellesdemarue&service=taxons" type="text/javascript"></script>
38
		<script src="<?=$url_base?>saisie?projet=bellesdemarue&service=taxons" type="text/javascript"></script>
39
		<script type="text/javascript">
39
		<script type="text/javascript">
40
		//<![CDATA[
40
		//<![CDATA[
41
        	$(document).ready(function() {
41
        	$(document).ready(function() {
42
				// Héritage !!
42
				// Héritage !!
43
				var widget = new WidgetSaisieBellesdemarue();
43
				var widget = new WidgetSaisieBellesdemarue();
44
 
44
 
45
				// la variable "taxons" chargée par "service=taxons" ci-dessus n'est pas accessible dans le contexte objet
45
				// la variable "taxons" chargée par "service=taxons" ci-dessus n'est pas accessible dans le contexte objet
46
				widget.taxons = taxons;
46
				widget.taxons = taxons;
47
 
47
 
48
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
48
				// La présence du parametre 'debug' dans l'URL enclenche le débogage
49
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
49
				widget.debug = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
50
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
50
				// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
51
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
51
				widget.html5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
52
				// Mot-clé du widget/projet
52
				// Mot-clé du widget/projet
53
				widget.tagProjet = "WidgetBellesdemarue,bellesdemarue";
53
				widget.tagProjet = "WidgetBellesdemarue,bellesdemarue";
54
				// Mots-clés à ajouter aux images
54
				// Mots-clés à ajouter aux images
55
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
55
				widget.tagImg = "<?=isset($_GET['tag-img']) ? $_GET['tag-img'] : ''?>";
56
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
56
				widget.separationTagImg = "<?= isset($_GET['motcle']) && isset($_GET['tag-img']) ? ',' : '' ?>";
57
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
57
				widget.tagImg = <?=isset($_GET['motcle']) ? "'".$_GET['motcle']."' + widget.separationTagImg + widget.tagImg" : 'widget.tagImg' ?>;
58
				// Mots-clés à ajouter aux observations
58
				// Mots-clés à ajouter aux observations
59
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
59
				widget.tagObs = "<?=isset($_GET['tag-obs']) ? $_GET['tag-obs'] : ''?>";
60
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
60
				widget.separationTagObs = "<?= isset($_GET['projet']) && isset($_GET['tag-obs']) ? ',' : '' ?>";
61
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
61
				widget.tagObs = <?=isset($_GET['projet']) ? "'".$_GET['projet']."' + widget.separationTagObs + widget.tagObs" : 'widget.tagObs' ?>;
62
				// Précharger le formulaire avec les infos d'une observation
62
				// Précharger le formulaire avec les infos d'une observation
63
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
63
				widget.obsId = "<?=isset($_GET['id-obs']) ? $_GET['id-obs'] : ''?>";
64
				// URL du web service réalisant l'insertion des données dans la base du CEL.
64
				// URL du web service réalisant l'insertion des données dans la base du CEL.
65
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
65
				widget.serviceSaisieUrl = "<?=$url_ws_saisie?>";
66
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
66
				// URL du web service permettant de récupérer les infos d'une observation du CEL.
67
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
67
				widget.serviceObsUrl = "<?=$url_ws_obs?>";
68
				// Code du référentiel utilisé pour les nom scientifiques.
68
				// Code du référentiel utilisé pour les nom scientifiques.
69
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
69
				widget.nomSciReferentiel = "<?=$ns_referentiel?>";
70
				// Indication de la présence d'une espèce imposée
70
				// Indication de la présence d'une espèce imposée
71
				widget.especeImposee = "<?=$espece_imposee; ?>";
71
				widget.especeImposee = "<?=$espece_imposee; ?>";
72
				// Tableau d'informations sur l'espèce imposée
72
				// Tableau d'informations sur l'espèce imposée
73
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
73
				widget.infosEspeceImposee = <?=$infos_espece; ?>;
74
				// Nombre d'élément dans les listes d'auto-complétion
74
				// Nombre d'élément dans les listes d'auto-complétion
75
				widget.autocompletionElementsNbre = 20;
75
				widget.autocompletionElementsNbre = 20;
76
				// Indication de la présence d'un référentiel imposé
76
				// Indication de la présence d'un référentiel imposé
77
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
77
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
78
				// URL du web service permettant l'auto-complétion des noms scientifiques
78
				// URL du web service permettant l'auto-complétion des noms scientifiques
79
				widget.serviceAutocompletionNomSciUrl = "<?=$url_ws_autocompletion_ns?>?"+
79
				widget.serviceAutocompletionNomSciUrl = "<?=$url_ws_autocompletion_ns?>?"+
80
					"masque={masque}&"+
80
					"masque={masque}&"+
81
					"recherche=etendue&"+
81
					"recherche=etendue&"+
82
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
82
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
83
					"ns.structure=au"+"&"+
83
					"ns.structure=au"+"&"+
84
					"navigation.limite=" + widget.autocompletionElementsNbre;
84
					"navigation.limite=" + widget.autocompletionElementsNbre;
85
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
85
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
86
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
86
				widget.serviceAutocompletionNomSciUrlTpl = "<?=$url_ws_autocompletion_ns_tpl?>?"+
87
					"masque={masque}&"+
87
					"masque={masque}&"+
88
					"recherche=etendue&"+
88
					"recherche=etendue&"+
89
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
89
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
90
					"retour.tri=alpharet&"+ // tri "à la CeL"
90
					"retour.tri=alpharet&"+ // tri "à la CeL"
91
					"ns.structure=au"+"&"+
91
					"ns.structure=au"+"&"+
92
					"navigation.limite=" + widget.autocompletionElementsNbre;
92
					"navigation.limite=" + widget.autocompletionElementsNbre;
93
				// Nombre d'observations max autorisé avant transmission
93
				// Nombre d'observations max autorisé avant transmission
94
				widget.obsMaxNbre = 10;
94
				widget.obsMaxNbre = 10;
95
				// Durée d'affichage en milliseconde des messages d'informations
95
				// Durée d'affichage en milliseconde des messages d'informations
96
				widget.dureeMessage = 15000;
96
				widget.dureeMessage = 15000;
97
				// Squelette d'URL du web service de l'annuaire.
97
				// Squelette d'URL du web service de l'annuaire.
98
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
98
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
99
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes. @TODO configurer !!!!
99
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes. @TODO configurer !!!!
100
				widget.serviceNomCommuneUrl = "http://api.tela-botanica.org/service:eflore:0.1/osm/zone-admin?lon={lon}&lat={lat}";
100
				widget.serviceNomCommuneUrl = "http://api.tela-botanica.org/service:eflore:0.1/osm/zone-admin?lon={lon}&lat={lat}";
101
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
101
				// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
102
				widget.serviceNomCommuneUrlAlt = "http://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
102
				widget.serviceNomCommuneUrlAlt = "http://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1";
103
				// URL de l'icône du chargement en cours
103
				// URL de l'icône du chargement en cours
104
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
104
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
105
				// URL de l'icône du chargement en cours d'une image
105
				// URL de l'icône du chargement en cours d'une image
106
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement-image.gif";
106
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement-image.gif";
107
				// URL de l'icône du calendrier
107
				// URL de l'icône du calendrier
108
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
108
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
109
				// URL de l'icône pour une photo manquante
109
				// URL de l'icône pour une photo manquante
110
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
110
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
111
				// URL du marqueur de début de rue
111
				// URL du marqueur de début de rue
112
				widget.googleMapMarqueurDebutUrl = "<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/marqueurs/debut.png";
112
				widget.googleMapMarqueurDebutUrl = "<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/marqueurs/debut.png";
113
				// URL du marqueur de fin de rue
113
				// URL du marqueur de fin de rue
114
				widget.googleMapMarqueurFinUrl = "<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/marqueurs/fin.png";
114
				widget.googleMapMarqueurFinUrl = "<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/marqueurs/fin.png";
115
 
115
 
116
				// La présence du parametre 'ville' dans l'URL géolocalise
116
				// La présence du parametre 'ville' dans l'URL géolocalise
117
				widget.ville = "<?=isset($_GET['ville']) ? $_GET['ville'] : ''?>";
117
				widget.ville = "<?=isset($_GET['ville']) ? $_GET['ville'] : ''?>";
118
				widget.ville = <?= isset($_GET['commune']) ? "'".$_GET['commune']."'" : 'widget.ville' ?>;
118
				widget.ville = <?= isset($_GET['commune']) ? "'".$_GET['commune']."'" : 'widget.ville' ?>;
119
				// La zone géographique passée en paramètre dans l'URL
119
				// La zone géographique passée en paramètre dans l'URL
120
				widget.zoneGeo = "<?= $zone_geo ?>";
120
				widget.zoneGeo = "<?= $zone_geo ?>";
121
				// Pareil, avec un gorupe de zones géo
121
				// Pareil, avec un gorupe de zones géo
122
				widget.groupeZonesGeo = "<?= $groupe_zones_geo ?>";
122
				widget.groupeZonesGeo = "<?= $groupe_zones_geo ?>";
123
				// URL service de recherche de zones
123
				// URL service de recherche de zones
124
				widget.serviceCoordSearchUrl = "<?=$url_ws_coord_search_tpl?>";
124
				widget.serviceCoordSearchUrl = "<?=$url_ws_coord_search_tpl?>";
125
 
125
 
126
				// URL de l'icône du bouton supprimer
126
				// URL de l'icône du bouton supprimer
127
				widget.supprimerIconeUrl = "<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/icones/supprimer.png";	
127
				widget.supprimerIconeUrl = "<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/icones/supprimer.png";	
128
				// URL du service de trace des rues
128
				// URL du service de trace des rues
129
				widget.serviceTraceRueUrl = "<?=$url_ws_trace_rue_tpl?>";
129
				widget.serviceTraceRueUrl = "<?=$url_ws_trace_rue_tpl?>";
130
				
130
				
131
				// Go bibiche !
131
				// Go bibiche !
132
				widget.init();
132
				widget.init();
133
        });
133
        });
134
		//]]>
134
		//]]>
135
		</script>
135
		</script>
136
 
136
 
137
		<!-- CSS -->
137
		<!-- CSS -->
138
		<link href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" media="screen" />
138
		<link href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" media="screen" />
139
		<link href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
139
		<link href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
140
		<link href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
140
		<link href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" media="screen" />
141
		<link href="<?=$url_base?>modules/saisie/squelettes/bellesdemarue/css/<?=isset($_GET['style']) ? $_GET['style'] : 'bellesdemarue'?>.css" rel="stylesheet" type="text/css" media="screen" />
141
		<link href="<?=$url_base?>modules/saisie/squelettes/bellesdemarue/css/<?=isset($_GET['style']) ? $_GET['style'] : 'bellesdemarue'?>.css" rel="stylesheet" type="text/css" media="screen" />
142
 
142
 
143
		<!--  Google Analytics -->
143
		<!--  Google Analytics -->
144
		<?php if($prod): ?>
144
		<?php if($prod): ?>
145
			<?php include "analytics.html"; ?>
145
			<?php include "analytics.html"; ?>
146
		<?php endif; ?>	
146
		<?php endif; ?>	
147
	</head>
147
	</head>
148
 
148
 
149
	<body data-spy="scroll">
149
	<body data-spy="scroll">
150
		<div id="zone-appli" class="container">
150
		<div id="zone-appli" class="container">
151
			<div class="row-fluid entete">
151
			<div class="row-fluid entete">
152
				<div class="span12">
152
				<div class="span12">
153
					<div class="row-fluid">
153
					<div class="row-fluid">
154
						<div class="span12">
154
						<div class="span12">
155
							<?php if($logo != 'defaut' && $logo != '0') { ?>
155
							<?php if($logo != 'defaut' && $logo != '0') { ?>
156
								<img id="logo-titre" class="span1" src="<?= $logo ?>" alt="Logo" />
156
								<img id="logo-titre" class="span1" src="<?= $logo ?>" alt="Logo" />
157
							<?php } else if($logo == 'defaut') { ?>
157
							<?php } else if($logo == 'defaut') { ?>
158
								<h1 id="widget-titre"><img src="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/logos/bdmr.jpg" alt="Sauvages de ma rue : Saisie des observations"/></h1>
158
								<h1 id="widget-titre"><img src="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/logos/bdmr.jpg" alt="Sauvages de ma rue : Saisie des observations"/></h1>
159
							<?php } ?>
159
							<?php } ?>
160
						</div>
160
						</div>
161
					</div>
161
					</div>
162
					<!--<div class="row-fluid">
162
					<!--<div class="row-fluid">
163
						<div class="span12">
163
						<div class="span12">
164
							<p class="discretion">
164
							<p class="discretion">
165
								Un aide interactive est à votre disposition sur l'interface.
165
								Un aide interactive est à votre disposition sur l'interface.
166
								Une fois familiarisé, vous pouvez cliquer sur le bouton suivant pour la désactiver :
166
								Une fois familiarisé, vous pouvez cliquer sur le bouton suivant pour la désactiver :
167
								<button id="btn-aide" class="btn btn-mini btn-success">
167
								<button id="btn-aide" class="btn btn-mini btn-success">
168
									<span class="icon-question-sign icon-white"></span>
168
									<span class="icon-question-sign icon-white"></span>
169
									<span id="btn-aide-txt" >Désactiver l'aide</span>
169
									<span id="btn-aide-txt" >Désactiver l'aide</span>
170
								</button>
170
								</button>
171
							</p>
171
							</p>
172
						</div>
172
						</div>
173
					</div>-->
173
					</div>-->
174
				</div>
174
				</div>
175
			</div>
175
			</div>
176
			<div class="row-fluid">
176
			<div class="row-fluid">
177
				<div class="span12">
177
				<div class="span12">
178
					<form id="form-observateur" action="#" autocomplete="on">
178
					<form id="form-observateur" action="#" autocomplete="on">
179
						<h2 id="titre-form-observateur">Observateur</h2>
179
						<h2 id="titre-form-observateur">Observateur</h2>
180
						<div id="zone-identification">
180
						<div id="zone-identification">
181
							<fieldset id="partie-identification">
181
							<fieldset id="partie-identification">
182
								<div class="row-fluid">
182
								<div class="row-fluid">
183
									<div class="span6 control-group has-tooltip" data-placement="bottom">
183
									<div class="span6 control-group has-tooltip" data-placement="bottom">
184
											<label class="control-label" for="courriel">
184
											<label class="control-label" for="courriel">
185
												<strong class="obligatoire">*</strong>
185
												<strong class="obligatoire">*</strong>
186
												Courriel
186
												Courriel
187
											</label>
187
											</label>
188
											<div class="controls">
188
											<div class="controls">
189
												<div class="input-prepend">
189
												<div class="input-prepend">
190
													<span class="add-on">
190
													<span class="add-on">
191
														<i class="icon-envelope"></i>
191
														<i class="icon-envelope"></i>
192
													</span>
192
													</span>
193
													<input id="courriel" name="courriel" class="span11" type="text"/>
193
													<input id="courriel" name="courriel" class="span11" type="text"/>
194
													<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
194
													<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
195
												</div>
195
												</div>
196
											</div>
196
											</div>
197
 
197
 
198
									</div>
198
									</div>
199
									<div id="zone-courriel-confirmation" class="span6 control-group has-tooltip"
199
									<div id="zone-courriel-confirmation" class="span6 control-group has-tooltip"
200
										style="display:none;"
200
										style="display:none;"
201
										data-placement="bottom">
201
										data-placement="bottom">
202
										<label class="control-label" for="courriel_confirmation">
202
										<label class="control-label" for="courriel_confirmation">
203
											<strong class="obligatoire">*</strong>
203
											<strong class="obligatoire">*</strong>
204
											Courriel (confirmation)
204
											Courriel (confirmation)
205
										</label>
205
										</label>
206
										<div class="controls">
206
										<div class="controls">
207
											<div class="input-prepend">
207
											<div class="input-prepend">
208
												<span class="add-on">
208
												<span class="add-on">
209
													<i class="icon-envelope"></i>
209
													<i class="icon-envelope"></i>
210
												</span>
210
												</span>
211
												<input id="courriel_confirmation" name="courriel_confirmation"
211
												<input id="courriel_confirmation" name="courriel_confirmation"
212
												 	class="span11" type="text"/>
212
												 	class="span11" type="text"/>
213
											</div>
213
											</div>
214
										</div>
214
										</div>
215
									</div>
215
									</div>
216
								</div>
216
								</div>
217
								<div id="zone-prenom-nom" class="row-fluid" style="display:none;">
217
								<div id="zone-prenom-nom" class="row-fluid" style="display:none;">
218
									<div class="span6 control-group">
218
									<div class="span6 control-group">
219
										<label for="prenom" class="control-label">
219
										<label for="prenom" class="control-label">
220
											<strong class="obligatoire">*</strong>
220
											<strong class="obligatoire">*</strong>
221
											Prénom
221
											Prénom
222
										</label>
222
										</label>
223
										<input id="prenom" name="prenom" class="span12" type="text"/>
223
										<input id="prenom" name="prenom" class="span12" type="text"/>
224
									</div>
224
									</div>
225
									<div class="span6 control-group">
225
									<div class="span6 control-group">
226
										<label for="nom" class="control-label">
226
										<label for="nom" class="control-label">
227
											<strong class="obligatoire">*</strong>
227
											<strong class="obligatoire">*</strong>
228
											Nom
228
											Nom
229
										</label>
229
										</label>
230
										<div class="controls">
230
										<div class="controls">
231
											<input id="nom" name="nom"  class="span12" type="text"/>
231
											<input id="nom" name="nom"  class="span12" type="text"/>
232
										</div>
232
										</div>
233
									</div>
233
									</div>
234
								</div>
234
								</div>
235
							</fieldset>
235
							</fieldset>
236
						</div>
236
						</div>
237
					</form>
237
					</form>
238
				</div>
238
				</div>
239
			</div>
239
			</div>
240
		
240
		
241
 
241
 
242
			<!-- Fiche terrain -->
242
			<!-- Fiche terrain -->
243
			<form id="form-obs" class="form-inline" action="#" autocomplete="on">
243
			<form id="form-obs" class="form-inline" action="#" autocomplete="on">
244
				<h2 id="titre-form-obs">Fiche de terrain</h2>
244
				<h2 id="titre-form-obs">Fiche de terrain</h2>
245
				<div id="zone-fiche-terrain">
245
				<div id="zone-fiche-terrain">
246
					
246
					
247
					<fieldset id="partie-station">
247
					<fieldset id="partie-station">
248
						<legend>
248
						<legend>
249
							<strong class="obligatoire">*</strong>
249
							<strong class="obligatoire">*</strong>
250
							Géolocalisation de la plante
250
							Géolocalisation de la plante
251
						</legend>
251
						</legend>
252
						<div class="row-fluid">
252
						<div class="row-fluid">
253
							<div class="span12">
253
							<div class="span12">
254
								<div class="form-search form-horizontal">
254
								<div class="form-search form-horizontal">
255
									<div class="control-group">
255
									<div class="control-group">
256
										<input id="carte-recherche"
256
										<input id="carte-recherche"
257
											class="search-query span12 obs-chp-etendu has-tooltip"
257
											class="search-query span12 obs-chp-etendu has-tooltip"
258
											type="text"
258
											type="text"
259
											title="Permet de centrer la carte sur le lieu recherché. Il est nécessaire de sélectionner le lieu dans la liste déroulante."
259
											title="Permet de centrer la carte sur le lieu recherché. Il est nécessaire de sélectionner le lieu dans la liste déroulante."
260
											placeholder="Entrez un nom de ville, de lieu ou de rue..."
260
											placeholder="Entrez un nom de ville, de lieu ou de rue..."
261
											name="adresse"
261
											name="adresse"
262
											data-label="Adresse"
262
											data-label="Adresse"
263
											value=""/>
263
											value=""/>
264
									</div>
264
									</div>
265
								</div>
265
								</div>
266
							</div>
266
							</div>
267
						</div>
267
						</div>
268
						<div class="row-fluid">
268
						<div class="row-fluid">
269
							<div class="span12">
269
							<div class="span12">
270
								<div id="map-canvas" class="has-tooltip"
270
								<div id="map-canvas" class="has-tooltip"
271
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
271
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
272
									représentant votre station ou bien le glisser-déposer sur
272
									représentant votre station ou bien le glisser-déposer sur
273
									le lieu souhaité."></div>
273
									le lieu souhaité."></div>
274
								</div>
274
								</div>
275
							</div>
275
							</div>
276
							<div class="row-fluid">
276
							<div class="row-fluid">
277
								<div id="info-commune" class="span12">
277
								<div id="info-commune" class="span12">
278
									<span for="marqueur-commune">Commune : </span>
278
									<span for="marqueur-commune">Commune : </span>
279
										<span id="marqueur-commune">
279
										<span id="marqueur-commune">
280
											<span id="commune-nom" class="commune-info"></span>
280
											<span id="commune-nom" class="commune-info"></span>
281
									</span>
281
									</span>
282
								</div>
282
								</div>
283
							</div>
283
							</div>
284
						<div id="coordonnees-geo" class="row-fluid" style="display:none;">
284
						<div id="coordonnees-geo" class="row-fluid" style="display:none;">
285
							<div class="form-inline">
285
							<div class="form-inline">
286
								<div id="coord-lat" class="span4 control-group">
286
								<div id="coord-lat" class="span4 control-group">
287
									<label for="latitude" class="control-label">
287
									<label for="latitude" class="control-label">
288
										<strong class="obligatoire">*</strong>
288
										<strong class="obligatoire">*</strong>
289
										Latitude
289
										Latitude
290
									</label>
290
									</label>
291
									<div class="controls">
291
									<div class="controls">
292
										<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
292
										<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
293
									</div>
293
									</div>
294
								</div>
294
								</div>
295
								<div id="coord-lng" class="span4">
295
								<div id="coord-lng" class="span4">
296
									<label for="longitude" class="control-label">
296
									<label for="longitude" class="control-label">
297
										<strong class="obligatoire">*</strong>
297
										<strong class="obligatoire">*</strong>
298
										Longitude
298
										Longitude
299
									</label>
299
									</label>
300
									<div class="controls">
300
									<div class="controls">
301
										<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
301
										<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
302
									</div>
302
									</div>
303
								</div>
303
								</div>
304
								<div class="span4">
304
								<div class="span4">
305
									<button id="geolocaliser" class="btn has-tooltip"
305
									<button id="geolocaliser" class="btn has-tooltip"
306
										title="Centre la carte sur les coordonnées de latitude et longitude saisies.">
306
										title="Centre la carte sur les coordonnées de latitude et longitude saisies.">
307
										Voir sur la carte
307
										Voir sur la carte
308
									</button>
308
									</button>
309
								</div>
309
								</div>
310
								<input id="longitude" class="input-mini" name="longitude" type="text" value="BLABLA" style="display:none;"/>
310
								<input id="longitude" class="input-mini" name="longitude" type="text" value="BLABLA" style="display:none;"/>
311
							</div>
311
							</div>
312
						</div>
312
						</div>
313
					</fieldset>
313
					</fieldset>
314
					
314
					
315
					<fieldset id="partie-date">
315
					<fieldset id="partie-date">
316
						<legend><strong class="obligatoire">*</strong>
316
						<legend><strong class="obligatoire">*</strong>
317
									Date d'observation</legend>
317
									Date d'observation</legend>
318
						<div class="row-fluid">
318
						<div class="row-fluid">
319
							<div class="span12 control-group has-tooltip">
319
							<div class="span12 control-group has-tooltip">
320
								<label class="control-label">
320
								<label class="control-label">
321
									<div class="input-prepend">
321
									<div class="input-prepend">
322
										<span id="date-icone" class="add-on"></span>
322
										<span id="date-icone" class="add-on"></span>
323
										<input id="date" class="input-small" name="date" type="text"
323
										<input id="date" class="input-small" name="date" type="text"
324
											placeholder="jj/mm/aaaa" />
324
											placeholder="jj/mm/aaaa" />
325
									</div>
325
									</div>
326
								</label>
326
								</label>
327
							</div>
327
							</div>
328
						</div>
328
						</div>
329
					</fieldset>
329
					</fieldset>
330
 
330
 
331
					<fieldset id="partie-observation">
331
					<fieldset id="partie-observation">
332
						<legend>Observation</legend>
332
						<legend>Observation</legend>
333
						<div class="row-fluid">
333
						<div class="row-fluid">
334
							<div class="span12">
334
							<div class="span12">
335
								<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
335
								<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
336
									title="Sélectionnez une espèce dans la liste déroulante par son nom latin
336
									title="Sélectionnez une espèce dans la liste déroulante par son nom latin
337
									ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
337
									ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
338
									<label class="span3">
338
									<label class="span3">
339
										<strong class="obligatoire">*</strong>
339
										<strong class="obligatoire">*</strong>
340
										Espèce commune
340
										Espèce commune
341
									</label>
341
									</label>
342
									<div id="taxon-liste-controls" class="input-prepend span8">
342
									<div id="taxon-liste-controls" class="input-prepend span8">
343
										<span class="add-on">
343
										<span class="add-on">
344
											<i class="icon-leaf"></i>
344
											<i class="icon-leaf"></i>
345
										</span>
345
										</span>
346
 
346
 
347
										<select id="taxon-liste" name="taxon-liste">
347
										<select id="taxon-liste" name="taxon-liste">
348
											<option value="" selected>Sélectionner une espèce</option>
348
											<option value="" selected>Sélectionner une espèce</option>
349
 
349
 
350
											<optgroup id="taxon-liste-noms">
350
											<optgroup id="taxon-liste-noms">
351
												<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
351
												<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
352
													<option
352
													<option
353
														class="<?=$taxon['nom_type'] ?>"
353
														class="<?=$taxon['nom_type'] ?>"
354
														value="<?=$taxon['num_nom'] ?>"
354
														value="<?=$taxon['num_nom'] ?>"
355
														title="<?=$taxon['nom_title'] ?>"
355
														title="<?=$taxon['nom_title'] ?>"
356
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
356
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
357
														>
357
														>
358
														<?=$taxon['nom_a_afficher']?>
358
														<?=$taxon['nom_a_afficher']?>
359
													</option>
359
													</option>
360
												<?php endforeach; ?>
360
												<?php endforeach; ?>
361
											</optgroup>
361
											</optgroup>
362
											<optgroup id="taxon-liste-special">
362
											<optgroup id="taxon-liste-special">
363
												<?php foreach ($taxons['speciaux'] as $taxon) :?>
363
												<?php foreach ($taxons['speciaux'] as $taxon) :?>
364
													<option
364
													<option
365
														class="<?=$taxon['nom_type'] ?>"
365
														class="<?=$taxon['nom_type'] ?>"
366
														value="<?=$taxon['num_nom'] ?>"
366
														value="<?=$taxon['num_nom'] ?>"
367
														title="<?=$taxon['nom_title'] ?>"
367
														title="<?=$taxon['nom_title'] ?>"
368
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
368
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
369
														>
369
														>
370
														<?=$taxon['nom_a_afficher']?>
370
														<?=$taxon['nom_a_afficher']?>
371
													</option>
371
													</option>
372
												<?php endforeach; ?>
372
												<?php endforeach; ?>
373
												<option value="?">Autre</option>
373
												<option value="?">Autre</option>
374
											</optgroup>
374
											</optgroup>
375
										</select>
375
										</select>
376
									</div>
376
									</div>
377
								</div>
377
								</div>
378
							</div>
378
							</div>
379
						</div>
379
						</div>
380
						<div id="taxon-input-groupe" class="row-fluid hidden">
380
						<div id="taxon-input-groupe" class="row-fluid hidden">
381
							<div class="span12">
381
							<div class="span12">
382
								<div class="control-group has-tooltip" >
382
								<div class="control-group has-tooltip" >
383
									<label for="taxon" class="control-label span3">
383
									<label for="taxon" class="control-label span3">
384
										Autre espèce
384
										Autre espèce
385
									</label>
385
									</label>
386
									<div class="controls">
386
									<div class="controls">
387
										<input id="taxon" name="taxon" type="text" class="span8"
387
										<input id="taxon" name="taxon" type="text" class="span8"
388
											placeholder="Saisissez le nom d'espèce"
388
											placeholder="Saisissez le nom d'espèce"
389
											value="<?= $nom_sci_espece_defaut; ?>" />
389
											value="<?= $nom_sci_espece_defaut; ?>" />
390
									</div>
390
									</div>
391
								</div>
391
								</div>
392
							</div>
392
							</div>
393
						</div>
393
						</div>
394
												
394
 
395
						<div class="row-fluid">
395
						<div class="row-fluid">
396
							<div class="span12 control-group has-tooltip"
396
							<div class="span12 control-group has-tooltip"
397
								title="Indiquez votre certitude vis-à-vis du nom d'espèce indiqué">
397
								title="Indiquez votre certitude vis-à-vis du nom d'espèce indiqué">
398
								<label class="span3 control-label">
398
								<label class="span3 control-label">
399
									<strong class="obligatoire">*</strong>
399
									<strong class="obligatoire">*</strong>
400
									Certitude
400
									Certitude
401
								</label>
401
								</label>
402
								<div id="certitude-controls" class="controls">
402
								<div id="certitude-controls" class="controls">
403
									<span class="span3" title="Détermination certaine">
403
									<span class="span3" title="Détermination certaine">
404
										<input type="radio" name="certitude" id="certitude-certaine" value="certain" />
404
										<input type="radio" name="certitude" id="certitude-certaine" value="certain" />
405
										<label for="certitude-certaine">Certaine</label>
405
										<label for="certitude-certaine">Certaine</label>
406
									</span>
406
									</span>
407
									<span class="span3" title="Détermination incertaine mais pas inexacte">
407
									<span class="span3" title="Détermination incertaine mais pas inexacte">
408
										<input type="radio" name="certitude" id="certitude-douteuse" value="douteux" />
408
										<input type="radio" name="certitude" id="certitude-douteuse" value="douteux" />
409
										<label for="certitude-douteuse">Douteuse</label>
409
										<label for="certitude-douteuse">Douteuse</label>
410
									</span>
410
									</span>
411
									<span class="span3" title="Détermination inconnue">
411
									<span class="span3" title="Détermination inconnue">
412
										<input type="radio" name="certitude" id="certitude-adeterminer" value="aDeterminer" />
412
										<input type="radio" name="certitude" id="certitude-adeterminer" value="aDeterminer" />
413
										<label for="certitude-adeterminer">A determiner</label>
413
										<label for="certitude-adeterminer">A determiner</label>
414
									</span>									
414
									</span>									
415
								</div>
415
								</div>
416
							</div>
416
							</div>
417
						</div>
417
						</div>
418
 
418
 
419
						<div class="row-fluid">
419
						<div class="row-fluid">
420
							<div class="span12 control-group has-tooltip"
420
							<div class="span12 control-group has-tooltip"
421
								title="Indiquez le milieu dans lequel vous avez rencontré cette espèce.">
421
								title="Indiquez le milieu dans lequel vous avez rencontré cette espèce.">
422
								<label class="span3 control-label">
422
								<label class="span3 control-label">
423
									Milieu
423
									Milieu
424
								</label>
424
								</label>
425
								<div id="milieux-controls" class="controls span8">
425
								<div id="milieux-controls" class="controls span8">
426
									<div class="input-prepend">
426
									<div class="input-prepend">
427
										<span class="add-on">
427
										<span class="add-on">
428
											<i class="icon-globe"></i>
428
											<i class="icon-globe"></i>
429
										</span>
429
										</span>
430
										<select id="milieu">
430
										<select id="milieu">
431
											<option value="fissures">Fissures</option>
431
											<option value="fissures">Fissures</option>
432
											<option value="pied d'arbre">Pied d'arbre</option>
432
											<option value="pied d'arbre">Pied d'arbre</option>
433
											<option value="mur">Mur</option>
433
											<option value="mur">Mur</option>
434
											<option value="pelouse">Pelouse</option>
434
											<option value="pelouse">Pelouse</option>
435
											<option value="plate bande">Plate bande</option>
435
											<option value="plate bande">Plate bande</option>
436
											<option value="haie">Haie</option>
436
											<option value="haie">Haie</option>
437
											<option value="chemin">Chemin</option>
437
											<option value="chemin">Chemin</option>
438
											<option value="autres">Autres</option>
438
											<option value="autres">Autres</option>
439
										</select>
439
										</select>
440
									</div>
440
									</div>
441
								</div>
441
								</div>
442
							</div>
442
							</div>
443
						</div>
443
						</div>
444
 
444
 
445
						<div id="milieu-autre-input-group" class="row-fluid hidden">
445
						<div id="milieu-autre-input-group" class="row-fluid hidden">
446
							<div class="span12">
446
							<div class="span12">
447
								<div class="control-group has-tooltip" >
447
								<div class="control-group has-tooltip" >
448
									<label for="milieu-autre" class="control-label span3">
448
									<label for="milieu-autre" class="control-label span3">
449
										Autre milieu
449
										Autre milieu
450
									</label>
450
									</label>
451
									<div class="controls">
451
									<div class="controls">
452
										<input id="milieu-autre" name="milieu-autre" type="text" class="span8"
452
										<input id="milieu-autre" name="milieu-autre" type="text" class="span8"
453
											placeholder="" />
453
											placeholder="" />
454
									</div>
454
									</div>
455
								</div>
455
								</div>
456
							</div>
456
							</div>
457
						</div>
457
						</div>
458
 
458
 
459
						<div class="row-fluid">
459
						<div class="row-fluid">
460
							<div class="span12">
460
							<div class="span12">
461
								<label for="notes">Notes</label>
461
								<label for="notes">Notes</label>
462
								<div>
462
								<div>
463
									<textarea id="notes" class="span12" rows="7" name="notes"
463
									<textarea id="notes" class="span12" rows="7" name="notes"
464
										placeholder="Champ libre"></textarea>
464
										placeholder="Champ libre"></textarea>
465
								</div>
465
								</div>
466
							</div>
466
							</div>
467
						</div>
467
						</div>
468
					</fieldset>
468
					</fieldset>
469
				</div><!-- zone-fiche-terrain-->
469
				</div><!-- zone-fiche-terrain-->
470
			</form>
470
			</form>
471
 
471
 
472
			<div id="zone-fiche-terrain-photo">
472
			<div id="zone-fiche-terrain-photo">
473
				<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>"
473
				<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>"
474
					method="post" enctype="multipart/form-data">
474
					method="post" enctype="multipart/form-data">
475
					<div class="row-fluid">
475
					<div class="row-fluid">
476
						<div class="span12">
476
						<div class="span12">
477
							<fieldset id="partie-photo">
477
							<fieldset id="partie-photo">
478
								<legend>Image(s) de cette plante</legend>
478
								<legend>Image(s) de cette plante</legend>
479
								<p class="miniature-info" class="discretion help-inline">
479
								<p class="miniature-info" class="discretion help-inline">
480
									Vous pouvez ajouter des photos. Celles-ci doivent être au format <strong>JPEG</strong> 
480
									Vous pouvez ajouter des photos. Celles-ci doivent être au format <strong>JPEG</strong> 
481
									et ne doivent pas excéder <strong>5Mo</strong> chacunes.
481
									et ne doivent pas excéder <strong>5Mo</strong> chacunes.
482
									<a target="_blank" id="lien-tuto-photo" href="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/table_commentprendreenphoto.png">
482
									<a target="_blank" id="lien-tuto-photo" href="<?=$url_base?>/modules/saisie/squelettes/bellesdemarue/img/table_commentprendreenphoto.png">
483
										Exemples de bonnes et mauvaises photos
483
										Exemples de bonnes et mauvaises photos
484
									</a>
484
									</a>
485
									<i class="icon-question-sign"></i>
485
									<i class="icon-question-sign"></i>
486
								</p>
486
								</p>
487
								<div id="image-obligatoire" class="alert alert-error alert-block" style="display: none;">
487
								<div id="image-obligatoire" class="alert alert-error alert-block" style="display: none;">
488
									<a class="close">×</a>
488
									<a class="close">×</a>
489
									<h4 class="alert-heading">Information : image obligatoire</h4>
489
									<h4 class="alert-heading">Information : image obligatoire</h4>
490
									<p>
490
									<p>
491
										Veuillez ajouter au moins une image.
491
										Veuillez ajouter au moins une image.
492
									</p>
492
									</p>
493
								</div>
493
								</div>
494
								<div id ="photos-conteneur">
494
								<div id ="photos-conteneur">
495
									<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
495
									<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
496
									<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
496
									<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
497
									<div id="miniatures"></div>
497
									<div id="miniatures"></div>
498
									<p class="miniature-msg" class="span12">&nbsp;</p>
498
									<p class="miniature-msg" class="span12">&nbsp;</p>
499
								</div>
499
								</div>
500
							</fieldset>
500
							</fieldset>
501
						</div>
501
						</div>
502
					</div>
502
					</div>
503
				</form>
503
				</form>
504
				<div class="row-fluid">
504
				<div class="row-fluid">
505
					<div class="span12 has-tooltip"
505
					<div class="span12 has-tooltip"
506
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
506
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
507
							ajouter votre observation à la liste à transmettre.">
507
							ajouter votre observation à la liste à transmettre.">
508
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
508
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
509
							Ajouter
509
							Ajouter
510
						</button>
510
						</button>
511
					</div>
511
					</div>
512
				</div>
512
				</div>
513
			</div>
513
			</div>
514
 
514
 
515
			<!-- Messages d'erreur du formulaire-->
515
			<!-- Messages d'erreur du formulaire-->
516
			<div class="row-fluid">
516
			<div class="row-fluid">
517
				<div class="zone-alerte span12">
517
				<div class="zone-alerte span12">
518
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
518
					<div id="dialogue-bloquer-creer-obs" class="alert alert-warning alert-block" style="display: none;">
519
						<a class="close">×</a>
519
						<a class="close">×</a>
520
						<h4 class="alert-heading">Information : <?= $max_nb_obs; ?> observations maximum</h4>
520
						<h4 class="alert-heading">Information : <?= $max_nb_obs; ?> observations maximum</h4>
521
						<p>
521
						<p>
522
							Vous venez d'ajouter votre <?= $max_nb_obs; ?>ème observation.<br/>
522
							Vous venez d'ajouter votre <?= $max_nb_obs; ?>ème observation.<br/>
523
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
523
							Pour en ajouter de nouvelles, il est nécessaire de les transmettre en cliquant sur le bouton ci-dessous.
524
						</p>
524
						</p>
525
					</div>
525
					</div>
526
				</div>
526
				</div>
527
				<div class="zone-alerte span12">
527
				<div class="zone-alerte span12">
528
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
528
					<div id="dialogue-form-invalide" class="alert alert-warning alert-block" style="display: none;">
529
						<a class="close">×</a>
529
						<a class="close">×</a>
530
						<h4 class="alert-heading">Information : champs en erreur</h4>
530
						<h4 class="alert-heading">Information : champs en erreur</h4>
531
						<p>
531
						<p>
532
							Certains champs du formulaire sont mal remplis.<br/>
532
							Certains champs du formulaire sont mal remplis.<br/>
533
							Veuillez vérifier vos données.
533
							Veuillez vérifier vos données.
534
						</p>
534
						</p>
535
					</div>
535
					</div>
536
				</div>
536
				</div>
537
				<div class="zone-alerte span12">
537
				<div class="zone-alerte span12">
538
					<div id="dialogue-form-invalide-rue" class="alert alert-warning alert-block" style="display: none;">
538
					<div id="dialogue-form-invalide-rue" class="alert alert-warning alert-block" style="display: none;">
539
						<a class="close">×</a>
539
						<a class="close">×</a>
540
						<h4 class="alert-heading">Information : champs en erreur</h4>
540
						<h4 class="alert-heading">Information : champs en erreur</h4>
541
						<p>
541
						<p>
542
							Le coordonnées du début et de la fin de la rue n'ont pas été géoréférencé.<br/>
542
							Le coordonnées du début et de la fin de la rue n'ont pas été géoréférencé.<br/>
543
							Veuillez suivre les étapes indiquées dans le champ « Géolocalisation ».
543
							Veuillez suivre les étapes indiquées dans le champ « Géolocalisation ».
544
						</p>
544
						</p>
545
					</div>
545
					</div>
546
				</div>
546
				</div>
547
			</div>
547
			</div>
548
 
548
 
549
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
549
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
550
			<div id="zone-liste-obs" class="hidden">
550
			<div id="zone-liste-obs" class="hidden">
551
				<div class="row-fluid">
551
				<div class="row-fluid">
552
					<div class="span12">
552
					<div class="span12">
553
						<div class="row-fluid">
553
						<div class="row-fluid">
554
							<div class="span8">
554
							<div class="span8">
555
								<h2 id="titre-liste-obs">Liste des observations à transmettre : <span class="obs-nbre">0</span></h2>
555
								<h2 id="titre-liste-obs">Liste des observations à transmettre : <span class="obs-nbre">0</span></h2>
556
							</div>
556
							</div>
557
							<div class="span4 droite">
557
							<div class="span4 droite">
558
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
558
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
559
									type="button" disabled="disabled"
559
									type="button" disabled="disabled"
560
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
560
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
561
									Transmettre
561
									Transmettre
562
								</button>
562
								</button>
563
							</div>
563
							</div>
564
						</div>
564
						</div>
565
						<div id="liste-obs" ></div>
565
						<div id="liste-obs" ></div>
566
					</div>
566
					</div>
567
				</div>
567
				</div>
568
			</div>
568
			</div>
569
 
569
 
570
			<div class="row-fluid">
570
			<div class="row-fluid">
571
				<div class="zone-alerte span12">
571
				<div class="zone-alerte span12">
572
					<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
572
					<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
573
						<a class="close">×</a>
573
						<a class="close">×</a>
574
						<h4 class="alert-heading">Attention : aucune observation</h4>
574
						<h4 class="alert-heading">Attention : aucune observation</h4>
575
						<p>Veuillez saisir des observations pour les transmettre.</p>
575
						<p>Veuillez saisir des observations pour les transmettre.</p>
576
					</div>
576
					</div>
577
 
577
 
578
					<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;">
578
					<div id="dialogue-obs-transaction-ok" class="alert alert-success alert-block" style="display: none;">
579
						<a class="close">×</a>
579
						<a class="close">×</a>
580
						<h4 class="alert-heading">Information : transmission des observations</h4>
580
						<h4 class="alert-heading">Information : transmission des observations</h4>
581
						<div class="alert-txt"></div>
581
						<div class="alert-txt"></div>
582
					</div>
582
					</div>
583
 
583
 
584
					<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
584
					<div id="dialogue-obs-transaction-ko" class="alert alert-error alert-block" style="display: none;">
585
						<a class="close">×</a>
585
						<a class="close">×</a>
586
						<h4 class="alert-heading">Erreur : transmission des observations</h4>
586
						<h4 class="alert-heading">Erreur : transmission des observations</h4>
587
						<div class="alert-txt"></div>
587
						<div class="alert-txt"></div>
588
					</div>
588
					</div>
589
				</div>
589
				</div>
590
			</div>
590
			</div>
591
		</div>
591
		</div>
592
 
592
 
593
		<!-- Fenêtres modales -->
593
		<!-- Fenêtres modales -->
594
		<div id="chargement" class="modal-fenetre" style="display:none;">
594
		<div id="chargement" class="modal-fenetre" style="display:none;">
595
			<div id="chargement-centrage" class="modal-contenu">
595
			<div id="chargement-centrage" class="modal-contenu">
596
				<div class="progress progress-success progress-striped active">
596
				<div class="progress progress-success progress-striped active">
597
		 			<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
597
		 			<div id="barre-progression-upload" class="bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="10" style="">
598
		    			<span class="sr-only">0/10 observations transmises</span>
598
		    			<span class="sr-only">0/10 observations transmises</span>
599
		  			</div>
599
		  			</div>
600
				</div>
600
				</div>
601
				<p id="chargement-txt" style="color:white;font-size:1.5em;">
601
				<p id="chargement-txt" style="color:white;font-size:1.5em;">
602
					Transfert des observations en cours...<br />
602
					Transfert des observations en cours...<br />
603
					Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
603
					Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre
604
					d'observations à transférer.
604
					d'observations à transférer.
605
				</p>
605
				</p>
606
			</div>
606
			</div>
607
		</div>
607
		</div>
608
 
608
 
609
		<!-- Templates HTML -->
609
		<!-- Templates HTML -->
610
		<div id="tpl-transmission-ok" style="display:none;">
610
		<div id="tpl-transmission-ok" style="display:none;">
611
			<p class="msg">
611
			<p class="msg">
612
				Merci Beaucoup&nbsp;! Vos observations ont bien été transmises.<br />
612
				Merci Beaucoup&nbsp;! Vos observations ont bien été transmises.<br />
613
				Elles sont désormais affichées sur la carte <a href="http://www.tela-botanica.org/widget:cel:cartoPoint?projet=Bellesdemarue">Belles de ma rue</a>
613
				Elles sont désormais affichées sur la carte <a href="http://www.tela-botanica.org/widget:cel:cartoPoint?projet=Bellesdemarue">Belles de ma rue</a>
614
			</p>
614
			</p>
615
		</div>
615
		</div>
616
		<div id="tpl-transmission-ko" style="display:none;">
616
		<div id="tpl-transmission-ko" style="display:none;">
617
			<p class="msg">
617
			<p class="msg">
618
				Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
618
				Une erreur est survenue lors de la transmission d'une observation (indiquée en rouge).<br />
619
				Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
619
				Vous pouvez tenter de la retransmettre en cliquant à nouveau sur le bouton transmettre ou bien la supprimer
620
				et transmettre les suivantes.<br />
620
				et transmettre les suivantes.<br />
621
				Les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. 
621
				Les observations n'apparaissant plus dans la liste "observations à transmettre", ont bien été transmises lors de votre précédente tentative. 
622
			</p>
622
			</p>
623
		</div>
623
		</div>
624
	</body>
624
	</body>
625
</html>
625
</html>