{% extends "main.html" %}

{% block javascript %}

    mapboxgl.accessToken = '{{ accessToken }}';

    var map = new mapboxgl.Map({
        container: 'map',
        style: {{ style }},
        center: {{ center }},
        zoom: {{ zoom }},
        transformRequest: (url, resourceType)=> {
            if ( url.slice(0,22) == 'https://api.mapbox.com' ) {
                //Add Python Plugin identifier for Mapbox API traffic
                return {
                   url: [url.slice(0, url.indexOf("?")+1), "pluginName=PythonMapboxgl&", url.slice(url.indexOf("?")+1)].join('')
                 }
             }
             else {
                 //Do not transform URL for non Mapbox GET requests
                 return {url: url}
             }
        }
    });

    {% block navigation %}

        map.addControl(new mapboxgl.NavigationControl());

    {% endblock navigation %}

    {% block legend %}{% endblock legend %}

    {% block map %}{% endblock map %}

{% endblock %}