{"version":3,"sources":["webpack:///./src/js/modules/mapboxMap/CustomMarker.js","webpack:///./src/js/modules/mapboxMap/CustomPath.js","webpack:///./src/js/modules/mapboxMap/CustomControl.js","webpack:///./src/js/modules/mapboxMap/StyleControl.js","webpack:///./src/js/modules/mapboxMap/InfoWindowControl.js","webpack:///./src/js/modules/mapboxMap/index.js"],"names":["CustomMarker","data","filter","this","_data","Object","assign","id","uuidv4","icon","zoom","displayZoomLevel","hideZoomLevel","_buildMarker","_addListeners","customMarker","document","createElement","className","innerHTML","name","el","appendChild","marker","mapboxgl","Marker","anchor","setLngLat","geo","lng","lat","addEventListener","e","label","currentTarget","querySelector","labelInner","style","width","offsetWidth","getLngLat","hidden","cb","map","addTo","active","classList","add","remove","clearTimeout","opacity","visibility","timeout","setTimeout","display","zoomLevel","hide","show","CustomPath","rendered","difficulty","beginner","intermediate","advanced","expert","extreme","color","addSource","type","lineMetrics","features","properties","geometry","coordinates","path","addLayer","source","paint","layout","minzoom","createMarker","getElement","animatePath","backgroundColor","markerLabel","elevation","getElevation","start","renderPath","turf","lineString","pathDistance","lineDistance","animationDuration","length","center","getCenter","startPosition","startZoom","getZoom","lerp","a","b","t","Array","isArray","result","i","Math","min","window","requestAnimationFrame","frame","time","animationPhase","alongPath","along","lngLat","position","setPaintProperty","setCenter","setZoom","floor","queryTerrainElevation","exaggerated","CustomControl","eventHandler","_label","_className","_eventHandler","_map","_icon","title","setAttribute","_btn","onclick","_container","parentNode","removeChild","undefined","StyleControl","mapLabel","satelliteLabel","mapStyle","satelliteStyle","_mapLabel","_satelliteLabel","_mapStyle","_satelliteStyle","_mapBtn","_createButton","_satelliteBtn","isActive","btn","_setStyle","target","setStyle","InfoWindowControl","_inner","_closeBtn","bind","description","address","linkUrl","linkText","linkTarget","accessToken","MapboxMap","dom","markers","activeMarker","loadMapData","initMap","addMapControls","addMapListeners","Promise","all","loadData","dataset","locationsEndpoint","trailsEndpoint","locationsData","trailsData","filters","mapData","createMarkers","createTrails","url","Axios","method","maxBounds","bearing","mapboxTheme","Map","container","maxZoom","minZoom","pitch","maxPitch","minPitch","dragRotate","attributionControl","on","onMapLoaded","onMapStylesLoaded","onMapZoom","onMapClick","forEach","trails","trail","add3DTerrain","addSky","addFog","restore","cancelZoomAnimation","shouldDisplay","contains","setActiveMarker","easeTo","speed","duration","zoomToMarker","setActive","infoWindow","setInfo","getData","satelliteTheme","addControl","NavigationControl","showCompass","FullscreenControl","onMapReset","tileSize","maxzoom","setTerrain","exaggeration","day","fog","setFog","range","find","filterName","onClick","stopPropagation","onMarkerClick","markerPosition","endPosition","endZoom","animation","cancelAnimationFrame","Component"],"mappings":"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","file":"79.b9eb2168e51009e5c769.js","sourcesContent":["import mapboxgl from 'mapbox-gl/dist/mapbox-gl';\nimport { v4 as uuidv4 } from 'uuid';\n\nexport class CustomMarker {\n  constructor({ data, filter }) {\n    this._data = Object.assign(data, {\n      id: uuidv4(),\n      icon: filter.icon,\n      zoom: filter.zoom,\n      displayZoomLevel: filter.displayZoomLevel,\n      hideZoomLevel: filter.hideZoomLevel\n    });\n\n    this._buildMarker();\n    this._addListeners();\n  }\n\n  _buildMarker() {\n    const customMarker = document.createElement('div');\n    customMarker.className = 'mapbox-map__marker-inner';\n    customMarker.innerHTML = `\n      <div class=\"mapbox-map__marker-icon\" style=\"background-image: url(${this._data.icon})\"></div>\n      <div class=\"mapbox-map__marker-label\"><span>${this._data.name}</span></div>\n    `;\n\n    this.el = document.createElement('div');\n    this.el.className = `mapbox-map__marker${\n      this._data.displayZoomLevel ? ' mapbox-map__marker--small' : ''\n    }`;\n    this.el.appendChild(customMarker);\n\n    this.marker = new mapboxgl.Marker(this.el, { anchor: 'bottom' }).setLngLat([\n      this._data.geo.lng,\n      this._data.geo.lat\n    ]);\n  }\n\n  _addListeners() {\n    this.el.addEventListener('mouseenter', e => {\n      const label = e.currentTarget.querySelector('.mapbox-map__marker-label');\n      const labelInner = label.querySelector('span');\n      label.style.width = `${labelInner.offsetWidth}px`;\n    });\n\n    this.el.addEventListener('mouseleave', e => {\n      const label = e.currentTarget.querySelector('.mapbox-map__marker-label');\n      label.style.width = null;\n    });\n  }\n\n  getData() {\n    return this._data;\n  }\n\n  getId() {\n    return this._data.id;\n  }\n\n  getZoom() {\n    return this._data.zoom;\n  }\n\n  getCenter() {\n    return this.marker.getLngLat();\n  }\n\n  isHidden() {\n    return !!this._data.hidden;\n  }\n\n  onClick(cb) {\n    this.el.addEventListener('click', cb);\n  }\n\n  addTo(map) {\n    this.marker.addTo(map);\n  }\n\n  setActive(active) {\n    if (active) {\n      this.el.classList.add('mapbox-map__marker--active');\n    } else {\n      this.el.classList.remove('mapbox-map__marker--active');\n    }\n  }\n\n  hide() {\n    if (!this._data.hidden) {\n      this.clearTimeout();\n\n      const customMarker = this.el.querySelector('.mapbox-map__marker-inner');\n      customMarker.style.opacity = 0;\n      customMarker.style.visibility = 'hidden';\n      this._data.hidden = true;\n\n      this.timeout = setTimeout(() => {\n        this.el.style.display = 'none';\n      }, 300);\n    }\n  }\n\n  show() {\n    if (this._data.hidden) {\n      this.clearTimeout();\n\n      const customMarker = this.el.querySelector('.mapbox-map__marker-inner');\n      this.el.style.display = 'block';\n      this._data.hidden = false;\n\n      this.timeout = setTimeout(() => {\n        customMarker.style = null;\n      }, 0);\n    }\n  }\n\n  clearTimeout() {\n    if (this.timeout) {\n      clearTimeout(this.timeout);\n      this.timeout = null;\n    }\n  }\n\n  shouldDisplay(zoomLevel) {\n    if (this._data.displayZoomLevel) {\n      if (this._data.displayZoomLevel > zoomLevel) {\n        this.hide();\n      } else {\n        this.show();\n      }\n    }\n\n    if (this._data.hideZoomLevel) {\n      if (this._data.hideZoomLevel < zoomLevel) {\n        this.hide();\n      } else {\n        this.show();\n      }\n    }\n  }\n}\n","import mapboxgl from 'mapbox-gl/dist/mapbox-gl';\nimport { v4 as uuidv4 } from 'uuid';\nimport turf from 'turf';\n\nexport class CustomPath {\n  constructor(data) {\n    this._data = {\n      id: uuidv4(),\n      ...data\n    };\n\n    this.rendered = false;\n\n    this.difficulty = {\n      beginner: '#39B54A',\n      intermediate: '#0971BA',\n      advanced: '#111111',\n      expert: '#111111',\n      extreme: '#111111'\n    };\n  }\n\n  renderPath(color) {\n    this.map.addSource(`trail-source-${this._data.id}`, {\n      type: 'geojson',\n      // Line metrics is required to use the 'line-progress' property\n      lineMetrics: true,\n      data: {\n        type: 'FeatureCollection',\n        features: [\n          {\n            type: 'Feature',\n            properties: {},\n            geometry: {\n              type: 'LineString',\n              coordinates: this._data.path\n            }\n          }\n        ]\n      }\n    });\n\n    this.map.addLayer({\n      type: 'line',\n      source: `trail-source-${this._data.id}`,\n      id: `trail-line-${this._data.id}`,\n      paint: {\n        'line-color': color\n          ? this.difficulty[this._data.difficulty]\n          : 'rgba(0,0,0,0)',\n        'line-width': 2\n      },\n      layout: {\n        'line-cap': 'round',\n        'line-join': 'round'\n      },\n      minzoom: 14\n    });\n\n    this.map.addLayer({\n      id: `trail-name-${this._data.id}`,\n      type: 'symbol',\n      source: `trail-source-${this._data.id}`,\n      layout: {\n        'symbol-placement': 'line',\n        'text-font': ['Open Sans Regular'],\n        'text-field': this._data.name,\n        'text-size': 14,\n        'text-anchor': 'top'\n      },\n      paint: {\n        'text-color': this.difficulty[this._data.difficulty]\n      },\n      minzoom: 14\n    });\n  }\n\n  addTo(map) {\n    this.map = map;\n\n    this.marker = this.createMarker();\n\n    this.marker.setLngLat(this._data.path[0]).addTo(this.map);\n\n    this.marker\n      .getElement()\n      .addEventListener('click', () => this.animatePath(this.map));\n  }\n\n  createMarker() {\n    const customMarker = document.createElement('div');\n    customMarker.className = 'mapbox-map__trail-inner';\n    customMarker.style.backgroundColor = this.difficulty[this._data.difficulty];\n\n    this.markerLabel = document.createElement('div');\n    this.markerLabel.className = 'mapbox-map__trail-name';\n    this.markerLabel.style.backgroundColor = this.difficulty[\n      this._data.difficulty\n    ];\n\n    const elevation = this.getElevation({\n      lng: this._data.path[0][0],\n      lat: this._data.path[0][1]\n    });\n\n    this.markerLabel.innerHTML = `${this._data.name}<br>Altitude: ${elevation}m`;\n\n    customMarker.appendChild(this.markerLabel);\n\n    this.el = document.createElement('div');\n    this.el.className = 'mapbox-map__trail';\n    this.el.appendChild(customMarker);\n\n    return new mapboxgl.Marker(this.el, {\n      anchor: 'center'\n    });\n  }\n\n  animatePath() {\n    let start;\n\n    this.markerLabel.classList.add('animated');\n\n    if (!this.rendered) {\n      this.rendered = true;\n      this.renderPath();\n    }\n\n    // sample the line at a given percentage with the turf.along function.\n    const path = turf.lineString(this._data.path);\n    // Get the total line distance\n    const pathDistance = turf.lineDistance(path);\n    const animationDuration = this._data.path.length * 40;\n\n    const center = this.map.getCenter();\n    const startPosition = [center.lng, center.lat];\n    const startZoom = this.map.getZoom();\n    const endZoom = 16;\n\n    const lerp = (a, b, t) => {\n      if (Array.isArray(a) && Array.isArray(b)) {\n        const result = [];\n        for (let i = 0; i < Math.min(a.length, b.length); i++)\n          result[i] = a[i] * (1.0 - t) + b[i] * t;\n        return result;\n      }\n\n      return a * (1.0 - t) + b * t;\n    };\n\n    const frame = time => {\n      if (!start) start = time;\n      const animationPhase = (time - start) / animationDuration;\n\n      if (animationPhase > 1) {\n        this.markerLabel.classList.remove('animated');\n        return;\n      }\n\n      // Get the new latitude and longitude by sampling along the path\n      const alongPath = turf.along(path, pathDistance * animationPhase).geometry\n        .coordinates;\n      const lngLat = {\n        lng: alongPath[0],\n        lat: alongPath[1]\n      };\n      const position = lerp(startPosition, alongPath, animationPhase);\n      const zoom = lerp(startZoom, endZoom, animationPhase);\n\n      // Update the label altitude value and marker location\n      this.markerLabel.innerHTML = `${\n        this._data.name\n      }<br>Altitude: ${this.getElevation(lngLat)}m`;\n      this.marker.setLngLat(lngLat);\n\n      // Reduce the visible length of the line by using a line-gradient to cutoff the line\n      // animationPhase is a value between 0 and 1 that reprents the progress of the animation\n      this.map.setPaintProperty(\n        `trail-line-${this._data.id}`,\n        'line-gradient',\n        [\n          'step',\n          ['line-progress'],\n          this.difficulty[this._data.difficulty],\n          animationPhase,\n          'rgba(0,0,0,0)'\n        ]\n      );\n\n      this.map.setCenter(position);\n      this.map.setZoom(zoom);\n\n      window.requestAnimationFrame(frame);\n    };\n\n    window.requestAnimationFrame(frame);\n  }\n\n  getElevation(lngLat) {\n    return Math.floor(\n      // Do not use terrain exaggeration to get actual meter values\n      this.map.queryTerrainElevation(lngLat, { exaggerated: false })\n    );\n  }\n\n  restore() {\n    if (this.rendered) {\n      this.renderPath(true);\n    }\n  }\n}\n","export class CustomControl {\n  constructor({ label, className, eventHandler }) {\n    this._label = label;\n    this._className = className;\n    this._eventHandler = eventHandler;\n  }\n\n  onAdd(map) {\n    this._map = map;\n\n    this._icon = document.createElement('span');\n    this._icon.className = 'mapboxgl-ctrl-icon';\n    this._icon.title = this._label;\n    this._icon.setAttribute('aria-hidden', true);\n\n    this._btn = document.createElement('button');\n    this._btn.className = this._className;\n    this._btn.setAttribute('aria-label', this._label);\n    this._btn.onclick = this._eventHandler;\n    this._btn.appendChild(this._icon);\n\n    this._container = document.createElement('div');\n    this._container.className = 'mapboxgl-ctrl mapboxgl-ctrl-group';\n    this._container.appendChild(this._btn);\n    return this._container;\n  }\n\n  onRemove() {\n    this._container.parentNode.removeChild(this._container);\n    // eslint-disable-next-line no-undefined\n    this._map = undefined;\n  }\n}\n","export class StyleControl {\n  constructor({ mapLabel, satelliteLabel, mapStyle, satelliteStyle }) {\n    this._mapLabel = mapLabel;\n    this._satelliteLabel = satelliteLabel;\n    this._mapStyle = mapStyle;\n    this._satelliteStyle = satelliteStyle;\n  }\n\n  onAdd(map) {\n    this._map = map;\n\n    this._mapBtn = this._createButton(this._mapLabel, this._mapStyle, true);\n    this._satelliteBtn = this._createButton(\n      this._satelliteLabel,\n      this._satelliteStyle\n    );\n\n    this._container = document.createElement('div');\n    this._container.className = 'mapbox-map__button-group';\n    this._container.appendChild(this._mapBtn);\n    this._container.appendChild(this._satelliteBtn);\n    return this._container;\n  }\n\n  onRemove() {\n    this._container.parentNode.removeChild(this._container);\n    // eslint-disable-next-line no-undefined\n    this._map = undefined;\n  }\n\n  _createButton(label, style, isActive) {\n    const btn = document.createElement('button');\n    btn.innerHTML = label;\n    btn.onclick = e => this._setStyle(e.target, style);\n\n    if (isActive) {\n      btn.classList.add('active');\n    }\n\n    return btn;\n  }\n\n  _setStyle(btn, style) {\n    this._map.setStyle(style);\n\n    this._mapBtn.classList.remove('active');\n    this._satelliteBtn.classList.remove('active');\n    btn.classList.add('active');\n  }\n}\n","export class InfoWindowControl {\n  constructor() {}\n\n  onAdd(map) {\n    this._map = map;\n\n    this._inner = document.createElement('div');\n    this._inner.className = 'mapbox-map__info-window-inner';\n    this._inner.innerHTML = '<h1>Test</h1>';\n\n    this._closeBtn = document.createElement('button');\n    this._closeBtn.className = 'mapbox-map__info-window-close';\n    this._closeBtn.setAttribute('aria-label', 'Close');\n    this._closeBtn.innerHTML = `\n      <svg viewBox=\"0 0 246 246\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n        <g transform=\"translate(-37.000000, -37.000000)\">\n          <polygon id=\"close\" transform=\"translate(160.000000, 160.122449) rotate(45.000000) translate(-160.000000, -160.122449) \" points=\"175.673469 314.244898 175.673469 173.836735 320 173.836735 320 146.408163 175.673469 146.408163 175.673469 6 145.632653 6 145.632653 146.408163 0 146.408163 0 173.836735 145.632653 173.836735 145.632653 314.244898\"></polygon>\n        </g>\n      </svg>\n    `;\n    this._closeBtn.addEventListener('click', this.hide.bind(this));\n\n    this._container = document.createElement('div');\n    this._container.className =\n      'mapbox-map__info-window mapbox-map__info-window--hidden';\n    this._container.appendChild(this._closeBtn);\n    this._container.appendChild(this._inner);\n    return this._container;\n  }\n\n  onRemove() {\n    this._container.parentNode.removeChild(this._container);\n    // eslint-disable-next-line no-undefined\n    this._map = undefined;\n  }\n\n  setInfo(data) {\n    this._inner.innerHTML = `\n      <h2 class=\"mapbox-map__info-window-title\">${data.name}</h2>\n      ${\n        data.description\n          ? `<p class=\"mapbox-map__info-window-description\">${data.description}</p>`\n          : ''\n      }\n      ${\n        data.address\n          ? `<p class=\"mapbox-map__info-window-address\"><strong>Address: </strong>${data.address}</p>`\n          : ''\n      }\n      ${\n        data.linkUrl && data.linkText\n          ? `<a class=\"mapbox-map__info-window-cta\" href=\"${data.linkUrl}\" ${\n              data.linkTarget ? `target=\"${data.linkTarget}\"` : ''\n            } >${data.linkText}</a>`\n          : ''\n      }\n    `;\n    this.show();\n  }\n\n  show() {\n    this._container.classList.remove('mapbox-map__info-window--hidden');\n  }\n\n  hide() {\n    this._container.classList.add('mapbox-map__info-window--hidden');\n  }\n}\n","import { Component } from '@verndale/core';\nimport Axios from 'axios';\nimport mapboxgl from 'mapbox-gl/dist/mapbox-gl';\nimport turf from 'turf';\nimport { CustomMarker } from './CustomMarker';\nimport { CustomPath } from './CustomPath';\nimport { CustomControl } from './CustomControl';\nimport { StyleControl } from './StyleControl';\nimport { InfoWindowControl } from './InfoWindowControl';\n\nmapboxgl.accessToken =\n  'pk.eyJ1IjoiZGF2aWRiZXBhODYiLCJhIjoiY2t6NzcyMzF0MHlpYzJxcHJ2OHU3ajZsdiJ9.YR6UP26p81TxHTvST6YJ1g';\n\nclass MapboxMap extends Component {\n  async setupDefaults() {\n    this.dom = {\n      map: this.el.querySelector('.mapbox-map__map')\n    };\n\n    this.markers = [];\n    this.activeMarker = null;\n\n    await this.loadMapData();\n\n    this.initMap();\n    this.addMapControls();\n    this.addMapListeners();\n  }\n\n  async loadMapData() {\n    // eslint-disable-next-line no-undef\n    const [locationsData, trailsData] = await Promise.all([\n      this.loadData(this.el.dataset.locationsEndpoint),\n      this.loadData(this.el.dataset.trailsEndpoint)\n    ]);\n\n    const { markers, filters, ...mapData } = locationsData.data;\n    this.mapData = mapData;\n\n    this.createMarkers(markers, filters);\n    this.createTrails(trailsData.data);\n  }\n\n  async loadData(url) {\n    return await Axios({\n      method: 'GET',\n      url\n    });\n  }\n\n  initMap() {\n    const {\n      map: { center, zoom, maxBounds, bearing }\n    } = this.mapData;\n    const { mapboxTheme } = this.el.dataset;\n\n    this.map = new mapboxgl.Map({\n      container: this.dom.map,\n      zoom,\n      maxZoom: 17,\n      minZoom: 12,\n      center,\n      maxBounds,\n      pitch: 75,\n      maxPitch: 75,\n      minPitch: 60,\n      bearing,\n      style: mapboxTheme,\n      dragRotate: false,\n      attributionControl: false\n    });\n  }\n\n  addMapListeners() {\n    this.map.on('load', this.onMapLoaded.bind(this));\n    this.map.on('style.load', this.onMapStylesLoaded.bind(this));\n    this.map.on('zoom', this.onMapZoom.bind(this));\n    this.map.on('mousedown', this.onMapClick.bind(this));\n    this.map.on('touchstart', this.onMapClick.bind(this));\n  }\n\n  onMapLoaded() {\n    this.markers.forEach(marker => marker.addTo(this.map));\n    this.trails.forEach(trail => trail.addTo(this.map));\n  }\n\n  onMapStylesLoaded() {\n    this.add3DTerrain();\n    this.addSky();\n    this.addFog();\n\n    this.trails.forEach(trail => trail.restore());\n  }\n\n  onMapZoom() {\n    this.cancelZoomAnimation();\n    const zoom = this.map.getZoom();\n\n    this.markers.forEach(marker => marker.shouldDisplay(zoom));\n\n    if (zoom > 14) {\n      if (!this.dom.map.classList.contains('mapbox-map__map--show-trails')) {\n        this.dom.map.classList.add('mapbox-map__map--show-trails');\n      }\n    } else {\n      if (this.dom.map.classList.contains('mapbox-map__map--show-trails')) {\n        this.dom.map.classList.remove('mapbox-map__map--show-trails');\n      }\n    }\n  }\n\n  onMapReset() {\n    this.setActiveMarker(null);\n\n    const {\n      map: { center, zoom, bearing }\n    } = this.mapData;\n\n    this.map.easeTo({\n      center,\n      zoom,\n      speed: 0.2,\n      bearing,\n      pitch: 75,\n      duration: 5000\n    });\n  }\n\n  onMapClick() {\n    this.cancelZoomAnimation();\n    this.setActiveMarker(null);\n  }\n\n  onMarkerClick(marker) {\n    this.zoomToMarker(marker);\n    this.setActiveMarker(marker);\n  }\n\n  setActiveMarker(marker = null) {\n    if (this.activeMarker) {\n      this.activeMarker.setActive(false);\n    }\n\n    if (marker) {\n      this.activeMarker = marker;\n      this.activeMarker.setActive(true);\n      this.infoWindow.setInfo(marker.getData());\n    } else {\n      this.infoWindow.hide();\n    }\n  }\n\n  addMapControls() {\n    const { mapboxTheme, satelliteTheme } = this.el.dataset;\n\n    this.map.addControl(\n      new mapboxgl.NavigationControl({ showCompass: false }),\n      'bottom-right'\n    );\n    this.map.addControl(new mapboxgl.FullscreenControl());\n\n    this.map.addControl(\n      new CustomControl({\n        label: 'Reset Map',\n        className: 'mapboxgl-ctrl-geolocate',\n        eventHandler: this.onMapReset.bind(this)\n      }),\n      'bottom-right'\n    );\n\n    this.map.addControl(\n      new StyleControl({\n        mapLabel: 'Map',\n        satelliteLabel: 'Satellite',\n        mapStyle: mapboxTheme,\n        satelliteStyle: satelliteTheme || 'mapbox://styles/mapbox/satellite-v9'\n      }),\n      'top-left'\n    );\n\n    this.infoWindow = new InfoWindowControl();\n    this.map.addControl(this.infoWindow, 'top-left');\n  }\n\n  add3DTerrain() {\n    this.map.addSource('mapbox-dem', {\n      type: 'raster-dem',\n      url: 'mapbox://mapbox.mapbox-terrain-dem-v1',\n      tileSize: 512,\n      maxzoom: 14\n    });\n\n    this.map.setTerrain({ source: 'mapbox-dem', exaggeration: 1.2 });\n  }\n\n  addSky() {\n    const {\n      map: { day }\n    } = this.mapData;\n\n    this.map.addLayer({\n      id: 'sky',\n      type: 'sky',\n      paint: {\n        'sky-type': 'atmosphere',\n        'sky-atmosphere-sun': [90, 0],\n        'sky-atmosphere-halo-color': 'rgba(255, 255, 255, 0.5)',\n        'sky-atmosphere-color': 'rgba(255, 255, 255, 0.2)',\n        'sky-opacity-transition': { duration: 500 },\n        'sky-atmosphere-sun-intensity': day ? 100 : 5\n      }\n    });\n  }\n\n  addFog() {\n    const {\n      map: { day, fog }\n    } = this.mapData;\n\n    if (fog) {\n      this.map.setFog({\n        range: [-1, 4.5],\n        color: day ? 'white' : 'rgba(66, 88, 106, 1)',\n        'horizon-blend': 0.1\n      });\n    }\n  }\n\n  createMarkers(markers, filters) {\n    const {\n      map: { zoom }\n    } = this.mapData;\n\n    this.markers = markers.map(marker => {\n      const filter = filters.find(filter => filter.name === marker.filterName);\n      const customMarker = new CustomMarker({ data: marker, filter });\n\n      customMarker.onClick(e => {\n        e.stopPropagation();\n        this.onMarkerClick(customMarker);\n      });\n\n      if (filter.displayZoomLevel > zoom) {\n        customMarker.hide();\n      }\n\n      return customMarker;\n    });\n  }\n\n  createTrails(data) {\n    this.trails = data.map(trail => new CustomPath(trail));\n  }\n\n  zoomToMarker(marker) {\n    const zoom = this.map.getZoom();\n\n    if (zoom < 14) {\n      this.map.easeTo({\n        center: marker.getCenter(),\n        zoom: marker.getZoom(),\n        speed: 0.2,\n        pitch: 60,\n        duration: 5000\n      });\n\n      return;\n    }\n\n    const lerp = (a, b, t) => {\n      if (Array.isArray(a) && Array.isArray(b)) {\n        const result = [];\n        for (let i = 0; i < Math.min(a.length, b.length); i++)\n          result[i] = a[i] * (1.0 - t) + b[i] * t;\n        return result;\n      }\n\n      return a * (1.0 - t) + b * t;\n    };\n\n    const animationDuration = 3000;\n    const center = this.map.getCenter();\n    const startPosition = [center.lng, center.lat];\n    const markerPosition = marker.getCenter();\n    const endPosition = [markerPosition.lng, markerPosition.lat];\n    const startZoom = this.map.getZoom();\n    const endZoom = marker.getZoom();\n\n    let start;\n\n    function frame(time) {\n      if (!start) start = time;\n      const animationPhase = (time - start) / animationDuration;\n      if (animationPhase > 1) {\n        return;\n      }\n\n      // interpolate camera position while keeping focus on a target lat/lng\n      const position = lerp(startPosition, endPosition, animationPhase);\n      const zoom = lerp(startZoom, endZoom, animationPhase);\n\n      this.map.setCenter(position);\n      this.map.setZoom(zoom);\n\n      this.animation = window.requestAnimationFrame(frame.bind(this));\n    }\n\n    this.animation = window.requestAnimationFrame(frame.bind(this));\n  }\n\n  cancelZoomAnimation() {\n    if (this.animation) {\n      window.cancelAnimationFrame(this.animation);\n      // eslint-disable-next-line no-undefined\n      this.animation = undefined;\n    }\n  }\n}\n\nexport default MapboxMap;\n"],"sourceRoot":""}