Subversion Repositories eFlore/Applications.cel

Rev

Rev 3163 | Rev 3208 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
3120 delphine 1
<!DOCTYPE html>
2
<html xmlns="http://www.w3.org/1999/xhtml">
3
  <head>
4
	<title><?= $widget['titre']; ?></title>
5
 
6
	<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
7
	<meta http-equiv="Content-style-type" content="text/css" />
8
	<meta http-equiv="Content-script-type" content="text/javascript" />
9
	<meta http-equiv="Content-language" content="fr" />
10
 
11
	<meta name="revisit-after" content="15 days" />
12
    <meta name="robots" content="index,follow" />
13
    <meta name="author" content="Tela Botanica" />
14
    <meta name="keywords" content="Tela Botanica, CEL" />
15
    <meta name="description" content="Gestion des widgets de saisie du carnet en ligne" />
16
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
17
 
18
	<!-- OpenGraph pour Facebook, Pinterest, Google+ -->
19
	<meta property="og:type" content="website" />
3204 delphine 20
	<meta property="og:title" content="Widgets de saisie du CeL" />
3120 delphine 21
	<meta property="og:site_name" content="Tela Botanica" />
3204 delphine 22
	<meta property="og:description" content="Widgets de saisie du Carnet en Ligne" />
3120 delphine 23
	<meta property="og:image" content="http://resources.tela-botanica.org/tb/img/256x256/carre_englobant.png" />
24
	<meta property="og:image:type" content="image/png" />
25
	<meta property="og:image:width" content="256" />
26
	<meta property="og:image:height" content="256" />
27
	<meta property="og:locale" content="fr_FR" />
28
 
29
	<!-- Favicones -->
30
	<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
31
 
32
	<!-- Jquery -->
3204 delphine 33
 
3163 delphine 34
	<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.1.js"></script>
3120 delphine 35
	<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
36
	<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
37
	<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script>
38
	<!-- Jquery Plugins -->
39
	<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
40
	<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
41
	<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
42
	<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
43
	<!-- Jquery Form :nécessaire pour l'upload des images -->
44
	<script type="text/javascript" src="http://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
45
	<!-- Bootstrap -->
46
	<script type="text/javascript" src="http://resources.tela-botanica.org/bootstrap/2.3.2/js/bootstrap.min.js"></script>
47
 
48
	<script type="text/javascript" src="<?=$url_base?>modules/saisie2/squelettes/js/WidgetSaisie.js"></script>
3204 delphine 49
	<script type="text/javascript" src="<?=$url_base?>modules/saisie2/squelettes/js/auth.js"></script>
3120 delphine 50
	<script type="text/javascript">
51
		//<![CDATA[
52
           $(document).ready(function() {
53
				// OMG un modèle objet !!
54
				var widget = new WidgetSaisie();
55
 
56
				// langue
57
				widget.langue = "<?= $widget['langue']; ?>";
58
				// Squelette d'URL du web service de l'annuaire.
59
				widget.serviceAnnuaireIdUrl = "<?=$url_ws_annuaire?>";
60
				// URL de l'icône du chargement en cours
61
				widget.chargementIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement.gif";
62
				// URL de l'icône du chargement en cours d'une image
63
				widget.chargementImageIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/chargement-image.gif";
64
				// URL de l'icône du calendrier
65
				widget.calendrierIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/calendrier.png";
66
				// URL de l'icône pour une photo manquante
67
				widget.pasDePhotoIconeUrl = "<?=$url_base?>modules/saisie/squelettes/defaut/img/icones/pasdephoto.png";
68
 
69
				// Code du référentiel utilisé pour les nom scientifiques.
70
				widget.nomSciReferentiel = "<?= strtolower($widget['referentiel']); ?>";
71
				// Indication de la présence d'une espèce imposée
72
				widget.especeImposee = "<?=$espece_imposee; ?>";
73
				// Tableau d'informations sur l'espèce imposée
74
				widget.infosEspeceImposee = "<?=$infos_espece; ?>";
75
				// Nombre d'élément dans les listes d'auto-complétion
76
				widget.autocompletionElementsNbre = 20;
77
				// Indication de la présence d'un référentiel imposé
78
				widget.referentielImpose = "<?=$referentiel_impose; ?>";
79
				// URL du web service permettant l'auto-complétion des noms scientifiques
80
				widget.serviceAutocompletionNomSciUrl = "<?= $widget['especes']['url_ws_autocompletion_ns']; ?>?"+
81
					"masque={masque}&"+
82
					"recherche=etendue&"+
83
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
84
					"ns.structure=au"+"&"+
85
					"navigation.limite=" + widget.autocompletionElementsNbre;
86
				// Squelette d'URL du web service permettant l'auto-complétion des noms scientifiques
87
				widget.serviceAutocompletionNomSciUrlTpl = "<?= $widget['especes']['url_ws_autocompletion_ns_tpl']; ?>?"+
88
					"masque={masque}&"+
89
					"recherche=etendue&"+
90
					"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
91
					"retour.tri=alpharet&"+ // tri "à la CeL"
92
					"ns.structure=au"+"&"+
93
					"navigation.limite=" + widget.autocompletionElementsNbre;
94
 
95
 
96
				// Initialisation du bousin
97
				widget.init();
98
			});
99
		//]]>
100
	</script>
101
	<!-- Barre de navigation -->
102
	<?php if ($bar !== false): ?>
103
		<script src="<?=$url_script_navigation?>"></script>
104
	<?php endif; ?>
105
 
106
 
107
	<!-- CSS -->
108
	<link href="http://www.tela-botanica.org/commun/jquery/jquery-ui/1.8.18/css/smoothness/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css" media="screen" />
109
	<!-- <link href="http://www.tela-botanica.org/commun/bootstrap/2.0.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" /> -->
110
	<link rel="stylesheet" type="text/css" href="<?=$url_base?>modules/saisie2/squelettes/css/bootstrap-4/css/bootstrap.min.css" />
111
	<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
112
	<!--  <link id="telabotanica-style-css" rel="stylesheet" href="https://beta.tela-botanica.org/preprod/wp-content/themes/telabotanica/dist/bundle.css?ver=4.7.5" type="text/css" media="all">
113
	--><link href="<?= $url_base; ?>modules/saisie2/squelettes/css/saisie.css" rel="stylesheet" type="text/css" media="screen" />
114
	<!--  Google Analytics -->
115
	<?php if($prod): ?>
116
		<?php include "analytics.html"; ?>
117
	<?php endif; ?>
3204 delphine 118
	<link rel="icon" type="image/x-icon" href="favicon.ico">
119
	<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
3120 delphine 120
  </head>
121
 
122
  <body>
123
		<div id="zone-appli" class="container">
124
		<?php if ($bar !== false): ?>
125
			<div id="tb-navigation" data-courant="widget-cel-saisie" data-squelette="bootstrap4" data-mode="prod">
126
			</div>
127
			<br/>
128
		<?php endif; ?>
129
		<div class="layout-wrapper page">
130
			<div class="media">
131
				<?= '<img class="d-flex mr-3" src="'.$widget['logo'].'" alt="'.$widget['projet'].'" >';?>
132
				<div class="media-body">
133
					<h1 class="mt-0">
134
						<?= $widget['titre']; ?>
135
					</h1>
136
				</div>
137
			</div>
138
			<div class="row align-items-center">
139
				<div class="col-md-6">
140
					<div id="description"><?= $widget['description']; ?></div>
141
				</div>
142
				<div class="col-md-6">
143
					<div id="aide" class="well well-lg hidden-sm-down">
144
						<h3><?= $aide['titre']; ?></h3>
145
						<div id="aide-txt" class="hiden-sm-down">
146
							<p>
3204 delphine 147
								<?= $aide['description']; ?>
3120 delphine 148
							</p>
149
							<p class="discretion">
3204 delphine 150
								<?= $aide['contact']; ?>
3120 delphine 151
								<a href="<?= $url_remarques ?>?service=cel&pageSource=<?php echo urlencode('http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']); ?>"
152
									target="_blank"
153
									onclick="javascript:window.open(this.getAttribute('href'), 'Tela Botanica - Remarques', config='height=700, width=640, scrollbars=yes, resizable=yes'); return false;">
3204 delphine 154
									<?= $aide['contact2']; ?></a>
3120 delphine 155
							</p>
156
						</div>
157
					</div>
158
				</div>
159
			</div>
160
			<div id="formulaire">
161
				<form id="form-observateur" role="form" autocomplete="on">
3204 delphine 162
					<h2><?= $observateur['titre']; ?>
163
						<!--la partie tb-navigation vient du widget stats http://svn.tela-botanica.net/websvn/filedetails.php?repname=eFlore%2FApplications.cel&path=%2Ftrunk%2Fwidget%2Fmodules%2Fstats%2Fsquelettes%2Fstats_utilisateur.tpl.html
164
							la partie contenu-souce vient de http://svn.tela-botanica.net/websvn/filedetails.php?repname=Applications.reseau&path=%2Ftrunk%2Fwidget%2Fmodules%2Fnavigation%2Fsquelettes%2Fbootstrap3.tpl.php
165
							le javascript auth.js vient de http://svn.tela-botanica.net/websvn/filedetails.php?repname=Applications.reseau&path=%2Ftrunk%2Fresources%2Fjs%2Fnavigation.js
166
							de l'aide dans la partie Intégration dans l'interface (applications AJAX) de https://www.tela-botanica.org/wikini/DevInformatiques/wakka.php?wiki=MemoIntegrationSSO
167
						<div id="tb-navigation" data-courant="widget-cel-stats" data-squelette="bootstrap3" data-mode="prod">
168
						 <form class="navbar-form navbar-left">
169
                                <?php if ($utilisateur_authentifie): ?>
170
                                        <button class="btn btn-default" disabled><?=$utilisateur?></button>
171
                                        <a id="mode-stats" class="btn btn-success" href="?mode=defaut" data-mode-courant="utilisateur">Statistiques globales</a>
172
                                <?php else: ?>
173
                                        <a id="mode-stats" class="btn btn-success" href="?mode=utilisateur" data-mode-courant="defaut">Statistiques personnelles</a>
174
                                <?php endif; ?>
175
                                </form>
176
						</div>
177
						  <div id="contenu-source">
178
                                <!-- ici le contenu du div #tb-navigation de la page appelante -->
179
                        <!--</div>-->
180
						<ul class="nav navbar-nav navbar-right">
181
                                <li id="bouton-connexion" class="dropdown">
182
                                        <a href="<?= $authTpl; ?>">Connexion</a>
183
                                </li>
184
                                <li class="dropdown" id="utilisateur-connecte" style="display: none;">
185
                                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span id="nom-complet"></span> <b class="caret"></b></a>
186
                                        <ul class="dropdown-menu">
187
                                                <li id="profil-utilisateur"><a href="http://www.tela-botanica.org/inscription">Mon profil</a></li>
188
                                                <li id="deconnexion"><a href="http://www.tela-botanica.org/widget:reseau:auth?action=deconnexion&origine=">Déconnexion</a></li>
189
                                        </ul>
190
                                </li>
191
                        </ul>
192
                    </h2>
3120 delphine 193
					<div id="zone-courriel" class="row align-items-center">
194
						<div class="col-md-6 form-inline">
195
							<label for="courriel" class="col-sm-3" title="<?= $observateur['courriel-title']; ?>">
3163 delphine 196
								<strong class="obligatoire">* </strong>
3120 delphine 197
								<?= $observateur['courriel']; ?>
198
							</label>
199
							<div class="col-sm-8 mb-2 input-group">
200
								<span class="input-group-addon hidden-xs-down"><span class="fa fa-envelope"></span></span>
201
								<input id="courriel" name="courriel" class="form-control" type="email" title="<?= $observateur['courriel-title']; ?> "/>
202
								<input id="id_utilisateur" name="id_utilisateur" type="hidden"/>
203
							</div>
204
						</div>
205
						<div id="zone-courriel-confirmation" class="col-md-6 form-inline" style="display:none;">
206
							<label for="courriel_confirmation" class="col-sm-3" title="Veuillez confirmer le courriel.">
207
								<strong class="obligatoire">*</strong> Courriel (confirmation)
208
							</label>
209
							<div class="col-sm-8 input-group">
210
								<span class="input-group-addon hidden-xs-down"><span class="fa fa-envelope"></span></span>
211
								<input id="courriel_confirmation" name="courriel_confirmation" class="form-control" type="email"/>
212
							</div>
213
						</div>
214
					</div>
215
					<div id="zone-prenom-nom" class="row align-items-center" style="display:none;">
216
						<div class="col-md-6 form-inline">
217
							<label for="prenom" class="col-sm-3"><?= $observateur['prenom']; ?></label>
218
							<div class="input-group col-sm-8">
219
								<span class="input-group-addon hidden-xs-down"><span class="fa fa-user"></span></span>
220
								<input id="prenom" name="prenom" class="form-control" type="text"/>
221
							</div>
222
						</div>
223
						<div class="col-md-6 form-inline">
224
							<label for="nom" class="col-sm-3"><?= $observateur['nom']; ?></label>
225
							<div class="input-group col-sm-8">
226
								<span class="input-group-addon hidden-xs-down"><span class="fa fa-user"></span></span>
227
								<input id="nom" name="nom" class="form-control" type="text"/>
228
							</div>
229
						</div>
230
					</div>
231
				</form>
232
				<form id="form-observation" role="form" autocomplete="on">
233
					<h2><?= $observation['titre']; ?></h2>
234
					<div id="zone-observation" class="row align-items-center">
235
						<div class="col-md-6 form-inline">
3204 delphine 236
							<label for="geolocalisation" class="col-sm-3" title="<?= $observateur['courriel-title']; ?>">
3163 delphine 237
								<strong class="obligatoire">* </strong>
3120 delphine 238
								<?= $observation['geolocalisation']; ?>
239
							</label>
240
							<div class="col-sm-8 mb-2 input-group">
3204 delphine 241
								<input id="geolocalisation" name="geolocalisation" type="hidden"/>
242
								<!-- code à décommenter pour avoir un aperçu de la carte qui fonctionne sous chrome,
243
								à remplacer quand Stéphane aura fait une release sur https://github.com/steph-del/tb-geoloc-lib/releases -->
244
								<!-- <app-root></app-root>
245
								<script type="text/javascript" src="modules/saisie2/squelettes/js/runtime.js"></script>
246
								<script type="text/javascript" src="modules/saisie2/squelettes/js/polyfills.js"></script>
247
								<script type="text/javascript" src="modules/saisie2/squelettes/js/styles.js"></script>
248
								<script type="text/javascript" src="modules/saisie2/squelettes/js/vendor.js"></script>
249
								<script type="text/javascript" src="modules/saisie2/squelettes/js/main.js"></script> -->
250
 
3120 delphine 251
							</div>
252
							<label for="milieu" class="col-sm-3">
253
								<?= $observation['milieu']; ?>
254
							</label>
255
							<div class="col-sm-8 mb-2 input-group">
256
							<span class="input-group-addon hidden-xs-down"><span class="fa fa-street-view"></span></span>
257
								<?php if ($widget['milieux'] != array()) {?>
258
									<select id="milieu" class="form-control" >
259
									<?php foreach ($widget['milieux'] as $milieu) {?>
260
										<option value="<?= $milieu; ?>"><?= $milieu; ?></option>
261
									<?php } ?>
262
									</select>
263
								<?php } else { ?>
264
									<input id="milieu" name="milieu" class="form-control" type="text" placeholder="bois, champ, falaise, ..."/>
265
								<?php } ?>
266
							</div>
267
						</div>
268
						<div class="col-md-6 form-inline">
269
							<label for="date" class="col-sm-3" title="">
3163 delphine 270
								<strong class="obligatoire">* </strong><?= $observation['date']; ?>
3120 delphine 271
							</label>
272
							<div class="col-sm-8 input-group date" id="datetimepicker">
273
								<span  id="date-icone" class="input-group-addon hidden-xs-down"><span class="fa fa-calendar"></span></span>
274
								<input id="date" name="date" class="form-control" type="date"/>
275
							</div>
276
							<?php if($widget['type_especes'] == "referentiel" && $widget['referentiel'] == "") { ?>
277
								<label for="referentiel" class="col-sm-3" title="">
3163 delphine 278
									<strong class="obligatoire">* </strong><?= $observation['referentiel']; ?>
3120 delphine 279
								</label>
280
								<div class="col-sm-8 input-group">
281
									<span class="input-group-addon hidden-xs-down"><span class="fa fa-book"></span></span>
282
									<select id="referentiel" class="form-control" >
283
										<option value="bdtfxr" selected="selected" title="Trachéophytes de France métropolitaine">Métropole (index réduit)</option>
284
										<option value="bdtfx" title="Trachéophytes de France métropolitaine">Métropole (BDTFX)</option>
285
										<option value="bdtxa" title="Trachéophytes des Antilles">Antilles françaises (BDTXA)</option>
286
										<option value="bdtre" title="Trachéophytes de La Réunion">Réunion (BDTRE)</option>
287
										<option value="aublet" title="Guyane">Guyane (AUBLET2)</option>
288
										<option value="florical" title="Nouvelle-Calédonie">Nouvelle-Calédonie (FLORICAL)</option>
289
										<option value="isfan" title="Afrique du Nord">Afrique du Nord (ISFAN)</option>
290
										<option value="apd" title="Afrique de l'Ouest et du Centre">Afrique de l'Ouest et du Centre (APD)</option>
291
										<option value="lbf" title="Liban">Liban (LBF)</option>
292
										<option value="autre" title="Autre/Inconnu">Autre/Inconnu</option>
293
									</select>
294
								</div>
295
							<?php } else { ?><input id="referentiel" name="referentiel" value="<?= $widget['referentiel']; ?>" type="hidden" /><?php } ?>
296
 
297
							<label for="taxon" class="col-sm-3" title="">
298
								<?= $observation['espece']; ?>
299
							</label>
300
							<div class="col-sm-8 input-group date">
301
								<span class="input-group-addon hidden-xs-down"><span class="fa fa-leaf"></span></span>
302
								<input id="taxon" name="taxon" class="form-control" type="text"/>
303
							</div>
304
							<label for="certitude" class="col-sm-3" title="">
3163 delphine 305
								<strong class="obligatoire">* </strong><?= $observation['certitude']; ?>
3120 delphine 306
							</label>
307
							<div class="col-sm-8 input-group date" id="datetimepicker">
308
								<span class="input-group-addon hidden-xs-down"><span class="fa fa-question"></span></span>
309
								<select id="certitude" name="certitude" class="form-control">
310
									<option value="aDeterminer" ><?= $observation['certADet']; ?></option>
311
									<option value="douteuse" ><?= $observation['certDout']; ?></option>
312
									<option value="certaine" selected="selected" ><?= $observation['certCert']; ?></option>
313
								</select>
314
							</div>
315
						</div>
316
					</div>
317
				</form>
318
				<?php if (isset($widget['chpSupp']) && $widget['chpSupp'] != array()) { ?>
319
					<form id="form-supp" role="form" autocomplete="on">
320
						<div id="zone-supp" class="row align-items-center">
321
							<div class="col-md-6 form-inline">
322
								<?php print_r(implode($widget['chpSupp']));?>
323
							</div>
324
						</div>
325
					</form>
326
				<?php } ?>
327
				<div id="image" class="row align-items-center">
328
				</div>
329
			</div>
330
 
331
				<div class="row align-items-end component-tools-item-link">
332
					<a href="http://www.tela-botanica.org/appli:cel" target="" style="color: #e16e37">
333
						<span>Gestion</span>
334
					</a>
335
					<a href="http://www.tela-botanica.org/widget:cel:cartoPoint?projet=<?= $widget['projet']; ?>" target="" style="color: #918a6f">
336
						<span>Carto</span>
337
					</a>
338
					<a href="http://www.tela-botanica.org/widget:cel:photo?projet=<?= $widget['projet']; ?>" target="" style="color: #964e75">
339
						<span>Photo</span>
340
					</a>
341
					<a href="http://www.tela-botanica.org/widget:cel:observation?projet=<?= $widget['projet']; ?>" target="" style="color: #b2cb43">
342
						<span>Observation</span>
343
					</a>
344
					<a href="http://www.tela-botanica.org/widget:cel:export?projet=<?= $widget['projet']; ?>" target="" style="color: #009fb8">
345
						<span>Export</span>
346
					</a>
347
					<a href="http://www.tela-botanica.org/appli:pictoflora?projet=<?= $widget['projet']; ?>" target="" style="color: #927fa2">
348
						<span>PictoFlora</span>
349
					</a>
350
					<a href="http://www.tela-botanica.org/appli:identiplante?projet=<?= $widget['projet']; ?>" target="" style="color: #f25a52">
351
						<span>IdentiPlante</span>
352
					</a>
353
				</div>
354
 
355
		</div>
356
	</div>
357
  </body>
358
</html>