view.jsp 2.09 KB
Newer Older
Elias Englmeier's avatar
Elias Englmeier committed
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<%@ include file="/init.jsp" %>
<head>
<script>
    define._amd = define.amd;
    define.amd = false;
</script>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vex-js/4.0.0/js/vex.combined.min.js"></script>
<script>vex.defaultOptions.className = 'vex-theme-default'</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vex-js/4.0.0/css/vex.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vex-js/4.0.0/css/vex-theme-default.css" />
<script>
    define.amd = define._amd;
</script>
</head>
<div id="map"></div>
<style>
<!--
Elias Englmeier's avatar
Elias Englmeier committed
20
#map {height: 600px;z-index:1;}
Elias Englmeier's avatar
Elias Englmeier committed
21
22
23
24
25
26
-->
</style>

<script type="text/javascript">
$(document).ready(function(){
	//init the map
27
28
	var map = L.map('map').setView([0.0, 0.0], 12);
	L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{
Elias Englmeier's avatar
Elias Englmeier committed
29
30
31
32
	    maxZoom: 18,
	    id: 'mapbox.streets',
	    accessToken: 'your.mapbox.access.token'
	}).addTo(map);
33

Elias Englmeier's avatar
Elias Englmeier committed
34
	//load markers from server
35
	var ideasJsonArray = JSON.parse('${allIdeas}');
36
	if(ideasJsonArray.length > 0){
37
	var markerGroup = new L.featureGroup();
Elias Englmeier's avatar
Elias Englmeier committed
38
39
40
41
	$.each(ideasJsonArray, function (index, value) {
					if(value.isVisibleOnMap){
					var latlng = L.latLng(value.latitude,value.longitude);
			        var loadedMarker = new L.Marker(latlng, {draggable:false});
42
			        markerGroup.addLayer(loadedMarker);
Elias Englmeier's avatar
Elias Englmeier committed
43
44
			        loadedMarker.dbId = value.id;
			        loadedMarker.bindTooltip(value.title).openTooltip();
Elias Englmeier's avatar
Elias Englmeier committed
45
			        loadedMarker.bindPopup(getMarkerPopUp(value.id,value.title,value.userName,value.pageUrl,value.rating));
Elias Englmeier's avatar
Elias Englmeier committed
46
47
48
			        map.addLayer(loadedMarker);
					}
			    });
49
	map.fitBounds(markerGroup.getBounds().pad(0.5));
50
51
52
	}else{
		map.setView([51.312066, 9.492901],12)
	}
Elias Englmeier's avatar
Elias Englmeier committed
53
54
55
	function getMarkerPopUp(id, title, username,link,votes){
		var votescount = votes.split(",");
		return "<h4>" + title + "</h4>" + "<p> Eingereicht von " + username + "</p>" + "<p> Stimmen: " + votescount.length + "</p><br>" + "<a href=" + link + ">Details</a>";
Elias Englmeier's avatar
Elias Englmeier committed
56
57
58
	}
});
</script>