"+message+"
");
}
function closeBox(){
$("#loading").dialog("close");
}
// -------------------------------------------------------------------
// Opacity control
// -------------------------------------------------------------------
$("#opacity-bar").slider({
value:_opacityLand0*100,
min:0.0,
max:100,
change: function(event,ui){
let nx=$("#opacity-bar").slider("value");
emodnetLand.setOpacity(nx/100);
}
});
$("#tooltip").hide();
/////////////////////////////////////////////////////
// Main options
/////////////////////////////////////////////////////
// -------------------------------------------------------------------
// Loading dialog
// -------------------------------------------------------------------
$("#loading").dialog({
autoOpen: false,
height: 250,
width: 500,
modal: true,
draggable: false,
resizable: false,
closeOnEscape: false,
title: 'Un moment, si us plau',
open: function(event, ui) {
$(".ui-dialog-titlebar-close", ui.dialog || ui).hide();
},
close: function () {
}
});
// -------------------------------------------------------------------
// Scale barr
// -------------------------------------------------------------------
var putScale = function() {
if (map.getControls().get("length") == _totalControls){
map.removeControl(_scaleControl);
} else {
map.addControl(_scaleControl);
}
}
// -------------------------------------------------------------------
// Screen-shot
// -------------------------------------------------------------------
var snapShot = function() {
var exportpng= document.querySelector('#snapshot');
map.once('rendercomplete', function(event) {
domtoimage.toPng(map.getViewport().querySelector('.ol-layers')).then(function(dataUrl) {
var tmpa = document.createElement('a');
tmpa.href =dataUrl;
tmpa.download = 'senderisme_i_teca.png';
tmpa.style = 'display: none';
exportpng.parentNode.appendChild(tmpa);
tmpa.click();
tmpa.remove();
});
});
map.renderSync();
};
// -------------------------------------------------------------------
// Center map to its original position and zoom
// -------------------------------------------------------------------
function centerMap(){
map.getView().setCenter(_center);
map.getView().setZoom(_zoom0);
}
// Load location and routes data
var sourceRoutes = [];
var Routes = []
var Rfeatures=[];
var startingPointStyle=[];
var banderetaNou=[];
for (i=0;i<4;i++){
banderetaNou[i]=MiICO+"bandereta_"+(i+1)+".png";
startingPointStyle[i]=new ol.style.Style({
image: new ol.style.Icon({
anchor: [13, 32],
anchorXUnits: 'pixels',
anchorYUnits: 'pixels',
src: banderetaNou[i]
}),
});
}
startingPointStyle[4]=new ol.style.Style({
image: new ol.style.Icon({
anchor: [13, 32],
anchorXUnits: 'pixels',
anchorYUnits: 'pixels',
src: MiICO+"bandereta.png"
}),
});
var startingPointStyleWiki=new ol.style.Style({
image: new ol.style.Icon({
anchor: [13, 32],
anchorXUnits: 'pixels',
anchorYUnits: 'pixels',
src: MiICO+"bandereta_v.png"
}),
});
let xmlFormat = new ol.format.OSMXML({});
var selected = null;
var closePop = function (){
isshowntrackinfo=false;
overlayPopup.setPosition(undefined);
closerPopup.blur();
}
closerPopup.onclick = function () {
closePop();
return false;
};
// Auto popup showin the name of the route
function checkRouteInfo(eve){
var feature= map.forEachFeatureAtPixel(eve.pixel, function (f) {
return f;
});
tooltip.style.display = feature ? '' : 'none';
if (feature) {
if (typeof feature.get('title') !== 'undefined') {
overlayTooltip.setPosition(eve.coordinate);
tooltip.innerHTML = feature.get('title');
} else {
tooltip.style.display = 'none';
}
}
}
function deleteTrack(){
if (track != null){
groupLayersUSER.getLayers().getArray().pop();
map.removeLayer(groupLayersUSER);
//track.setMap(null);
track=null;
trackHTML=textTrack("Track no seleccionat","No hi ha informació disponible.");
}
}
function showRouteInfo(eve){
var selectedtmp=null;
selectedtmp = map.forEachFeatureAtPixel(eve.pixel, function (f) {
return f;
});
if (selectedtmp == null) {
return false;
}
if (track != null){
if (typeof selectedtmp.get('name') !== 'undefined'){
if (selectedtmp.get('name') == "Consulteu la ruta"){
if (typeof selected.get('link') !== 'undefined') {
if (selected.get('win')=="_blank"){
window.open(selected.get('link'));
} else {
messageBox('Carregant la descripció');
window.location.href=selected.get('link');
}
return true;
}
}
}
}
if (selectedtmp.get('startPoint') != true) {
return false;
}
selected=selectedtmp.clone();
deleteTrack();
var randomNum=Math.random();
var titol=selected.get('title');
var titfunc=titol.replace(/'/g, "\\'");
var link=selected.get('link');
var imgsrc=selected.get('img');
var descripcio=selected.get('description');
var link_track=selected.get('link_track');
var idtrack=selected.get('name');
var kml=true;
if (idtrack*1>=10000){
kml=false;
}
//Posem les darreres rutes a la vista
html = '';
if (kml){
html += '
';
}
html += ''+titol+''
+ '
'+ descripcio + '' + '
';
}
html+= '';
contentPopup.innerHTML=html;
//$(".ol-popup-closer").show();
overlayPopup.setPosition(_coordMouse);
}
var isshowntrackinfo=false;
function showTrackInfo(){
var extent,lo;
if (isshowntrackinfo==true){
closePop();
} else {
contentPopup.innerHTML=trackHTML;
extent=map.getView().calculateExtent()
lo=extent[0]+(extent[2]-extent[0])/5
overlayPopup.setPosition([lo, extent[1]]);
isshowntrackinfo=true;
}
}
function textTrack(titol,desc){
var texte=''+ descripcio + '' + '
';
if ( link_track != ""){
html += '
';
}
if (!kml){
html += '
';
} else {
html += '';
}
if (!kml){
html += ''
+ '
'
+ ''+titol+''
+ '
'+desc+'' + '
';
return texte;
}
var trackHTML=textTrack("Track no seleccionat","No hi ha informació disponible.");
var trackX=[];
var trackZ=[];
function showTrack(url,titol,kml=true){
messageBox('Carregant el track');
trackHTML="";
var extension=null;
var styleFunction = function (feature) {
var name = feature.get('name');
var tmpext;
if (name == "Dades de la ruta"){ return null;}
if (name != "Consulteu la ruta"){
style = styles['geoMarker'];
if (name!="Path"){
style.getText().setText(name);
} else {
style.getText().setText("");
}
} else {
style =new ol.style.Style({
image: new ol.style.Icon({
anchor: [48, 48],
anchorXUnits: 'pixels',
anchorYUnits: 'pixels',
src: MiICO+"info.png?asdjj",
})
})
}
return style;
};
if (zxs == "") closePop();
// Put track
if (kml){
kmlformat=new ol.format.KML({
extractStyles:false,
});
sourceTrack=new ol.source.Vector({
url: url,
format: kmlformat,
});
} else {
gpxformat=new ol.format.GPX({
extractStyles:false,
});
sourceTrack=new ol.source.Vector({
url: url,
format: gpxformat,
});
}
var localtrack = new ol.layer.Vector({
title:titol,
source: sourceTrack,
style: styleFunction,
visible: true,
});
// Necessary because when track is called directly global variable track
// is not accessible inside collectKML (?)
var finished=false;
// Show info
$(document).ready(function () {
if (kml){
$.ajax({
type: "GET",
url: url,
dataType: "xml",
success: collectKML
});
} else {
$.ajax({
type: "GET",
url: url,
dataType: "xml",
success: collectGPX
});
}
});
function collectGPX(gpxDades){
if (!iskml){
$(gpxDades).find("trk").each(function () {
desc=$(this).find('desc').text();
});
} else {
desc=selected.get('description');
}
trackHTML=textTrack(titol,desc);
var coords=[];
var preextension;
preextension=[99999999,99999999,-99999999,-99999999];
var Dist=0;
var Puj=0;
const R=6371;
var latant=-9999;
var lonant=-9999;
var eleant=-9999;
var deg2rad=3.1415926/180.0;
$(gpxDades).find("trkpt").each(function () {
lat=parseFloat($(this).attr('lat'));
lon=parseFloat($(this).attr('lon'));
// ele=parseFloat($(this).find("ele").text());
if (latant == -9999) latant=lat;
if (lonant == -9999) lonant=lon;
// if (eleant == -9999) eleant=ele;
if (lon < preextension[0]) preextension[0]=lon;
if (lon > preextension[2]) preextension[2]=lon;
if (lat < preextension[1]) preextension[1]=lat;
if (lat > preextension[3]) preextension[3]=lat;
/* X=R*Math.cos(lat*deg2rad)*(lon-lonant)*deg2rad;
Y=R*(lat-latant)*deg2rad;
Z=ele-eleant;
Dist=Dist+Math.sqrt(X*X+Y*Y+Z*Z);
trackX.push(Dist);
if (Z>0) Puj+=Z;
trackZ.push(Z);*/
});
// console.log(trackX[trackX.length-1],Puj);
extension=ol.proj.transformExtent(preextension,'EPSG:4326',_projection);
extension[0]-=2000;
extension[1]-=2000;
extension[2]+=2000;
extension[3]+=2000;
map.getView().fit(extension);
var px,py;
px=extension[0]+(extension[2]-extension[0])*0.5;
py=extension[3]-2000;
if (zxs == ""){
var infopoint = new ol.geom.Point([px,py]);
var featureInfo = new ol.Feature({
name: "Consulteu la ruta",
title: "Premeu per consultar la ruta",
geometry: infopoint,
});
sourceTrack.addFeature(featureInfo);
}
closeBox();
finished=true;
return true;
}
function collectKML(kmlDades){
var coords=[];
const regex = /http:/g;
var preextension;
preextension=[99999999,99999999,-99999999,-99999999];
var descA=$(kmlDades).find('description').text().split("");
var desc=descA[0]+"";
if (desc.indexOf("Pujada acumulada")<0) desc=null;
if (desc == null){
desc="No hi ha informació disponible sobre aquest track";
} else {
descA[0]=desc.replace(regex, "https:");
desc=descA[0];
}
trackHTML = textTrack(titol,desc);
$(kmlDades).find("coordinates").each(function () {
coords.push($(this).text());
});
coords.forEach(function(item,index){
let lonlatz=item.split(",");
if (lonlatz[0] < preextension[0]) preextension[0]=lonlatz[0];
if (lonlatz[0] > preextension[2]) preextension[2]=lonlatz[0];
if (lonlatz[1] < preextension[1]) preextension[1]=lonlatz[1];
if (lonlatz[1] > preextension[3]) preextension[3]=lonlatz[1];
});
extension=ol.proj.transformExtent(preextension,'EPSG:4326',_projection);
extension[0]-=2000;
extension[1]-=2000;
extension[2]+=2000;
extension[3]+=2000;
map.getView().fit(extension);
if (zxs !=""){
_center=[0.5*(extension[0]+ extension[2]),0.5*(extension[1]+ extension[3])];
_zoom0=map.getView().getZoom();
}
var px,py;
px=extension[0]+(extension[2]-extension[0])*0.5;
py=extension[3]-2000;
if (zxs == ""){
var infopoint = new ol.geom.Point([px,py]);
var featureInfo = new ol.Feature({
name: "Consulteu la ruta",
title: "Premeu per consultar la ruta",
geometry: infopoint,
});
sourceTrack.addFeature(featureInfo);
}
closeBox();
finished=true;
return true;
}
function waituntilcharged(){
if (finished==true){
track=localtrack;
groupLayersUSER.getLayers().getArray().push(track);
map.addLayer(groupLayersUSER);
track.setVisible(true);
} else {
setTimeout(waituntilcharged, 10); // check ever 0.1 sec
}
}
waituntilcharged(); // Wait until all url have been charged
}
function loadRoutes(type){
var punt;
var estil;
$(document).ready(function () {
$.ajax({
type: "GET",
url:type,
dataType: "xml",
success: collectInfo
});
});
var html_routes=[];
var finished=false;
numberOfRoutes=Routes.length;
function collectInfo(xmlDades){
var i=0;
var totalRoutes=$(xmlDades).find("ruta").length;
$(xmlDades).find("ruta").each(function () {
idruta=$(this).attr('id');
lat=parseFloat($(this).attr('lat'));
lon=parseFloat($(this).attr('lon'));
punt=new ol.geom.Point(ol.proj.transform([lon,lat],'EPSG:4326',_projection));
link = $(this).attr('link');
link_track=$(this).attr('link_track');
titol=$(this).find('titol').text();
descripcio=$(this).find('descripcio').text();
if (idruta<10000){
imatge=MiFOT+idruta+".jpg";
} else {
imatge=MiICO+"banerkml.gif";
}
//Store data into feature for later use...
win="_self";
if (type == _XMLlistWiki) win="_blank";
Rfeatures.push(new ol.Feature({startPoint:true, win:win, geometry: punt,name: idruta, title:titol, description:descripcio, img:imatge, link:link, link_track:link_track}));
sourceRoutes.push(new ol.source.Vector());
sourceRoutes[numberOfRoutes].addFeature(Rfeatures[numberOfRoutes]);
if (type == _XMLlist){
if (i>=totalRoutes-4){
estil=startingPointStyle[totalRoutes-i-1];
html_routes[totalRoutes-i-1] = ''
+ ''+titol+''
+ ''+desc+'' + '
'
+ '
';
} else {
estil=startingPointStyle[4];
}
} else {
estil=startingPointStyleWiki;
}
Routes.push(new ol.layer.Vector({source:sourceRoutes[numberOfRoutes],name:idruta,style:estil,crossOrigin: 'anonymous', visible: true,}));
//Routes[i].setSource(sourceRoutes[i]);
Routes[numberOfRoutes].setMap(map);
numberOfRoutes++;
i=i+1;
});
if (type == _XMLlist){
var html_darreres = ''
+ '
'
+ ''+titol+''
+ '
'
+ '
'
+ ''+ descripcio + ''
+ '
';
for (j=0;j<4;j++){
html_darreres += html_routes[j];
}
html_darreres += '
';
// Afegim el text a les rutes destacades
document.getElementById("darreres_rutes").innerHTML =html_darreres;
}
finished=true;
return true;
}
function waituntilcharged(){
if (finished==true){
if (type == _XMLlist) {
loadRoutes(_XMLlistWiki);
} else {
map.addEventListener('pointermove',checkRouteInfo);
map.addEventListener('click',showRouteInfo);
}
} else {
setTimeout(waituntilcharged, 10); // check ever 0.1 sec
}
}
waituntilcharged(); // Wait until all url have been charged
}
var overlayTooltip = new ol.Overlay({
element: tooltip,
className: tooltip,
offset: [10, 0],
positioning: 'bottom-left'
});
$('.ol-zoom-in, .ol-zoom-out ').tooltip({
placement: 'right',
container: '#map',
});
$('.ol-rotate-reset, .ol-attribution button[title]').tooltip({
placement: 'left',
container: '#map',
});
function eventFire(el, etype){
if (el.fireEvent) {
el.fireEvent('on' + etype);
} else {
var evObj = document.createEvent('Events');
evObj.initEvent(etype, true, false);
el.dispatchEvent(evObj);
}
}
// -------------------------------------------------------------------
// init function
// -------------------------------------------------------------------
messageBox("Carregant mapa i rutes");
var titol_globus_punts="";
function CarregaMapa() {
$("#opacity-text").hide();
$("#opacity-bar").hide();
loadMap();
if (zxs!=""){
if (titol_globus_punts==""){
titol_globus_punts="El teu track";
}
closeBox();
if (zxs != "/wp-content/kml_googlemaps/999999_g.kml") {
showTrack(zxs+'?'+Math.random(),'"'+titol_globus_punts+'"',iskml);
}
} else {
loadRoutes(_XMLlist);
closeBox();
}
return;
}