|
|
@@ -34,10 +34,17 @@ include('server/server.php'); |
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
|
<title></title> |
|
|
|
<link rel="stylesheet" type="text/css" href="styles/style.css"> |
|
|
|
<link rel="stylesheet" type="text/css" href="scripts/leaflet/leaflet.css"> |
|
|
|
<script src="scripts/jquery-3.3.1.min.js"></script> |
|
|
|
<script src="scripts/p5.min.js"></script> |
|
|
|
<script src="scripts/leaflet/leaflet.js"></script> |
|
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" |
|
|
|
integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" |
|
|
|
crossorigin=""/> |
|
|
|
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js" |
|
|
|
integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew==" |
|
|
|
crossorigin=""></script> |
|
|
|
|
|
|
|
<!-- <link rel="stylesheet" type="text/css" href="scripts/leaflet/leaflet.css"> |
|
|
|
<script src="scripts/leaflet/leaflet.js"></script>--> |
|
|
|
|
|
|
|
<!-- |
|
|
|
<script src="sketch.js"></script> |
|
|
|
--> |
|
|
@@ -45,14 +52,17 @@ include('server/server.php'); |
|
|
|
|
|
|
|
<body> |
|
|
|
<script> |
|
|
|
let newWindow = false; |
|
|
|
let overlayWindow = false; |
|
|
|
|
|
|
|
|
|
|
|
var newWindow = false; |
|
|
|
var overlayWindow = false; |
|
|
|
var entry; |
|
|
|
var edit = true; |
|
|
|
var selected = 0; |
|
|
|
|
|
|
|
function overlay(leaflet_id){ |
|
|
|
if (newWindow){ |
|
|
|
newWindowToggle(); |
|
|
|
} |
|
|
|
overlayWindow = true; |
|
|
|
let entry; |
|
|
|
for(var i = 0; i < pointList.length; i++){ |
|
|
|
if(leaflet_id == pointList[i][1]){ |
|
|
|
entry = points[i]; |
|
|
@@ -61,29 +71,80 @@ include('server/server.php'); |
|
|
|
} |
|
|
|
} |
|
|
|
console.log(entry); |
|
|
|
//$('#overlay').empty(); |
|
|
|
|
|
|
|
$('#overlayTitle').html('<h2>' + entry[1] + '</h2>'); |
|
|
|
//$('#overlayBody').empty(); |
|
|
|
//if entry[4] is not null ... |
|
|
|
//$('#overlayBody').html('<div class="fb-page" data-href="https://www.facebook.com/pg/' + entry[4] + '/" data-tabs="timeline" data-width="' + overlayWidth + '" data-height="' + overlayHeight + '" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="false"></div>'); |
|
|
|
//$('#overlayBody').load('facebook.php?page=HBKsaar'); |
|
|
|
$('#overlayBody').attr('src', 'facebook.php?page=HBKsaar&height=' + overlayHeight.toString()); |
|
|
|
$('#overlay').show(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$('#overlayBody').attr('src',''); |
|
|
|
|
|
|
|
$('#overlayFooter').empty(); |
|
|
|
var initLoad; |
|
|
|
if(entry[4] != ""){ |
|
|
|
$('#overlayFooter').append('<div class="networkButton" onClick="loadWebsite(0)">facebook</div>'); |
|
|
|
initLoad = 0; |
|
|
|
} |
|
|
|
if(entry[5] != ""){ |
|
|
|
$('#overlayFooter').append('<div class="networkButton" onClick="loadWebsite(1)">instagram</div>'); |
|
|
|
initLoad = 1; |
|
|
|
} |
|
|
|
if(entry[6] != ""){ |
|
|
|
$('#overlayFooter').append('<div class="networkButton" onClick="loadWebsite(2)">twitter</div>'); |
|
|
|
initLoad = 2; |
|
|
|
} |
|
|
|
if(entry[8] != ""){ |
|
|
|
$('#overlayFooter').append('<div class="networkButton" onClick="loadWebsite(3)">website</div>'); |
|
|
|
initLoad = 3; |
|
|
|
} |
|
|
|
//$('#overlayBody').attr('src', 'facebook.php?page=HBKsaar&height=' + overlayHeight.toString()); |
|
|
|
$('#overlay').show(); |
|
|
|
$('#entryListe').hide(); |
|
|
|
$('#mapmenu').hide(); |
|
|
|
loadWebsite(initLoad); |
|
|
|
} |
|
|
|
|
|
|
|
function loadWebsite(type){ |
|
|
|
switch(type){ |
|
|
|
case(0): |
|
|
|
//$('#overlayBody').attr('src', 'expose.php?type=fb&page=' + entry[4] + '&height=' + overlayHeight.toString()); |
|
|
|
$('#overlayBody').attr('src', 'https://www.facebook.com/' + entry[4] + '/'); |
|
|
|
break; |
|
|
|
case(1): |
|
|
|
//$('#overlayBody').attr('src', 'expose.php?type=insta&page=' + entry[5] + '&height=' + overlayHeight.toString()); |
|
|
|
$('#overlayBody').attr('src', 'https://www.instagram.com/' + entry[5] + '/'); |
|
|
|
break; |
|
|
|
case(2): |
|
|
|
//$('#overlayBody').attr('src', 'expose.php?type=twitter&page=' + entry[6] + '&height=' + overlayHeight.toString()); |
|
|
|
$('#overlayBody').attr('src', 'https://www.twitter.com/' + entry[6] + '/'); |
|
|
|
break; |
|
|
|
case(3): |
|
|
|
$('#overlayBody').attr('src', entry[8]); |
|
|
|
break; |
|
|
|
default: |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
function trash(){ |
|
|
|
location.href = "server/server.php?delete=" + selected; |
|
|
|
} |
|
|
|
|
|
|
|
function editInstitute(){ |
|
|
|
closeOverlay(); |
|
|
|
newWindowToggle(); |
|
|
|
edit = true; |
|
|
|
console.log(entry); |
|
|
|
$('form#institutionForm').append('<input id="edit" type="hidden" value="' + entry[0] + '" name="edit"></input>'); |
|
|
|
$('#name').val(entry[1]); |
|
|
|
$('#loc').val(entry[3]); |
|
|
|
$('option').eq(entry[9]).prop('selected', true); |
|
|
|
$('#fb').val(entry[4]); |
|
|
|
$('#insta').val(entry[5]); |
|
|
|
$('#twitter').val(entry[6]); |
|
|
|
$('#web').val(entry[8]); |
|
|
|
} |
|
|
|
|
|
|
|
function closeOverlay(){ |
|
|
|
overlayWindow = false; |
|
|
|
$('#overlay').hide(); |
|
|
|
$('#entryListe').show(); |
|
|
|
$('#mapmenu').show(); |
|
|
|
} |
|
|
|
|
|
|
@@ -92,6 +153,7 @@ include('server/server.php'); |
|
|
|
$('#map').show(); |
|
|
|
$('#mapLink').hide(); |
|
|
|
$('#listLink').show(); |
|
|
|
$('#entryListe').show(); |
|
|
|
$('#mapmenu').show(); |
|
|
|
$('#listmenu').hide(); |
|
|
|
overlayWindow = false; |
|
|
@@ -102,6 +164,7 @@ include('server/server.php'); |
|
|
|
$('#map').hide(); |
|
|
|
$('#listLink').hide(); |
|
|
|
$('#mapLink').show(); |
|
|
|
$('#entryListe').hide(); |
|
|
|
$('#mapmenu').hide(); |
|
|
|
overlayWindow = false; |
|
|
|
$('#overlay').hide(); |
|
|
@@ -165,6 +228,9 @@ include('server/server.php'); |
|
|
|
|
|
|
|
|
|
|
|
function newWindowToggle(){ |
|
|
|
$('#edit').remove(); |
|
|
|
edit = false; |
|
|
|
$('#institutionForm')[0].reset(); |
|
|
|
$('#new').toggle(); |
|
|
|
newWindow = !newWindow; |
|
|
|
if(newWindow == false){ |
|
|
@@ -191,14 +257,14 @@ include('server/server.php'); |
|
|
|
<li onclick="toggleClass(2)">Akademien<img class="eyeIcon" src="img/gui/eye-open-icon.png"></img><img class="markerIcon" src="img/gui/akademie-icon.png"></img></li> |
|
|
|
<li onclick="toggleClass(3)">Venues<img class="eyeIcon" src="img/gui/eye-open-icon.png"></img><img class="markerIcon" src="img/gui/venue-icon.png"></img></li> |
|
|
|
<li onclick="toggleClass(4)">Stiftungen<img class="eyeIcon" src="img/gui/eye-open-icon.png"></img><img class="markerIcon" src="img/gui/stiftung-icon.png"></img></li> |
|
|
|
<li onclick="toggleClass(5)">Festivals<img class="eyeIcon" src="img/gui/eye-open-icon.png"></img><img class="markerIcon" src="img/gui/festival-icon.png"></img></li> |
|
|
|
<li onclick="toggleClass(5)">Events<img class="eyeIcon" src="img/gui/eye-open-icon.png"></img><img class="markerIcon" src="img/gui/festival-icon.png"></img></li> |
|
|
|
<li onclick="toggleClass(6)">Künstler<img class="eyeIcon" src="img/gui/eye-open-icon.png"></img><img class="markerIcon" src="img/gui/kunstler-icon.png"></img></li> |
|
|
|
</ul> |
|
|
|
|
|
|
|
<ul><li onclick="newWindowToggle()">Neues Institut</li></ul> |
|
|
|
|
|
|
|
<div id="new" style="display:none;"> |
|
|
|
<form method="post" name="newInstitution" onsubmit="return validateForm()" action=""> |
|
|
|
<form method="post" name="newInstitution" id="institutionForm" onsubmit="return validateForm()" action=""> |
|
|
|
<div id="newleft"> |
|
|
|
<p><label for="name">Name:*</label><input name="name" id="name"></input></p> |
|
|
|
<p><label for="loc">Location:*</label><input name="loc" id="loc" readonly></input></p> |
|
|
@@ -208,7 +274,7 @@ include('server/server.php'); |
|
|
|
<option value="akademie">Akademie</option> |
|
|
|
<option value="venue">Venue</option> |
|
|
|
<option value="stiftung">Stiftung</option> |
|
|
|
<option value="festival">Festival</option> |
|
|
|
<option value="festival">Event</option> |
|
|
|
<option value="kunstler">Künstler</option> |
|
|
|
</select> |
|
|
|
</div> |
|
|
@@ -217,9 +283,11 @@ include('server/server.php'); |
|
|
|
<p><label for="insta">Instagram:</label><input name="insta" id="insta"></input></p> |
|
|
|
<p><label for="twitter">Twitter:</label><input name="twitter" id="twitter"></input></p> |
|
|
|
<p><label for="web">Web:</label><input name="web" id="web"></input></p> |
|
|
|
<p><input id="edit" value="edit" name="edit"></input></p> |
|
|
|
</div> |
|
|
|
<input type="submit" value="Speichern" id="newSubmit"></input> |
|
|
|
</form> |
|
|
|
<a href="#" onClick="newWindowToggle()"><img src="img/gui/x.png" class="newMenuIcon"></img></a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
@@ -238,119 +306,158 @@ include('server/server.php'); |
|
|
|
<div id="overlayTitle"> |
|
|
|
</div> |
|
|
|
<div id="overlayMenu"> |
|
|
|
<a href="#" onClick="editInstitute()"><img src="img/gui/pen.png" class="overlayMenuIcon"></img></a> |
|
|
|
<a href="#" onClick="if (confirm('Sicher löschen?')) trash(); return false"><img src="img/gui/bin.png" class="overlayMenuIcon"></img></a> |
|
|
|
<a href="#" onClick="closeOverlay()"><img src="img/gui/x.png" class="overlayMenuIcon"></img></a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<iframe id="overlayBody"> |
|
|
|
|
|
|
|
<!--<div class="fb-page" data-href="https://www.facebook.com/pg/HBKsaar/" data-tabs="timeline" data-width="1152" data-height="573" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="false"></div>--> |
|
|
|
<!--<div class="fb-page" data-href="https://www.facebook.com/pg/HBKsaar/" data-tabs="timeline" data-width="1152" data-height="573" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="false"></div>--> |
|
|
|
|
|
|
|
|
|
|
|
</iframe> |
|
|
|
</iframe> |
|
|
|
<div id="overlayFooter"> |
|
|
|
<div class="networkButton">twitter</div> |
|
|
|
<div class="networkButton">instagram</div> |
|
|
|
<div class="networkButton">facebook</div> |
|
|
|
<div class="networkButton">rss</div> |
|
|
|
<div class="networkButton">website</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div id="entryListe"> |
|
|
|
<div id="museumListe">Museen<ul></ul></div> |
|
|
|
<div id="galerieListe">Galerien<ul></ul></div> |
|
|
|
<div id="akademieListe">Akademien<ul></ul></div> |
|
|
|
<div id="venueListe">Venues<ul></ul></div> |
|
|
|
<div id="stiftungListe">Stiftungen<ul></ul></div> |
|
|
|
<div id="eventListe">Events<ul></ul></div> |
|
|
|
<div id="künstlerListe">Künstler<ul></ul></div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div id="map"></div> |
|
|
|
|
|
|
|
<script> |
|
|
|
var mymap = L.map('map'); |
|
|
|
mymap.zoomControl.setPosition('topright'); |
|
|
|
L.tileLayer('https://api.mapbox.com/styles/v1/pr1est0r/ck2zdlu690te41cl4xuonp8o3/tiles/256/{z}/{x}/{y}?access_token={accessToken}', { |
|
|
|
//attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>', |
|
|
|
maxZoom: 18, |
|
|
|
zoomControl: true, |
|
|
|
id: 'mapbox.streets', |
|
|
|
accessToken: 'pk.eyJ1IjoicHIxZXN0MHIiLCJhIjoiY2syejltOWwyMGM0ZzNuczA0cml5c2VzZyJ9.Yg9alT_uU0iy5dOQUi670g' |
|
|
|
}).addTo(mymap); |
|
|
|
|
|
|
|
let newMarker; |
|
|
|
var museumIcon = L.divIcon({className: 'museum-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var galerieIcon = L.divIcon({className: 'galerie-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var akademieIcon = L.divIcon({className: 'akademie-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var venueIcon = L.divIcon({className: 'venue-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var stiftungIcon = L.divIcon({className: 'stiftung-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var festivalIcon = L.divIcon({className: 'festival-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var kunstlerIcon = L.divIcon({className: 'kunstler-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
function onMapClick(e) { |
|
|
|
if(newWindow){ |
|
|
|
if(newMarker != null){ |
|
|
|
newMarker.remove(); |
|
|
|
} |
|
|
|
// newMarker = L.marker(e.latlng, {icon: museumIcon}); |
|
|
|
newMarker = L.marker(e.latlng, {icon: museumIcon}); |
|
|
|
newMarker.addTo(mymap).on('click', function(e) { |
|
|
|
console.log(e.target._leaflet_id); //or sourceTarget? |
|
|
|
}); |
|
|
|
|
|
|
|
var locs = (e.latlng.lat).toFixed(4) + ", " + (e.latlng.lng).toFixed(4); |
|
|
|
$('#loc').val(locs); |
|
|
|
} else if (overlayWindow){ |
|
|
|
closeOverlay(); |
|
|
|
} |
|
|
|
} |
|
|
|
mymap.on('click', onMapClick); |
|
|
|
|
|
|
|
|
|
|
|
<?php $entries = json_encode(fetch_all($db, "SELECT * FROM `institut`")); ?> |
|
|
|
var points = <?=$entries ?>; |
|
|
|
var pointList = []; |
|
|
|
for (i= 0; i < points.length; i++){ |
|
|
|
var thisIcon; |
|
|
|
switch (points[i][9]) { |
|
|
|
case "0": |
|
|
|
thisIcon = museumIcon; |
|
|
|
break; |
|
|
|
case "1": |
|
|
|
thisIcon = galerieIcon; |
|
|
|
break; |
|
|
|
case "2": |
|
|
|
thisIcon = akademieIcon; |
|
|
|
break; |
|
|
|
case "3": |
|
|
|
thisIcon = venueIcon; |
|
|
|
break; |
|
|
|
case "4": |
|
|
|
thisIcon = stiftungIcon; |
|
|
|
break; |
|
|
|
case "5": |
|
|
|
thisIcon = festivalIcon; |
|
|
|
break; |
|
|
|
case "6": |
|
|
|
thisIcon = kunstlerIcon; |
|
|
|
break; |
|
|
|
default: |
|
|
|
thisIcon = stiftungIcon; |
|
|
|
break; |
|
|
|
/*L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { |
|
|
|
'attribution': 'Kartendaten © <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> Mitwirkende', |
|
|
|
'useCache': true |
|
|
|
}).addTo(mymap);*/ |
|
|
|
/*L.tileLayer('http://{s}.tile.stamen.com/watercolor/{z}/{x}/{y}.jpg', { |
|
|
|
'attribution': 'Kartendaten © <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> Mitwirkende', |
|
|
|
'useCache': true |
|
|
|
}).addTo(mymap);*/ |
|
|
|
L.tileLayer('https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png', { |
|
|
|
maxZoom: 17, |
|
|
|
attribution: 'Map data: © <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, <a href="http://viewfinderpanoramas.org">SRTM</a> | Map style: © <a href="https://opentopomap.org">OpenTopoMap</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)' |
|
|
|
}).addTo(mymap); |
|
|
|
|
|
|
|
let newMarker; |
|
|
|
var museumIcon = L.divIcon({className: 'museum-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var galerieIcon = L.divIcon({className: 'galerie-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var akademieIcon = L.divIcon({className: 'akademie-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var venueIcon = L.divIcon({className: 'venue-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var stiftungIcon = L.divIcon({className: 'stiftung-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var festivalIcon = L.divIcon({className: 'festival-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
var kunstlerIcon = L.divIcon({className: 'kunstler-marker', iconSize: [25, 41],iconAnchor: [14, 47], popupAnchor: [-3, -76],}); |
|
|
|
function onMapClick(e) { |
|
|
|
if(newWindow){ |
|
|
|
if(newMarker != null){ |
|
|
|
newMarker.remove(); |
|
|
|
} |
|
|
|
var markerBoot = L.marker(points[i][3].split(','), {icon: thisIcon}); |
|
|
|
|
|
|
|
markerBoot.bindTooltip(points[i][1],{ |
|
|
|
offset: [0,-30] |
|
|
|
// newMarker = L.marker(e.latlng, {icon: museumIcon}); |
|
|
|
newMarker = L.marker(e.latlng, {icon: museumIcon}); |
|
|
|
newMarker.addTo(mymap).on('click', function(e) { |
|
|
|
console.log(e.target._leaflet_id); //or sourceTarget? |
|
|
|
}); |
|
|
|
markerBoot.addTo(mymap).on('click', function(e) { |
|
|
|
overlay(e.target._leaflet_id); |
|
|
|
}); |
|
|
|
pointList.push([points[i][1], markerBoot._leaflet_id, points[i][0], points[i][9]]); //name, leaflet id, sql id, type |
|
|
|
|
|
|
|
var locs = (e.latlng.lat).toFixed(4) + ", " + (e.latlng.lng).toFixed(4); |
|
|
|
$('#loc').val(locs); |
|
|
|
} else if (overlayWindow){ |
|
|
|
closeOverlay(); |
|
|
|
} |
|
|
|
mymap.setView([48.799, 9.794], 4); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var overlayWidth = $('#overlay').width(); |
|
|
|
var overlayHeight = $('#overlayBody').height(); |
|
|
|
function onResize(){ |
|
|
|
overlayWidth = $('#overlay').width(); |
|
|
|
overlayHeight = $('#overlayBody').height(); |
|
|
|
} |
|
|
|
mymap.on('click', onMapClick); |
|
|
|
|
|
|
|
|
|
|
|
<?php $entries = json_encode(fetch_all($db, "SELECT * FROM `institut`")); ?> |
|
|
|
var points = <?=$entries ?>; |
|
|
|
var pointList = []; |
|
|
|
for (i= 0; i < points.length; i++){ |
|
|
|
var thisIcon; |
|
|
|
switch (points[i][9]) { |
|
|
|
case "0": |
|
|
|
thisIcon = museumIcon; |
|
|
|
break; |
|
|
|
case "1": |
|
|
|
thisIcon = galerieIcon; |
|
|
|
break; |
|
|
|
case "2": |
|
|
|
thisIcon = akademieIcon; |
|
|
|
break; |
|
|
|
case "3": |
|
|
|
thisIcon = venueIcon; |
|
|
|
break; |
|
|
|
case "4": |
|
|
|
thisIcon = stiftungIcon; |
|
|
|
break; |
|
|
|
case "5": |
|
|
|
thisIcon = festivalIcon; |
|
|
|
break; |
|
|
|
case "6": |
|
|
|
thisIcon = kunstlerIcon; |
|
|
|
break; |
|
|
|
default: |
|
|
|
thisIcon = stiftungIcon; |
|
|
|
break; |
|
|
|
} |
|
|
|
var markerBoot = L.marker(points[i][3].split(','), {icon: thisIcon}); |
|
|
|
|
|
|
|
markerBoot.bindTooltip(points[i][1],{ |
|
|
|
offset: [0,-30] |
|
|
|
}); |
|
|
|
markerBoot.addTo(mymap).on('click', function(e) { |
|
|
|
overlay(e.target._leaflet_id); |
|
|
|
}); |
|
|
|
pointList.push([points[i][1], markerBoot._leaflet_id, points[i][0], points[i][9]]); //name, leaflet id, sql id, type |
|
|
|
|
|
|
|
} |
|
|
|
mymap.setView([48.799, 9.794], 4); |
|
|
|
|
|
|
|
|
|
|
|
for (var i = 0; i < pointList.length; i++){ |
|
|
|
console.log(pointList[i]); |
|
|
|
switch(pointList[i][3]){ |
|
|
|
case('0'): |
|
|
|
$('#museumListe ul').append("<li onclick='overlay(" + pointList[i][1] + ")'>" + pointList[i][0] + "</li>"); |
|
|
|
break; |
|
|
|
case('1'): |
|
|
|
$('#galerieListe ul').append("<li onclick='overlay(" + pointList[i][1] + ")'>" + pointList[i][0] + "</li>"); |
|
|
|
break; |
|
|
|
case('2'): |
|
|
|
$('#akademieListe ul').append("<li onclick='overlay(" + pointList[i][1] + ")'>" + pointList[i][0] + "</li>"); |
|
|
|
break; |
|
|
|
case('3'): |
|
|
|
$('#venueListe ul').append("<li onclick='overlay(" + pointList[i][1] + ")'>" + pointList[i][0] + "</li>"); |
|
|
|
break; |
|
|
|
case('4'): |
|
|
|
$('#stiftungListe ul').append("<li onclick='overlay(" + pointList[i][1] + ")'>" + pointList[i][0] + "</li>"); |
|
|
|
break; |
|
|
|
case('5'): |
|
|
|
$('#eventListe ul').append("<li onclick='overlay(" + pointList[i][1] + ")'>" + pointList[i][0] + "</li>"); |
|
|
|
break; |
|
|
|
case('6'): |
|
|
|
$('#künstlerListe ul').append("<li onclick='overlay(" + pointList[i][1] + ")'>" + pointList[i][0] + "</li>"); |
|
|
|
break; |
|
|
|
default: |
|
|
|
break; |
|
|
|
} |
|
|
|
window.addEventListener('resize', onResize); |
|
|
|
} |
|
|
|
|
|
|
|
var overlayWidth = $('#overlay').width(); |
|
|
|
var overlayHeight = $('#overlayBody').height(); |
|
|
|
function onResize(){ |
|
|
|
overlayWidth = $('#overlay').width(); |
|
|
|
overlayHeight = $('#overlayBody').height(); |
|
|
|
} |
|
|
|
window.addEventListener('resize', onResize); |
|
|
|
|
|
|
|
</script> |
|
|
|
|