//Utility functions for map info window
function mapit(lat,lon,zoom,id) {
    map = L.map(document.getElementById("map-wrapper-"+id));
    centerCoord = new L.LatLng(lat, lon);
    zoom = zoom;
    L.tileLayer.provider('Esri.WorldTopoMap', {maxZoom: 18, attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Tiles &copy; Esri and the GIS User Community'}).addTo(map);
    map.setView(centerCoord, zoom);
    ////get the geojson for this map
    $.ajax({
        url: "/projects/data/natparks/"+id+".json",
        dataType: "json",
        success: function(data, text, request) { draw_poly(data, map); } 
        //complete: function(xhr, status) {console.log(status); return false; },
    });
    //draw the polygon
    function draw_poly(data, map) {
        var myStyle = {
            "color": "#201a11",
            "weight": 2,
            "opacity": 0.65
        };
        L.geoJson(data, {
            style: myStyle
        }).addTo(map);
    }
}  

// utility functions to create/remove map container
function create_map(obj) {
    var lat = parseFloat(obj.attr('data-latitude'));
	var lon = parseFloat(obj.attr('data-longitude'));
	var zoom= parseInt(obj.attr('data-zoom'));
	var id= obj.attr('data-id');

    //create container divs
    $(obj).parents().eq(3).append('<div class="map-container" id="map-container-'+id+'">');
    $('#map-container-'+id).append('<div class="map-wrapper" id="map-wrapper-'+id+'">');
    mapit(lat,lon,zoom,id);
}
function remove_map(id) {
    $(id).remove();
}

//functions to handle the "more" link
// utility functions to create/remove camera info container
function get_exif(obj,id) {
    //$(obj).parents().eq(2).append('<div id="exif-container">');
    $(obj).parents().eq(3).append('<div class="more-container" id="'+id+'">');    $(obj).parents().eq(2).children('.meta').clone().appendTo('#'+id).css('visibility', 'visible');
    
    
        
    //deal with the variable height of div.legend
    $('#exif-container').css({
        bottom: function(index, value) {
            return parseFloat($(obj).parent().parent().css("height"))-14;
        }
     });
}
function remove_exif(id) {
    $('#'+id).remove();
}
$(document).ready(function(){  
//set up click events for map button
    $('.map-link').click( function() {
        var more_id = 'more-container-'+$(this).parent().next().children('.more-link').attr('id').split('-')[1];
        var id = '#map-container-'+$(this).attr('data-id');
        if ($('#'+more_id).is(":visible")){
                remove_exif(more_id);
        }
        if ($(id).is(":visible")) {
            remove_map(id);  
        } else {
            create_map($(this));
        }
        return false;
    
    }); 
    
    //set up click events for more info button
    $('.more-link').click( function() {
        var map_id = '#map-container-'+$(this).parent().prev().children('.map-link').attr('data-id');
        var id = 'more-container-'+this.id.split('-')[1];
        if ($(map_id).is(":visible")){
            remove_map(map_id);
        }
        if ($('#'+id).is(":visible")) {
            remove_exif(id);
        } else {
            get_exif(this, id);
        }
        return false;
    });

});