Subversion Repositories eFlore/Applications.cel

Rev

Rev 2864 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 2864 Rev 2865
Line 145... Line 145...
145
	</head>
145
	</head>
Line 146... Line 146...
146
 
146
 
147
	<body data-spy="scroll">
147
	<body data-spy="scroll">
148
		<div class="container">
148
		<div class="container">
149
			<div class="row-fluid">
149
			<div class="row-fluid">
150
				<div class="span6 page-header">
150
				<div class="span12 page-header">
151
					<div class="row">
151
					<div class="row">
152
						<div class="span6">
152
						<div class="span12">
153
							<h1>
153
							<h1>
154
								<?php if($logo != 'defaut' && $logo != '0') { ?>
154
								<?php if($logo != 'defaut' && $logo != '0') { ?>
155
									<img id="logo-titre" class="span1" src="<?= $logo ?>" alt="Logo" />
155
									<img id="logo-titre" class="span1" src="<?= $logo ?>" alt="Logo" />
156
								<?php } else if($logo == 'defaut') { ?>
156
								<?php } else if($logo == 'defaut') { ?>
Line 162... Line 162...
162
									Ajout rapide d'observations
162
									Ajout rapide d'observations
163
								<?php } ?>
163
								<?php } ?>
164
							</h1>
164
							</h1>
165
						</div>
165
						</div>
166
					</div>
166
					</div>
-
 
167
				</div>
-
 
168
			</div>
-
 
169
			<div class="row-fluid">
-
 
170
				<div class="span12">
167
					<div class="row">
171
					<div class="row">
168
						<div class="span6">
172
						<div class="span12">
169
							<p>
173
							<p>
170
								Cet outil vous permet de partager simplement vos observations avec le
174
								Cet outil vous permet de partager simplement vos observations avec le
171
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a> (sous <a href="http://www.tela-botanica.org/page:licence?langue=fr">licence CC-BY-SA</a>).
175
								<a href="http://www.tela-botanica.org/site:accueil">réseau Tela Botanica</a> (sous <a href="http://www.tela-botanica.org/page:licence?langue=fr">licence CC-BY-SA</a>).
172
								Identifiez-vous bien pour ensuite retrouver et gérer vos données dans
176
								Identifiez-vous bien pour ensuite retrouver et gérer vos données dans
173
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
177
								<a href="http://www.tela-botanica.org/appli:cel">votre Carnet en ligne</a>.
Line 190... Line 194...
190
								</button>
194
								</button>
191
							</p>
195
							</p>
192
						</div>
196
						</div>
193
					</div>
197
					</div>
194
				</div>
198
				</div>
-
 
199
			</div>
195
 
200
				
-
 
201
			<div class="row-fluid">
-
 
202
				<div class="span6">
-
 
203
					<div class="well">
-
 
204
						Zone du schéma
-
 
205
					</div>
-
 
206
				</div>
196
				<div class="span6">
207
				<div class="span6">
197
					<div class="well">
208
					<div class="well">
198
						<h2>Observateur</h2>
209
						<h2>Observateur</h2>
199
						<form id="form-observateur" action="#" class="" autocomplete="on">
210
						<form id="form-observateur" action="#" class="" autocomplete="on">
200
							<div class="row-fluid">
211
							<div class="row-fluid">
Line 202... Line 213...
202
									title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
213
									title="Saisissez le courriel avec lequel vous êtes inscrit à Tela Botanica.
203
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
214
										Si vous n'êtes pas inscrit, ce n'est pas grave, vous pourrez le faire
204
										ultérieurement. Des informations complémentaires vont vous être
215
										ultérieurement. Des informations complémentaires vont vous être
205
										demandées : prénom et nom.">
216
										demandées : prénom et nom.">
206
									<label for="courriel"
217
									<label for="courriel"
-
 
218
										class="pointer"
207
										title="Veuillez saisir votre adresse courriel.">
219
										title="Veuillez saisir votre adresse courriel.">
208
										<strong class="obligatoire">*</strong> Courriel
220
										<strong class="obligatoire">*</strong> Courriel
209
									</label>
221
									</label>
210
									<div class="input-prepend">
222
									<div class="input-prepend">
211
										<span class="add-on">
223
										<span class="add-on">
Line 283... Line 295...
283
									<div class="row-fluid">
295
									<div class="row-fluid">
284
										<!-- DATE-->
296
										<!-- DATE-->
285
										<h2>Date du relevé</h2>
297
										<h2>Date du relevé</h2>
286
										<div class="span12 control-group">
298
										<div class="span12 control-group">
287
											<form id="form-date" action="#" autocomplete="on">
299
											<form id="form-date" action="#" autocomplete="on">
288
												<label for="date" class="has-tooltip"
300
												<label for="date" class="has-tooltip pointer"
289
													title="Veuillez indiquer la date du relevé au format jj/mm/aaaa. Vous pouvez
301
													title="Veuillez indiquer la date du relevé au format jj/mm/aaaa. Vous pouvez
290
													cliquer sur l'icône de calendrier pour sélectionner une date">
302
													cliquer sur l'icône de calendrier pour sélectionner une date">
291
													<strong class="obligatoire">*</strong>
303
													<strong class="obligatoire">*</strong>
292
													Date du relevé
304
													Date du relevé
293
												</label>
305
												</label>
Line 312... Line 324...
312
											<label class="has-tooltip" 
324
											<label class="has-tooltip" 
313
											title="Vous pouvez sélectionner un type de culture parmi la liste ou en saisir un manuellement via l'option Autres">
325
											title="Vous pouvez sélectionner un type de culture parmi la liste ou en saisir un manuellement via l'option Autres">
314
												Type de culture
326
												Type de culture
315
											</label>
327
											</label>
316
											<!-- Céréale -->										
328
											<!-- Céréale -->										
317
											<label for="culture-cereale-radio" class="radio culture">
329
											<label for="culture-cereale-radio" class="radio culture pointer">
318
												<input type="radio" id="culture-cereale-radio" name="type-culture" value="cereale" data-titre="céréale" />
330
												<input type="radio" id="culture-cereale-radio" name="type-culture" value="cereale" data-titre="céréale" />
319
												Céréale
331
												Céréale
320
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
332
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
321
												</i>
333
												</i>
322
											</label>
334
											</label>
Line 324... Line 336...
324
												<h5>Céréale</h5>
336
												<h5>Céréale</h5>
325
												Une description du champ de céréales<br/>
337
												Une description du champ de céréales<br/>
326
												...
338
												...
327
											</div>
339
											</div>
328
											<!-- Friche -->										
340
											<!-- Friche -->										
329
											<label for="culture-friche-radio" class="radio culture">
341
											<label for="culture-friche-radio" class="radio culture pointer">
330
												<input type="radio" id="culture-friche-radio" name="type-culture" value="friche" data-titre="friche" />
342
												<input type="radio" id="culture-friche-radio" name="type-culture" value="friche" data-titre="friche" />
331
												Friche
343
												Friche
332
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
344
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
333
												</i>
345
												</i>
334
											</label>
346
											</label>
Line 336... Line 348...
336
												<h5>Friche</h5>
348
												<h5>Friche</h5>
337
												Une description du champ de Friche<br/>
349
												Une description du champ de Friche<br/>
338
												...
350
												...
339
											</div>
351
											</div>
340
											<!-- Légumineuse -->										
352
											<!-- Légumineuse -->										
341
											<label for="culture-legumineuse-radio" class="radio culture">
353
											<label for="culture-legumineuse-radio" class="radio culture pointer">
342
												<input type="radio" id="culture-legumineuse-radio" name="type-culture" value="legumineuse" data-titre="légumineuse" />
354
												<input type="radio" id="culture-legumineuse-radio" name="type-culture" value="legumineuse" data-titre="légumineuse" />
343
												Légumineuse
355
												Légumineuse
344
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
356
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
345
												</i>
357
												</i>
346
											</label>
358
											</label>
Line 348... Line 360...
348
												<h5>Légumineuse</h5>
360
												<h5>Légumineuse</h5>
349
												Une description du champ de Légumineuse<br/>
361
												Une description du champ de Légumineuse<br/>
350
												...
362
												...
351
											</div>
363
											</div>
352
											<!-- Vigne -->										
364
											<!-- Vigne -->										
353
											<label for="culture-vigne-radio" class="radio culture">
365
											<label for="culture-vigne-radio" class="radio culture pointer">
354
												<input type="radio" id="culture-vigne-radio" name="type-culture" value="vigne" data-titre="vigne" />
366
												<input type="radio" id="culture-vigne-radio" name="type-culture" value="vigne" data-titre="vigne" />
355
												Vigne
367
												Vigne
356
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
368
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
357
												</i>
369
												</i>
358
											</label>
370
											</label>
Line 360... Line 372...
360
												<h5>Vigne</h5>
372
												<h5>Vigne</h5>
361
												Une description du champ de Vigne<br/>
373
												Une description du champ de Vigne<br/>
362
												...
374
												...
363
											</div>
375
											</div>
364
											<!-- Verger -->										
376
											<!-- Verger -->										
365
											<label for="culture-verger-radio" class="radio culture">
377
											<label for="culture-verger-radio" class="radio culture pointer">
366
												<input type="radio" id="culture-verger-radio" name="type-culture" value="verger" data-titre="verger" />
378
												<input type="radio" id="culture-verger-radio" name="type-culture" value="verger" data-titre="verger" />
367
												Verger
379
												Verger
368
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
380
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
369
												</i>
381
												</i>
370
											</label>
382
											</label>
Line 372... Line 384...
372
												<h5>Verger</h5>
384
												<h5>Verger</h5>
373
												Une description du champ de Verger<br/>
385
												Une description du champ de Verger<br/>
374
												...
386
												...
375
											</div>
387
											</div>
376
											<!-- Autres -->										
388
											<!-- Autres -->										
377
											<label for="culture-autres-radio" class="radio culture">
389
											<label for="culture-autres-radio" class="radio culture pointer">
378
												<input type="radio" id="culture-autres-radio" name="type-culture" value="autres" data-titre="autres" />
390
												<input type="radio" id="culture-autres-radio" name="type-culture" value="autres" data-titre="autres" />
379
												Autres
391
												Autres
380
												<input type="text" id="culture-autres-input" name="culture-autres" style="display: none;" />
392
												<input type="text" id="culture-autres-input" name="culture-autres" style="display: none;" />
381
											</label>
393
											</label>
382
										</div>
394
										</div>
Line 386... Line 398...
386
												<h2>Géolocalisation</h2>
398
												<h2>Géolocalisation</h2>
387
											</div>
399
											</div>
388
											<div class="span8 droite">
400
											<div class="span8 droite">
389
												<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
401
												<form id="form-carte-recherche" class="form-search form-horizontal" action="#" >
390
													<div class="control-group">
402
													<div class="control-group">
391
														<label for="carte-recherche">Rechercher</label>
403
														<label for="carte-recherche" class="pointer">Rechercher</label>
392
														<input id="carte-recherche" class="search-query has-tooltip" type="text" value=""
404
														<input id="carte-recherche" class="search-query has-tooltip" type="text" value=""
393
															title="Permet de centrer la carte sur le lieu recherché."
405
															title="Permet de centrer la carte sur le lieu recherché."
394
															placeholder="Ex: France, Paris, Rue de Rivoli..."/>
406
															placeholder="Ex: France, Paris, Rue de Rivoli..."/>
395
													</div>
407
													</div>
396
												</form>
408
												</form>
Line 427... Line 439...
427
										<!-- Formulaire Station -->
439
										<!-- Formulaire Station -->
428
										<form id="form-station" class="control-group" action="#" enctype="multipart/form-data" autocomplete="on">
440
										<form id="form-station" class="control-group" action="#" enctype="multipart/form-data" autocomplete="on">
429
											<div id="coordonnees-geo" class="well" style="display:none;">
441
											<div id="coordonnees-geo" class="well" style="display:none;">
430
												<div class="row-fluid form-inline">
442
												<div class="row-fluid form-inline">
431
													<div id="coord-lat" class="span4">
443
													<div id="coord-lat" class="span4">
432
														<label for="latitude">Latitude</label>
444
														<label for="latitude" class="pointer">Latitude</label>
433
														<div>
445
														<div>
434
															<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
446
															<input id="latitude" class="input-mini" name="latitude" type="text" value=""/>
435
														</div>
447
														</div>
436
													</div>
448
													</div>
437
													<div id="coord-lng" class="span4">
449
													<div id="coord-lng" class="span4">
438
														<label for="longitude">Longitude</label>
450
														<label for="longitude" class="pointer">Longitude</label>
439
														<div>
451
														<div>
440
															<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
452
															<input id="longitude" class="input-mini" name="longitude" type="text" value=""/>
441
														</div>
453
														</div>
442
													</div>
454
													</div>
443
													<div class="span1">
455
													<div class="span1">
Line 450... Line 462...
450
												</div>
462
												</div>
451
											</div>
463
											</div>
452
											<div class="row-fluid">
464
											<div class="row-fluid">
453
												<div class="span4 has-tooltip"
465
												<div class="span4 has-tooltip"
454
													title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
466
													title="Toponyme plus précis que la commune, utilisé localement et se trouvant souvent sur les cartes au 1/25 000." >
455
													<label for="lieudit">Lieu-dit</label>
467
													<label for="lieudit" class="pointer">Lieu-dit</label>
456
													<div>
468
													<div>
457
														<input type="text" id="lieudit" class="span2" name="lieudit"/>
469
														<input type="text" id="lieudit" class="span2" name="lieudit"/>
458
													</div>
470
													</div>
459
												</div>
471
												</div>
460
												<div class="span4 has-tooltip"
472
												<div class="span4 has-tooltip"
461
													title="Lieu précis de l'observation définissant une unité écologique homogène (ex: le pré derrière la maison)." >
473
													title="Lieu précis de l'observation définissant une unité écologique homogène (ex: le pré derrière la maison)." >
462
													<label for="station">Station</label>
474
													<label for="station" class="pointer">Station</label>
463
													<div>
475
													<div>
464
														<input type="text" id="station" class="span2" name="station"/>
476
														<input type="text" id="station" class="span2" name="station"/>
465
													</div>
477
													</div>
466
												</div>
478
												</div>
467
												<div class="span4 has-tooltip"
479
												<div class="span4 has-tooltip"
468
													title="Type d'habitat plus ou moins standardisé dans les codes Corine ou Catminat (ex: prairie humide).">
480
													title="Type d'habitat plus ou moins standardisé dans les codes Corine ou Catminat (ex: prairie humide).">
469
													<label for="milieu">Milieu</label>
481
													<label for="milieu" class="pointer">Milieu</label>
470
													<div>
482
													<div>
471
														<input type="text" id="milieu" class="span2" name="milieu" />
483
														<input type="text" id="milieu" class="span2" name="milieu" />
472
													</div>
484
													</div>
473
												</div>
485
												</div>
474
											</div>
486
											</div>
Line 580... Line 592...
580
									<div class="row-fluid">
592
									<div class="row-fluid">
581
										<div class="span12 control-group">
593
										<div class="span12 control-group">
582
											<strong class="obligatoire">*</strong>
594
											<strong class="obligatoire">*</strong>
583
											Zone du champ
595
											Zone du champ
584
											<!-- Bordure -->										
596
											<!-- Bordure -->										
585
											<label for="bordure" class="checkbox">
597
											<label for="bordure" class="checkbox pointer">
586
												<input type="checkbox" id="bordure" name="zone-champ[]" value="bordure" data-titre="bordure" />
598
												<input type="checkbox" id="bordure" name="zone-champ[]" value="bordure" data-titre="bordure" />
587
												Bordure
599
												Bordure
588
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
600
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
589
												</i>
601
												</i>
590
											</label>
602
											</label>
Line 592... Line 604...
592
												<h5>Bordure</h5>
604
												<h5>Bordure</h5>
593
												Une description de la zone Bordure<br/>
605
												Une description de la zone Bordure<br/>
594
												...
606
												...
595
											</div>
607
											</div>
596
											<!-- Cœur du champ -->										
608
											<!-- Cœur du champ -->										
597
											<label for="coeur-champ" class="checkbox">
609
											<label for="coeur-champ" class="checkbox pointer">
598
												<input type="checkbox" id="coeur-champ" name="zone-champ[]" value="coeur" data-titre="cœur" />
610
												<input type="checkbox" id="coeur-champ" name="zone-champ[]" value="coeur" data-titre="cœur" />
599
												Cœur du champ
611
												Cœur du champ
600
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
612
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
601
												</i>
613
												</i>
602
											</label>
614
											</label>
Line 604... Line 616...
604
												<h5>Cœur du champ</h5>
616
												<h5>Cœur du champ</h5>
605
												Une description de la zone Cœur du champ<br/>
617
												Une description de la zone Cœur du champ<br/>
606
												...
618
												...
607
											</div>
619
											</div>
608
											<!-- Zone délaissée -->										
620
											<!-- Zone délaissée -->										
609
											<label for="zone-delaissee" class="checkbox">
621
											<label for="zone-delaissee" class="checkbox pointer">
610
												<input type="checkbox" id="zone-delaissee" name="zone-champ[]" value="zone-delaissee" data-titre="zone délaissée" />
622
												<input type="checkbox" id="zone-delaissee" name="zone-champ[]" value="zone-delaissee" data-titre="zone délaissée" />
611
												Zone délaissée
623
												Zone délaissée
612
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
624
												<i class="icon-question-sign cursor-pointer" data-toggle="popover" data-trigger="hover">
613
												</i>
625
												</i>
614
											</label>
626
											</label>
Line 619... Line 631...
619
											</div>
631
											</div>
620
										</div>
632
										</div>
621
									</div>
633
									</div>
622
									<div class="row-fluid">
634
									<div class="row-fluid">
623
										<div class="span12">
635
										<div class="span12">
624
											<label for="notes">Notes</label>
636
											<label for="notes" class="pointer">Notes</label>
625
											<div>
637
											<div>
626
												<textarea id="notes" class="span6" rows="7" name="notes"
638
												<textarea id="notes" class="span6" rows="7" name="notes"
627
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
639
													placeholder="vous pouvez éventuellement ajouter des informations complémentaires à votre observation (altitude, taille de la plante...)"></textarea>
628
											</div>
640
											</div>
629
										</div>
641
										</div>
Line 642... Line 654...
642
											<br>
654
											<br>
643
											Veuillez ajouter au moins une image.
655
											Veuillez ajouter au moins une image.
644
										</p>
656
										</p>
645
									</div>
657
									</div>
646
									<div id ="photos-conteneur">
658
									<div id ="photos-conteneur">
647
										<input type="file" id="fichier" name="fichier" accept="image/jpeg" />
659
										<input type="file" class="pointer" id="fichier" name="fichier" accept="image/jpeg" />
648
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
660
										<input type="hidden" name="MAX_FILE_SIZE" value="5242880"/>
649
										<div id="miniatures">
661
										<div id="miniatures">
650
										</div>
662
										</div>
651
										<p class="miniature-msg" class="span12">&nbsp;</p>
663
										<p class="miniature-msg" class="span12">&nbsp;</p>
652
									</div>
664
									</div>