Subversion Repositories eFlore/Applications.cel

Rev

Rev 2366 | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 2366 Rev 2372
Line 21... Line 21...
21
		<!-- Google Map v3 -->
21
		<!-- Google Map v3 -->
22
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
22
		<!--<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>-->
23
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
23
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&amp;language=fr&amp;region=FR"></script>
Line 24... Line 24...
24
 
24
 
25
		<!-- Jquery -->
25
		<!-- Jquery -->
26
		<script src="http://resources.tela-botanica.org/jquery/1.7.1/jquery-1.7.1.min.js"></script>
26
		<script src="http://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
27
		<!-- Jquery UI : nécessaire pour le mini-calendrier et l'auto-complétion -->
27
		<!-- Jquery UI : nécessaire pour le mini-calendrier et l'auto-complétion -->
28
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/js/jquery-ui-1.8.18.custom.min.js"></script>
28
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
29
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/js/jquery.ui.datepicker-fr.js"></script>
29
		<script src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
30
		<!-- Jquery Plugins -->
30
		<!-- Jquery Plugins -->
31
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
31
		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
32
		<script src="http://resources.tela-botanica.org/jquery/validate/1.9.0/jquery.validate.min.js"></script>
32
		<script src="http://resources.tela-botanica.org/jquery/validate/1.13.0/jquery.validate.min.js"></script>
33
		<script src="http://resources.tela-botanica.org/jquery/validate/1.9.0/messages_fr.js"></script>
33
		<script src="http://resources.tela-botanica.org/jquery/validate/1.13.0/localization/messages_fr.js"></script>
34
		<!-- Jquery Form :nécessaire pour l'upload des images -->
34
		<!-- Jquery Form :nécessaire pour l'upload des images -->
Line 35... Line 35...
35
		<script src="http://resources.tela-botanica.org/jquery/form/2.95/jquery.form.min.js"></script>
35
		<script src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
36
 
36
 
37
		<!-- Bootstrap -->
37
		<!-- Bootstrap -->
38
		<script src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
38
		<script src="http://resources.tela-botanica.org/bootstrap/3.2.0/js/bootstrap.min.js"></script>
Line 39... Line 39...
39
		<script src="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/js/bootstrap-modalmanager.js"></script>
39
		<script src="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/js/bootstrap-modalmanager.js"></script>
40
		<script src="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/js/bootstrap-modal.js"></script>
40
		<script src="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/js/bootstrap-modal.js"></script>
Line 115... Line 115...
115
		//]]>
115
		//]]>
116
		</script>
116
		</script>
117
		<script src="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/js/arbres-tetards.js"></script>
117
		<script src="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/js/arbres-tetards.js"></script>
Line 118... Line 118...
118
 
118
 
119
		<!-- CSS -->
119
		<!-- CSS -->
-
 
120
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/jquery-ui.min.css" />
120
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" />
121
		<link rel="stylesheet" href="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/css/themes/smoothness/theme.css" />
121
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap.min.css" />
122
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap.min.css" />
122
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/2.3.2/css/bootstrap-responsive.min.css" />
123
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/3.2.0/css/bootstrap-theme.min.css" />
123
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/css/bootstrap-modal.css" />
124
		<link rel="stylesheet" href="http://resources.tela-botanica.org/bootstrap/modal/2.2.5/css/bootstrap-modal.css" />
Line 124... Line 125...
124
		<link rel="stylesheet" href="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/css/<?=isset($_GET['style']) ? $_GET['style'] : 'arbres-tetards'?>.css" />
125
		<link rel="stylesheet" href="<?=$url_base?>modules/saisie/squelettes/arbres-tetards/css/<?=isset($_GET['style']) ? $_GET['style'] : 'arbres-tetards'?>.css" />
Line 125... Line 126...
125
 
126
 
126
	</head>
127
	</head>
127
 
128
 
128
	<body data-spy="scroll">
-
 
129
		<div class="container">
129
	<body data-spy="scroll">
130
			<div class="row-fluid page-header">
130
		<div class="container">
131
				<div>
131
			<div class="page-header">
132
					<h1>
132
				<h1>
133
						<img id="logo-titre" class="span1" src="<?=$url_base?>/modules/saisie/squelettes/arbres-tetards/img/logos/gentiana.png" alt="Gentiana" />
-
 
134
						Arbres têtards de l'Isère
133
					<img id="logo-titre" src="<?=$url_base?>/modules/saisie/squelettes/arbres-tetards/img/logos/gentiana.png" alt="Gentiana" />
135
					</h1>
134
					 Arbres têtards de l'Isère
136
				</div>
135
				</h1>
137
			</div>
-
 
138
			<div class="row-fluid">
136
			</div>
139
				<div class="span6">
137
			<div class="row">
140
					<div class="row-fluid">
138
				<div class="col-md-6">
141
						<div id="intro" class ="well collapse in">
139
					<div id="intro" class="well well-lg">
142
							<a class="fermer" data-toggle="collapse" data-target="#intro">
140
						<a class="fermer" data-toggle="collapse" data-target="#intro-txt">
143
								<h3 class="titre">
141
							<h3 class="titre">
144
									Le projet
142
								Le projet
-
 
143
								<span class="glyphicon glyphicon-plus-sign"></span>
145
									<i class="icone icon-plus-sign"></i>
144
							</h3>
146
								</h3>
145
						</a>
147
							</a>
146
						<div id="intro-txt" class="collapse in">
148
							<p>
147
							<p>
149
								Les arbres têtards (trognes), sont des arbres taillés exploités depuis des siècles
148
								Les arbres têtards (trognes), sont des arbres taillés exploités depuis des siècles
Line 177... Line 176...
177
							</p>
176
							</p>
178
						</div>
177
						</div>
179
					</div>
178
					</div>
180
				</div>
179
				</div>
Line 181... Line 180...
181
 
180
 
182
				<div class="span6">
-
 
183
					<div class="row-fluid">
181
				<div class="col-md-6">
184
						<div id="aide" class="well collapse in">
182
					<div id="aide" class="well well-lg">
185
							<a class="fermer" data-toggle="collapse" data-target="#aide">
183
						<a class="fermer" data-toggle="collapse" data-target="#aide-txt">
186
								<h3 class="titre">
184
							<h3 class="titre">
187
									Aide
185
								Aide
188
									<i class="icone icon-plus-sign"></i>
186
								<span class="glyphicon glyphicon-plus-sign"></span>
189
								</h3>
187
							</h3>
-
 
188
						</a>
190
							</a>
189
						<div id="aide-txt" class="collapse in">
191
							<p>
190
							<p>
192
								Cet outil vous permet de partager simplement vos observations avec
191
								Cet outil vous permet de partager simplement vos observations avec
193
								<a href="http://www.gentiana.org/" target="_blank">Gentiana</a> et le
192
								<a href="http://www.gentiana.org/" target="_blank">Gentiana</a> et le
194
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
193
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a>
Line 205... Line 204...
205
									target="_blank"
204
									target="_blank"
206
									onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
205
									onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
207
									contactez-nous</a>
206
									contactez-nous</a>
208
							</p>
207
							</p>
209
							<p class="discretion">
208
							<p class="discretion">
210
								Une fois familiarisé avec l'interface vous pouvez cliquer sur ce bouton pour désactiver l'aide.
209
								Une fois familiarisé avec l'interface vous pouvez cliquer sur le bouton suivant pour désactiver l'aide&nbsp;:
211
								<button id="btn-aide" class="btn btn-mini btn-success">
210
								<button id="btn-aide" class="btn btn-xs btn-success">
212
									<span class="icon-question-sign icon-white"></span>
211
									<span class="glyphicon glyphicon-question-sign icon-white"></span>
213
									<span id="btn-aide-txt" >Désactiver l'aide</span>
212
									<span id="btn-aide-txt">Désactiver l'aide</span>
214
								</button>
213
								</button>
215
							</p>
214
							</p>
216
						</div>
215
						</div>
217
					</div>
216
					</div>
218
				</div>
217
				</div>
219
			</div>
218
			</div>
220
			<div class="row-fluid">
-
 
-
 
219
 
221
				<div class="well">
220
			<div class="well well-lg">
222
					<h2>Observateur</h2>
221
				<h2>Observateur</h2>
223
					<form id="form-observateur" action="#" class="" autocomplete="on">
222
				<form id="form-observateur" role="form" autocomplete="on">
224
						<div class="row-fluid">
223
					<div class="row">
225
							<div class="span6 control-group has-tooltip" data-placement="right"
224
						<div class="col-md-6 form-group has-tooltip" data-placement="right"
226
								title="Saisissez le courriel avec lequel vous être inscrit à Tela Botanica.
225
							title="Saisissez le courriel avec lequel vous être inscrit à Tela Botanica.
227
									Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
226
								Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
228
									ultérieurement. Des informations complémentaires vont vous être
227
								ultérieurement. Des informations complémentaires vont vous être
229
									demandées : prénom et nom.">
228
								demandées : prénom et nom.">
230
								<label for="courriel"  class="control-label"
-
 
231
									title="Veuillez saisir votre adresse courriel.">
229
							<label for="courriel"  title="Veuillez saisir votre adresse courriel.">
232
									<strong class="obligatoire">*</strong> Courriel
230
								<strong class="obligatoire">*</strong>
233
								</label>
231
								Courriel
234
								<div class="input-prepend">
232
							</label>
235
									<span class="add-on">
233
							<div class="input-group">
236
										<i class="icon-envelope"></i>
234
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
237
									</span>
-
 
238
									<input id="courriel" name="courriel" type="text"/>
235
								<input id="courriel" name="courriel" class="form-control" type="text"/>
239
									<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
236
								<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
240
								</div>
237
							</div>
241
							</div>
238
						</div>
242
							<div id="zone-courriel-confirmation" class="span6 control-group hidden">
239
						<div id="zone-courriel-confirmation" class="col-md-6 form-group has-feedback hidden">
243
								<label for="courriel_confirmation" class="control-label"
-
 
244
									title="Veuillez saisir confirmer le courriel.">
240
							<label for="courriel_confirmation" title="Veuillez saisir confirmer le courriel.">
245
									<strong class="obligatoire">*</strong> Courriel (confirmation)
241
								<strong class="obligatoire">*</strong> Courriel (confirmation)
246
								</label>
242
							</label>
247
								<div class="input-prepend">
243
							<div class="input-group">
248
									<span class="add-on">
-
 
249
										<i class="icon-envelope"></i>
244
								<span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span>
250
									</span>
-
 
251
									<input id="courriel_confirmation" name="courriel_confirmation" type="text"/>
245
								<input id="courriel_confirmation" name="courriel_confirmation" class="form-control" type="text"/>
252
								</div>
-
 
253
							</div>
246
							</div>
254
						</div>
247
						</div>
-
 
248
					</div>
255
						<div id="zone-prenom-nom" class="row-fluid hidden">
249
					<div id="zone-prenom-nom" class="row hidden">
256
							<div class="span6">
250
						<div class="col-md-6 form-group">
257
								<label for="prenom">Prénom</label>
251
							<label for="prenom">Prénom</label>
258
								<div>
-
 
259
									<input id="prenom" name="prenom" type="text"/>
-
 
260
								</div>
-
 
261
							</div>
-
 
262
							<div class="span6">
252
							<div class="input-group">
263
								<label for="nom">Nom</label>
253
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
264
								<div>
-
 
265
									<input id="nom" name="nom"  type="text"/>
254
								<input id="prenom" name="prenom" class="form-control" type="text"/>
266
								</div>
-
 
267
							</div>
255
							</div>
268
						</div>
256
						</div>
-
 
257
						<div class="col-md-6 form-group">
-
 
258
							<label for="nom">Nom</label>
-
 
259
							<div class="input-group">
-
 
260
								<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
-
 
261
								<input id="nom" name="nom" class="form-control" type="text"/>
-
 
262
							</div>
269
					</form>
263
						</div>
270
				</div>
264
					</div>
-
 
265
				</form>
271
			</div>
266
			</div>
-
 
267
 
272
			<!-- Messages d'erreur du formulaire-->
268
			<!-- Messages d'erreur du formulaire-->
273
			<div class="row">
269
			<div class="row">
274
				<div class="zone-alerte span6 offset3">
270
				<div class="zone-alerte col-md-6 col-md-offset-3">
275
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
271
					<div id="dialogue-bloquer-copier-coller" class="alert alert-info alert-block" style="display:none;">
276
						<a class="close">×</a>
272
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
277
						<h4 class="alert-heading">Information : copier/coller</h4>
273
						<h4 class="alert-heading">Information : copier/coller</h4>
278
						<p>
274
						<p>
279
							Merci de ne pas copier/coller votre courriel.<br/>
275
							Merci de ne pas copier/coller votre courriel.<br/>
280
							La double saisie permet de vérifier l'absence d'erreurs.
276
							La double saisie permet de vérifier l'absence d'erreurs.
281
						</p>
277
						</p>
282
					</div>
278
					</div>
283
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
279
					<div id="dialogue-courriel-introuvable" class="alert alert-info alert-block" style="display:none;">
284
						<a class="close">×</a>
280
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
285
						<h4 class="alert-heading">Information : courriel introuvable</h4>
281
						<h4 class="alert-heading">Information : courriel introuvable</h4>
286
						<p>
282
						<p>
287
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
283
							Vous n'êtes pas inscrit à Tela Botanica avec ce courriel.<br/>
288
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
284
							Veuillez compléter les champs supplémentaires ou indiquer votre courriel d'inscription.<br/>
289
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
285
							Pour retrouver vos observations dans le <a href="http://www.tela-botanica.org/appli:cel">Carnet en ligne</a>,
290
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
286
							il sera nécesaire de <a href="http://www.tela-botanica.org/page:inscription">vous inscrire à Tela Botanica</a>.
291
						</p>
287
						</p>
292
					</div>
288
					</div>
293
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
289
					<div id="dialogue-google-map" class="alert alert-info alert-block" style="display: none;">
294
						<a class="close">×</a>
290
						<button type="button" class="close"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
295
						<h4 class="alert-heading">Information sur Google Map</h4>
291
						<h4 class="alert-heading">Information sur Google Map</h4>
296
						<div class="contenu"></div>
292
						<div class="contenu"></div>
297
					</div>
293
					</div>
298
				</div>
294
				</div>
299
			</div>
295
			</div>
-
 
296
 
-
 
297
			<div class="well well-lg">
300
			<div class="row-fluid">
298
				<div class="row">
301
				<div class="span12">
299
					<div class="col-md-12">
-
 
300
						<h2>Lieu du relevé</h2>
-
 
301
					</div>
-
 
302
				</div>
302
					<div class="well">
303
				<div class="row">
303
						<div class="row-fluid">
304
					<div class="col-md-6">
304
							<div class="span12">
305
						<div class="row">
305
								<h2>Lieu du relevé</h2>
306
							<div class="col-md-3">
-
 
307
								<strong title="Veuillez localiser l'observation">Géolocalisation</strong>
306
							</div>
308
							</div>
307
						</div>
-
 
308
						<div class="row-fluid">
-
 
309
							<div class="span6">
-
 
310
								<div class="row-fluid">
309
							<div class="col-md-8 text-right">
311
									<div class="span4">
-
 
312
										<label for="map_canvas" title="Veuillez localiser l'observation">
310
								<form id="form-carte-recherche" class="form-horizontal" role="form">
313
											Géolocalisation
-
 
314
										</label>
-
 
315
									</div>
-
 
316
									<div class="span8 droite">
311
									<div class="form-group">
317
										<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
312
										<label for="carte-recherche" class="sr-only">Rechercher</label>
318
											<div class="control-group">
313
										<div class="input-group">
319
												<label for="carte-recherche">Rechercher</label>
-
 
320
												<input id="carte-recherche" class="search-query has-tooltip" type="text" value=""
314
											<input id="carte-recherche" class="form-control has-tooltip" type="search" value=""
321
													title="Permet de centrer la carte sur le lieu recherché."
315
													title="Permet de centrer la carte sur le lieu recherché."
322
													placeholder="Centrer la carte sur un lieu..."/>
316
													placeholder="Centrer la carte sur un lieu..."/>
323
											</div>
-
 
324
										</form>
-
 
325
									</div>
-
 
326
								</div>
-
 
327
								<div class="row-fluid">
-
 
328
									<div class="span12">
-
 
329
										<div id="map-canvas" class="has-tooltip"
-
 
330
											title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
317
											<span class="input-group-addon"><span class="glyphicon glyphicon-search"></span></span>
331
												représentant votre station ou bien le glisser-déposer sur
-
 
332
												le lieu souhaité."></div>
-
 
333
									</div>
318
										</div>
334
								</div>
-
 
335
								<div class="row-fluid">
-
 
336
									<div id="info-altitude" class="span5">
-
 
337
										<span for="marqueur-altitude">Altitude : </span>
-
 
338
										<span id="marqueur-altitude"><span id="altitude"></span> m</span>
-
 
339
									</div>
319
									</div>
-
 
320
								</form>
-
 
321
							</div>
-
 
322
						</div>
-
 
323
						<div class="row">
-
 
324
							<div class="col-md-12">
-
 
325
								<div id="map-canvas" class="has-tooltip"
-
 
326
									title="Vous pouvez cliquer sur la carte pour déplacer le marqueur
-
 
327
										représentant votre station ou bien le glisser-déposer sur
-
 
328
										le lieu souhaité."></div>
-
 
329
							</div>
-
 
330
						</div>
-
 
331
						<div class="row">
-
 
332
							<div id="info-altitude" class="col-md-5">
-
 
333
								<span>Altitude : </span>
-
 
334
								<span id="marqueur-altitude"><span id="altitude"></span> m</span>
-
 
335
							</div>
Line 340... Line 336...
340
 
336
 
341
									<div id="info-commune" class="span7">
337
							<div id="info-commune" class="col-md-7">
342
										<span for="marqueur-commune">Commune : </span>
338
								<span>Commune : </span>
343
										<span id="marqueur-commune">
339
								<span id="marqueur-commune">
344
											<span id="commune-nom" class="commune-info"></span>
340
									<span id="commune-nom" class="commune-info"></span>
345
											(<span id="commune-code-insee" class="commune-info has-tooltip"
341
									(<span id="commune-code-insee" class="commune-info has-tooltip"
346
												title="Code INSEE de la commune"></span>)
342
										title="Code INSEE de la commune"></span>)
347
										</span>
343
								</span>
-
 
344
							</div>
-
 
345
						</div>
-
 
346
					</div>
-
 
347
					<div class="col-md-6">
-
 
348
						<form id="form-station" class="form-horizontal" role="form" autocomplete="on">
-
 
349
							<div class="form-group has-tooltip"
-
 
350
								title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
-
 
351
								<label for="lieudit" class="col-sm-2 control-label">
-
 
352
									<strong class="obligatoire">*</strong>
-
 
353
									Lieu-dit
-
 
354
								</label>
-
 
355
								<div class="col-sm-10">
348
									</div>
356
									<input id="lieudit" name="lieudit" class="form-control" type="text" />
349
								</div>
357
								</div>
350
							</div>
-
 
351
							<div class="span6">
-
 
352
								<form id="form-station" action="#" enctype="multipart/form-data" autocomplete="on">
-
 
353
									<div class="row-fluid">
-
 
354
										<div class="span12 control-group has-tooltip"
-
 
355
											title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
-
 
356
											<label class="control-label">
-
 
357
												<strong class="obligatoire">*</strong>
-
 
358
												Lieu-dit
-
 
359
												<input type="text" id="lieudit" name="lieudit"/>
-
 
360
											</label>
-
 
361
										</div>
-
 
Line 362... Line -...
362
									</div>
-
 
363
 
358
							</div>
364
									<div class="row-fluid">
359
 
365
										<div class="span12 control-group has-tooltip"
360
							<div class="form-group has-tooltip"
366
											title="Sélectionnez une ou plusieurs situations correspondant au site.">
-
 
367
											<label class="span2 control-label">
-
 
368
												Situation(s)
361
								title="Sélectionnez une ou plusieurs situations correspondant au site.">
369
											</label>
-
 
370
											<div id="milieux-controls" class="controls">
362
								<label for="milieux[]"class="col-sm-2 control-label">Situation(s)</label>
371
												<div class="input-prepend">
363
								<div id="milieux-controls" class="col-sm-10">
372
													<div class="btn-group">
364
									<div class="btn-group dropdown">
373
														<button class="btn dropdown-toggle" data-toggle="dropdown">
365
										<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
374
															<i class="icon-globe"></i>
366
											<span class="glyphicon glyphicon-globe"></span>
375
															Sélectionner une ou plusieurs situations
367
											Sélectionner une ou plusieurs situations
376
															<span class="caret"></span>
368
											<span class="caret"></span>
-
 
369
										</button>
377
														</button>
370
										<ul class="dropdown-menu col-sm-12" role="menu" aria-labelledby="dLabel">
378
														<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
371
											<li class="checkbox" role="presentation">
379
															<li>
372
												<a role="menuitem">
380
																<label class="checkbox">
373
													<label>
381
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="séparation de parcelle"/>
374
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="séparation de parcelle"/>
382
																	Séparation de parcelle
375
														Séparation de parcelle
383
																</label>
376
													</label>
-
 
377
												</a>
384
															</li>
378
											</li>
-
 
379
											<li class="checkbox" role="presentation">
385
															<li>
380
												<a role="menuitem">
386
																<label class="checkbox">
381
													<label>
387
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="proximité de bâtiment"/>
382
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="proximité de bâtiment"/>
388
																	Proximité de bâtiment
383
														Proximité de bâtiment
389
																</label>
384
													</label>
-
 
385
												</a>
390
															</li>
386
											</li>
-
 
387
											<li class="checkbox" role="presentation">
391
															<li>
388
												<a role="menuitem">
392
																<label class="checkbox">
389
													<label>
393
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="plein champ"/>
390
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="plein champ"/>
394
																	Plein champ
391
														Plein champ
395
																</label>
392
													</label>
-
 
393
												</a>
396
															</li>
394
											</li>
-
 
395
											<li class="checkbox" role="presentation">
397
															<li>
396
												<a role="menuitem">
398
																<label class="checkbox">
397
													<label>
399
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="jardin de particulier"/>
398
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="jardin de particulier"/>
400
																	Jardin de particulier
399
														Jardin de particulier
401
																</label>
400
													</label>
-
 
401
												</a>
402
															</li>
402
											</li>
-
 
403
											<li class="checkbox" role="presentation">
403
															<li>
404
												<a role="menuitem">
404
																<label class="checkbox">
405
													<label>
405
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="bord de cours d'eau"/>
406
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="bord de cours d'eau"/>
406
																	Bord de cours d'eau
407
														Bord de cours d'eau
407
																</label>
408
													</label>
-
 
409
												</a>
408
															</li>
410
											</li>
-
 
411
											<li class="checkbox" role="presentation">
409
															<li>
412
												<a role="menuitem">
410
																<label class="checkbox">
413
													<label>
411
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="bord de chemin"/>
414
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="bord de chemin"/>
412
																	Bord de chemin
415
														Bord de chemin
413
																</label>
416
													</label>
-
 
417
												</a>
414
															</li>
418
											</li>
-
 
419
											<li class="checkbox" role="presentation">
415
															<li>
420
												<a role="menuitem">
416
																<label class="checkbox">
421
													<label>
417
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="intégré à une haie"/>
422
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="intégré à une haie"/>
418
																	Intégré à une haie
423
														Intégré à une haie
419
																</label>
424
													</label>
-
 
425
												</a>
420
															</li>
426
											</li>
-
 
427
											<li class="checkbox" role="presentation">
421
															<li>
428
												<a role="menuitem">
422
																<label class="checkbox">
429
													<label>
423
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="en forêt"/>
430
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="en forêt"/>
424
																	En forêt
431
														En forêt
425
																</label>
432
													</label>
-
 
433
												</a>
426
															</li>
434
											</li>
-
 
435
											<li class="checkbox" role="presentation">
427
															<li>
436
												<a role="menuitem">
428
																<label class="checkbox">
437
													<label>
429
																	<input name="milieux[]" class="cb-milieux" type="checkbox" value="en zone humide"/>
438
														<input name="milieux[]" class="cb-milieux" type="checkbox" value="en zone humide"/>
-
 
439
														En zone humide
430
																	En zone humide
440
													</label>
431
																</label>
441
												</a>
-
 
442
											</li>
-
 
443
										</ul>
-
 
444
									</div>
-
 
445
								</div>
-
 
446
							</div>
-
 
447
 
-
 
448
							<div class="row">
-
 
449
								<div class="col-md-12">
-
 
450
									<button class="afficher-coord btn-coord btn btn-default"
-
 
451
											data-toggle-text="Cacher les coordonnées (WGS 84 et Lambert 93)">
-
 
452
										Afficher les coordonnées (WGS 84 et Lambert 93)
-
 
453
									</button>
-
 
454
									<div id="coordonnees-geo" class="well hidden">
-
 
455
										<div class="row">
-
 
456
											<div class="col-md-4">
-
 
457
												<div id="coord-lat" class="form-group form-group-sm">
-
 
458
													<label for="latitude" class="col-sm-4 control-label">Latitude</label>
-
 
459
													<div class="col-sm-8">
432
															</li>
460
														<input id="latitude" class="form-control" name="latitude" type="text"
433
														</ul>
461
															title="Latitude (WGS 84)" value=""/>
434
													</div>
462
													</div>
435
												</div>
-
 
436
											</div>
-
 
437
										</div>
-
 
438
									</div>
-
 
439
 
-
 
440
									<div class="row-fluid">
-
 
441
										<label class="span12 control-label">
-
 
442
											<a href="#" class="afficher-coord btn">Afficher les coordonnées (WGS 84 et Lambert 93)</a>
-
 
443
											<a href="#" class="afficher-coord btn" style="display:none;">Cacher les coordonnées (WGS 84 et Lambert 93)</a>
-
 
444
										</label>
-
 
445
									</div>
463
												</div>
446
									<div id="coordonnees-geo" class="well" style="display:none;">
464
											</div>
447
										<div class="row-fluid">
-
 
448
											<div id="coord-lat" class="span4">
465
											<div class="col-md-5">
449
												<label>Latitude
-
 
450
													<input id="latitude" class="input-mini" name="latitude" type="text"
-
 
451
														title="Latitude (WGS 84)" value=""/>
-
 
452
												</label>
-
 
453
											</div>
466
												<div id="coord-lng" class="form-group form-group-sm">
454
											<div id="coord-lng" class="span4">
467
													<label for="latitude" class="col-sm-4 control-label">Longitude</label>
455
												<label>Longitude
468
													<div class="col-sm-8">
456
													<input id="longitude" class="input-mini" name="longitude" type="text"
-
 
457
														title="Longitude (WGS 84)" value=""/>
469
														<input id="longitude" class="form-control" name="longitude" type="text"
458
												</label>
-
 
459
											</div>
-
 
460
											<div class="span1">
-
 
461
												<input id="geolocaliser" type="button" value="Voir sur la carte"
-
 
462
													class="btn has-tooltip"
-
 
463
													title="Centre la carte sur les coordonnées de latitude et longitude saisies."/>
-
 
464
											</div>
-
 
465
										</div>
-
 
466
										<div class="row-fluid form-inline">
-
 
467
											<div id="coord-l93-x" class="span4">
-
 
468
												<label >X Lambert 93
-
 
469
													<input id="l93-x" disabled type="text" class="input-mini obs-chp-etendu"
-
 
470
															name="coordonneeLambert93X"
-
 
471
															data-label="Lambert 93 X"
-
 
472
															value=""/>
470
															title="Longitude (WGS 84)" value=""/>
473
												</label>
-
 
474
											</div>
-
 
475
											<div id="coord-l93-y" class="span4">
-
 
476
												<label>Y Lambert 93
-
 
477
													<input id="l93-y" disabled type="text" class="input-mini obs-chp-etendu"
-
 
478
															name="coordonneeLambert93Y"
-
 
479
															data-label="Lambert 93 Y"
-
 
480
															value=""/>
471
													</div>
481
												</label>
-
 
482
											</div>
-
 
483
										</div>
-
 
484
									</div>
-
 
485
								</form>
-
 
486
							</div>
-
 
487
						</div>
472
												</div>
488
 
-
 
489
						<div class="row-fluid">
473
											</div>
490
							<div class="span6">
-
 
491
								<form id="form-obs" class="form-horizontal" action="#" autocomplete="on">
474
											<div class="col-md-2">
492
									<h2>Arbre observé</h2>
-
 
493
									<input id="referentiel" type="hidden" value="bdtfx" />
-
 
494
 
475
												<div id="coord-lng" class="form-group form-group-sm">
495
									<div class="row-fluid">
476
													<input type="button" id="geolocaliser"
496
										<div class="span12 control-group has-tooltip"
-
 
497
												title="Vous pouvez cliquer sur l'icône de calendrier pour
-
 
498
													sélectionner une date dans un calendrier.">
-
 
499
											<label for="date"class="control-label"  title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
-
 
500
												<strong class="obligatoire">*</strong>
-
 
501
												Date du relevé
-
 
502
											</label>
477
														class="btn btn-default btn-sm has-tooltip"
503
											<div class="controls">
-
 
504
												<div class="input-prepend">
-
 
505
													<span id="date-icone" class="add-on"></span>
478
														title="Centre la carte sur les coordonnées de latitude et longitude saisies."
506
													<input id="date" name="date" type="text" placeholder="jj/mm/aaaa" />
479
														value="Voir sur la carte"/>
507
												</div>
480
												</div>
508
											</div>
-
 
Line 509... Line 481...
509
										</div>
481
											</div>
510
									</div>
482
										</div>
511
 
483
 
512
									<div class="row-fluid">
-
 
513
										<div class="span12">
-
 
514
											<div id="taxon-liste-input-groupe" class="control-group has-tooltip"
484
										<div class="row">
515
												title="Sélectionnez une espèce dans la liste déroulante par son nom latin
-
 
516
												ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
-
 
517
												<label for="taxon-liste" class="control-label" title="Choisissez l'espèce rencontrée.">
-
 
518
													<strong class="obligatoire">*</strong>
485
											<div class="col-md-6">
519
													Espèces
-
 
520
												</label>
-
 
521
												<div class="controls">
-
 
522
													<div class="input-prepend ">
-
 
523
														<span class="add-on">
-
 
524
															<i class="icon-leaf"></i>
-
 
525
														</span>
486
												<div id="coord-l93-x" class="form-group">
526
 
-
 
527
														<select id="taxon-liste" name="taxon-liste">
-
 
528
															<option value="" selected>Sélectionner une espèce</option>
-
 
529
 
-
 
530
															<optgroup id="taxon-liste-noms">
487
													<label for="l93-x" class="col-sm-6 control-label">X Lambert 93</label>
531
																<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
-
 
532
																	<option
-
 
533
																		class="<?=$taxon['nom_type'] ?>"
-
 
534
																		value="<?=$taxon['num_nom'] ?>"
-
 
535
																		title="<?=$taxon['nom_title'] ?>"
-
 
536
																		data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
-
 
537
																		>
488
													<div class="col-sm-5">
538
																		<?=$taxon['nom_a_afficher']?>
-
 
539
																	</option>
-
 
540
																<?php endforeach; ?>
-
 
541
															</optgroup>
-
 
542
															<optgroup id="taxon-liste-special">
-
 
543
																<?php foreach ($taxons['speciaux'] as $taxon) :?>
-
 
544
																	<option
-
 
545
																		class="<?=$taxon['nom_type'] ?>"
-
 
546
																		value="<?=$taxon['num_nom'] ?>"
-
 
547
																		title="<?=$taxon['nom_title'] ?>"
-
 
548
																		data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
489
														<input id="l93-x" disabled type="text" class="input-sm form-control obs-chp-etendu"
549
																		>
-
 
550
																		<?=$taxon['nom_a_afficher']?>
-
 
551
																	</option>
-
 
552
																<?php endforeach; ?>
-
 
553
																<option value="?">Autre espèce</option>
490
																name="coordonneeLambert93X"
554
															</optgroup>
491
																data-label="Lambert 93 X"
555
														</select>
492
																value=""/>
556
													</div>
-
 
557
												</div>
-
 
558
											</div>
-
 
559
										</div>
493
													</div>
560
									</div>
494
												</div>
561
									<div id="taxon-input-groupe" class="row-fluid hidden">
495
											</div>
562
										<div class="span12">
496
											<div class="col-md-6">
563
											<div class="control-group has-tooltip"
497
												<div id="coord-l93-y" class="form-group">
564
												title="Sélectionnez une espèce dans la liste déroulante pour lier
498
													<label for="l93-y" class="col-sm-6 control-label">Y Lambert 93</label>
565
													votre nom au référentiel. Si vous le désirez vous pouvez aussi saisir
499
													<div class="col-sm-5">
566
													un nom absent du référentiel (Ex. : 'fleur violette' ou 'Viola sp.1')." >
500
														<input id="l93-y" disabled type="text" class="input-sm form-control obs-chp-etendu"
567
												<label for="taxon" class="control-label" title="Choisissez l'espèce rencontrée.">
501
																name="coordonneeLambert93Y"
568
													<strong class="obligatoire">*</strong>
-
 
569
													Autre espèce
-
 
570
												</label>
-
 
571
												<div class="controls">
-
 
572
													<input id="taxon" name="taxon" type="text" class="span12"
502
																data-label="Lambert 93 Y"
573
														placeholder="Autre espèce (ou indication sur la plante)"
503
																value=""/>
574
														value="<?= $nom_sci_espece_defaut; ?>" />
504
													</div>
575
												</div>
505
												</div>
-
 
506
											</div>
-
 
507
										</div>
-
 
508
									</div>
-
 
509
								</div>
-
 
510
							</div>
Line 576... Line 511...
576
											</div>
511
						</form>
577
										</div>
512
					</div>
578
									</div>
513
				</div>
579
 
-
 
580
									<div class="row-fluid">
514
 
581
										<div class="span12 control-group has-tooltip"
515
				<div class="row">
582
												title="Indiquez la certitude de votre détermination.">
-
 
-
 
516
					<div class="col-md-6">
583
											<label for="certitude" class="control-label">
517
						<form id="form-obs" class="form-horizontal" role="form" autocomplete="on">
584
												<strong class="obligatoire">*</strong>
518
							<h2>Arbre observé</h2>
585
												Identification de l'arbre
519
							<input id="referentiel" type="hidden" value="bdtfx" />
586
											</label>
520
 
587
											<div class="controls">
521
							<div class="form-group has-tooltip"
588
												<select id="certitude" class="span12" name="certitude">
522
									title="Vous pouvez cliquer sur l'icône de calendrier pour
589
													<option selected value="">Sélectionnez une certitude</option>
523
										sélectionner une date dans un calendrier.">
590
													<option value="certaine">Certaine</option>
524
								<label for="date" class=" col-sm-4 control-label"
591
													<option value="douteuse">Douteuse</option>
525
									   title="Veuillez indiquer la date du relevé au format jj/mm/aaaa">
-
 
526
									<strong class="obligatoire">*</strong>
-
 
527
									Date du relevé
-
 
528
								</label>
592
													<option value="A déterminer">À déterminer</option>
529
								<div class="col-sm-8">
-
 
530
									<div class="input-group">
-
 
531
										<span id="date-icone" class="input-group-addon"></span>
Line 593... Line 532...
593
												</select>
532
										<input id="date" name="date" class="form-control" type="text" placeholder="jj/mm/aaaa" />
594
											</div>
533
									</div>
595
										</div>
534
								</div>
596
									</div>
535
							</div>
597
 
536
 
598
									<div class="row-fluid">
537
							<div id="taxon-liste-input-groupe" class="form-group has-tooltip"
599
										<div class="span12 control-group has-tooltip"
538
								title="Sélectionnez une espèce dans la liste déroulante par son nom latin
600
												title="Indiquez le type de formation de l'arbre ou des arbres têtards.">
539
								ou commun. Si une espèce est absente, sélectionner «Autre espèce»." >
601
											<label for="formation" class="control-label">
-
 
602
												<strong class="obligatoire">*</strong>
-
 
603
												Formation
-
 
604
											</label>
-
 
605
											<div class="controls">
-
 
606
												<select id="formation" class="span12 obs-chp-etendu"
-
 
607
														name="arbreTetardFormation"
-
 
608
														data-label="Type de formation">
-
 
609
													<option selected value="">Sélectionnez une formation</option>
-
 
610
													<option value="alignement">Arbres d'alignement</option>
-
 
611
													<option value="isolé">Arbre isolé</option>
-
 
612
												</select>
540
								<label for="taxon-liste" class="col-sm-4 control-label" title="Choisissez l'espèce rencontrée.">
613
											</div>
541
									<strong class="obligatoire">*</strong>
614
										</div>
-
 
615
									</div>
-
 
616
									<div id="aligne-nbre-groupe" class="row-fluid form-inline hidden">
542
									Espèces
617
										<div class="span12">
-
 
618
											<div class="control-group has-tooltip"
-
 
619
												title="Indiquez le nombre d'arbres têtards alignés." >
-
 
620
												<label for="aligne-nbre" class="control-label">
-
 
621
													<strong class="obligatoire">*</strong>
-
 
622
													Nombre d'arbres
-
 
623
												</label>
-
 
624
												<div class="controls">
-
 
625
													<input id="aligne-nbre" type="number" class="span2 obs-chp-etendu"
-
 
626
														name="arbreTetardAligneNbre"
543
								</label>
627
														data-label="Nombre d'arbres d'alignement"
-
 
Line 628... Line -...
628
														value="" />
-
 
629
												</div>
-
 
630
											</div>
-
 
631
										</div>
-
 
632
									</div>
-
 
633
 
-
 
634
									<div class="row-fluid">
-
 
635
										<div class="span12 control-group has-tooltip"
544
								<div class="col-sm-8">
636
												title="Indiquez si des cavités sont présentes sur l'arbre.">
-
 
637
											<label for="cavites" class="control-label">
-
 
638
												Cavités
-
 
639
											</label>
-
 
640
											<div class="controls">
545
									<div class="input-group">
641
												<select id="cavites" class="span12 obs-chp-etendu"
-
 
642
														name="arbreTetardPresenceCavite"
-
 
643
														data-label="Présence de cavités">
-
 
644
													<option selected value="">Sélectionnez la présence de cavités</option>
-
 
645
													<option value="aucune">Aucune</option>
-
 
Line 646... Line 546...
646
													<option value="petite">Oui, petite(s)</option>
546
										<span class="input-group-addon">
-
 
547
											<span class="glyphicon glyphicon-leaf"></span>
-
 
548
										</span>
647
													<option value="grande">Oui, grande(s)</option>
549
 
-
 
550
										<select id="taxon-liste" name="taxon-liste" class="form-control">
648
												</select>
551
											<option value="" selected>Sélectionner une espèce</option>
649
											</div>
552
 
-
 
553
											<optgroup id="taxon-liste-noms">
-
 
554
												<?php foreach ($taxons['sci-et-fr'] as $taxon) :?>
650
										</div>
555
													<option
-
 
556
														class="<?=$taxon['nom_type'] ?>"
651
									</div>
557
														value="<?=$taxon['num_nom'] ?>"
652
 
558
														title="<?=$taxon['nom_title'] ?>"
653
									<div class="row-fluid">
559
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
654
										<div class="span12 control-group has-tooltip"
560
														>
655
												title="Indiquez la circonférence à 1m du sol.">
561
														<?=$taxon['nom_a_afficher']?>
656
											<label for="circonference" class="control-label">
562
													</option>
657
												Circonférence
563
												<?php endforeach; ?>
658
											</label>
564
											</optgroup>
-
 
565
											<optgroup id="taxon-liste-special">
659
											<div class="controls">
566
												<?php foreach ($taxons['speciaux'] as $taxon) :?>
660
												<select id="circonference" class="span12 obs-chp-etendu"
567
													<option
661
														name="arbreTetardCirconferenceA1m"
568
														class="<?=$taxon['nom_type'] ?>"
-
 
569
														value="<?=$taxon['num_nom'] ?>"
662
														data-label="Circonférence à 1 m du sol">
570
														title="<?=$taxon['nom_title'] ?>"
663
													<option selected value="">Sélectionnez la circonférence (à 1m du sol)</option>
571
														data-nom-a-sauver="<?=$taxon['nom_a_sauver'] ?>"
664
													<option value="0-0,5">0 à 0,5m</option>
572
														>
-
 
573
														<?=$taxon['nom_a_afficher']?>
-
 
574
													</option>
Line 665... Line 575...
665
													<option value="0,5-2">0,5 à 2m</option>
575
												<?php endforeach; ?>
666
													<option value="2-3">2 à 3m</option>
576
												<option value="?">Autre espèce</option>
-
 
577
											</optgroup>
667
													<option value="+3">&gt; à 3m</option>
578
										</select>
-
 
579
									</div>
668
												</select>
580
								</div>
669
											</div>
581
							</div>
670
										</div>
582
 
671
									</div>
583
							<div id="taxon-input-groupe" class="form-group has-tooltip hidden"
672
 
584
								title="Sélectionnez une espèce dans la liste déroulante pour lier
673
									<div class="row-fluid">
585
									votre nom au référentiel. Si vous le désirez vous pouvez aussi saisir
674
										<div class="span12 control-group has-tooltip"
586
									un nom absent du référentiel (Ex. : 'fleur violette' ou 'Viola sp.1')." >
675
												title="Indiquez la hauteur de la tête.">
-
 
676
											<label for="hauteur-tete" class="control-label">
-
 
677
												Hauteur de la tête
-
 
678
											</label>
-
 
679
											<div class="controls">
-
 
680
												<select id="hauteur-tete" class="span12 obs-chp-etendu"
-
 
681
														name="arbreTetardHauteurTete"
587
								<label for="taxon" class="col-sm-4 control-label" title="Choisissez l'espèce rencontrée.">
682
														data-label="Hauteur de la tête">
588
									<strong class="obligatoire">*</strong>
Line 683... Line 589...
683
													<option selected value="">Sélectionnez la hauteur</option>
589
									Autre espèce
684
													<option value="0-1,5">0 à 1,5m</option>
590
								</label>
685
													<option value="1,5-3">1,5 à 3m</option>
591
								<div class="col-sm-8">
-
 
592
									<input id="taxon" name="taxon" type="text" class="form-control"
-
 
593
										placeholder="Autre espèce (ou indication sur la plante)"
686
													<option value="+3">&gt; à 3m</option>
594
										value="<?= $nom_sci_espece_defaut; ?>" />
687
												</select>
595
								</div>
688
											</div>
596
							</div>
689
										</div>
597
 
690
									</div>
598
							<div class="form-group has-tooltip"
691
 
599
									title="Indiquez la certitude de votre détermination.">
692
									<div class="row-fluid">
600
								<label for="certitude" class="col-sm-4 control-label">
693
										<div class="span12">
601
									<strong class="obligatoire">*</strong>
694
											<label for="presence-sp">Espèces présentes sur l'arbre (végétale ou animale)</label>
602
									Identification de l'arbre
695
											<div>
603
								</label>
696
												<textarea id="presence-sp" class="span12 obs-chp-etendu" rows="7"
-
 
697
													name="arbreTetardPresenceSp"
-
 
698
													data-label="Présence d'espèces sur l'arbre"
-
 
699
													placeholder="Vous pouvez éventuellement indiquez des informations du type : Champignons ; Lierre ; Mousses ; Lichens ; Autre plante... Larve d'insecte saproxylique ; Galerie dans le bois ; Pelote de réjection ; Nid ; Crotte ; Trou"></textarea>
-
 
700
											</div>
-
 
701
										</div>
-
 
702
									</div>
-
 
703
								</form>
-
 
704
							</div>
-
 
705
							<div class="span6">
-
 
706
								<form id="form-gestion" class="form-horizontal" action="#" autocomplete="on">
-
 
707
									<h2>Gestion de l'arbre</h2>
-
 
708
 
-
 
709
									<div class="row-fluid">
-
 
710
										<div class="span12 control-group has-tooltip"
-
 
711
												title="Indiquez le type de taille de l'arbre.">
-
 
712
											<label for="taille-type" class="control-label">
-
 
713
												Type de taille
-
 
714
											</label>
-
 
715
											<div class="controls">
-
 
716
												<select id="taille-type" class="span12 obs-chp-etendu"
-
 
717
														name="arbreTetardTailleType"
-
 
718
														data-label="Type de taille">
-
 
Line 719... Line -...
719
													<option selected value="">Sélectionnez le type de taille</option>
-
 
720
													<option value="trogne">Trogne</option>
604
								<div class="col-sm-8">
721
													<option value="tête de chat">Tête de chat</option>
605
									<select id="certitude" class="form-control" name="certitude">
722
													<option value="émonde">Émonde</option>
606
										<option selected value="">Sélectionnez une certitude</option>
-
 
607
										<option value="certaine">Certaine</option>
723
													<option value="autre">Autre, précisez le type de taille dans les notes</option>
608
										<option value="douteuse">Douteuse</option>
724
												</select>
609
										<option value="A déterminer">À déterminer</option>
725
											</div>
610
									</select>
726
										</div>
611
								</div>
727
									</div>
612
							</div>
728
 
613
 
729
									<div class="row-fluid">
614
							<div class="form-group has-tooltip"
730
										<div class="span12 control-group has-tooltip"
615
									title="Indiquez le type de formation de l'arbre ou des arbres têtards.">
731
												title="Indiquez le type d’entretien de l'arbre, en précisant la périodicité des coupes.">
-
 
732
											<label for="entretient" class="control-label">
616
								<label for="formation" class="col-sm-4 control-label">
733
												Type d'entretient
617
									<strong class="obligatoire">*</strong>
734
											</label>
-
 
735
											<div class="controls">
618
									Formation
736
												<select id="entretient" class="span12 obs-chp-etendu"
619
								</label>
Line 737... Line -...
737
														name="arbreTetardEntretientCoupe"
-
 
738
														data-label="Type d'entretient">
620
								<div class="col-sm-8 select-container">
739
													<option selected value="">Sélectionnez la périodicité des coupes d'entretient</option>
621
									<select id="formation" class="form-control obs-chp-etendu"
740
													<option value="récente">Coupe récente (< 5 ans ; branches de diamètre < 10cm)</option>
622
											name="arbreTetardFormation"
-
 
623
											data-label="Type de formation">
741
													<option value="ancienne">Ancienne (5 à 10 ans ; diamètre des branches entre 10 et 15 cm )</option>
624
										<option selected value="">Sélectionnez une formation</option>
742
													<option value="non entretenu">Non entretenu ( diamètre des branches > 15 cm)</option>
625
										<option value="alignement">Arbres d'alignement</option>
743
												</select>
626
										<option value="isolé">Arbre isolé</option>
744
											</div>
627
									</select>
745
										</div>
628
								</div>
746
									</div>
629
							</div>
747
 
-
 
748
									<div class="row-fluid">
-
 
749
										<div class="span12 control-group has-tooltip"
-
 
750
												title="Indiquez l'état sanitaire de l'arbre têtard.">
630
 
751
											<label for="etat-sanitaire" class="control-label">
631
							<div id="aligne-nbre-groupe" class="form-group has-tooltip hidden"
752
												État sanitaire
-
 
753
											</label>
632
								title="Indiquez le nombre d'arbres têtards alignés." >
754
											<div class="controls">
633
								<label for="aligne-nbre" class="col-sm-4 control-label">
755
												<select id="etat-sanitaire" class="span12 obs-chp-etendu"
-
 
Line -... Line 634...
-
 
634
									<strong class="obligatoire">*</strong>
-
 
635
									Nombre d'arbres
-
 
636
								</label>
756
														name="arbreTetardEtatSanitaire"
637
								<div class="col-sm-4">
757
														data-label="État sanitaire">
638
									<input id="aligne-nbre" type="number" class="form-control obs-chp-etendu"
-
 
639
										min="2"
758
													<option selected value="">Sélectionnez l'état sanitaire</option>
640
										name="arbreTetardAligneNbre"
-
 
641
										data-label="Nombre d'arbres d'alignement"
-
 
642
										value="" />
759
													<option value="mort">Mort</option>
643
								</div>
-
 
644
							</div>
-
 
645
 
-
 
646
							<div class="form-group has-tooltip"
-
 
647
									title="Indiquez si des cavités sont présentes sur l'arbre.">
760
													<option value="dépérissant">Dépérissant</option>
648
								<label for="cavites" class="col-sm-4 control-label">
-
 
649
									Cavités
Line -... Line 650...
-
 
650
								</label>
761
													<option value="bon">Bon état général</option>
651
								<div class="col-sm-8">
762
												</select>
652
									<select id="cavites" class="form-control obs-chp-etendu"
-
 
653
											name="arbreTetardPresenceCavite"
763
											</div>
654
											data-label="Présence de cavités">
764
										</div>
655
										<option selected value="">Sélectionnez la présence de cavités</option>
765
									</div>
656
										<option value="aucune">Aucune</option>
766
								</form>
657
										<option value="petite">Oui, petite(s)</option>
-
 
658
										<option value="grande">Oui, grande(s)</option>
767
 
659
									</select>
768
								<div>
660
								</div>
769
									<h2>Notes</h2>
661
							</div>
770
									<textarea id="notes" form="form-obs" class="span12" rows="7" name="notes"
662
 
771
										placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation"></textarea>
663
							<div class="form-group has-tooltip"
772
								</div>
664
									title="Indiquez la circonférence à 1m du sol.">
773
 
665
								<label for="circonference" class="col-sm-4 control-label">
774
								<form id="form-upload" class="form-horizontal" action="<?= $url_ws_upload ?>?projet=<?=isset($_GET['projet']) ? $_GET['projet'] : 'defaut'?>"
666
									Circonférence
775
									method="post" enctype="multipart/form-data">
-
 
Line -... Line 667...
-
 
667
								</label>
-
 
668
								<div class="col-sm-8">
-
 
669
									<select id="circonference" class="form-control obs-chp-etendu"
-
 
670
											name="arbreTetardCirconferenceA1m"
-
 
671
											data-label="Circonférence à 1 m du sol">
776
									<h2>Image(s) de l'arbre</h2>
672
										<option selected value="">Sélectionnez la circonférence (à 1m du sol)</option>
-
 
673
										<option value="0-0,5">0 à 0,5m</option>
-
 
674
										<option value="0,5-2">0,5 à 2m</option>
-
 
675
										<option value="2-3">2 à 3m</option>
-
 
676
										<option value="+3">&gt; à 3m</option>
-
 
677
									</select>
-
 
678
								</div>
-
 
679
							</div>
-
 
680
 
-
 
681
							<div class="form-group has-tooltip"
-
 
682
									title="Indiquez la hauteur de la tête.">
Line -... Line 683...
-
 
683
								<label for="hauteur-tete" class="col-sm-4 control-label">
-
 
684
									Hauteur de la tête
-
 
685
								</label>
-
 
686
								<div class="col-sm-8">
-
 
687
									<select id="hauteur-tete" class="form-control obs-chp-etendu"
-
 
688
											name="arbreTetardHauteurTete"
-
 
689
											data-label="Hauteur de la tête">
-
 
690
										<option selected value="">Sélectionnez la hauteur</option>
777
									<strong>Ajouter une image</strong>
691
										<option value="0-1,5">0 à 1,5m</option>
-
 
692
										<option value="1,5-3">1,5 à 3m</option>
-
 
693
										<option value="+3">&gt; à 3m</option>
Line 778... Line 694...
778
									<p class="miniature-info" class="discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
694
									</select>
-
 
695
								</div>
-
 
696
							</div>
-
 
697
 
779
									<div id ="photos-conteneur">
698
							<div class="form-group">
780
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
699
								<label for="presence-sp" class="col-sm-12 control-label">Espèces présentes sur l'arbre (végétale ou animale)</label>
-
 
700
								<div class="col-sm-12">
-
 
701
									<textarea id="presence-sp" class="form-control obs-chp-etendu" rows="7"
-
 
702
										name="arbreTetardPresenceSp"
-
 
703
										data-label="Présence d'espèces sur l'arbre"
-
 
704
										placeholder="Vous pouvez éventuellement indiquez des informations du type : Champignons ; Lierre ; Mousses ; Lichens ; Autre plante... Larve d'insecte saproxylique ; Galerie dans le bois ; Pelote de réjection ; Nid ; Crotte ; Trou"></textarea>
-
 
705
								</div>
-
 
706
							</div>
-
 
707
						</form>
-
 
708
					</div>
781
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
709
 
-
 
710
					<div class="col-md-6">
-
 
711
						<form id="form-gestion" class="form-horizontal" role="form" autocomplete="on">
-
 
712
							<h2>Gestion de l'arbre</h2>
-
 
713
 
-
 
714
							<div class="form-group has-tooltip"
-
 
715
									title="Indiquez le type de taille de l'arbre.">
-
 
716
								<label for="taille-type" class="col-sm-4 control-label">
-
 
717
									Type de taille
-
 
718
								</label>
-
 
719
								<div class="col-sm-8">
-
 
720
									<select id="taille-type" class="form-control obs-chp-etendu"
-
 
721
											name="arbreTetardTailleType"
782
										<div id="miniatures">
722
											data-label="Type de taille">
-
 
723
										<option selected value="">Sélectionnez le type de taille</option>
-
 
724
										<option value="trogne">Trogne</option>
-
 
725
										<option value="tête de chat">Tête de chat</option>
-
 
726
										<option value="émonde">Émonde</option>
-
 
727
										<option value="autre">Autre, précisez le type de taille dans les notes</option>
-
 
728
									</select>
-
 
729
								</div>
-
 
730
							</div>
-
 
731
 
-
 
732
							<div class="form-group has-tooltip"
-
 
733
									title="Indiquez le type d’entretient de l'arbre, en précisant la périodicité des coupes.">
-
 
734
								<label for="entretient" class="col-sm-4 control-label">
-
 
735
									Type d'entretient
-
 
736
								</label>
783
										</div>
737
								<div class="col-sm-8">
-
 
738
									<select id="entretient" class="form-control obs-chp-etendu"
-
 
739
											name="arbreTetardEntretientCoupe"
-
 
740
											data-label="Type d'entretient">
-
 
741
										<option selected value="">Sélectionnez la périodicité des coupes d'entretient</option>
-
 
742
										<option value="récente">Coupe récente (< 5 ans ; branches de diamètre < 10cm)</option>
-
 
743
										<option value="ancienne">Ancienne (5 à 10 ans ; diamètre des branches entre 10 et 15 cm )</option>
-
 
744
										<option value="non entretenu">Non entretenu ( diamètre des branches > 15 cm)</option>
-
 
745
									</select>
-
 
746
								</div>
784
										<p class="miniature-msg" class="span12">&nbsp;</p>
747
							</div>
-
 
748
 
-
 
749
							<div class="form-group has-tooltip"
-
 
750
									title="Indiquez l'état sanitaire de l'arbre têtard.">
-
 
751
								<label for="etat-sanitaire" class="col-sm-4 control-label">
-
 
752
									État sanitaire
-
 
753
								</label>
-
 
754
								<div class="col-sm-8">
-
 
755
									<select id="etat-sanitaire" class="form-control obs-chp-etendu"
785
									</div>
756
											name="arbreTetardEtatSanitaire"
786
								</form>
757
											data-label="État sanitaire">
-
 
758
										<option selected value="">Sélectionnez l'état sanitaire</option>
-
 
759
										<option value="mort">Mort</option>
-
 
760
										<option value="dépérissant">Dépérissant</option>
-
 
761
										<option value="bon">Bon état général</option>
-
 
762
									</select>
-
 
763
								</div>
-
 
764
							</div>
-
 
765
						</form>
-
 
766
 
-
 
767
						<div class="row">
-
 
768
							<div class="col-md-12">
-
 
769
								<h2>Notes</h2>
-
 
770
								<textarea id="notes" form="form-obs" class="form-control col-md-12" rows="7" name="notes"
-
 
771
									placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation"></textarea>
-
 
772
							</div>
-
 
773
						</div>
-
 
774
 
-
 
775
						<div class="row">
-
 
776
							<form id="form-upload" class="form form-horizontal" role="form" action="<?= $url_ws_upload ?>"
-
 
777
								method="post" enctype="multipart/form-data">
-
 
778
								<div class="col-md-12">
-
 
779
									<h2>Image(s) de l'arbre</h2>
-
 
780
									<strong>Ajouter une image</strong>
-
 
781
									<p class="miniature-info discretion help-inline">Les photos doivent être au format JPEG et ne doivent pas excéder 5Mo chacunes.</p>
-
 
782
									<div id ="photos-conteneur" class="form-group">
-
 
783
										<div class="col-sm-12">
-
 
784
											<input type="file" id="fichier" name="fichier" class="form-control" accept="image/jpeg" />
-
 
785
											<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
-
 
786
										</div>
787
							</div>
787
										<div id="miniatures"></div>
788
						</div>
788
										<p class="miniature-msg col-md-12">&nbsp;</p>
789
 
789
									</div>
Line 790... Line 790...
790
						<div class="row-fluid">
790
								</div>
791
 
791
							</form>
792
						</div>
792
						</div>
793
 
793
					</div>
794
						<div class="row-fluid">
794
				</div>
795
							<div class="span12 centre has-tooltip"
795
 
796
								title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
796
				<div class="row">
797
									ajouter votre observation à la liste à transmettre.">
797
					<div class="col-md-12 centre has-tooltip"
798
								<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
798
						title="Une fois les champs remplis, vous pouvez cliquer sur ce bouton pour
799
									Créer
799
							ajouter votre observation à la liste à transmettre.">
800
								</button>
800
						<button id="ajouter-obs" class="btn btn-primary btn-large" type="button">
801
							</div>
801
							Créer
802
						</div>
802
						</button>
803
					</div>
803
					</div>
804
				</div>
804
				</div>
805
			</div>
805
			</div>
806
 
806
 
807
			<!-- Messages d'erreur du formulaire-->
807
			<!-- Messages d'erreur du formulaire-->
Line 827... Line 827...
827
					</div>
827
					</div>
828
				</div>
828
				</div>
829
			</div>
829
			</div>
Line 830... Line 830...
830
 
830
 
831
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
831
			<!-- Affiche le tableau récapitulatif des observations ajoutées -->
832
			<div id="zone-liste-obs" class="row-fluid">
832
			<div id="zone-liste-obs" class="row">
833
				<div class="span12">
833
				<div class="col-md-12">
834
					<div class="well">
834
					<div class="well well-lg">
835
						<div class="row-fluid">
835
						<div class="row">
836
							<div class="span8">
836
							<div class="col-md-8">
837
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
837
								<h2>Observations à transmettre : <span class="obs-nbre">0</span></h2>
838
							</div>
838
							</div>
839
							<div class="span4 droite">
839
							<div class="col-md-4 text-right">
840
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
840
								<button id="transmettre-obs" class="btn btn-primary btn-large has-tooltip"
841
									type="button" disabled="disabled"
841
									type="button" disabled="disabled"
842
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
842
									title="Ajoute les observations ci-dessous à votre Carnet en Ligne et les rend publiques.">
843
									Transmettre
843
									Transmettre
844
								</button>
844
								</button>
845
							</div>
845
							</div>
846
						</div>
846
						</div>
847
						<div id="liste-obs" ></div>
847
						<div id="liste-obs" ></div>
848
						<div class="row">
848
						<div class="row">
849
							<div class="zone-alerte span6 offset3">
849
							<div class="zone-alerte col-md-6 col-md-offset-3">
850
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
850
								<div id="dialogue-zero-obs" class="alert alert-block" style="display: none;">
851
									<a class="close">×</a>
851
									<a class="close">×</a>
852
									<h4 class="alert-heading">Attention : aucune observation</h4>
852
									<h4 class="alert-heading">Attention : aucune observation</h4>
853
									<p>Veuillez saisir des observations pour les transmettres.</p>
853
									<p>Veuillez saisir des observations pour les transmettres.</p>
Line 869... Line 869...
869
 
869
 
870
					</div>
870
					</div>
871
				</div>
871
				</div>
Line 872... Line 872...
872
			</div>
872
			</div>
873
 
873
 
874
			<footer class="row-fluid">
874
			<footer class="row">
Line 875... Line 875...
875
				<p class="span12">&copy; Tela Botanica 2014</p>
875
				<p class="col-md-12">&copy; Tela Botanica 2014</p>
876
			</footer>
876
			</footer>
877
 
877