WebSVN – eFlore/Applications.cel – Diff – /trunk/widget/modules/saisie/squelettes/saisie.tpl.html

 		<!-- Bootstrap CSS -->
 		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous" />
 		<!-- Fontawesome -->
 		<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
 		<!-- Carto -->
+		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin="anonymous">
+		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css" integrity="sha512-gc3xjCmIy673V6MyOAZhIW93xhM9ei1I+gLbmFjUHIjocENRsLX/QUE1htk5q1XV2D/iie/VQ8DXI6Vu8bexvQ==" crossorigin="anonymous">
+		<link rel="stylesheet" href="<?php echo $url_base;?>js/tb-geoloc/css/leaflet-gesture-handling.min.css" type="text/css">
-		<link href="<?php echo $url_base; ?>js/tb-geoloc/styles.css" rel="stylesheet" type="text/css" media="screen" />
+		<link rel="stylesheet" href="<?php echo $url_base;?>js/tb-geoloc/css/geoloc.css" type="text/css">
 		<!-- STYLE SAISIE -->
 		<link href="<?php echo $url_base; ?>css/saisie.css" rel="stylesheet" type="text/css" media="screen" />
 		<link href="<?php echo $url_base; ?>css/saisieSpe.css" rel="stylesheet" type="text/css" media="screen" />
 						<h2><?php echo $observation['titre']; ?></h2>
 						<div id="zone-observation" class="row">
 							<div class="col-md-6">
 								<div class="mb-3">
-									<label for="geolocalisation" class="col-sm-8 obligatoire has-tooltip" data-toggle="tooltip" title="<?php echo $observation['geoloc-title']; ?>">
+									<label  id="geoloc-label" for="geolocalisation" class="col-sm-8 obligatoire has-tooltip" data-toggle="tooltip" title="<?php echo $observation['geoloc-title']; ?>">
 										<i class="fa fa-street-view" aria-hidden="true"></i>
 										<?php echo $observation['geolocalisation']; ?>
 									</label>
 									<?php if( $widget['type_localisation'] === 'rue' ) : ?>
 									<div class="control-group">
 										<div id="geoloc-datas">
 											<input type="hidden" id="pays" name="pays" value="" style="display:none">
 											<input type="hidden" id="commune-nom" name="commune-nom" value="" style="display:none">
 											<input type="hidden" id="geometry" name="geometry" value="" style="display:none">
-											<input type="hidden" id="latitude" name="latitude" value="" style="display:none">
+											<!-- <input type="text" id="latitude" name="latitude" value="<?php //echo $widget['localisation']['latitude'] ?? '';?>">
-											<input type="hidden" id="longitude" name="longitude" value="" style="display:none">
+											<input type="text" id="longitude" name="longitude" value="<?php //echo $widget['localisation']['longitude'] ?? '';?>"> -->
 											<input type="hidden" id="altitude" name="altitude" value="" style="display:none">
 											<input type="hidden" id="commune-insee" name="commune-insee" value="" style="display:none">
 											<input type="hidden" id="coord-lineaire" name="coord-lineaire" value="" style="display:none">
 										</div>
 										<div id="geoloc" class="col-sm-12">
-											<tb-geolocation-element
+											<script type="text/javascript">
+												const URL_GEOLOC_SERVICE = "<?php echo $url_ws_geoloc;?>";
-												id="tb-geolocation"
+												const URL_BASE = "<?php echo $url_base;?>";
-												layer='osm'
+											</script>
-												zoom_init="<?php echo ( isset($widget['localisation']['zoom']) ) ? $widget['localisation']['zoom']: '4' ;?>"
+											<div id="tb-places-zone" class="flex hidden">
+												<div class="form-col search-container">
-												lat_init="<?php echo ( isset($widget['localisation']['latitude']) ) ? $widget['localisation']['latitude']: '46.5' ;?>"
+													<label for="tb-places" >Trouver un lieu</label>
+													<div class="input-search-container">
-												lng_init="<?php echo ( isset($widget['localisation']['longitude'])) ? $widget['localisation']['longitude'] : '2.9' ;?>"
+														<input id="tb-places" class="tb-places" type="search" name="tb-places" placeholder="Recherchez une adresse ici" autocomplete="off">
-												marker="<?php echo ( $widget['type_localisation'] === 'point' ) ? 'true' : 'false' ;?>"
+														<div class="tb-places-search-icon"></div>
-												polyline="<?php echo ( $widget['type_localisation'] === 'rue' ) ? 'true' : 'false' ;?>"
+														<button class="tb-places-close hidden"></button>
-												polygon="false"
+													</div>
-												show_lat_lng_elevation_inputs="<?php echo ( $widget['type_localisation'] === 'point' ) ? 'true' : 'false' ;?>"
+													<div class="tb-places-results-container hidden">
+														<ul class="tb-places-results"></ul>
+													</div>
+												</div>
+											</div>
+											<div id="map-container">
+												<div
-												osm_class_filter=""
+													id="tb-geolocation"
+													style="height: 400px;width: 100%"
-												geometry_filter="<?php echo ($widget['type_localisation'] === 'rue' ) ? 'linestring' : 'point' ;?>"
+													data-type-localisation="<?php echo $widget['type_localisation'] ?? '';?>"
+													data-zoom="<?php echo $widget['localisation']['zoom'] ?? '5';?>"
-												elevation_provider="mapquest"
+													data-layer="osm"
-												map_quest_api_key="mG6oU5clZHRHrOSnAV0QboFI7ahnGg34"
+													data-form-suffix=""
-												height="400px"
+													>
-											>
+												</div>
-											</tb-geolocation-element>
+											</div>
 										</div>
 									</div>
 								</div>
+								<div id="coord" class="control-group">
+									<label for="latitude" class="col-sm-8">
+										<i class="fa fa-globe" aria-hidden="true"></i>
+										<?php echo $observation['latitude']; ?>
+									</label>
+									<div class="col-sm-8 mb-3">
+										<input type="text" id="latitude" name="latitude" class="form-control has-tooltip" data-toggle="tooltip" title="<?php echo $observation['latitude']; ?>" value="<?php echo $widget['localisation']['latitude'] ?? '';?>">
+									</div>
+									<label for="longitude" class="col-sm-8">
+										<i class="fa fa-globe" aria-hidden="true"></i>
+										<?php echo $observation['longitude']; ?>
+									</label>
+									<div class="col-sm-8 mb-3">
+										<input type="text" id="longitude" name="longitude" class="form-control has-tooltip" data-toggle="tooltip" title="<?php echo $observation['longitude']; ?>" value="<?php echo $widget['localisation']['longitude'] ?? '';?>">
+									</div>
+								</div>
 								<div class="control-group">
 									<label for="lieudit" class="col-sm-8">
 										<i class="fa fa-map-signs" aria-hidden="true"></i>
 										<?php echo $observation['lieudit']; ?>
 					<div class="modal-body" id="print_content"></div>
 					<div class="modal-footer"></div>
 				</div>
 			</div>
 		</div>
-		<!-- carto -->
-		<script type="text/javascript" src="<?php echo $url_base; ?>js/tb-geoloc/tb-geoloc-lib-app.js"></script>
 		<!-- Jquery -->
 		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/1.11.1/jquery-1.11.1.min.js"></script>
 		<!-- Jquery UI : nécessaire pour le minicalendrier et l'auto-complétion -->
 		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/jquery-ui.min.js"></script>
-		<!-- <script type="text/javascript" src="https://resources.tela-botanica.org/jquery/jquery-ui/1.11.0/js/datepicker-fr.js"></script> -->
 		<!-- Jquery Plugins -->
 		<!-- Jquery Validate : nécessaire pour la validation des formulaires -->
 		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/jquery.validate.min.js"></script>
 		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/additional-methods.min.js"></script>
 		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/validate/1.11.1/messages_fr.js"></script>
 		<!-- Jquery Form :nécessaire pour l'upload des images -->
 		<script type="text/javascript" src="https://resources.tela-botanica.org/jquery/form/3.51/jquery.form.min.js"></script>
 		<!-- Bootstrap -->
 		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
 		<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
+		<!-- carto -->
+		<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin="anonymous"></script>
+		<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js" integrity="sha512-ozq8xQKq6urvuU6jNgkfqAmT7jKN2XumbrX1JiB3TnF7tI48DPI4Gy1GXKD/V3EExgAs1V+pRO7vwtS1LHg0Gw==" crossorigin="anonymous"></script>
+		<script src="<?php echo $url_base;?>js/tb-geoloc/js/modules/leaflet-gesture-handling.min.js"></script>
 		<!-- Connexion, bloc de prévisualisation, date -->
-		<script type="text/javascript" src="<?php echo $url_base; ?>js/Utils.js"></script>
-		<script type="text/javascript" src="<?php echo $url_base; ?>js/WidgetsSaisiesCommun.js"></script>
-		<script type="text/javascript" src="<?php echo $url_base; ?>js/WidgetSaisie.js"></script>
+		<script type="module" src="<?php echo $url_base; ?>js/WidgetSaisie.js"></script>
 		<script type="text/javascript">
 			//<![CDATA[
-				const NBRE_ELTS_AUTOCOMP = 20;
+				const NBRE_ELTS_AUTOCOMP = 20,
-				const OBS_MAX_NBRE       = 10;
-				const DUREE_MESSAGE      = 1000;
-				var widgetProp = {
+					widgetProp = {
 					// url jusqu'à "/widget:cel:"
 					'urlWidgets'                        : "<?php echo $widgets_url; ?>",
 					// module utilisé (apa,lg,streets)
 					'projet'                            : "<?php echo $widget['projet']; ?>",
 					// id du projet
 						"retour.champs=famille,nom_retenu,nom_retenu_complet,num_taxonomique,nom_retenu.id&"+
 						"retour.tri=alpharet&"+ // tri "à la CeL"
 						"ns.structure=au,an&"+
 						"navigation.limite=" + NBRE_ELTS_AUTOCOMP,
 					// Nombre d'observations max autorisé avant transmission
-					'obsMaxNbre'                        : OBS_MAX_NBRE,
+					'obsMaxNbre'                        : 10,
 					// Durée d'affichage en milliseconde des messages d'informations
-					'dureeMessage'                      : DUREE_MESSAGE,
+					'dureeMessage'                      : 1000,
 					// Squelette d'URL du web service d'eFlore fournissant les noms de communes.
 					'serviceNomCommuneUrl'              : "https://api.tela-botanica.org/service:eflore:0.1/osm/nom-commune?lon={lon}&lat={lat}",
 					// Squelette d'URL du web service d'eFlore fournissant les noms de communes hors de France (localisation approximative).
 					'serviceNomCommuneUrlAlt'           : "https://api.tela-botanica.org/service:eflore:0.1/wikipedia/nom-commune?lon={lon}&lat={lat}&nbre=1"
 				};
-				$( document ).ready( function() {
-					widget = new WidgetSaisie(widgetProp);
-					widget.init();
-					// Fonctions de Style et Affichage des éléments "spéciaux"
-					utils.init();
-				});
 			//]]>
 		</script>
 		<!-- Barre de navigation -->
 		<?php if ( $bar ): ?>
 			<script src="<?php echo $url_script_navigation; ?>"></script>

Subversion Repositories eFlore/Applications.cel

(root)/trunk/widget/modules/saisie/squelettes/saisie.tpl.html – Rev 3815 → 3844