/* * This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ //import mapboxgl from 'mapbox-gl'; // or "const mapboxgl = require('mapbox-gl');" mapboxgl.accessToken = ''; const map = new mapboxgl.Map({ container: 'mapbox', style: SETTINGS['map_style_json'], attributionControl: false, touchZoomRotate: 'center', pitch: 0, zoom: 0, maxZoom: 20 }); map.touchZoomRotate.enable({around: 'center'}); map.dragPan.disable(); function mapEasing(t) { return t * (2 - t); } gotfirstfix = false; watchLocation(function (position) { if (gotfirstfix) { setMapLocation(position.coords.latitude, position.coords.longitude); updatePlaceLayer(position.coords.latitude, position.coords.longitude); } else { animateMapIn(position.coords.latitude, position.coords.longitude, 16, position.coords.heading); gotfirstfix = true; } }, function (error) { app.toast.show({ text: ' ' + error, position: "bottom", destroyOnClose: true, closeTimeout: 5000 }); }); function setMapHeading(heading) { if (typeof heading == 'number') { map.easeTo({ bearing: heading, easing: mapEasing }); } } function setMapLocation(latitude, longitude) { map.easeTo({ center: [ longitude, latitude ] }); } function updatePlaceLayer(latitude, longitude) { callAPI("nearbyplaces", { username: localStorage.getItem("username"), password: localStorage.getItem("password"), latitude: latitude, longitude: longitude, radius: 5 }, function (data) { var oldmarkers = document.getElementsByClassName("place-marker"); if (oldmarkers.length > 0) { markerparent = oldmarkers[0].parentNode; while (oldmarkers.length > 0) { markerparent.removeChild(oldmarkers[0]); } } data.features.forEach(function (place) { var el = document.createElement("div"); el.className = "place-marker"; if (place.properties.teamid != null && place.properties.teamid > 0) { el.className += " color-filter-" + SETTINGS["teams"][place.properties.teamid]["color"]; } el.addEventListener('click', function () { window.alert(place.properties.name + " \n" + place.properties.id); }); new mapboxgl.Marker(el) .setLngLat(place.geometry.coordinates) .addTo(map); }); }); } function animateMapIn(latitude, longitude, zoom, heading) { if (typeof zoom == 'undefined') { zoom = 15; } if (typeof heading == 'undefined') { heading = 0; } map.flyTo({ center: [ longitude, latitude ], speed: 0.7, zoom: zoom, heading: heading, pitch: 45 }); // Set min zoom after some time to fly in setTimeout(function () { map.setMinZoom(15); map.setPitch(45); }, 1000); }