qwerty/milfs
2
0
Fork 2
Code Issues 6 Pull Requests 1 Releases Wiki Activity

Compare commits

base: qwerty:master
Branches Tags
qwerty:master
qwerty:dev7
qwerty:modo_menu
qwerty:portalconsulta
qwerty:responsive
qwerty:v3
qwerty:v4
qwerty:gh-pages
qwerty:01
..
compare: qwerty:responsive
Branches Tags
qwerty:master
qwerty:dev7
qwerty:modo_menu
qwerty:portalconsulta
qwerty:responsive
qwerty:v3
qwerty:v4
qwerty:gh-pages
qwerty:01

No commits in common. "master" and "responsive" have entirely different histories.
master ... responsive

8 changed files with 275 additions and 1698 deletions
Show Stats Expand all files Collapse all files

2
api.php
View File

@ -1,6 +1,6 @@
<?php
//session_start();
//ini_set('display_errors', 'On');
ini_set('display_errors', 'On');
require ('xajax/xajax.inc.php');
$xajax = new xajax();

83
css/mapero.css
View File

@ -1,83 +0,0 @@
body { margin:0; padding:0; overflow:hidden; touch-action:none; }
#map { position:absolute; top:0; bottom:0; width:100%; overflow:hidden; }
p {font-size: 14px;}
#sidebar {
z-index: 10; position: absolute; right: 10px; top: 10px; width: 320px;
background-color:rgba(255,255,255,.9); padding: 20px; border-radius: 3px; }
#title h1 { color: #390; }
#introduction p { margin-bottom: 10px; line-height: 1.5em }
#taxas>div { display: inline-block; }
#taxas p { text-align: center; }
.button {
background-color: #fff; background-size:cover;
border-radius: 5px; border: #390 1px solid; height:48px; width: 48px;
margin: 4px; margin-left: 8px;
}
.button.active { border:color:#390; }
.button:hover { border-color: #390; }
.button#Plantae { background-image: url('img/icon0_plantae.png') }
.button#Aves { background-image: url('img/icon0_aves.png') }
.button#Insecta { background-image: url('img/icon0_insecta.png') }
.button#Fungi { background-image: url('img/icon0_fungi.png') }
.button#Plantae.active { background-image: url('img/icon1_plantae.png') }
.button#Aves.active { background-image: url('img/icon1_aves.png') }
.button#Insecta.active { background-image: url('img/icon1_insecta.png') }
.button#Fungi.active { background-image: url('img/icon1_fungi.png') }
.button#Plantae:hover { background-image: url('img/icon1_plantae.png') }
.button#Aves:hover { background-image: url('img/icon1_aves.png') }
.button#Insecta:hover { background-image: url('img/icon1_insecta.png') }
.button#Fungi:hover { background-image: url('img/icon1_fungi.png') }
.marker {
border: #fff 1.4px solid; border-radius: 50%; cursor: pointer; box-shadow: 1px 1px 1px;
height: 48px; width: 48px; margin: -24px 0 0 -24px;
background-size: cover; }
.marker:hover { z-index: 1; border-color: #390; }
.marker.sm {
background-color: none; border-width: 0; box-shadow: 0 0 0;
height: 32px; width: 32px; margin-left: -16px; margin-top:-16px;}
.marker.sm:hover { border: #fff 1px solid; }
#me { height: 16px; width: 16px; background-size: 100% 100%; }
.mapboxgl-ctrl-geocoder { z-index: 0; }
.mapboxgl-popup { width: 280px; }
.mapboxgl-popup-close-button { background-color: rgba(255,255,255,.9); height: 30px; width: 30px; font-size: 18px; padding:2px; border-radius: 1px;}
.mapboxgl-popup p { font-size: 12px; line-height: 16px; margin-top:6px;}
.img-md { height: 260px; width:260px; background-position: center center; background-repeat: no-repeat; background-size: cover; }
.loading { display:none; }
@media only screen and (max-width: 479px) {
.mobile-hide{ display: none; }
.mobile-show{ display: inline-block !important; }
#sidebar {
z-index: 2; border-radius: 0; padding:2vh 4vw 2vh 4vw;
position: absolute; width:100%; height:150px;
bottom: 30px; left:0; right:0; top:inherit;
}
#sidebar p { margin-bottom: 2vh; font-size: 1em; }
#title { margin-bottom: 2vh; }
#title h1 { font-size: 20px; line-height: 26px; display: inline-block; }
#info {
height:18px; width:18px; display: inline-block; margin-left:3px;
background-image: url('img/arrow_down.svg'); background-size:cover; }
.button { width:15vw; margin: .5vh 1vw .5vh 10vw; height:15vw;}
.button:first-of-type { margin-left:5vw; }
.button img { height:100%; width: 100%; }
#taxas p { text-align: center; margin-left: 5vw; }
.mapboxgl-popup-content { padding: 1vw; padding-bottom: 2vw; }
.mapboxgl-popup { width: 52vw; }
.img-md { height: 50vw; width: 50vw;}
}

1672
funciones/funciones.php
View File

File diff suppressed because it is too large Load Diff

2
geojson.js.php
View File

@ -11,7 +11,7 @@ require ("funciones/conex.php");
if(isset($_REQUEST['buscar'])){$buscar=$_REQUEST['buscar'];}else{$buscar="";}
if(isset($_REQUEST['item'])){$item=$_REQUEST['item'];}else{$item="";}
if(isset($_REQUEST['id'])){$id=$_REQUEST['id'];}else{$id="";}
//echo print_r($_SERVER);
$geojson = imprime_geojson("$id","","mapa","$buscar","$item","");
//header('Content-Type: application/json');
echo "let geojsonSample = [";

BIN
images/iconos/marker.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 1.5 KiB

BIN
images/iconos/pin.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
images/iconos/rojo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 907 B

After

Width:  |  Height:  |  Size: 1.6 KiB

214
js/mapero.js
View File

@ -1,214 +0,0 @@
mapboxgl.accessToken = 'pk.eyJ1IjoieXVuamllIiwiYSI6ImNpZnd0ZjZkczNjNHd0Mm0xcGRoc21nY28ifQ.8lFXo9aC9PfoKQF9ywWW-g';
//var sfmapbox = [-122.413692, 37.775712];
var sfmapbox = [-72, 4];
// sfmapbox = [-122,37];
var mylocation = sfmapbox;
var taxon_active = 'Plantae';
var markers = {};
var marker_me;
// Create a new dark theme map
var map = new mapboxgl.Map({
container: 'map', // container id
style: 'mapbox://styles/mapbox/outdoors-v9', //stylesheet location
center: sfmapbox, // Center of USA
zoom: 12, // starting zoom
// minZoom: 11,
});
map.on('load', function() {
// Disable scroll in posts
if (window.location.search.indexOf('embed') !== -1) map.scrollZoom.disable();
//Add controls for navigation, geocoding and geolocation
var geocoder = new mapboxgl.Geocoder();
map.addControl(geocoder);
map.addControl ( new mapboxgl.Navigation({ position: 'top-left' }) );
var geolocator = new mapboxgl.Geolocate({ position: 'top-left' });
map.addControl(geolocator);
//go to SF and retrieve data
mapMe(mylocation);
getObservation(mylocation, taxon_active);
//Toggle icons in the event of zoom change
map.on('zoom', function() {
var zoom = map.getZoom();
$('.marker').each(function() {
checkZoom(this, zoom);
});
});
//Interact with taxas buttons
$('.button').on('click', function() {
$('.button').removeClass('active');
$(this).addClass('active');
taxon_active = $(this).attr('id');
getObservation(mylocation, taxon_active);
$('.mapboxgl-popup') ? $('.mapboxgl-popup').remove() : null;
});
//Redo quest on location change
geocoder.on('result', function(e) {
// window.alert('new location: ' + e.result.center);
mylocation = e.result.center;
getObservation(mylocation, taxon_active);
mapMe(mylocation);
$('.mapboxgl-popup') ? $('.mapboxgl-popup').remove() : null;
});
//Redo quest on geolocation
geolocator.on('geolocate', function(position) {
mylocation = [position.coords.longitude, position.coords.latitude];
map.zoomTo(12);
mapMe(mylocation);
getObservation(mylocation, taxon_active);
});
//Mobile friendly
$('#info').on('click', function() {
if ( $('#introduction').is(':visible') ) {
$('#introduction').hide();
$('#info').css('background-image', 'url(img/arrow_down.svg)');
$('#sidebar').css('height', '150px');
} else {
$('#introduction').show();
$('#info').css("background-image", 'url(img/arrow_up.svg)');
$('#sidebar').css('height', '240px');
}
})
});
// Map the user location using a marker called me
function mapMe(location) {
if (!document.getElementById('me')) {
var me = document.createElement('div');
me.id = "me";
me.style.backgroundImage = 'url(img/icon_me.png)';
marker_me = new mapboxgl.Marker(me)
.setLngLat(location)
.addTo(map);
} else {
marker_me.setLngLat(location);
}
map.flyTo({ 'center': location, 'zoom': 12 });
}
// Retrieve from API, map the markers to the map, and save relevant data in html. Pop-ups for marker on click.
function getObservation(location, taxon) {
$('.loading').show();
// clean up previous markers
for (marker in markers) {
markers[marker].remove();
}
markers = {};
//create url
var iNat_url = createURL(location, taxon);
// get results from url
try {
iNat_results = $.getJSON(iNat_url, function() {
// console.log("API results: ", iNat_results.responseJSON.results);
// Update count in html description
$('#count').html(iNat_results.responseJSON.features.length);
// Used for marker change on zoom level
var zoom = map.getZoom();
// Iterate through all API results
iNat_results.responseJSON.features.forEach(function(marker) {
// create an img element for the marker
var el = document.createElement('div');
el.className = 'marker';
//img_url = marker.photos[0].url;
img_url = marker.properties.imagen;
// text description for popup
var species = marker.species_guess ? marker.species_guess : 'Unknown';
//var user = marker.user.name ? marker.user.name : 'Anonymous';
var user = marker.properties.title ? marker.properties.title : 'Anonymous';
text = species + ' observed on ' + marker.properties.time + ' by ' + user + ' - ';
text = text.charAt(0).toUpperCase() + text.substr(1);
// img_url = img_url.replace("http", "https");
//$(el).attr('data-img', img_url);
$(el).attr('data-img', img_url);
// $(el).attr('data-taxon', taxon);
//$(el).attr('data-text', text);
$(el).attr('data-text', marker.properties.title);
$(el).attr('html', marker.properties.description);
//$(el).html(marker.properties.description);
$(el).attr('data-link', marker.properties.uri);
$(el).attr('data-link', marker.properties.imagen);
//$(el).attr('data-latlon', marker.geojson.coordinates);
$(el).attr('data-latlon', marker.geometry.coordinates);
// Map to the map with markers for the current zoomlevel
checkZoom(el, zoom);
// add marker to map
// markers[marker.id] = new mapboxgl.Marker(el)
markers[marker.control] = new mapboxgl.Marker(el)
// .setLngLat(marker.geojson.coordinates)
.setLngLat(marker.geometry.coordinates)
.addTo(map);
});
$('.loading').hide();
// markers on click
$('.marker').click(function(e) {
e.stopPropagation();
var latlon = $(this).attr('data-latlon').split(",");
latlon = [Number(latlon[0]), Number(latlon[1])];
var descripcion = $(this).attr('html');//.replace('square', 'medium');
$('.mapboxgl-popup') ? $('.mapboxgl-popup').remove() : null;
var popup = new mapboxgl.Popup()
.setLngLat(latlon)
.setHTML(descripcion)
.addTo(map);
});
});
} catch (e) {
window.alert("API not working properly :(")
}
}
// Create the url for API request
function createURL(location, taxon) {
//url = ['https://api.inaturalist.org/v1/observations?geo=true&native=true&photos=true&lat=',location[1], '&lng=', location[0], '&radius=5&iconic_taxa=', taxon, '&order=desc&order_by=created_at'].join('');
url = ['http://localhost/tupali/archivos/74.geojson'].join('');
console.log("API url: ", url);
return url;
}
// Check what zoom level for what markers, then map to map
function checkZoom(marker, zoom) {
var img;
if (zoom < 12) {
$(marker).addClass('sm');
// img = 'url(img/marker_' + $(marker).attr('data-taxon').toLowerCase() + '.png)';
// img = 'url(img/marker_' + $(marker).attr('data-taxon').toLowerCase() + '.png)';
img = 'url(https://tupale.co/milfs/images/secure/?file=150/da6d16547658ebc06c5378b30d1ee4bf.png)';
$(marker).css("background-image", img);
} else {
$(marker).removeClass('sm');
img = 'url(' + $(marker).attr('data-img') + ')';
// img = 'url(https://tupale.co/milfs/images/secure/?file=150/da6d16547658ebc06c5378b30d1ee4bf.png)';
$(marker).css("background-image", img);
};
}