diff options
Diffstat (limited to 'layouts/shortcodes/map.html')
| -rw-r--r-- | layouts/shortcodes/map.html | 153 |
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> |
