//Utility functions for map info window
function mapit(lat,lon,zoom,id) {
    var map;
    //create a new map
    var centerCoord = new google.maps.LatLng(lat, lon);
    var mapOptions = {
        zoom: zoom,
        center: centerCoord,
        mapTypeId: google.maps.MapTypeId.TERRAIN,
        disableDefaultUI: true,
        navigationControl: true,
        navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
    };
    map = new google.maps.Map(document.getElementById('map-wrapper-'+id), mapOptions);
    //get the geojson for this map
    $.ajax({
        url: "/projects/data/"+id+"/",
        dataType: "json",
        success: function(data, text, request) { draw_poly(data); } 
        //complete: function(xhr, status) {console.log(status); return false; },
    });
    //draw the polygon
    function draw_poly(data) {
        var poly = createPolygons(data.features[0].geometry);
        for (i=0;i<=poly.length-1;i++) {
            poly[i].setMap(map);
        }
        
    }
}  

// utility functions to create/remove map container
function create_map(obj) {
    //break up the variable passed from the map link's title element
    var lat = parseFloat(obj.title.split(',')[0]);
	var lon = parseFloat(obj.title.split(',')[1]);
	var zoom= parseInt(obj.title.split(',')[2]);
	var id= obj.title.split(',')[3];

    //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+'">');
        
    
    //deal with the variable height of div.legend
    //$('#map-container').css({
    //  bottom: function(index, value) {
    //    return parseFloat($(obj).parent().parent().css("height"))-2;
    //  }
    // });
    
    mapit(lat,lon,zoom,id);
}
function remove_map(id) {
    $(id).remove();
}

//function to parse and render polygons for GMaps
//# taken from http://friism.com/drawing-geojson-based-polygons-on-google-maps
function createPolygons(areajson, bounds){
    var coords = areajson.coordinates;
    var polygons = _(coords).reduce([], function(memo_n, n) {
        var polygonpaths = _(n).reduce(new google.maps.MVCArray(), function(memo_o, o) {
            var polygoncords = _(o).reduce(new google.maps.MVCArray(), function(memo_p, p) {
                var mylatlng = new google.maps.LatLng(p[1], p[0]);
                if(bounds){
                    bounds.extend(mylatlng);
                }
                memo_p.push(mylatlng);
                return memo_p;
            });
            memo_o.push(polygoncords);
            return memo_o;
        });
        var polygon = new google.maps.Polygon({
            paths: polygonpaths,
            strokeColor: "#201a11",
            strokeOpacity: 0.8,
            strokeWeight: 2,
            fillColor: "#201a11",
            fillOpacity: 0.35
        });
        memo_n.push(polygon);
        return memo_n;
    });
    return polygons;
}

//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.title.split(',')[3];
        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('title').split(',')[3];
        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;
    });

});