var telerArray;
var map;
var infoWindow;
var contentArray = new Array();
var markerArray = new Array();
var iconUserLocation;

$(document).ready(function() {

    iconUserLocation = "/media/coforta/icons/green-marker.png";
    var telerString = $('.map_canvas').text();
    telerArray = telerString.split(';');    

    $('.teler-down').click(function() {
        var mapCenter = new google.maps.LatLng(52.15, 5.666666);
        var mapOptions = {
            zoom: 7,
            center: mapCenter,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            scrollwheel: false
        };
        map = new google.maps.Map(document.getElementById('teler-map'), mapOptions);

        infoWindow = new google.maps.InfoWindow({
            content: "test"
        });

        var content;

        for (var i = 0; i < telerArray.length; i++) {
            telerDataArray = telerArray[i].split('#');

            if (telerDataArray[2] == "userLocation") {

                markerLocation = new google.maps.LatLng(telerDataArray[0], telerDataArray[1]);

                marker = new google.maps.Marker({
                    position: markerLocation,
                    map: map,
                    title: "Uw locatie"
                });
            }

            else if (telerDataArray[0] != "dropDown") {

                content = "<p><strong>" + telerDataArray[2] + "</strong>";
                content += "<br /><br />" + telerDataArray[3];
                content += "<br />" + telerDataArray[4];
                content += "<br />" + telerDataArray[5];

                if (telerArray[telerArray.length - 1].split('#')[2] == "userLocation") {
                    content += "<br /><br />Afstand tot uw locatie:";
                    content += "<br />" + telerDataArray[6] + " km";
                }
                content += "</p>";

                contentArray[i] = content;

                createMarker(telerDataArray[0], telerDataArray[1], telerDataArray[2], content, i);
            }
        }
    });

    if (telerArray[telerArray.length - 1] == "dropDown") {
        $('.teler-down').click();
    }

    $('.teler-resultaat ul li a').click(function() {
        $('.teler-resultaat ul li a.active').removeClass('active');
        $(this).addClass('active');
        index = $(this).attr('id').replace("teler", "");
        infoWindow.setContent(contentArray[index]);
        infoWindow.open(map, markerArray[index]);
        map.setZoom(9);
    });   
});

function createMarker(lat, lng, company, content, index) {

    markerLocation = new google.maps.LatLng(lat, lng);

    marker = new google.maps.Marker({
        position: markerLocation,
        map: map,
        title: company,
        icon: iconUserLocation
    });

    markerArray[index] = marker;

    google.maps.event.addListener(marker, 'click', (function(marker, content) {
        return function() {
            infoWindow.setContent(content);
            infoWindow.open(map, marker);
        }
    })(marker, content));
}