$(document).ready ->
  $('#map.events').each ->
    map = L.map 'map'

    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
      attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a>'
    ).addTo map

    $.getJSON $(this).data('url') + location.search, (json) ->
      layer = L.geoJson(json,
        onEachFeature: (feature, layer) ->
          # Does this feature have a property named popupContent?
          if (feature.properties && feature.properties.popupContent)
            layer.bindPopup feature.properties.popupContent
      )

      map.addLayer L.markerClusterGroup().addLayer layer

      # Automatic focus to all displayed events
      map.fitBounds layer.getBounds()

  $('#map.event').each ->
    coord = [$(this).data('latitude'), $(this).data('longitude')]

    map = L.map('map').setView [coord[0], coord[1]], 16

    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
      attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a>'
    ).addTo map

    $.getJSON $(this).data('url') + location.search, (json) ->
      layer = L.geoJson(json,
        onEachFeature: (feature, layer) ->
          # Does this feature have a property named popupContent?
          if (feature.properties && feature.properties.popupContent)
            layer.bindPopup(feature.properties.popupContent)
      )

      map.addLayer L.markerClusterGroup().addLayer layer

    marker = L.marker([coord[0], coord[1]]).addTo map