import * as pmtiles from "pmtiles";
import * as maplibregl from "maplibre-gl";
import { layerSpecification } from "./modules/MapLayerSpecificationModule";
import { addCountryBorder } from "./modules/AddCountryBorderModule";

// read https://maplibre.org/maplibre-gl-js/docs/examples/pmtiles/
// add pmtiles protocol
let protocol = new pmtiles.Protocol();
maplibregl.addProtocol("pmtiles", protocol.tile);

// create map tiles
const map = new maplibregl.Map({
  container: "map",
  zoom: 1,
  minZoom: 2,
  maxZoom: 6,
  center: [0, 0],
  style: {
    version: 8,
    sources: {
      tiles: {
        type: "vector",
        // read https://maplibre.org/maplibre-style-spec/sources/#vector
        url: "pmtiles://https://nbg1.your-objectstorage.com/maps/map.pmtiles",
      },
    },
    //
    layers: layerSpecification,
  },
});

// debug
//map.showTileBoundaries = true;

// add zoom and rotation controls
map.addControl(new maplibregl.NavigationControl());

addCountryBorder(map);
