prueba de concepto crear circuitos
This commit is contained in:
humano
parent
fbce2cf606
commit
fb00c8b6d9
220
circuitos.php
Normal file
220
circuitos.php
Normal file
@ -0,0 +1,220 @@
|
|||||||
|
<?php session_start();
|
||||||
|
if(isset($_REQUEST['debug'])) {ini_set('display_errors', 'On');}
|
||||||
|
require ('milfs/xajax/xajax.inc.php');
|
||||||
|
$xajax = new xajax();
|
||||||
|
//require ('json.lab.php');
|
||||||
|
require ('milfs/funciones/funciones.php');
|
||||||
|
require ("milfs/funciones/conex.php");
|
||||||
|
include ('milfs/librerias/parsedown/Parsedown.php');
|
||||||
|
//require_once ('includes/markdown.php');
|
||||||
|
//require ('funciones/convert.php');
|
||||||
|
$xajax->processRequests();
|
||||||
|
//if($_REQUEST[id2] =='') {$agregar= $_REQUEST[id];}else {$agregar = $_REQUEST[id2];}
|
||||||
|
if(isset($_REQUEST['categoria']) AND isset($_REQUEST['buscar'])) {
|
||||||
|
$cadena_busqueda = "$_REQUEST[buscar]";
|
||||||
|
$_REQUEST['buscar'] = "$_REQUEST[categoria]:$_REQUEST[buscar]";
|
||||||
|
}
|
||||||
|
$formulario_nombre = remplacetas('form_id','id',$_REQUEST[id],'nombre',"","") ;
|
||||||
|
$formulario_descripcion = remplacetas('form_id','id',$_REQUEST[id],'descripcion',"","") ;
|
||||||
|
$descripcion_meta = preg_replace("[\n|\r|\n\r|\t]",'', strip_tags($formulario_descripcion[0]));
|
||||||
|
$agregar_nombre = remplacetas('form_id','id',$agregar,'nombre',"","") ;
|
||||||
|
$id_empresa = remplacetas('form_id','id',$_REQUEST[id],'id_empresa',"","") ;
|
||||||
|
$twitter = remplacetas('empresa','id',"$id_empresa[0]",'twitter','',"","") ;
|
||||||
|
if($twitter[0] =="") {$twitter[0] ="@tupaleCo";}
|
||||||
|
$logo = remplacetas('empresa','id',"$id_empresa[0]",'imagen','',"","") ;
|
||||||
|
$razon_social = remplacetas('empresa','id',"$id_empresa[0]",'razon_social','',"","") ;
|
||||||
|
$campos_formulario = input_campos("$_REQUEST[id]","categoria");
|
||||||
|
$uri = "$_SERVER[SERVER_NAME]/$_SERVER[REQUEST_URI]";
|
||||||
|
$background_imagen = buscar_imagen("$_REQUEST[id]","","","$id_empresa");
|
||||||
|
$plantilla ="mapa";
|
||||||
|
$categorias = lista_categorias($_REQUEST['id'],'','mapa') ;
|
||||||
|
?>
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head >
|
||||||
|
<title><?php echo "$formulario_nombre[0] / $cadena_busqueda" ?> tupale.co</title>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<!-- <meta name="viewport" content="user-scalable=no, width=device-width, maximum-scale=1, initial-scale=1"> -->
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<!-- <meta name="viewport" content="width=device-width, initial-scale=1"> -->
|
||||||
|
<meta name="description" content="">
|
||||||
|
<meta NAME="Language" CONTENT="Spanish">
|
||||||
|
<meta NAME="Revisit" CONTENT="1 days">
|
||||||
|
<meta NAME="Distribution" CONTENT="Global">
|
||||||
|
<meta NAME="Robots" CONTENT="All">
|
||||||
|
<meta name="twitter:card" content="summary">
|
||||||
|
<meta name="twitter:site" content="<?php echo $twitter[0]; ?>">
|
||||||
|
<meta name="twitter:creator" content="@qwerty_co">
|
||||||
|
<meta name="twitter:url" content="<?php echo $uri ; ?>">
|
||||||
|
<meta name="twitter:title" content="<?php echo "$formulario_nombre[0] / $cadena_busqueda" ?> tupale.co">
|
||||||
|
<meta name="twitter:description" content=" <?php echo $descripcion_meta; ?>">
|
||||||
|
<meta name="twitter:image" content="<?php echo "$_SESSION[url]images/secure/?file=full/$background_imagen"; ?>">
|
||||||
|
<meta property="og:type" content="article">
|
||||||
|
<meta property="og:title" content="<?php echo "$formulario_nombre[0] / $cadena_busqueda" ?> tupale.co" />
|
||||||
|
<meta property="og:type" content="website" />
|
||||||
|
<meta property="og:url" content="<?php echo "$uri"; ?>" />
|
||||||
|
<meta property="og:image" content="<?php echo "$_SESSION[url]images/secure/?file=full/$background_imagen"; ?>" />
|
||||||
|
<meta property="og:site_name" content="<?php echo $razon_social[0]; ?>" />
|
||||||
|
<meta property="og:description" content=" <?php echo $descripcion_meta; ?>" />
|
||||||
|
<link rel="shortcut icon" href="<?php echo "milfs/images/secure/?file=150/$logo[0]"; ?>">
|
||||||
|
<?php $xajax->printJavascript("milfs/xajax/"); ?>
|
||||||
|
<link rel="shortcut icon" href="favicon-152.png">
|
||||||
|
<link rel="apple-touch-icon-precomposed" href="favicon-152.png">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="librerias/bootstrap/css/bootstrap.min.css" >
|
||||||
|
<link rel="stylesheet" href="librerias/leaflet/leaflet.css" />
|
||||||
|
<script src="librerias/leaflet/leaflet.js"></script>
|
||||||
|
<link rel="stylesheet" href="librerias/leaflet/dist/MarkerCluster.css" />
|
||||||
|
<link rel="stylesheet" href="librerias/leaflet/dist/MarkerCluster.Default.css" />
|
||||||
|
<script src="librerias/leaflet/dist/leaflet.markercluster-src.js"></script>
|
||||||
|
<script type="text/javascript" src="milfs/geojson.js.php?id=<?php echo $_REQUEST['id'] ?>&buscar=<?php echo $_REQUEST['buscar'] ?>&item=<?php echo $_REQUEST['item'] ?>"></script>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||||
|
<link href="librerias/font-awesome/css/font-awesome.min.css" rel="stylesheet">
|
||||||
|
<link rel="stylesheet" href="librerias/leaflet/css/leaflet-sidebar.css" />
|
||||||
|
<link rel="stylesheet" href="librerias/bootstrap/css/bootstrap.min.css" >
|
||||||
|
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html, body, #map {
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<!-- optionally define the sidebar content via HTML markup -->
|
||||||
|
<div id="sidebar" class="leaflet-sidebar collapsed">
|
||||||
|
|
||||||
|
<!-- nav tabs -->
|
||||||
|
<div class="leaflet-sidebar-tabs">
|
||||||
|
<!-- top aligned tabs -->
|
||||||
|
<ul role="tablist">
|
||||||
|
<li><a href="#home" role="tab"><i class="fa fa-bars active"></i></a></li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<!-- bottom aligned tabs -->
|
||||||
|
|
||||||
|
<ul role="tablist">
|
||||||
|
<li><a href="https://tupale.co"><img title='Powered by Tupale.co' alt='http://tupale.co' class='img img-responsive' src='https://tupale.co/images/icons/icon-152x152.png'></a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- panel content -->
|
||||||
|
<div class="leaflet-sidebar-content">
|
||||||
|
<div class="leaflet-sidebar-pane" id="home">
|
||||||
|
<h1 class="leaflet-sidebar-header">
|
||||||
|
<span id='formulario_titulo_mapa'><?php echo $formulario_nombre[0] ?></span>
|
||||||
|
<span class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></span>
|
||||||
|
</h1>
|
||||||
|
<h3><span id='formulario_descripcion_mapa'><?php echo $formulario_descripcion[0] ?></span></h3>
|
||||||
|
<?php echo $categorias; ?>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="map"></div>
|
||||||
|
|
||||||
|
|
||||||
|
<script src="librerias/leaflet/leaflet.js" crossorigin=""></script>
|
||||||
|
<script src="librerias/leaflet/js/leaflet-sidebar.js"></script>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="librerias/leaflet/dist/MarkerCluster.css" />
|
||||||
|
<link rel="stylesheet" href="librerias/leaflet/dist/MarkerCluster.Default.css" />
|
||||||
|
<script src="librerias/leaflet/dist/leaflet.markercluster-src.js"></script>
|
||||||
|
<script src="librerias/jquery/jquery-2.1.4.min.js"></script>
|
||||||
|
<script type="text/javascript" src="milfs/geojson.js.php?id=<?php echo $_REQUEST['id'] ?>&buscar=<?php echo $_REQUEST['buscar'] ?>&item=<?php echo $_REQUEST['item'] ?>"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// standard leaflet map setup
|
||||||
|
var map = L.map('map');
|
||||||
|
// map.setView([51.2, 7], 9);
|
||||||
|
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||||
|
maxZoom: 19,
|
||||||
|
attribution: "Map data © OpenStreetMap contributors <a href='https://tupale.co'>Powered by Tupale.co</a>"
|
||||||
|
}).addTo(map);
|
||||||
|
|
||||||
|
|
||||||
|
var geojson = L.geoJson(geojsonSample, {
|
||||||
|
|
||||||
|
pointToLayer: function(feature, latlng) {
|
||||||
|
var smallIcon = new L.Icon({
|
||||||
|
iconSize: [100, 100],
|
||||||
|
iconAnchor: [13, 27],
|
||||||
|
popupAnchor: [1, -24],
|
||||||
|
autoPanPadding: [30,30],
|
||||||
|
|
||||||
|
iconUrl: feature.properties.icon.iconUrl
|
||||||
|
|
||||||
|
/* iconUrl: "http://localhost/default/tupali/milfs/images/secure/?file=150/da6d16547658ebc06c5378b30d1ee4bf.png"*/
|
||||||
|
|
||||||
|
});
|
||||||
|
return L.marker(latlng, {icon: smallIcon });
|
||||||
|
},
|
||||||
|
|
||||||
|
onEachFeature: function(feature, layer) {
|
||||||
|
layer._leaflet_id = feature.properties.control;
|
||||||
|
var popupText = feature.properties.description
|
||||||
|
layer.bindPopup(popupText)
|
||||||
|
layer.bindTooltip(feature.properties.title).openTooltip();
|
||||||
|
}
|
||||||
|
}).addTo(map);
|
||||||
|
|
||||||
|
var markers = L.markerClusterGroup();
|
||||||
|
markers.addLayer(geojson).addTo(map);
|
||||||
|
|
||||||
|
map.fitBounds(geojson.getBounds().pad(Math.sqrt(2) /4));
|
||||||
|
|
||||||
|
// create the sidebar instance and add it to the map
|
||||||
|
var sidebar = L.control.sidebar({ container: 'sidebar', autopan: true })
|
||||||
|
.addTo(map)
|
||||||
|
.open('home');
|
||||||
|
|
||||||
|
// add panels dynamically to the sidebar
|
||||||
|
sidebar
|
||||||
|
|
||||||
|
// add a tab with a click callback, initially disabled
|
||||||
|
/* .addPanel({
|
||||||
|
id: 'mail',
|
||||||
|
tab: '<i class="fa fa-envelope"></i>',
|
||||||
|
title: 'Messages',
|
||||||
|
button: function() { alert('opened via JS callback') },
|
||||||
|
disabled: true,
|
||||||
|
})*/
|
||||||
|
|
||||||
|
// be notified when a panel is opened
|
||||||
|
sidebar.on('content', function (ev) {
|
||||||
|
switch (ev.id) {
|
||||||
|
case 'autopan':
|
||||||
|
sidebar.options.autopan = true;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
sidebar.options.autopan = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var userid = 0
|
||||||
|
function addUser() {
|
||||||
|
sidebar.addPanel({
|
||||||
|
id: 'user' + userid++,
|
||||||
|
tab: '<i class="fa fa-user"></i>',
|
||||||
|
title: 'User Profile ' + userid,
|
||||||
|
pane: '<p>user ipsum dolor sit amet</p>',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
195
librerias/leaflet/css/leaflet-sidebar.css
Normal file
195
librerias/leaflet/css/leaflet-sidebar.css
Normal file
@ -0,0 +1,195 @@
|
|||||||
|
.leaflet-sidebar {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 2000; }
|
||||||
|
.leaflet-sidebar.collapsed {
|
||||||
|
width: 40px; }
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.leaflet-sidebar {
|
||||||
|
top: 10px;
|
||||||
|
bottom: 10px;
|
||||||
|
transition: width 500ms; } }
|
||||||
|
@media (min-width: 768px) and (max-width: 991px) {
|
||||||
|
.leaflet-sidebar {
|
||||||
|
width: 305px;
|
||||||
|
max-width: 305px; } }
|
||||||
|
@media (min-width: 992px) and (max-width: 1199px) {
|
||||||
|
.leaflet-sidebar {
|
||||||
|
width: 390px;
|
||||||
|
max-width: 390px; } }
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.leaflet-sidebar {
|
||||||
|
width: 460px;
|
||||||
|
max-width: 460px; } }
|
||||||
|
|
||||||
|
.leaflet-sidebar-left {
|
||||||
|
left: 0; }
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.leaflet-sidebar-left {
|
||||||
|
left: 10px; } }
|
||||||
|
|
||||||
|
.leaflet-sidebar-right {
|
||||||
|
right: 0; }
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.leaflet-sidebar-right {
|
||||||
|
right: 10px; } }
|
||||||
|
|
||||||
|
.leaflet-sidebar-tabs {
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #fff; }
|
||||||
|
.leaflet-sidebar-left .leaflet-sidebar-tabs {
|
||||||
|
left: 0; }
|
||||||
|
.leaflet-sidebar-right .leaflet-sidebar-tabs {
|
||||||
|
right: 0; }
|
||||||
|
.leaflet-sidebar-tabs, .leaflet-sidebar-tabs > ul {
|
||||||
|
position: absolute;
|
||||||
|
width: 40px;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style-type: none; }
|
||||||
|
.leaflet-sidebar-tabs > li, .leaflet-sidebar-tabs > ul > li {
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
color: #333;
|
||||||
|
font-size: 12pt;
|
||||||
|
overflow: hidden;
|
||||||
|
transition: all 80ms; }
|
||||||
|
.leaflet-sidebar-tabs > li:hover, .leaflet-sidebar-tabs > ul > li:hover {
|
||||||
|
color: #000;
|
||||||
|
background-color: #eee; }
|
||||||
|
.leaflet-sidebar-tabs > li.active, .leaflet-sidebar-tabs > ul > li.active {
|
||||||
|
color: #fff;
|
||||||
|
background-color: #0074d9; }
|
||||||
|
.leaflet-sidebar-tabs > li.disabled, .leaflet-sidebar-tabs > ul > li.disabled {
|
||||||
|
color: rgba(51, 51, 51, 0.4); }
|
||||||
|
.leaflet-sidebar-tabs > li.disabled:hover, .leaflet-sidebar-tabs > ul > li.disabled:hover {
|
||||||
|
background: transparent; }
|
||||||
|
.leaflet-sidebar-tabs > li.disabled > a, .leaflet-sidebar-tabs > ul > li.disabled > a {
|
||||||
|
cursor: default; }
|
||||||
|
.leaflet-sidebar-tabs > li > a, .leaflet-sidebar-tabs > ul > li > a {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
line-height: 40px;
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
cursor: pointer; }
|
||||||
|
.leaflet-sidebar-tabs > ul + ul {
|
||||||
|
bottom: 0; }
|
||||||
|
|
||||||
|
.leaflet-sidebar-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-color: rgba(255, 255, 255, 0.95);
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: auto; }
|
||||||
|
.leaflet-sidebar-left .leaflet-sidebar-content {
|
||||||
|
left: 40px;
|
||||||
|
right: 0; }
|
||||||
|
.leaflet-sidebar-right .leaflet-sidebar-content {
|
||||||
|
left: 0;
|
||||||
|
right: 40px; }
|
||||||
|
.leaflet-sidebar.collapsed > .leaflet-sidebar-content {
|
||||||
|
overflow-y: hidden; }
|
||||||
|
|
||||||
|
.collapsed > .leaflet-sidebar-content {
|
||||||
|
overflow-y: hidden; }
|
||||||
|
|
||||||
|
.leaflet-sidebar-pane {
|
||||||
|
display: none;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 10px 20px; }
|
||||||
|
.leaflet-sidebar-pane.active {
|
||||||
|
display: block; }
|
||||||
|
@media (min-width: 768px) and (max-width: 991px) {
|
||||||
|
.leaflet-sidebar-pane {
|
||||||
|
min-width: 265px; } }
|
||||||
|
@media (min-width: 992px) and (max-width: 1199px) {
|
||||||
|
.leaflet-sidebar-pane {
|
||||||
|
min-width: 350px; } }
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.leaflet-sidebar-pane {
|
||||||
|
min-width: 420px; } }
|
||||||
|
|
||||||
|
.leaflet-sidebar-header {
|
||||||
|
margin: -10px -20px 0;
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 20px;
|
||||||
|
line-height: 40px;
|
||||||
|
font-size: 14.4pt;
|
||||||
|
color: #fff;
|
||||||
|
background-color: #0074d9; }
|
||||||
|
.leaflet-sidebar-right .leaflet-sidebar-header {
|
||||||
|
padding-left: 40px; }
|
||||||
|
|
||||||
|
.leaflet-sidebar-close {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
text-align: center;
|
||||||
|
cursor: pointer; }
|
||||||
|
.leaflet-sidebar-left .leaflet-sidebar-close {
|
||||||
|
right: 0; }
|
||||||
|
.leaflet-sidebar-right .leaflet-sidebar-close {
|
||||||
|
left: 0; }
|
||||||
|
|
||||||
|
.leaflet-sidebar {
|
||||||
|
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65); }
|
||||||
|
.leaflet-sidebar.leaflet-touch {
|
||||||
|
box-shadow: none;
|
||||||
|
border-right: 2px solid rgba(0, 0, 0, 0.2); }
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.leaflet-sidebar {
|
||||||
|
border-radius: 4px; }
|
||||||
|
.leaflet-sidebar.leaflet-touch {
|
||||||
|
border: 2px solid rgba(0, 0, 0, 0.2); } }
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.leaflet-sidebar-left ~ .leaflet-control-container .leaflet-left {
|
||||||
|
transition: left 500ms; } }
|
||||||
|
|
||||||
|
@media (min-width: 768px) and (max-width: 991px) {
|
||||||
|
.leaflet-sidebar-left ~ .leaflet-control-container .leaflet-left {
|
||||||
|
left: 315px; } }
|
||||||
|
|
||||||
|
@media (min-width: 992px) and (max-width: 1199px) {
|
||||||
|
.leaflet-sidebar-left ~ .leaflet-control-container .leaflet-left {
|
||||||
|
left: 400px; } }
|
||||||
|
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.leaflet-sidebar-left ~ .leaflet-control-container .leaflet-left {
|
||||||
|
left: 470px; } }
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.leaflet-sidebar-left.collapsed ~ .leaflet-control-container .leaflet-left {
|
||||||
|
left: 50px; } }
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.leaflet-sidebar-right ~ .leaflet-control-container .leaflet-right {
|
||||||
|
transition: right 500ms; } }
|
||||||
|
|
||||||
|
@media (min-width: 768px) and (max-width: 991px) {
|
||||||
|
.leaflet-sidebar-right ~ .leaflet-control-container .leaflet-right {
|
||||||
|
right: 315px; } }
|
||||||
|
|
||||||
|
@media (min-width: 992px) and (max-width: 1199px) {
|
||||||
|
.leaflet-sidebar-right ~ .leaflet-control-container .leaflet-right {
|
||||||
|
right: 400px; } }
|
||||||
|
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.leaflet-sidebar-right ~ .leaflet-control-container .leaflet-right {
|
||||||
|
right: 470px; } }
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.leaflet-sidebar-right.collapsed ~ .leaflet-control-container .leaflet-right {
|
||||||
|
right: 50px; } }
|
||||||
1
librerias/leaflet/css/leaflet-sidebar.min.css
vendored
Normal file
1
librerias/leaflet/css/leaflet-sidebar.min.css
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
.leaflet-sidebar{position:absolute;top:0;bottom:0;width:100%;overflow:hidden;z-index:2000}.leaflet-sidebar.collapsed{width:40px}@media (min-width:768px){.leaflet-sidebar{top:10px;bottom:10px;transition:width .5s}}@media (min-width:768px) and (max-width:991px){.leaflet-sidebar{width:305px;max-width:305px}}@media (min-width:992px) and (max-width:1199px){.leaflet-sidebar{width:390px;max-width:390px}}@media (min-width:1200px){.leaflet-sidebar{width:460px;max-width:460px}}.leaflet-sidebar-left{left:0}@media (min-width:768px){.leaflet-sidebar-left{left:10px}}.leaflet-sidebar-right{right:0}@media (min-width:768px){.leaflet-sidebar-right{right:10px}}.leaflet-sidebar-tabs{top:0;bottom:0;height:100%;background-color:#fff}.leaflet-sidebar-left .leaflet-sidebar-tabs{left:0}.leaflet-sidebar-right .leaflet-sidebar-tabs{right:0}.leaflet-sidebar-tabs,.leaflet-sidebar-tabs>ul{position:absolute;width:40px;margin:0;padding:0;list-style-type:none}.leaflet-sidebar-tabs>li,.leaflet-sidebar-tabs>ul>li{width:100%;height:40px;color:#333;font-size:12pt;overflow:hidden;transition:all 80ms}.leaflet-sidebar-tabs>li:hover,.leaflet-sidebar-tabs>ul>li:hover{color:#000;background-color:#eee}.leaflet-sidebar-tabs>li.active,.leaflet-sidebar-tabs>ul>li.active{color:#fff;background-color:#0074d9}.leaflet-sidebar-tabs>li.disabled,.leaflet-sidebar-tabs>ul>li.disabled{color:rgba(51,51,51,.4)}.leaflet-sidebar-tabs>li.disabled:hover,.leaflet-sidebar-tabs>ul>li.disabled:hover{background:0 0}.leaflet-sidebar-tabs>li.disabled>a,.leaflet-sidebar-tabs>ul>li.disabled>a{cursor:default}.leaflet-sidebar-tabs>li>a,.leaflet-sidebar-tabs>ul>li>a{display:block;width:100%;height:100%;line-height:40px;color:inherit;text-decoration:none;text-align:center;cursor:pointer}.leaflet-sidebar-tabs>ul+ul{bottom:0}.leaflet-sidebar-content{position:absolute;top:0;bottom:0;background-color:rgba(255,255,255,.95);overflow-x:hidden;overflow-y:auto}.leaflet-sidebar-left .leaflet-sidebar-content{left:40px;right:0}.leaflet-sidebar-right .leaflet-sidebar-content{left:0;right:40px}.leaflet-sidebar.collapsed>.leaflet-sidebar-content{overflow-y:hidden}.collapsed>.leaflet-sidebar-content{overflow-y:hidden}.leaflet-sidebar-pane{display:none;left:0;right:0;box-sizing:border-box;padding:10px 20px}.leaflet-sidebar-pane.active{display:block}@media (min-width:768px) and (max-width:991px){.leaflet-sidebar-pane{min-width:265px}}@media (min-width:992px) and (max-width:1199px){.leaflet-sidebar-pane{min-width:350px}}@media (min-width:1200px){.leaflet-sidebar-pane{min-width:420px}}.leaflet-sidebar-header{margin:-10px -20px 0;height:40px;padding:0 20px;line-height:40px;font-size:14.4pt;color:#fff;background-color:#0074d9}.leaflet-sidebar-right .leaflet-sidebar-header{padding-left:40px}.leaflet-sidebar-close{position:absolute;top:0;width:40px;height:40px;text-align:center;cursor:pointer}.leaflet-sidebar-left .leaflet-sidebar-close{right:0}.leaflet-sidebar-right .leaflet-sidebar-close{left:0}.leaflet-sidebar{box-shadow:0 1px 5px rgba(0,0,0,.65)}.leaflet-sidebar.leaflet-touch{box-shadow:none;border-right:2px solid rgba(0,0,0,.2)}@media (min-width:768px){.leaflet-sidebar{border-radius:4px}.leaflet-sidebar.leaflet-touch{border:2px solid rgba(0,0,0,.2)}}@media (min-width:768px){.leaflet-sidebar-left~.leaflet-control-container .leaflet-left{transition:left .5s}}@media (min-width:768px) and (max-width:991px){.leaflet-sidebar-left~.leaflet-control-container .leaflet-left{left:315px}}@media (min-width:992px) and (max-width:1199px){.leaflet-sidebar-left~.leaflet-control-container .leaflet-left{left:400px}}@media (min-width:1200px){.leaflet-sidebar-left~.leaflet-control-container .leaflet-left{left:470px}}@media (min-width:768px){.leaflet-sidebar-left.collapsed~.leaflet-control-container .leaflet-left{left:50px}}@media (min-width:768px){.leaflet-sidebar-right~.leaflet-control-container .leaflet-right{transition:right .5s}}@media (min-width:768px) and (max-width:991px){.leaflet-sidebar-right~.leaflet-control-container .leaflet-right{right:315px}}@media (min-width:992px) and (max-width:1199px){.leaflet-sidebar-right~.leaflet-control-container .leaflet-right{right:400px}}@media (min-width:1200px){.leaflet-sidebar-right~.leaflet-control-container .leaflet-right{right:470px}}@media (min-width:768px){.leaflet-sidebar-right.collapsed~.leaflet-control-container .leaflet-right{right:50px}}
|
||||||
529
librerias/leaflet/js/leaflet-sidebar.js
Executable file
529
librerias/leaflet/js/leaflet-sidebar.js
Executable file
@ -0,0 +1,529 @@
|
|||||||
|
// @ts-nocheck
|
||||||
|
/**
|
||||||
|
* @name Sidebar
|
||||||
|
* @class L.Control.Sidebar
|
||||||
|
* @extends L.Control
|
||||||
|
* @param {string} id - The id of the sidebar element (without the # character)
|
||||||
|
* @param {Object} [options] - Optional options object
|
||||||
|
* @param {string} [options.autopan=false] - whether to move the map when opening the sidebar to make maintain the visible center point
|
||||||
|
* @param {string} [options.position=left] - Position of the sidebar: 'left' or 'right'
|
||||||
|
* @param {string} [options.id] - ID of a predefined sidebar container that should be used
|
||||||
|
* @param {boolean} [data.close=true] Whether to add a close button to the pane header
|
||||||
|
* @see L.control.sidebar
|
||||||
|
*/
|
||||||
|
L.Control.Sidebar = L.Control.extend(/** @lends L.Control.Sidebar.prototype */ {
|
||||||
|
includes: L.Evented ? L.Evented.prototype : L.Mixin.Events,
|
||||||
|
|
||||||
|
options: {
|
||||||
|
autopan: false,
|
||||||
|
closeButton: true,
|
||||||
|
container: null,
|
||||||
|
position: 'left'
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Create a new sidebar on this object.
|
||||||
|
*
|
||||||
|
* @constructor
|
||||||
|
* @param {Object} [options] - Optional options object
|
||||||
|
* @param {string} [options.autopan=false] - whether to move the map when opening the sidebar to make maintain the visible center point
|
||||||
|
* @param {string} [options.position=left] - Position of the sidebar: 'left' or 'right'
|
||||||
|
* @param {string} [options.container] - ID of a predefined sidebar container that should be used
|
||||||
|
* @param {bool} [data.close=true] Whether to add a close button to the pane header
|
||||||
|
*/
|
||||||
|
initialize: function(options, deprecatedOptions) {
|
||||||
|
if (typeof options === 'string') {
|
||||||
|
console.warn('this syntax is deprecated. please use L.control.sidebar({ container }) now');
|
||||||
|
options = { container: options };
|
||||||
|
}
|
||||||
|
|
||||||
|
if (typeof options === 'object' && options.id) {
|
||||||
|
console.warn('this syntax is deprecated. please use L.control.sidebar({ container }) now');
|
||||||
|
options.container = options.id;
|
||||||
|
}
|
||||||
|
|
||||||
|
this._tabitems = [];
|
||||||
|
this._panes = [];
|
||||||
|
this._closeButtons = [];
|
||||||
|
|
||||||
|
L.setOptions(this, Object.assign({}, options, deprecatedOptions));
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add this sidebar to the specified map.
|
||||||
|
*
|
||||||
|
* @param {L.Map} map
|
||||||
|
* @returns {Sidebar}
|
||||||
|
*/
|
||||||
|
onAdd: function(map) {
|
||||||
|
var i, child, tabContainers, newContainer, container;
|
||||||
|
|
||||||
|
// use container from previous onAdd()
|
||||||
|
container = this._container
|
||||||
|
|
||||||
|
// use the container given via options.
|
||||||
|
if (!container) {
|
||||||
|
container = this._container || typeof this.options.container === 'string'
|
||||||
|
? L.DomUtil.get(this.options.container)
|
||||||
|
: this.options.container;
|
||||||
|
}
|
||||||
|
|
||||||
|
// if no container was specified or not found, create it and apply an ID
|
||||||
|
if (!container) {
|
||||||
|
container = L.DomUtil.create('div', 'leaflet-sidebar collapsed');
|
||||||
|
if (typeof this.options.container === 'string')
|
||||||
|
container.id = this.options.container;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Find paneContainer in DOM & store reference
|
||||||
|
this._paneContainer = container.querySelector('div.leaflet-sidebar-content');
|
||||||
|
|
||||||
|
// If none is found, create it
|
||||||
|
if (this._paneContainer === null)
|
||||||
|
this._paneContainer = L.DomUtil.create('div', 'leaflet-sidebar-content', container);
|
||||||
|
|
||||||
|
// Find tabContainerTop & tabContainerBottom in DOM & store reference
|
||||||
|
tabContainers = container.querySelectorAll('ul.leaflet-sidebar-tabs, div.leaflet-sidebar-tabs > ul');
|
||||||
|
this._tabContainerTop = tabContainers[0] || null;
|
||||||
|
this._tabContainerBottom = tabContainers[1] || null;
|
||||||
|
|
||||||
|
// If no container was found, create it
|
||||||
|
if (this._tabContainerTop === null) {
|
||||||
|
newContainer = L.DomUtil.create('div', 'leaflet-sidebar-tabs', container);
|
||||||
|
newContainer.setAttribute('role', 'tablist');
|
||||||
|
this._tabContainerTop = L.DomUtil.create('ul', '', newContainer);
|
||||||
|
}
|
||||||
|
if (this._tabContainerBottom === null) {
|
||||||
|
newContainer = this._tabContainerTop.parentNode;
|
||||||
|
this._tabContainerBottom = L.DomUtil.create('ul', '', newContainer);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Store Tabs in Collection for easier iteration
|
||||||
|
for (i = 0; i < this._tabContainerTop.children.length; i++) {
|
||||||
|
child = this._tabContainerTop.children[i];
|
||||||
|
child._sidebar = this;
|
||||||
|
child._id = child.querySelector('a').hash.slice(1); // FIXME: this could break for links!
|
||||||
|
this._tabitems.push(child);
|
||||||
|
}
|
||||||
|
for (i = 0; i < this._tabContainerBottom.children.length; i++) {
|
||||||
|
child = this._tabContainerBottom.children[i];
|
||||||
|
child._sidebar = this;
|
||||||
|
child._id = child.querySelector('a').hash.slice(1); // FIXME: this could break for links!
|
||||||
|
this._tabitems.push(child);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Store Panes in Collection for easier iteration
|
||||||
|
for (i = 0; i < this._paneContainer.children.length; i++) {
|
||||||
|
child = this._paneContainer.children[i];
|
||||||
|
if (child.tagName === 'DIV' &&
|
||||||
|
L.DomUtil.hasClass(child, 'leaflet-sidebar-pane')) {
|
||||||
|
this._panes.push(child);
|
||||||
|
|
||||||
|
// Save references to close buttons
|
||||||
|
var closeButtons = child.querySelectorAll('.leaflet-sidebar-close');
|
||||||
|
if (closeButtons.length) {
|
||||||
|
this._closeButtons.push(closeButtons[closeButtons.length - 1]);
|
||||||
|
this._closeClick(closeButtons[closeButtons.length - 1], 'on');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// set click listeners for tab & close buttons
|
||||||
|
for (i = 0; i < this._tabitems.length; i++) {
|
||||||
|
this._tabClick(this._tabitems[i], 'on');
|
||||||
|
}
|
||||||
|
|
||||||
|
// leaflet moves the returned container to the right place in the DOM
|
||||||
|
return container;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove this sidebar from the map.
|
||||||
|
*
|
||||||
|
* @param {L.Map} map
|
||||||
|
* @returns {Sidebar}
|
||||||
|
*/
|
||||||
|
onRemove: function (map) {
|
||||||
|
var i;
|
||||||
|
|
||||||
|
this._map = null;
|
||||||
|
this._tabitems = [];
|
||||||
|
this._panes = [];
|
||||||
|
this._closeButtons = [];
|
||||||
|
|
||||||
|
// Remove click listeners for tab & close buttons
|
||||||
|
for (i = 0; i < this._tabitems.length; i++)
|
||||||
|
this._tabClick(this._tabitems[i], 'off');
|
||||||
|
|
||||||
|
for (i = 0; i < this._closeButtons.length; i++)
|
||||||
|
this._closeClick(this._closeButtons[i], 'off');
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @method addTo(map: Map): this
|
||||||
|
* Adds the control to the given map. Overrides the implementation of L.Control,
|
||||||
|
* changing the DOM mount target from map._controlContainer.topleft to map._container
|
||||||
|
*/
|
||||||
|
addTo: function (map) {
|
||||||
|
this.onRemove();
|
||||||
|
this._map = map;
|
||||||
|
|
||||||
|
this._container = this.onAdd(map);
|
||||||
|
|
||||||
|
L.DomUtil.addClass(this._container, 'leaflet-control');
|
||||||
|
L.DomUtil.addClass(this._container, 'leaflet-sidebar-' + this.getPosition());
|
||||||
|
if (L.Browser.touch)
|
||||||
|
L.DomUtil.addClass(this._container, 'leaflet-touch');
|
||||||
|
|
||||||
|
// when adding to the map container, we should stop event propagation
|
||||||
|
L.DomEvent.disableScrollPropagation(this._container);
|
||||||
|
L.DomEvent.disableClickPropagation(this._container);
|
||||||
|
L.DomEvent.on(this._container, 'contextmenu', L.DomEvent.stopPropagation);
|
||||||
|
|
||||||
|
// insert as first child of map container (important for css)
|
||||||
|
map._container.insertBefore(this._container, map._container.firstChild);
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @deprecated - Please use remove() instead of removeFrom(), as of Leaflet 0.8-dev, the removeFrom() has been replaced with remove()
|
||||||
|
* Removes this sidebar from the map.
|
||||||
|
* @param {L.Map} map
|
||||||
|
* @returns {Sidebar}
|
||||||
|
*/
|
||||||
|
removeFrom: function(map) {
|
||||||
|
console.warn('removeFrom() has been deprecated, please use remove() instead as support for this function will be ending soon.');
|
||||||
|
this._map._container.removeChild(this._container);
|
||||||
|
this.onRemove(map);
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Open sidebar (if it's closed) and show the specified tab.
|
||||||
|
*
|
||||||
|
* @param {string} id - The ID of the tab to show (without the # character)
|
||||||
|
* @returns {L.Control.Sidebar}
|
||||||
|
*/
|
||||||
|
open: function(id) {
|
||||||
|
var i, child, tab;
|
||||||
|
|
||||||
|
// If panel is disabled, stop right here
|
||||||
|
tab = this._getTab(id);
|
||||||
|
if (L.DomUtil.hasClass(tab, 'disabled'))
|
||||||
|
return this;
|
||||||
|
|
||||||
|
// Hide old active contents and show new content
|
||||||
|
for (i = 0; i < this._panes.length; i++) {
|
||||||
|
child = this._panes[i];
|
||||||
|
if (child.id === id)
|
||||||
|
L.DomUtil.addClass(child, 'active');
|
||||||
|
else if (L.DomUtil.hasClass(child, 'active'))
|
||||||
|
L.DomUtil.removeClass(child, 'active');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Remove old active highlights and set new highlight
|
||||||
|
for (i = 0; i < this._tabitems.length; i++) {
|
||||||
|
child = this._tabitems[i];
|
||||||
|
if (child.querySelector('a').hash === '#' + id)
|
||||||
|
L.DomUtil.addClass(child, 'active');
|
||||||
|
else if (L.DomUtil.hasClass(child, 'active'))
|
||||||
|
L.DomUtil.removeClass(child, 'active');
|
||||||
|
}
|
||||||
|
|
||||||
|
this.fire('content', { id: id });
|
||||||
|
|
||||||
|
// Open sidebar if it's closed
|
||||||
|
if (L.DomUtil.hasClass(this._container, 'collapsed')) {
|
||||||
|
this.fire('opening');
|
||||||
|
L.DomUtil.removeClass(this._container, 'collapsed');
|
||||||
|
if (this.options.autopan) this._panMap('open');
|
||||||
|
}
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Close the sidebar (if it's open).
|
||||||
|
*
|
||||||
|
* @returns {L.Control.Sidebar}
|
||||||
|
*/
|
||||||
|
close: function() {
|
||||||
|
var i;
|
||||||
|
|
||||||
|
// Remove old active highlights
|
||||||
|
for (i = 0; i < this._tabitems.length; i++) {
|
||||||
|
var child = this._tabitems[i];
|
||||||
|
if (L.DomUtil.hasClass(child, 'active'))
|
||||||
|
L.DomUtil.removeClass(child, 'active');
|
||||||
|
}
|
||||||
|
|
||||||
|
// close sidebar, if it's opened
|
||||||
|
if (!L.DomUtil.hasClass(this._container, 'collapsed')) {
|
||||||
|
this.fire('closing');
|
||||||
|
L.DomUtil.addClass(this._container, 'collapsed');
|
||||||
|
if (this.options.autopan) this._panMap('close');
|
||||||
|
}
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add a panel to the sidebar
|
||||||
|
*
|
||||||
|
* @example
|
||||||
|
* sidebar.addPanel({
|
||||||
|
* id: 'userinfo',
|
||||||
|
* tab: '<i class="fa fa-gear"></i>',
|
||||||
|
* pane: someDomNode.innerHTML,
|
||||||
|
* position: 'bottom'
|
||||||
|
* });
|
||||||
|
*
|
||||||
|
* @param {Object} [data] contains the data for the new Panel:
|
||||||
|
* @param {String} [data.id] the ID for the new Panel, must be unique for the whole page
|
||||||
|
* @param {String} [data.position='top'] where the tab will appear:
|
||||||
|
* on the top or the bottom of the sidebar. 'top' or 'bottom'
|
||||||
|
* @param {HTMLString} {DOMnode} [data.tab] content of the tab item, as HTMLstring or DOM node
|
||||||
|
* @param {HTMLString} {DOMnode} [data.pane] content of the panel, as HTMLstring or DOM node
|
||||||
|
* @param {String} [data.link] URL to an (external) link that will be opened instead of a panel
|
||||||
|
* @param {String} [data.title] Title for the pane header
|
||||||
|
* @param {String} {Function} [data.button] URL to an (external) link or a click listener function that will be opened instead of a panel
|
||||||
|
* @param {bool} [data.disabled] If the tab should be disabled by default
|
||||||
|
*
|
||||||
|
* @returns {L.Control.Sidebar}
|
||||||
|
*/
|
||||||
|
addPanel: function(data) {
|
||||||
|
var pane, tab, tabHref, closeButtons, content;
|
||||||
|
|
||||||
|
// Create tab node
|
||||||
|
tab = L.DomUtil.create('li', data.disabled ? 'disabled' : '');
|
||||||
|
tabHref = L.DomUtil.create('a', '', tab);
|
||||||
|
tabHref.href = '#' + data.id;
|
||||||
|
tabHref.setAttribute('role', 'tab');
|
||||||
|
tabHref.innerHTML = data.tab;
|
||||||
|
tab._sidebar = this;
|
||||||
|
tab._id = data.id;
|
||||||
|
tab._button = data.button; // to allow links to be disabled, the href cannot be used
|
||||||
|
if (data.title && data.title[0] !== '<') tab.title = data.title;
|
||||||
|
|
||||||
|
// append it to the DOM and store JS references
|
||||||
|
if (data.position === 'bottom')
|
||||||
|
this._tabContainerBottom.appendChild(tab);
|
||||||
|
else
|
||||||
|
this._tabContainerTop.appendChild(tab);
|
||||||
|
|
||||||
|
this._tabitems.push(tab);
|
||||||
|
|
||||||
|
// Create pane node
|
||||||
|
if (data.pane) {
|
||||||
|
if (typeof data.pane === 'string') {
|
||||||
|
// pane is given as HTML string
|
||||||
|
pane = L.DomUtil.create('DIV', 'leaflet-sidebar-pane', this._paneContainer);
|
||||||
|
content = '';
|
||||||
|
if (data.title)
|
||||||
|
content += '<h1 class="leaflet-sidebar-header">' + data.title;
|
||||||
|
if (this.options.closeButton)
|
||||||
|
content += '<span class="leaflet-sidebar-close"><i class="fa fa-caret-' + this.options.position + '"></i></span>';
|
||||||
|
if (data.title)
|
||||||
|
content += '</h1>';
|
||||||
|
pane.innerHTML = content + data.pane;
|
||||||
|
} else {
|
||||||
|
// pane is given as DOM object
|
||||||
|
pane = data.pane;
|
||||||
|
this._paneContainer.appendChild(pane);
|
||||||
|
}
|
||||||
|
pane.id = data.id;
|
||||||
|
|
||||||
|
this._panes.push(pane);
|
||||||
|
|
||||||
|
// Save references to close button & register click listener
|
||||||
|
closeButtons = pane.querySelectorAll('.leaflet-sidebar-close');
|
||||||
|
if (closeButtons.length) {
|
||||||
|
// select last button, because thats rendered on top
|
||||||
|
this._closeButtons.push(closeButtons[closeButtons.length - 1]);
|
||||||
|
this._closeClick(closeButtons[closeButtons.length - 1], 'on');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Register click listeners, if the sidebar is on the map
|
||||||
|
this._tabClick(tab, 'on');
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Removes a panel from the sidebar
|
||||||
|
*
|
||||||
|
* @example
|
||||||
|
* sidebar.remove('userinfo');
|
||||||
|
*
|
||||||
|
* @param {String} [id] the ID of the panel that is to be removed
|
||||||
|
* @returns {L.Control.Sidebar}
|
||||||
|
*/
|
||||||
|
removePanel: function(id) {
|
||||||
|
var i, j, tab, pane, closeButtons;
|
||||||
|
|
||||||
|
// find the tab & panel by ID, remove them, and clean up
|
||||||
|
for (i = 0; i < this._tabitems.length; i++) {
|
||||||
|
if (this._tabitems[i]._id === id) {
|
||||||
|
tab = this._tabitems[i];
|
||||||
|
|
||||||
|
// Remove click listeners
|
||||||
|
this._tabClick(tab, 'off');
|
||||||
|
|
||||||
|
tab.remove();
|
||||||
|
this._tabitems.splice(i, 1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (i = 0; i < this._panes.length; i++) {
|
||||||
|
if (this._panes[i].id === id) {
|
||||||
|
pane = this._panes[i];
|
||||||
|
closeButtons = pane.querySelectorAll('.leaflet-sidebar-close');
|
||||||
|
for (j = 0; j < closeButtons.length; j++) {
|
||||||
|
this._closeClick(closeButtons[j], 'off');
|
||||||
|
}
|
||||||
|
|
||||||
|
pane.remove();
|
||||||
|
this._panes.splice(i, 1);
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* enables a disabled tab/panel
|
||||||
|
*
|
||||||
|
* @param {String} [id] ID of the panel to enable
|
||||||
|
* @returns {L.Control.Sidebar}
|
||||||
|
*/
|
||||||
|
enablePanel: function(id) {
|
||||||
|
var tab = this._getTab(id);
|
||||||
|
L.DomUtil.removeClass(tab, 'disabled');
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* disables an enabled tab/panel
|
||||||
|
*
|
||||||
|
* @param {String} [id] ID of the panel to disable
|
||||||
|
* @returns {L.Control.Sidebar}
|
||||||
|
*/
|
||||||
|
disablePanel: function(id) {
|
||||||
|
var tab = this._getTab(id);
|
||||||
|
L.DomUtil.addClass(tab, 'disabled');
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* (un)registers the onclick event for the given tab,
|
||||||
|
* depending on the second argument.
|
||||||
|
* @private
|
||||||
|
*
|
||||||
|
* @param {DOMelement} [tab]
|
||||||
|
* @param {String} [on] 'on' or 'off'
|
||||||
|
*/
|
||||||
|
_tabClick: function(tab, on) {
|
||||||
|
var link = tab.querySelector('a');
|
||||||
|
if (!link.hasAttribute('href') || link.getAttribute('href')[0] !== '#')
|
||||||
|
return;
|
||||||
|
|
||||||
|
var onTabClick = function(e) {
|
||||||
|
// `this` points to the tab DOM element!
|
||||||
|
if (L.DomUtil.hasClass(this, 'active')) {
|
||||||
|
this._sidebar.close();
|
||||||
|
} else if (!L.DomUtil.hasClass(this, 'disabled')) {
|
||||||
|
if (typeof this._button === 'string') // an url
|
||||||
|
window.location.href = this._button;
|
||||||
|
else if (typeof this._button === 'function') // a clickhandler
|
||||||
|
this._button(e);
|
||||||
|
else // a normal pane
|
||||||
|
this._sidebar.open(this.querySelector('a').hash.slice(1));
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (on === 'on') {
|
||||||
|
L.DomEvent
|
||||||
|
.on(tab.querySelector('a'), 'click', L.DomEvent.preventDefault)
|
||||||
|
.on(tab.querySelector('a'), 'click', onTabClick, tab);
|
||||||
|
} else {
|
||||||
|
L.DomEvent.off(tab.querySelector('a'), 'click', onTabClick);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
onCloseClick: function() {
|
||||||
|
this.close();
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* (un)registers the onclick event for the given close button
|
||||||
|
* depending on the second argument
|
||||||
|
* @private
|
||||||
|
*
|
||||||
|
* @param {DOMelement} [closeButton]
|
||||||
|
* @param {String} [on] 'on' or 'off'
|
||||||
|
*/
|
||||||
|
_closeClick: function(closeButton, on) {
|
||||||
|
if (on === 'on') {
|
||||||
|
L.DomEvent.on(closeButton, 'click', this.onCloseClick, this);
|
||||||
|
} else {
|
||||||
|
L.DomEvent.off(closeButton, 'click', this.onCloseClick);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Finds & returns the DOMelement of a tab
|
||||||
|
*
|
||||||
|
* @param {String} [id] the id of the tab
|
||||||
|
* @returns {DOMelement} the tab specified by id, null if not found
|
||||||
|
*/
|
||||||
|
_getTab: function(id) {
|
||||||
|
for (var i = 0; i < this._tabitems.length; i++) {
|
||||||
|
if (this._tabitems[i]._id === id)
|
||||||
|
return this._tabitems[i];
|
||||||
|
}
|
||||||
|
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Helper for autopan: Pans the map for open/close events
|
||||||
|
*
|
||||||
|
* @param {String} [openClose] The behaviour to enact ('open' | 'close')
|
||||||
|
*/
|
||||||
|
_panMap: function(openClose) {
|
||||||
|
var panWidth = Number.parseInt(L.DomUtil.getStyle(this._container, 'max-width')) / 2;
|
||||||
|
if (
|
||||||
|
openClose === 'open' && this.options.position === 'left' ||
|
||||||
|
openClose === 'close' && this.options.position === 'right'
|
||||||
|
) panWidth *= -1;
|
||||||
|
this._map.panBy([panWidth, 0], { duration: 0.5 });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Create a new sidebar.
|
||||||
|
*
|
||||||
|
* @example
|
||||||
|
* var sidebar = L.control.sidebar({ container: 'sidebar' }).addTo(map);
|
||||||
|
*
|
||||||
|
* @param {Object} [options] - Optional options object
|
||||||
|
* @param {string} [options.autopan=false] - whether to move the map when opening the sidebar to make maintain the visible center point
|
||||||
|
* @param {string} [options.position=left] - Position of the sidebar: 'left' or 'right'
|
||||||
|
* @param {string} [options.container] - ID of a predefined sidebar container that should be used
|
||||||
|
* @param {boolean} [data.close=true] Whether to add a close button to the pane header
|
||||||
|
* @returns {Sidebar} A new sidebar instance
|
||||||
|
*/
|
||||||
|
L.control.sidebar = function(options, deprecated) {
|
||||||
|
return new L.Control.Sidebar(options, deprecated);
|
||||||
|
};
|
||||||
1
librerias/leaflet/js/leaflet-sidebar.min.js
vendored
Executable file
1
librerias/leaflet/js/leaflet-sidebar.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
24
mapero.php
24
mapero.php
@ -347,7 +347,7 @@ $leyenda ="<div id='div_leyenda'><a class='btn btn-default btn-xs' onclick=xaja
|
|||||||
|
|
||||||
|
|
||||||
var tiles = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
var tiles = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||||
maxZoom: 18,
|
maxZoom:19,
|
||||||
attribution: '<a href="https://tupale.co">https://tupale.co</a> © <a href="https://openstreetmap.org/copyright">OpenStreetMap</a> contributors'
|
attribution: '<a href="https://tupale.co">https://tupale.co</a> © <a href="https://openstreetmap.org/copyright">OpenStreetMap</a> contributors'
|
||||||
}),
|
}),
|
||||||
latlng = L.latLng(4, -74.9005222);
|
latlng = L.latLng(4, -74.9005222);
|
||||||
@ -358,6 +358,7 @@ $leyenda ="<div id='div_leyenda'><a class='btn btn-default btn-xs' onclick=xaja
|
|||||||
var geojson = L.geoJson(geojsonSample, {
|
var geojson = L.geoJson(geojsonSample, {
|
||||||
|
|
||||||
pointToLayer: function(feature, latlng) {
|
pointToLayer: function(feature, latlng) {
|
||||||
|
|
||||||
var smallIcon = new L.Icon({
|
var smallIcon = new L.Icon({
|
||||||
iconSize: [100, 100],
|
iconSize: [100, 100],
|
||||||
iconAnchor: [13, 27],
|
iconAnchor: [13, 27],
|
||||||
@ -377,28 +378,7 @@ onEachFeature: function(feature, layer) {
|
|||||||
layer.bindPopup(popupText); }
|
layer.bindPopup(popupText); }
|
||||||
});
|
});
|
||||||
|
|
||||||
/*
|
|
||||||
var geojsonAux = L.geoJson(geojsonAuxiliar, {
|
|
||||||
|
|
||||||
pointToLayer: function(feature, latlng) {
|
|
||||||
var smallIcon = new L.Icon({
|
|
||||||
iconSize: [60, 60],
|
|
||||||
iconAnchor: [13, 27],
|
|
||||||
popupAnchor: [1, -24],
|
|
||||||
|
|
||||||
iconUrl: "http://localhost/default/tupali/milfs/images/secure/?file=150/da6d16547658ebc06c5378b30d1ee4bf.png"
|
|
||||||
|
|
||||||
});
|
|
||||||
return L.marker(latlng, {icon: smallIcon});
|
|
||||||
},
|
|
||||||
|
|
||||||
onEachFeature: function(feature, layer) {
|
|
||||||
var popupText = feature.properties.description
|
|
||||||
|
|
||||||
|
|
||||||
layer.bindPopup(popupText); }
|
|
||||||
});
|
|
||||||
*/
|
|
||||||
<?php echo $layer; ?>
|
<?php echo $layer; ?>
|
||||||
var markers = L.markerClusterGroup();
|
var markers = L.markerClusterGroup();
|
||||||
markers.addLayer(geojson);
|
markers.addLayer(geojson);
|
||||||
|
|||||||
2
milfs
2
milfs
@ -1 +1 @@
|
|||||||
Subproject commit debb238d179a35513955d1c9fde4f0e3c39d416a
|
Subproject commit 9a89a921e03bca67d97921b5e36fbac655a3e678
|
||||||
Loading…
Reference in New Issue
Block a user