summaryrefslogtreecommitdiff
path: root/layouts/shortcodes/map.html
diff options
context:
space:
mode:
Diffstat (limited to 'layouts/shortcodes/map.html')
-rw-r--r--layouts/shortcodes/map.html153
1 files changed, 0 insertions, 153 deletions
diff --git a/layouts/shortcodes/map.html b/layouts/shortcodes/map.html
deleted file mode 100644
index c2f6d11..0000000
--- a/layouts/shortcodes/map.html
+++ /dev/null
@@ -1,153 +0,0 @@
-<div class="section">
- <div id="loadingmap" class="preloader-wrapper small active" style="left: 45%;">
- <div class="spinner-layer spinner-blue-only">
- <div class="circle-clipper left">
- <div class="circle"></div>
- </div><div class="gap-patch">
- <div class="circle"></div>
- </div><div class="circle-clipper right">
- <div class="circle"></div>
- </div>
- </div>
- </div>
- <div id="mapview" style="width: 100%; height: 40em;"></div>
- <script type="text/javascript">
- var map,
- mapboxReadyAttached;
-
- if (typeof $ === 'undefined') {
- document.addEventListener('DOMContentLoaded', loadMapbox);
- }
- if (typeof mapboxReadyAttached === 'undefined') {
- mapboxReadyAttached = true;
- document.addEventListener('pageReady', loadMapbox);
- }
-
- function loadMapbox() {
- if ($('#mapview').length == 0) return; // map is inactive
-
- if (typeof mapboxgl === 'undefined') {
- console.log('loading mapbox files');
- $('<link>').appendTo('head')
- .attr({type: 'text/css', rel: 'stylesheet'})
- .attr('href', 'https://api.mapbox.com/mapbox-gl-js/v0.22.1/mapbox-gl.css');
- $.getScript('https://api.mapbox.com/mapbox-gl-js/v0.23.0/mapbox-gl.js', initMapbox);
- } else {
- console.log('mapbox files already present');
- initMapbox();
- }
- }
-
- function loadFallback() {
- if (typeof L === 'undefined') {
- console.log('loading mapbox fallback files');
- $('<link>').appendTo('head')
- .attr({type: 'text/css', rel: 'stylesheet'})
- .attr('href', 'https://api.mapbox.com/mapbox.js/v2.4.0/mapbox.css');
- $.getScript('https://api.mapbox.com/mapbox.js/v2.4.0/mapbox.js', initFallback);
- } else {
- console.log('mapbox fallback files already present');
- initFallback();
- }
- }
-
- function initMapbox() {
- if (mapboxgl.supported() === false) {
- console.log('MapboxGL unsupported, loading fallback');
- loadFallback();
- return;
- }
- console.log('creating new map instance');
- var lon = parseFloat({{ .Get "lon" }}),
- lat = parseFloat({{ .Get "lat" }}),
- zoom= parseFloat({{ .Get "zoom" }});
-
- if (typeof map !== 'undefined') {
- console.log('killed old map');
- map.remove();
- }
-
- mapboxgl.accessToken = 'pk.eyJ1IjoiY29kZS13dnMiLCJhIjoiY2lzNHM4bWUwMDAwdTJ0cDBjYms5em9hYSJ9.VLxxJ6aTbWUbQchg58tgkA';
- map = new mapboxgl.Map({
- pitch: 60,
- bearing: 45,
- container: 'mapview',
- style: 'mapbox://styles/mapbox/basic-v9',
- center: [lon, lat],
- zoom: zoom
- });
- map.on('load', showMapbox);
- }
-
- function initFallback() {
- console.log('creating new map fallback instance');
- var lon = parseFloat({{ .Get "lon" }}),
- lat = parseFloat({{ .Get "lat" }}),
- zoom= parseFloat({{ .Get "zoom" }});
- if (typeof map !== 'undefined') {
- console.log('killed old map for fallback');
- map.remove();
- }
- L.mapbox.accessToken = 'pk.eyJ1IjoiY29kZS13dnMiLCJhIjoiY2lzNHM4bWUwMDAwdTJ0cDBjYms5em9hYSJ9.VLxxJ6aTbWUbQchg58tgkA';
- map = L.mapbox.map('mapview')
- .setView([lat, lon], zoom);
- var layer = L.mapbox.tileLayer('mapbox.streets').addTo(map);
- layer.on('ready', showFallback);
- }
-
- /* ! mapboxgl: [lon, lat] - mapboxjs: [lat, lon]… */
- function showMapbox() {
- var lon = parseFloat({{ .Get "lon" }}),
- lat = parseFloat({{ .Get "lat" }}),
- zoom= parseFloat({{ .Get "zoom" }});
-
- console.log('updating map data', [lon, lat, zoom]);
-
- map.setCenter([lon, lat]);
- map.setZoom(zoom);
-
- var markers = {
- "type": "FeatureCollection",
- "features": [{
- "type": "Feature",
- "properties": {
- "icon": "fast-food"
- },
- "geometry": {
- "type": "Point",
- "coordinates": [lon, lat]
- }
- }]
- };
-
- if (!map.getSource('markers')) {
- map.addSource('markers', {
- 'type': 'geojson',
- 'data': markers
- });
- map.addLayer({
- "id": "markers",
- "type": "symbol",
- "source": "markers",
- "layout": {
- "icon-image": "{icon}-15"
- }
- });
- }
- $('#loadingmap').hide();
- $('#mapview').show();
- }
-
- function showFallback() {
- var lon = parseFloat({{ .Get "lon" }}),
- lat = parseFloat({{ .Get "lat" }}),
- zoom= parseFloat({{ .Get "zoom" }});
-
- console.log('updating fallback map data', [lon, lat, zoom]);
- map.setView([lat, lon], zoom);
- L.marker([lat, lon]).addTo(map);
- $('#loadingmap').hide();
- $('#mapview').show();
- }
- </script>
- </div>