mappa-ricezione-radio/static/js/addmap.js

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) {
            console.log(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(),
            comprensibile: $('#pointform select[name=comprensibile]').val(),
        })
        $('#pointform').addClass('hidden')
        return false;
    }

    function onMapClick(e) {
        console.log('click', e)
        console.log(e.latlng)
        var stabilita = 3
        console.log(map.getZoom())
        if(map.getZoom() > 15) {
            stabilita = 19 - map.getZoom()
        }
        console.log('st', stabilita)
        $('#pointform input[name=lat]').val(e.latlng.lat)
        $('#pointform input[name=lng]').val(e.latlng.lng)
        $('#pointform select[name=stabilita]').val(stabilita)
        $('#pointform').removeClass('hidden')
        // TODO: aggiungi punto temporaneo, ma poi va rimosso

    }

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