-
Notifications
You must be signed in to change notification settings - Fork 3
/
list.html
61 lines (59 loc) · 2.89 KB
/
list.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
---
title: Liste & Karte
permalink: "/list.html"
layout: page
---
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/MarkerCluster.Default.css" />
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/MarkerCluster.css" />
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
<script src="https://unpkg.com/[email protected]/dist/leaflet.markercluster.js"></script>
<script src="{{ site.baseurl }}/assets/js/Control.FullScreen.js"></script>
<style>
.leaflet-control-zoom-fullscreen { background-image: url({{ site.baseurl }}/images/icon-fullscreen.png); }
.leaflet-retina .leaflet-control-zoom-fullscreen { background-image: url({{ site.baseurl }}/images/icon-fullscreen-2x.png); background-size: 26px 26px; }
.leaflet-container:-webkit-full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-pseudo-fullscreen { position: fixed !important; width: 100% !important; height: 100% !important; top: 0px !important; left: 0px !important; z-index: 99999; }
.leaflet-popup-content{ font-size: 18px; margin: 8px !important; }
#list-id{display:none;}#map{height: 600px;}li{list-style: none;}
.map-btn,.list-btn{width:calc(50% - 3px);}
</style>
<script>
var coordinates = [
{% for page in site.list %}
{
"x": {% if page.x %}{{ page.x }}{% else %}{{ site.lat }}{% endif %},
"y": {% if page.y %}{{ page.y }}{% else %}{{ site.long }}{% endif %},
"title": "{% if page.x and page.y %}{{ page.title }}{% else %}{{ page.title }}<br>Keine Koordinaten angegeben{% endif %}",
"url": "{{ site.baseurl }}{{ page.url }}"
}
{% unless forloop.last %},{% endunless %}
{% endfor %}
];
var map_coord = [{{ site.lat }}, {{ site.long }}];
</script>
<a class="button button-primary map-btn" onclick="showMap();"><i class="icon ion-android-map"></i> KARTE</a>
<a class="button button-primary list-btn" onclick="showList();"><i class="icon ion-android-list"></i> LISTE</a>
<div id="map"></div>
<div id="list-id">
<form>
<div class="input-field" role="search">
<input id="search" type="search" placeholder="Suche..." class="fuzzy-search" required>
</div>
</form>
<ul class="list">
{% assign list = site.list | sort: 'address' %}
{% for item in list %}
<li class="card">
<div class="card-content">
<h2><i class="icon ion-android-list"></i> <span class="names">{{ item.title }}</span><br><small class="address">{{ item.address }}</small></h2>
</div>
<div class="card-action">
<a class="button" href="{{ site.baseurl }}{{ item.url }}">MEHR <i class="icon ion-plus"></i></a>
</div>
</li>
{% endfor %}
</ul>
</div>
<script src="{{ site.baseurl }}/assets/js/list.min.js"></script>
<script src="{{ site.baseurl }}/assets/js/list.js"></script>