base-ui-ak.js

const timeofday = require('../timeofday.js');

init(lat, lng) {
  let mapEl = document.createElement('div');
  mapEl.id = 'map';
  document.body.appendChild(mapEl);

  // http://leafletjs.com/reference-1.3.0.html#map
  let map = (this.map = leaflet.map(mapEl, this.options));
  // We decide what map to use based on time of day
  let tileUrl = timeofday.isLight() ? 'http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png' : 'https://cartodb-basemaps-{s}.global.ssl.fastly.net/dark_all/{z}/{x}/{y}.png';
  leaflet.tileLayer(tileUrl, { attribution }).addTo(map);
  map.setView([lat, lng], defaultZoomLevel);

  // http://leafletjs.com/reference-1.3.0.html#map-event
  let onMapChange = () => this.emit('update', map.getBounds());
  map.on('viewreset', onMapChange);
  map.on('moveend', onMapChange);
  
  // Show a marker at our current location
  this.currentLocationMarker = leaflet
    .marker([lat, lng], {
      title: 'Current Location',
      icon: timeofday.isLight() ? svgMarker.location : svgMarker.locationWhite
    })
    .addTo(map);

  log.info(`Map initialized with centre lat=${lat}, lng=${lng}`);
}