/********************************************************************
	Javascript
********************************************************************/

var map;
var markersArray = new Array();    //list of marker for clustermarker
var othermarkers = new Array();    // list of other markers for same book
var redIcon, multiIcon, blueIcon;  // google maps standard icons
var toggleState = 1;
var geocoder = new GClientGeocoder();
geocoder.setBaseCountryCode("dk");

$(document).ready(function() {

    if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(55.869, 11.228), 6);
        map.addMapType( G_PHYSICAL_MAP  );
        map.setUIToDefault();

        //active icon
        redIcon = new GIcon( G_DEFAULT_ICON );
        redIcon.image = "gfx/map_marker.png";
        redIcon.iconSize = new GSize(20, 23);
        redIcon.iconAnchor = new GPoint(9, 23);
        redIcon.shadowSize = new GSize(37, 23);

        blueIcon = new GIcon( redIcon );
        blueIcon.image = "gfx/map_marker_blue.png";

        //icon for multiple markers
        multiIcon = new GIcon( redIcon );
        multiIcon.image = "gfx/map_marker_multiple.png";

        cluster = new ClusterMarker( map, {
            clusterMarkerIcon: multiIcon,
            clusterMarkerClick: myClusterClick,
            clusterMarkerTitle:'Klik for at se %count bøger'
        });
        cluster.clusteringEnabled = true;

    }

    //get all positions and insert markers
    $.ajax({
        type:     "POST",
        url:      "getlocationsjson.php",
        dataType: "json",
        success: function(json){

            for( var i=0; i < json.length; i++){
                othermarkers.push( new Array() );
                for( var j=0; j < json.length; j++){
                    if( json[i].id == json[j].id && i != j ){
                        othermarkers[i].push( j );
                    }
                }
                marker = new GMarker( new GLatLng(json[i].lat, json[i].lng), {title:unescape(json[i].title), icon:redIcon} );
                markersArray.push( marker );
            }

            //cannot generate html before all markers generated
             for( var k=0; k < json.length; k++){
                var html = generateBubbleHtml( json[k], k );
                createMarkerListener( markersArray[k], html, k );
            }
            cluster.addMarkers( markersArray );
            cluster.refresh();
        }
    });

});

function mapSearchToggleSlide(){
    var increment = 120;
    var plusminus = ($("#map_search").css("width") == "20px") ? "+=" : "-=";
    $("#map_search").animate( {width:plusminus+increment}, 400 );
    $("#map_canvas").animate( {width:( plusminus == "+=" ? "-=" : "+=" )+increment}, 400 );
}

//almost repetition of function for finding spot in admin part - but here to ensure later package for other use
function searchMap(){
        address = $("#map_search_input").val();
        if(address == ""){
            return false;
        }else{
            if(geocoder) {
                $("#loading_search").show();
                geocoder.getLatLng(address,
                    function(point) {
                        if (!point) {
                            $("#loading_search").hide();
                            $("#map_search_feedback").html("Adressen '"+address+"' blev ikke fundet")
                            return false;
                        } else {
                            $("#loading_search").hide();
                            $("#map_search_feedback").html("")
                            map.setCenter(point,11);
                            return true;
                        }
                    }
                )
            }else{
                $("#map_search_feedback").html("Problemer med serveren har gjort at adressen ikke blevfundet.")
                return false;
            }
        }
}

//makes sure clustered markers have info-windows with list of contained markers
function myClusterClick(args) {
    cluster.defaultClickAction=function(){
        map.setCenter(args.clusterMarker.getLatLng(), map.getBoundsZoomLevel(args.clusterMarker.clusterGroupBounds))
        delete cluster.defaultClickAction;
    }
    var html = "";
    var printedMarkers = new Array();
    for( i=0 ; i<args.clusteredMarkers.length ; i++ ){
        if( !isInArray( args.clusteredMarkers[i].getTitle(), printedMarkers ) ){
            html+='<b>&middot;</b> <a style="color:black;" href="javascript:cluster.triggerClick('+args.clusteredMarkers[i].index+')">'+args.clusteredMarkers[i].getTitle()+'</a><br />';
            printedMarkers.push( args.clusteredMarkers[i].getTitle() );
        }
    }
    html = '<div style="width:24em"><strong>' + args.clusteredMarkers.length + ' steder fordelt på disse bøger:</strong><br />' + html;
    html+='<br /><span class="fakelink" onclick="map.closeInfoWindow(); cluster.defaultClickAction();">Zoom ind</span> for at se stederne.</div>';
    //html+='<br /><span class="fakelink" onclick="map.closeInfoWindow(); cluster.defaultClickAction();"><img src="gfx/zoomin19x20.gif" border="0"></div>';
    if( printedMarkers.length <= 25 ){
        map.openInfoWindowHtml(args.clusterMarker.getLatLng(), html);
    } else {
        map.closeInfoWindow();
        cluster.defaultClickAction();
    }
}

function createMarkerListener( marker, html, index ){

    //open windows, set marker-color, add temporary blue markers to show book-connections and add to temporary array
    GEvent.addListener(marker,"click", function() {
        marker.openInfoWindowHtml( html );
        marker.setImage( "gfx/map_marker_blue.png" );
        for( var i=0; i<othermarkers[index].length; i++ ){
            var tmpMarker = new GMarker(markersArray[ othermarkers[index][i] ].getLatLng(), {icon:blueIcon, title: "Marker_" + othermarkers[index][i] } );
            map.addOverlay( tmpMarker );
        }
    });

    //reset marker color, remove temporary markers, refresh cluster
    GEvent.addListener(marker, "infowindowclose", function(){
        marker.setImage( "gfx/map_marker.png" );
        map.clearOverlays();
        cluster.removeMarkers();
        cluster.addMarkers( markersArray );
        cluster.refresh( true );
    });
}

//zooms and centers to all locations with this book
function zoomtobounds( index ){
    var bounds = new GLatLngBounds( markersArray[index].getLatLng() );
    var locmarkers = new Array();
    for( var i=0; i<othermarkers[index].length; i++ ){
        bounds.extend( markersArray[ othermarkers[index][i] ].getLatLng() );
        locmarkers.push( markersArray[ othermarkers[index][i] ] );
    }
    var zoom = map.getBoundsZoomLevel( bounds );
    map.setCenter( bounds.getCenter(), zoom );
    $.each(locmarkers, function(){
        this.setImage( "gfx/map_marker_blue.png" );     //OK
    });
}

function generateBubbleHtml( json, index ){
    var output = "<div style='width:300px;'>" +
        "<a href='" + unescape(json.url) + "' target='_blank' style='font:bold 14px verdana, sans-serif; color:black; text-decoration:none; margin-top:5px;'>" + unescape(json.title) + "</a><br />";
    if(json.image != "") output += "<img src='" + json.image + "' style='float:left; margin:10px 5px 0 0; border:1px solid #aaaaaa; '>";
    output +=
        "<div style='font:italic bold 12px verdana, sans-serif; margin-top:10px;'>" + unescape(json.author) + "</div>" +
        "<div style='font:italic 12px verdana, sans-serif;'>" + unescape(json.category_title) + "</div><br>" +
        "<div style='font:bold 12px verdana, sans-serif;'>Beskrivelse</div>" +
        "<div style='font:12px verdana, sans-serif;'>" + unescape(json.description) + "</div><br>";
	var links = json.relatedlinks.split(";;");
    if( links.length > 1 ){
        output += "<div style='font:bold 12px verdana, sans-serif;'>Relaterede links:</div><div>";
        for( var i=0; i<links.length-1; i++){
            var link = links[i].split(";");
            output += " &#9679; <a style='color:black;' href='" + unescape(link[1]) + "' target='_blank'>"  + unescape(link[0]) + "</a>";
        }
        output += "</div><br />"
    }
    output += "<div style='clear:both;'></div>";

    if( othermarkers[index].length == 1 ){
        output += "<div style='font:bold 12px verdana, sans-serif;'>Bogen er også knyttet til 1 andet sted</div>";
        output += "<span class='fakelink' onclick='zoomtobounds(" + index + ");'>Zoom så det også kan ses</span> - Det er markeret med blåt.";
    } else if( othermarkers[index].length > 0 ) {
        output += "<div style='font:bold 12px verdana, sans-serif;'>Bogen er også knyttet til " + othermarkers[index].length + " andre steder</div>";
        output += "<span class='fakelink' onclick='zoomtobounds(" + index + ");'>Zoom så alle kan ses</span> - De er markeret med blåt.";
    }
    output += "</div>";
    
    return output;
}

function isInArray( value, array){
    for(var i=0; i<array.length; i++){
        if( array[i] == value) return true;
    }
    return false;
}