Subversion Repositories eFlore/Applications.cel

Rev

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

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