var map;
var markers = [];
var infoWindow;
var infoWindowText = [];
var currentMapstyle;

var iconimage = new google.maps.MarkerImage(
    '/layout/images/marker.png',
    new google.maps.Size(20,24),
    new google.maps.Point(0,0),
    new google.maps.Point(10,24)
    );
    
var iconshadow = new google.maps.MarkerImage(
    '/layout/images/markershadow.png',
    new google.maps.Size(36,24),
    new google.maps.Point(0,0),
    new google.maps.Point(10,24)
    );

var shape = {
    coord: [14,0,16,1,17,2,18,3,18,4,19,5,19,6,19,7,19,8,19,9,19,10,19,11,19,12,19,13,18,14,18,15,17,16,16,17,15,18,14,19,13,20,11,21,10,22,10,23,9,23,8,22,7,21,6,20,5,19,4,18,3,17,2,16,1,15,1,14,0,13,0,12,0,11,0,10,0,9,0,8,0,7,0,6,0,5,1,4,1,3,2,2,3,1,4,0,14,0],
    type: 'poly'
};


function createMap(divName, style) {
    currentMapstyle = style;
    markers = [];
    switch(style) {
        case 'fixed':
            var myOptions = {
                zoom: 16,
                mapTypeId: google.maps.MapTypeId.SATELLITE,
                disableDefaultUI: true,
                zoomControl: false,
                scrollwheel: false,
                draggable: false
            };
            break;
        case 'roadmap':
            var myOptions = {
                zoom: 16,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                disableDefaultUI: true,
                zoomControl: true
            };
            break;
        default:
            var myOptions = {
                zoom: 16,
                mapTypeId: google.maps.MapTypeId.SATELLITE,
                disableDefaultUI: true,   
                zoomControl: true     
            };  
            break;    
    }

    map = new google.maps.Map(document.getElementById(divName), myOptions);
    infoWindow= new google.maps.InfoWindow();
    
    
    google.maps.event.addListener(map, "drag", function() {
        hideSlogan();
    });
    
    google.maps.event.addListener(map, "zoom_changed", function() {
        hideSlogan();
    });    
    
    //infowindow sluiten als gebruiker op kaart klikt
    google.maps.event.addListener(map, 'click', function(){
        infoWindow.close();
        hideSlogan();

    });
}

//zellik-specifiek
function hideSlogan() {
    $('#slogan').fadeOut('slow', function() {
        $('#slogan').remove();
    }); 
}

function centerMapOnCoordinates(lat, lng) {
    map.setCenter(createLatLng(lat, lng));
}

function addMarkersOnCoordinates(locationArray) {
    for(var i in locationArray) {
        addSingleMarkOnCoordinates(locationArray[i]);
    }
    for(var i in markers) {
        infoWindowText[markers[i].getPosition().toString()] = '<div class="infowindow">' + infoWindowText[markers[i].getPosition().toString()] + '</div>';
    }
}


function addSingleMarkOnCoordinates(location) {
    markerAlreadyExists = false;
    existingMarkerIndex = 0;
    for(var i in markers) {
        if (markers[i].getPosition().lat() == location['lat'] && markers[i].getPosition().lng() == location['lng']) {
            markerAlreadyExists = true
            existingMarkerIndex = i;
        }
    }    
    
    if (markerAlreadyExists) {
        infoWindowText[markers[existingMarkerIndex].getPosition().toString()] += getLocationContentString(location);
        return markers[existingMarkerIndex];
        
    }
    else {
    
        var latLng = createLatLng(location['lat'], location['lng']);

    
        var marker = new google.maps.Marker({
            //zellik specifiek
            icon: iconimage,
            shadow: iconshadow,
            shape: shape,
            clickable:false,
            position: latLng
        });
        
        marker.setMap(map);
        if (currentMapstyle != 'fixed') {
            if (currentMapstyle != 'roadmap') {
                marker.setClickable(true);
                infoWindowText[marker.getPosition().toString()] = getLocationContentString(location);
                google.maps.event.addListener(marker, 'click', function(){
                    hideSlogan();
                    infoWindow.setContent(infoWindowText[marker.getPosition().toString()]);
                    infoWindow.open(map, marker);
                });
            }
        }
    
        markers[markers.length] = marker;
        return marker
    }
    
    
}

function getLocationContentString(location) {
//    if (location['logo'] != null) {
//        logoHtml = '<img class="firmLogo" src="' + location['logo'] + '" alt="'+ location['name'] +'" />';
//    }
//    else {
        logoHtml = '';
//    }
    if (location['url'] != '') {
        locationName = '<a href="'+location['url']+'">'+location['name']+'</a>';
    }
    else {
        locationName = location['name'];
    }
    
    html = '<div>' + logoHtml +'<div class="infocontent"><span class="webfontNormal">' + locationName + '</span>'+location['description'] + '</div></div>';

    return html;
    
}

function createLatLng(lat, lng) {
    var latLngObject = new google.maps.LatLng(lat, lng);
    return latLngObject;
}