// markerevents.js - responds to marker or form event (marker drag or form input)
// author: Krishna Tadepalli version 1.0 date: 07/25/2018
//
// set up a tile layer
var tileLayer = new L.TileLayer('//services.arcgisonline.com/arcgis/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}?', {
    attribution: '<div class="popup" onclick="showSources()" style="color: #0080ff">Sources<span class="popuptext" id="popupSrc">Esri, DeLorme, HERE, USGS, Intermap, iPC, NRCAN, Esri Japan, METI, Esri China (Hong Kong), Esri (Thailand), MapmyIndia,                               and the GIS User Community</span></div>'
});
//position the map to default lat-lon
var map = new L.Map('map', {
    'center': [37.2509, -92.5104],
    'zoom': 7,
    'layers': [tileLayer]
});
var marker = L.marker([37.2509, -92.5104], {
    draggable: true
}).addTo(map);
setTimeout(function () {
  map.invalidateSize();
  map.fitBounds(myBounds2, {
    maxZoom: 10
  });
}, 500);
// listen to drag event and register the location to backend bean
marker.on('dragend', function (e) {
    var lat = marker.getLatLng().lat;
    var lon = marker.getLatLng().lng;
    map.panTo([lat, lon]);
    updateLL([{name: 'lat', value: lat}, {name: 'lon', value: lon}]);
});
// update marker position based on form input via backend bean's listener
function updateLatLng(lat, lon) {
    marker.setLatLng([lat, lon]);
    map.panTo([lat, lon]);
}