/* globals $, jQuery, L */
function viewMap () {
  var map = L.map('mapid').setView([43.797, 11.2400], 11)
  // Set up the OSM layer
  L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map)

  $.getJSON('/api/rapporti/get', function (data) {
    for (var i in data.rapporti) {
      var p = data.rapporti[i]
      L.circle([p.lat, p.lng], {
        color: p.colore,
        fillColor: p.colore,
        fillOpacity: 0.2,
        opacity: 0.7,
        radius: p.radius
      }).addTo(map)
    }
  })

  function addPointToDb (dati) {
    $.post('/api/rapporti/add', dati
      , function (p) {
        L.circle([p.lat, p.lng], {
          color: p.colore,
          fillColor: p.colore,
          fillOpacity: 0.5,
          radius: p.radius
        }).addTo(map)
      })
  }

  function onFormSubmit () {
    addPointToDb({
      lat: $('#pointform input[name=lat]').val(),
      lng: $('#pointform input[name=lng]').val(),
      stabilita: $('#pointform select[name=stabilita]').val(),
      tiporadio: $('#pointform select[name=tiporadio]').val(),
      indirizzo: $('#pointform input[name=indirizzo]').val(),
      comprensibile: $('#pointform select[name=comprensibile]').val()
    })
    $('#pointform').addClass('hidden')
    return false
  }

  function onMapClick (e) {
      $('#pointform').addClass('hidden')
      $.ajax('https://nominatim.openstreetmap.org/reverse?format=jsonv2&lat=' + e.latlng.lat + '&lon=' + e.latlng.lng,
          {
              timeout: 5000
          }
      ).then(function(nominatimData) {
          var stabilita = 3
          if (map.getZoom() > 15) {
              stabilita = 19 - map.getZoom()
          }
          $('#pointform input[name=lat]').val(e.latlng.lat)
          $('#pointform input[name=lng]').val(e.latlng.lng)
          $('#pointform input[name=indirizzo]').val(nominatimData.display_name)
          $('#pointform select[name=stabilita]').val(stabilita)
          $('#pointform').removeClass('hidden')
      })
  }

  map.on('click', onMapClick)
  $('#addPoint').on('click', onFormSubmit)
}
jQuery(function ($) {
  $('#mapid').css('height', $(window).height() - 200)
  viewMap()
})