Subversion Repositories eFlore/Applications.cel

Rev

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

Rev 1130 Rev 1206
1 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 1 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2 
<html xmlns="http://www.w3.org/1999/xhtml">
 2 
<html xmlns="http://www.w3.org/1999/xhtml">
3 
	<head>
 3 
	<head>
4 
		<title>Sauvages de ma rue</title>
 4 
		<title>Sauvages de ma rue</title>
5
5
6 
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
 6 
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
7 
		<meta http-equiv="Content-style-type" content="text/css" />
 7 
		<meta http-equiv="Content-style-type" content="text/css" />
8 
		<meta http-equiv="Content-script-type" content="text/javascript" />
 8 
		<meta http-equiv="Content-script-type" content="text/javascript" />
9 
		<meta http-equiv="Content-language" content="fr" />
 9 
		<meta http-equiv="Content-language" content="fr" />
10
10
11 
		<meta name="revisit-after" content="15 days" />
 11 
		<meta name="revisit-after" content="15 days" />
12 
        <meta name="robots" content="index,follow" />
 12 
        <meta name="robots" content="index,follow" />
13 
        <meta name="author" content="Céline VIDAL, Jean-Pascal MILCENT" />
 13 
        <meta name="author" content="Céline VIDAL, Jean-Pascal MILCENT" />
14 
        <meta name="keywords" content="Tela Botanica, Natural Solutions, MNHN, Sauvages de ma rue, CEL" />
 14 
        <meta name="keywords" content="Tela Botanica, Natural Solutions, MNHN, Sauvages de ma rue, CEL" />
15 
        <meta name="description" content="Widget de saisie simplifié pour le projet Sauvages de ma rue" />
 15 
        <meta name="description" content="Widget de saisie simplifié pour le projet Sauvages de ma rue" />
16 
 
 16 
 
17 
		<!-- Favicones -->
 17 
		<!-- Favicones -->
18 
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/sauvages/images/favicon.ico" />
 18 
		<link rel="shortcut icon" type="image/x-icon" href="<?=$url_base?>/modules/saisie/squelettes/sauvages/images/favicon.ico" />
19
19
20 
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 20 
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
21
21
22 
		<!-- Javascript : bibliothèques -->
 22 
		<!-- Javascript : bibliothèques -->
23 
		<!-- Google Map v3 -->
 23 
		<!-- Google Map v3 -->
24 
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
 24 
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
25 
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
25 
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
26
26
27 
		<!-- Jquery -->
 27 
		<!-- Jquery -->
28 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.min.js"></script>
 28 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/1.7.1/jquery-1.7.1.min.js"></script>
29
29
30 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/js/jquery-ui-1.8.17.custom.min.js"></script>
 30 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/js/jquery-ui-1.8.17.custom.min.js"></script>
31 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/js/jquery.ui.datepicker-fr.js"></script>
 31 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/js/jquery.ui.datepicker-fr.js"></script>
32 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/jquery.validate.js"></script>
 32 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/jquery.validate.js"></script>
33 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/messages_fr.js"></script>
 33 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/validate/1.9.0/messages_fr.js"></script>
34 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/form/2.95/jquery.form.min.js"></script>
 34 
		<script type="text/javascript" src="http://www.tela-botanica.org/commun/jquery/form/2.95/jquery.form.min.js"></script>
35
35
36 
		<script src="<?=$url_base?>saisie?projet=sauvages&amp;service=taxons" type="text/javascript"></script>
 36 
		<script src="<?=$url_base?>saisie?projet=sauvages&amp;service=taxons" type="text/javascript"></script>
37
37
38 
		<!-- Javascript : appli saisie -->
 38 
		<!-- Javascript : appli saisie -->
39 
		<script type="text/javascript">
 39 
		<script type="text/javascript">
40 
		//<![CDATA[
 40 
		//<![CDATA[
41 
			// La présence du parametre 'debug' dans l'URL enclenche le dégogage
 41 
			// La présence du parametre 'debug' dans l'URL enclenche le dégogage
42 
			var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
 42 
			var DEBUG = <?=isset($_GET['debug']) ? 'true' : 'false'?>;
43 
			// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
 43 
			// La présence du parametre 'html5' dans l'URL enclenche les fonctions avancées HTML5
44 
			var HTML5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
 44 
			var HTML5 = <?=isset($_GET['html5']) ? 'true' : 'false'?>;
45 
			// La présence du parametre 'ville' dans l'URL géolocalise
 45 
			// La présence du parametre 'ville' dans l'URL géolocalise
46 
			var VILLE = "<?=isset($_GET['ville']) ? $_GET['ville'] : ''?>";
 46 
			var VILLE = "<?=isset($_GET['ville']) ? $_GET['ville'] : ''?>";
47 
			// URL du web service réalisant l'insertion des données dans la base du CEL.
 47 
			// URL du web service réalisant l'insertion des données dans la base du CEL.
48 
			var SERVICE_SAISIE_URL = "<?=$url_ws_saisie?>";
 48 
			var SERVICE_SAISIE_URL = "<?=$url_ws_saisie?>";
49 
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
 49 
			// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
50 
			var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:osm/0.1/nom-commune?lon={lon}&lat={lat}";
 50 
			var SERVICE_NOM_COMMUNE_URL = "http://www.tela-botanica.org/service:eflore:osm/0.1/nom-commune?lon={lon}&lat={lat}";
51 
			// URL du marqueur à utiliser dans la carte Google Map
 51 
			// URL du marqueur à utiliser dans la carte Google Map
52 
			var GOOGLE_MAP_MARQUEUR_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/marqueurs/fleur.png";
 52 
			var GOOGLE_MAP_MARQUEUR_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/marqueurs/fleur.png";
53 
			// URL de l'icône du bouton supprimer
 53 
			// URL de l'icône du bouton supprimer
54 
			var SUPPRIMER_ICONE_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/icones/supprimer.png";
 54 
			var SUPPRIMER_ICONE_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/icones/supprimer.png";
55 
			// URL de l'icône du chargement en cours
 55 
			// URL de l'icône du chargement en cours
56 
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/icones/chargement.gif";
 56 
			var CHARGEMENT_ICONE_URL = "<?=$url_base?>/modules/saisie/squelettes/sauvages/images/icones/chargement.gif";
57 
		//]]>
 57 
		//]]>
58 
		</script>
 58 
		</script>
59
59
60 
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/sauvages/js/sauvages.js"></script>
 60 
		<script type="text/javascript" src="<?=$url_base?>modules/saisie/squelettes/sauvages/js/sauvages.js"></script>
61
61
62 
		<!-- CSS -->
 62 
		<!-- CSS -->
63 
		<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/css/ui-darkness/jquery-ui-1.8.17.custom.css" rel="stylesheet" type="text/css" media="screen" />
 63 
		<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.17/css/ui-darkness/jquery-ui-1.8.17.custom.css" rel="stylesheet" type="text/css" media="screen" />
64 
		<link href="<?=$url_base?>modules/saisie/squelettes/sauvages/css/<?=isset($_GET['style']) ? $_GET['style'] : 'sauvages'?>.css" rel="stylesheet" type="text/css" media="screen" />
 64 
		<link href="<?=$url_base?>modules/saisie/squelettes/sauvages/css/<?=isset($_GET['style']) ? $_GET['style'] : 'sauvages'?>.css" rel="stylesheet" type="text/css" media="screen" />
65 
	</head>
 65 
	</head>
66 
 
 66 
 
67 
	<body>
 67 
	<body>
- 
 
 68 
		<div id="zone-appli">
68 
		<h1><img src="<?=$url_base?>/modules/saisie/squelettes/sauvages/images/logos/sdmr.png" alt="Sauvages de ma rue : Saisie des observations"/></h1>
 69 
			<h1><img src="<?=$url_base?>/modules/saisie/squelettes/sauvages/images/logos/sdmr.png" alt="Sauvages de ma rue : Saisie des observations"/></h1>
69
70
70 
		<form id="saisie-obs" action="#" enctype="multipart/form-data" autocomplete="on">
 71 
			<form id="saisie-obs" action="#" enctype="multipart/form-data" autocomplete="on">
71 
			<fieldset id="partie-identification">
 72 
				<fieldset id="partie-identification">
72 
				<legend>Observateur</legend>
 73 
					<legend>Observateur</legend>
73 
				<ul>
 - 
 
74 
					<li>
 - 
 
75 
						<label for="prenom">Prénom</label>
 - 
 
76 
						<input id="prenom" name="prenom" type="text" value=""/>
 - 
 
77 
					</li>
 - 
 
78 
					<li>
 - 
 
79 
						<label for="nom">Nom</label>
 - 
 
80 
						<input id="nom" name="nom" type="text" value=""/>
 - 
 
81 
					</li>
 - 
 
82 
					<li>
 - 
 
83 
						<label for="courriel" class="oblig"
- 
 
84 
							title="Veuillez saisir votre adresse courriel. Elle ne sera pas utilisée à des fins commerciales.">
 - 
 
85 
							<strong class="obligatoire">*</strong> Courriel
 - 
 
86 
						</label>
 - 
 
87 
						<input id="courriel" name="courriel" type="text" value=""/>
 - 
 
88 
					</li>
 - 
 
89 
					<li>
 - 
 
90 
						<label for="courriel_confirmation" class="oblig" title="Veuillez saisir confirmer votre adresse courriel">
 - 
 
91 
							<strong class="obligatoire">*</strong> Courriel (confirmation)
 - 
 
92 
						</label>
 - 
 
93 
						<input id="courriel_confirmation" name="courriel_confirmation" type="text" value=""/>
 - 
 
94 
					</li>
 - 
 
95 
				</ul>
 - 
 
96 
			</fieldset>
 - 
 
97
- 
 
98 
			<h2>Fiche de terrain</h2>
 - 
 
99 
			<div id="zone-fiche-terrain">
 - 
 
100 
				<fieldset id="partie-date">
 - 
 
101 
					<legend>Date du relevé</legend>
- 
 
102 
					<ul>
 - 
 
103 
						<li>
 - 
 
104 
							<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
 - 
 
105 
								<strong class="obligatoire">*</strong> Date du relevé
 - 
 
106 
							</label>
 - 
 
107 
							<input id="date" name="date" type="text" value="" />
 - 
 
108 
						</li>
 - 
 
109 
					</ul>
 - 
 
110 
				</fieldset>
 - 
 
111 
				<fieldset id="partie-station">
 - 
 
112 
					<legend>Lieu du relevé</legend>
 - 
 
113 
					<ul>
 - 
 
114 
						<li>
 - 
 
115 
							<ul>
 - 
 
116 
								<li>
 - 
 
117 
									<label for="rue" title="Indiquer le nom de la rue">
 - 
 
118 
										<strong class="obligatoire">*</strong>
- 
 
119 
										Rue
 - 
 
120 
									</label>
 - 
 
121 
									<input id="rue" name="rue" type="text" value="" />
 - 
 
122 
								</li>
 - 
 
123 
								<li>
 - 
 
124 
									<ul id="rue_numeros">
 - 
 
125 
										<li>
 - 
 
126 
											<label for="rue_num_debut" title="Indiquer le numéro de début de la rue">
 - 
 
127 
												<strong class="obligatoire">*</strong>
- 
 
128 
												N° début
 - 
 
129 
											</label>
 - 
 
130 
											<input id="rue_num_debut" name="rue_num_debut" type="text" value="" />
 - 
 
131 
										</li>
 - 
 
132 
										<li>
 - 
 
133 
											<label for="rue_num_fin" title="Indiquer le numéro de fin de la rue">
 - 
 
134 
												<strong class="obligatoire">*</strong>
- 
 
135 
												N° fin
 - 
 
136 
											</label>
 - 
 
137 
											<input id="rue_num_fin" name="rue_num_fin" type="text" value="" />
 - 
 
138 
										</li>
 - 
 
139 
									</ul>
 - 
 
140 
									<hr class="nettoyage" />
 - 
 
141 
								</li>
 - 
 
142 
								<li>
 - 
 
143 
									<label for="rue_cote" title="Choisissez un type de côté de rue">
 - 
 
144 
										<strong class="obligatoire">*</strong>
- 
 
145 
										Côté
 - 
 
146 
									</label>
 - 
 
147 
									<select id="rue_cote" name="rue_cote">
 - 
 
148 
										<option value="">Sélectionner un type de côté</option>
 - 
 
149 
									 	<option value="pair">Pair</option>
 - 
 
150 
									 	<option value="impair">Impair</option>
 - 
 
151 
									 	<option value="2cotes">Les deux</option>
 - 
 
152 
									</select>
- 
 
153 
								</li>
 - 
 
154 
							</ul>
 - 
 
155 
						</li>
 - 
 
156 
					</ul>
 - 
 
157 
				</fieldset>
 - 
 
158 
				<fieldset id="partie-observation">
 - 
 
159 
					<legend>Observations</legend>
- 
 
160 
					<ul>
 74 
					<ul>
161 
						<li>
 75 
						<li>
162 
							<label for="taxon" title="Choisissez une espèce">
 76 
							<label for="prenom">Prénom</label>
163 
								<strong class="obligatoire">*</strong>
- 
 
164 
								Espèce
 - 
 
165 
							</label>
 - 
 
166 
							<select id="taxon" name="taxon">
 77 
							<input id="prenom" name="prenom" type="text" value=""/>
167 
								<option value="">Sélectionner un taxon</option>
 - 
 
168 
								<?php foreach ($taxons as $taxon) :?>
 - 
 
169 
									<option value="<?=$taxon['num_nom_sel']?>"
- 
 
170 
										title="<?=$taxon['nom_sel'].($taxon['nom_fr_autre'] != '' ? ' - '.$taxon['nom_fr_autre'] : '' )?>">
 - 
 
171 
										<?=$taxon['nom_fr']?>
 - 
 
172 
									</option>
 - 
 
173 
								<?php endforeach; ?>
- 
 
174 
							</select>
- 
 
175 
						</li>
 78 
						</li>
176 
						<li>
 79 
						<li>
177 
							<label for="liste-milieux" title="Veuillez sélectionner un milieu">
 - 
 
178 
								<strong class="obligatoire">*</strong>
- 
 
179 
								Milieu
 - 
 
180 
							</label>
 - 
 
181 
							<ul id="liste-milieux">
 80 
							<label for="nom">Nom</label>
182 
								<?php foreach ($milieux as $milieu => $description) : ?>
 - 
 
183 
								<li>
 - 
 
184 
									<input type="radio" class="milieu" name="milieu" value="<?=$milieu?>"
81 
							<input id="nom" name="nom" type="text" value=""/>
185 
										<?=($description != '') ? 'title="'.$description.'"': '' ?>/>
 - 
 
186 
									<?=$milieu?>
 - 
 
187 
								</li>
 - 
 
188 
								<?php endforeach; ?>
 - 
 
189 
							</ul>
 - 
 
190 
							<hr class="nettoyage" />
 - 
 
191 
						</li>
 82 
						</li>
192 
						<li>
 83 
						<li>
193 
							<label for="map_canvas" class="oblig" title="Veuillez localiser l'observation">
 84 
							<label for="courriel" class="oblig"
- 
 
 85 
								title="Veuillez saisir votre adresse courriel. Elle ne sera pas utilisée à des fins commerciales.">
194 
								<strong class="obligatoire">*</strong> Géolocalisation
 86 
								<strong class="obligatoire">*</strong> Courriel
195 
							</label>
 87 
							</label>
- 
 
 88 
							<input id="courriel" name="courriel" type="text" value=""/>
196 
						</li>
 89 
						</li>
197 
						<li id="map-canvas"></li>
 - 
 
198 
						<li>
 90 
						<li>
199 
							<label for="coordonnees-geo">
 - 
 
200 
								<a href="#" class="afficher-coord">Afficher</a>
 - 
 
201 
								<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
 91 
							<label for="courriel_confirmation" class="oblig" title="Veuillez saisir confirmer votre adresse courriel">
202 
								Les coordonnées géographiques
 - 
 
203 
								<span id="lat-lon-info" class="info"
92 
								<strong class="obligatoire">*</strong> Courriel (confirmation)
204 
									title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
 - 
 
205 
									(WGS84)
 - 
 
206 
								</span>
 - 
 
207 
							</label>
 93 
							</label>
208 
							<ul id="coordonnees-geo" style="display:none;">
 - 
 
209 
								<li id="coord-lat">
- 
 
210 
									<label for="latitude">Latitude</label>
 - 
 
211 
									<input id="latitude" name="latitude" type="text" value=""/>
 - 
 
212 
								</li>
 - 
 
213 
								<li id="coord-lng">
 - 
 
214 
									<label for="longitude">Longitude</label>
 - 
 
215 
									<input id="longitude" name="longitude" type="text" value=""/>
 94 
							<input id="courriel_confirmation" name="courriel_confirmation" type="text" value=""/>
216 
								</li>
 - 
 
217 
								<li id="info-commune">
 - 
 
218 
						    		<label for="marqueur-commune">Commune</label>
 - 
 
219 
						    		<span id="marqueur-commune">
 - 
 
220 
						    			<span id="commune-nom" class="commune-info"></span>
 - 
 
221 
						    			(<span id="commune-code-insee" class="commune-info" title="Code INSEE de la commune"></span>)
 - 
 
222 
						    		</span>
 - 
 
223 
					    		</li>
 - 
 
224 
								<li>
 - 
 
225 
									<input id="geolocaliser" type="button" value="Voir sur la carte"/>
 - 
 
226 
								</li>
 - 
 
227 
							</ul>
 - 
 
228 
						</li>
 - 
 
229 
						<li>
 - 
 
230 
							<hr class="nettoyage" />
 - 
 
231 
						</li>
 - 
 
232 
						<li>
 - 
 
233 
							<label for="notes">Notes</label>
 - 
 
234 
							<textarea id="notes" name="notes" rows="3" cols="4"></textarea>
 - 
 
235 
						</li>
 95 
						</li>
236 
					</ul>
 96 
					</ul>
237 
				</fieldset>
 97 
				</fieldset>
238 
			</div><!-- zone-fiche-terrain-->
 - 
 
239 
		</form>
- 
 
240
- 
 
241 
		<div id="zone-fiche-terrain-photo">
 - 
 
242 
			<form id="form-upload"  action="<?=$url_base?>saisie?projet=sauvages&amp;service=upload-image"
- 
 
243 
				method="post" enctype="multipart/form-data">
 - 
 
244 
				<fieldset id="partie-photo">
 - 
 
245 
					<legend>Ajouter une photo</legend>
 - 
 
246 
					<p id="miniature-info" class="discretion">La photo doit être au format JPEG et ne doit pas excéder 5Mo.</p>
- 
 
247 
					<input type="file" id="fichier" name="fichier" accept="image/jpeg"/>
 - 
 
248 
					<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
 - 
 
249 
					<p id="miniature-msg">&nbsp;</p>
 - 
 
250 
					<div id="miniature"></div>
 - 
 
251 
					<button id="effacer-miniature" type="button" style="display:none;">Effacer</button>
 - 
 
252 
				</fieldset>
 - 
 
253 
			</form>
 - 
 
- 
 
 98
- 
 
 99 
				<h2>Fiche de terrain</h2>
- 
 
 100 
				<div id="zone-fiche-terrain">
- 
 
 101 
					<fieldset id="partie-date">
- 
 
 102 
						<legend>Date du relevé</legend>
- 
 
 103 
						<ul>
- 
 
 104 
							<li>
- 
 
 105 
								<label for="date" title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
- 
 
 106 
									<strong class="obligatoire">*</strong> Date du relevé
- 
 
 107 
								</label>
- 
 
 108 
								<input id="date" name="date" type="text" value="" />
- 
 
 109 
							</li>
- 
 
 110 
						</ul>
- 
 
 111 
					</fieldset>
- 
 
 112 
					<fieldset id="partie-station">
- 
 
 113 
						<legend>Lieu du relevé</legend>
- 
 
 114 
						<ul>
- 
 
 115 
							<li>
- 
 
 116 
								<ul>
- 
 
 117 
									<li>
- 
 
 118 
										<label for="rue" title="Indiquer le nom de la rue">
- 
 
 119 
											<strong class="obligatoire">*</strong>
- 
 
 120 
											Rue
- 
 
 121 
										</label>
- 
 
 122 
										<input id="rue" name="rue" type="text" value="" />
- 
 
 123 
									</li>
- 
 
 124 
									<li>
- 
 
 125 
										<ul id="rue_numeros">
- 
 
 126 
											<li>
- 
 
 127 
												<label for="rue_num_debut" title="Indiquer le numéro de début de la rue">
- 
 
 128 
													<strong class="obligatoire">*</strong>
- 
 
 129 
													N° début
- 
 
 130 
												</label>
- 
 
 131 
												<input id="rue_num_debut" name="rue_num_debut" type="text" value="" />
- 
 
 132 
											</li>
- 
 
 133 
											<li>
- 
 
 134 
												<label for="rue_num_fin" title="Indiquer le numéro de fin de la rue">
- 
 
 135 
													<strong class="obligatoire">*</strong>
- 
 
 136 
													N° fin
- 
 
 137 
												</label>
- 
 
 138 
												<input id="rue_num_fin" name="rue_num_fin" type="text" value="" />
- 
 
 139 
											</li>
- 
 
 140 
										</ul>
- 
 
 141 
										<hr class="nettoyage" />
- 
 
 142 
									</li>
- 
 
 143 
									<li>
- 
 
 144 
										<label for="rue_cote" title="Choisissez un type de côté de rue">
- 
 
 145 
											<strong class="obligatoire">*</strong>
- 
 
 146 
											Côté
- 
 
 147 
										</label>
- 
 
 148 
										<select id="rue_cote" name="rue_cote">
- 
 
 149 
											<option value="">Sélectionner un type de côté</option>
- 
 
 150 
										 	<option value="pair">Pair</option>
- 
 
 151 
										 	<option value="impair">Impair</option>
- 
 
 152 
										 	<option value="2cotes">Les deux</option>
- 
 
 153 
										</select>
- 
 
 154 
									</li>
- 
 
 155 
								</ul>
- 
 
 156 
							</li>
- 
 
 157 
						</ul>
- 
 
 158 
					</fieldset>
- 
 
 159 
					<fieldset id="partie-observation">
- 
 
 160 
						<legend>Observations</legend>
- 
 
 161 
						<ul>
- 
 
 162 
							<li>
- 
 
 163 
								<label for="taxon" title="Choisissez une espèce">
- 
 
 164 
									<strong class="obligatoire">*</strong>
- 
 
 165 
									Espèce
- 
 
 166 
								</label>
- 
 
 167 
								<select id="taxon" name="taxon">
- 
 
 168 
									<option value="">Sélectionner un taxon</option>
- 
 
 169 
									<?php foreach ($taxons as $taxon) :?>
- 
 
 170 
										<option value="<?=$taxon['num_nom_sel']?>"
- 
 
 171 
											title="<?=$taxon['nom_sel'].($taxon['nom_fr_autre'] != '' ? ' - '.$taxon['nom_fr_autre'] : '' )?>">
- 
 
 172 
											<?=$taxon['nom_fr']?>
- 
 
 173 
										</option>
- 
 
 174 
									<?php endforeach; ?>
- 
 
 175 
								</select>
- 
 
 176 
							</li>
- 
 
 177 
							<li>
- 
 
 178 
								<label for="liste-milieux" title="Veuillez sélectionner un milieu">
- 
 
 179 
									<strong class="obligatoire">*</strong>
- 
 
 180 
									Milieu
- 
 
 181 
								</label>
- 
 
 182 
								<ul id="liste-milieux">
- 
 
 183 
									<?php foreach ($milieux as $milieu => $description) : ?>
- 
 
 184 
									<li>
- 
 
 185 
										<input type="radio" class="milieu" name="milieu" value="<?=$milieu?>"
- 
 
 186 
											<?=($description != '') ? 'title="'.$description.'"': '' ?>/>
- 
 
 187 
										<?=$milieu?>
- 
 
 188 
									</li>
- 
 
 189 
									<?php endforeach; ?>
- 
 
 190 
								</ul>
- 
 
 191 
								<hr class="nettoyage" />
- 
 
 192 
							</li>
- 
 
 193 
							<li>
- 
 
 194 
								<label for="map_canvas" class="oblig" title="Veuillez localiser l'observation">
- 
 
 195 
									<strong class="obligatoire">*</strong> Géolocalisation
- 
 
 196 
								</label>
- 
 
 197 
							</li>
254
198 
							<li id="map-canvas"></li>
- 
 
 199 
							<li>
- 
 
 200 
								<label for="coordonnees-geo">
- 
 
 201 
									<a href="#" class="afficher-coord">Afficher</a>
- 
 
 202 
									<a href="#" class="afficher-coord" style="display:none;">Cacher</a>
- 
 
 203 
									Les coordonnées géographiques
- 
 
 204 
									<span id="lat-lon-info" class="info"
- 
 
 205 
										title="Système géodésique mondial, révision de 1984 - Coordonnées non projetées">
- 
 
 206 
										(WGS84)
- 
 
 207 
									</span>
- 
 
 208 
								</label>
- 
 
 209 
								<ul id="coordonnees-geo" style="display:none;">
- 
 
 210 
									<li id="coord-lat">
- 
 
 211 
										<label for="latitude">Latitude</label>
- 
 
 212 
										<input id="latitude" name="latitude" type="text" value=""/>
- 
 
 213 
									</li>
- 
 
 214 
									<li id="coord-lng">
- 
 
 215 
										<label for="longitude">Longitude</label>
- 
 
 216 
										<input id="longitude" name="longitude" type="text" value=""/>
- 
 
 217 
									</li>
- 
 
 218 
									<li id="info-commune">
- 
 
 219 
							    		<label for="marqueur-commune">Commune</label>
- 
 
 220 
							    		<span id="marqueur-commune">
- 
 
 221 
							    			<span id="commune-nom" class="commune-info"></span>
- 
 
 222 
							    			(<span id="commune-code-insee" class="commune-info" title="Code INSEE de la commune"></span>)
- 
 
 223 
							    		</span>
- 
 
 224 
						    		</li>
255 
			<div>
 225 
									<li>
- 
 
 226 
										<input id="geolocaliser" type="button" value="Voir sur la carte"/>
- 
 
 227 
									</li>
- 
 
 228 
								</ul>
- 
 
 229 
							</li>
- 
 
 230 
							<li>
- 
 
 231 
								<hr class="nettoyage" />
- 
 
 232 
							</li>
- 
 
 233 
							<li>
- 
 
 234 
								<label for="notes">Notes</label>
256 
				<button id="ajouter-obs" type="button">Ajouter</button>
 235 
								<textarea id="notes" name="notes" rows="3" cols="4"></textarea>
- 
 
 236 
							</li>
- 
 
 237 
						</ul>
257 
			</div>
 238 
					</fieldset>
- 
 
 239 
				</div><!-- zone-fiche-terrain-->
- 
 
 240 
			</form>
- 
 
 241
- 
 
 242 
			<div id="zone-fiche-terrain-photo">
- 
 
 243 
				<form id="form-upload"  action="<?=$url_base?>saisie?projet=sauvages&amp;service=upload-image"
- 
 
 244 
					method="post" enctype="multipart/form-data">
- 
 
 245 
					<fieldset id="partie-photo">
- 
 
 246 
						<legend>Ajouter une photo</legend>
- 
 
 247 
						<p id="miniature-info" class="discretion">La photo doit être au format JPEG et ne doit pas excéder 5Mo.</p>
- 
 
 248 
						<input type="file" id="fichier" name="fichier" accept="image/jpeg"/>
- 
 
 249 
						<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
- 
 
 250 
						<p id="miniature-msg">&nbsp;</p>
- 
 
 251 
						<div id="miniature"></div>
- 
 
 252 
						<button id="effacer-miniature" type="button" style="display:none;">Effacer</button>
- 
 
 253 
					</fieldset>
- 
 
 254 
				</form>
- 
 
 255
- 
 
 256 
				<div>
- 
 
 257 
					<button id="ajouter-obs" type="button">Ajouter</button>
- 
 
 258 
				</div>
258 
		</div><!-- zone-fiche-terrain-photo -->
 259 
			</div><!-- zone-fiche-terrain-photo -->
259
260
260 
		<!-- Affiche le tableau récapitualif des observations ajoutées -->
 261 
			<!-- Affiche le tableau récapitualif des observations ajoutées -->
261 
		<div id="zone-liste-obs">
 262 
			<div id="zone-liste-obs">
262 
			<form action="#" >
 263 
				<form action="#" >
263 
				<fieldset id="partie-preview">
 264 
					<fieldset id="partie-preview">
264 
					<legend>Liste des observations à transmettre</legend>
 265 
						<legend>Liste des observations à transmettre</legend>
265 
					<table id="liste-obs">
 266 
						<table id="liste-obs">
266 
						<thead>
 267 
							<thead>
267 
							<tr>
 268 
								<tr>
268 
								<th>N&deg;</th>
 269 
									<th>N&deg;</th>
269 
								<th>Date</th>
 270 
									<th>Date</th>
270 
								<th>Adresse</th>
 271 
									<th>Adresse</th>
271 
								<th>Nom</th>
 272 
									<th>Nom</th>
272 
								<th>Milieu</th>
 273 
									<th>Milieu</th>
273 
								<th title="Latitude / Longitude">Lat./Long.</th>
 274 
									<th title="Latitude / Longitude">Lat./Long.</th>
274 
								<th>Photo</th>
 275 
									<th>Photo</th>
275 
								<th>Notes</th>
 276 
									<th>Notes</th>
276 
								<th></th>
 277 
									<th></th>
277 
							</tr>
 278 
								</tr>
278 
						</thead>
 279 
							</thead>
279 
						<tbody></tbody>
 280 
							<tbody></tbody>
280 
					</table>
 281 
						</table>
281 
					<button id="transmettre-obs" type="button">Transmettre</button>
 282 
						<button id="transmettre-obs" type="button">Transmettre</button>
282 
				</fieldset>
 283 
					</fieldset>
- 
 
 284 
				</form>
283 
			</form>
 285 
			</div> <!-- zone-liste-obs : wrap3 -->
284 
		</div> <!-- zone-liste-obs : wrap3 -->
 286 
		</div>
285
287
286 
		<!-- Messages d'erreur du formulaire-->
 288 
		<!-- Messages d'erreur du formulaire-->
287 
		<div id="dialogue-bloquer-copier-coller" style="display: none;" title="Information copier/coller">
 289 
		<div id="dialogue-bloquer-copier-coller" style="display: none;" title="Information copier/coller">
288 
			<p>
 290 
			<p>
289 
				Merci de ne pas copier/coller votre courriel.<br/>
 291 
				Merci de ne pas copier/coller votre courriel.<br/>
290 
				La double saisie permet de vérifier l'absence d'erreurs.
 292 
				La double saisie permet de vérifier l'absence d'erreurs.
291 
			</p>
 293 
			</p>
292 
		</div>
 294 
		</div>
293 
		<div id="dialogue-zero-obs" style="display: none;" title="Information aucune observation">
 295 
		<div id="dialogue-zero-obs" style="display: none;" title="Information aucune observation">
294 
			<p>Veuillez saisir des observations pour les transmettres.</p>
 296 
			<p>Veuillez saisir des observations pour les transmettres.</p>
295 
		</div>
 297 
		</div>
296 
		<div id="dialogue-form-invalide" style="display: none;" title="Validation du formulaire">
 298 
		<div id="dialogue-form-invalide" style="display: none;" title="Validation du formulaire">
297 
			<p>Certains champs n'ont pas été saisis correctement, veuillez vérifier les champs saisis.</p>
 299 
			<p>Certains champs n'ont pas été saisis correctement, veuillez vérifier les champs saisis.</p>
298 
		</div>
 300 
		</div>
299
301
300 
		<div id="dialogue-obs-transaction" style="display: none;" title="Transmission des observations"></div>
 302 
		<div id="dialogue-obs-transaction" style="display: none;" title="Transmission des observations"></div>
301
303
302 
		<div id="dialogue-google-map" style="display: none;" title="Information sur Google Map"></div>
 304 
		<div id="dialogue-google-map" style="display: none;" title="Information sur Google Map"></div>
303
305
304 
		<div id="dialogue-erreur" style="display: none;" title="Erreur"></div>
 306 
		<div id="dialogue-erreur" style="display: none;" title="Erreur"></div>
305
307
306 
		<div id="chargement" style="position:fixed;z-index:1000;top:0;left:0;height:100%;width:100%;background:#777;background:rgba(90,86,93,0.7);text-align:center;display:none;">
308 
		<div id="chargement" style="position:fixed;z-index:1000;top:0;left:0;height:100%;width:100%;background:#777;background:rgba(90,86,93,0.7);text-align:center;display:none;">
307 
			<div id="chargement-centrage" style="position:relative;width:30%;margin:0 auto;top:30%;">
 309 
			<div id="chargement-centrage" style="position:relative;width:30%;margin:0 auto;top:30%;">
308 
				<img id="chargement-img" src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif" alt="Transfert en cours..."/>
 310 
				<img id="chargement-img" src="<?=$url_base?>modules/saisie/squelettes/sauvages/images/chargement_arbre.gif" alt="Transfert en cours..."/>
309 
				<p id="chargement-txt" style="color:white;font-size:1.5em;">
 311 
				<p id="chargement-txt" style="color:white;font-size:1.5em;">
310 
					Transfert des observations en cours...<br />
 312 
					Transfert des observations en cours...<br />
311 
					Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre d'observation à transférer.
 313 
					Cela peut prendre plusieurs minutes en fonction de la taille des images et du nombre d'observation à transférer.
312 
				</p>
 314 
				</p>
313 
			</div>
 315 
			</div>
314 
		</div>
 316 
		</div>
315
317
316 
		<!-- Stats : Google Analytics-->
 318 
		<!-- Stats : Google Analytics-->
317 
		<script type="text/javascript">
 319 
		<script type="text/javascript">
318 
			//<![CDATA[
 320 
			//<![CDATA[
319 
			var _gaq = _gaq || [];
 321 
			var _gaq = _gaq || [];
320 
			_gaq.push(['_setAccount', 'UA-20092557-1']);
 322 
			_gaq.push(['_setAccount', 'UA-20092557-1']);
321 
			_gaq.push(['_trackPageview']);
 323 
			_gaq.push(['_trackPageview']);
322
324
323 
			(function() {
 325 
			(function() {
324 
			  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
 326 
			  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
325 
			  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
 327 
			  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
326 
			  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
 328 
			  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
327 
			})();
 329 
			})();
328 
			//]]>
 330 
			//]]>
329 
		</script>
 331 
		</script>
330 
	</body>
 332 
	</body>
331 
</html>
 333 
</html>