var map;
var infowindow;
var infoBox;
var image = [];
var gmarkers = [];
var gpolygons = [];
var categories = {};

var myOptions = {
    zoom: 10,
    center: new google.maps.LatLng(53.162529, 6.730505),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    streetViewControl: true,
    mapTypeControl: true,
    navigationControl: true,
    navigationControlOptions: { style: google.maps.NavigationControlStyle.DEFAULT }
}

function initialize_GMap() {

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    if (routes != null)
        fillRoutes(routes);
}

function fillPoints(locations) {
    for (var i = 0; i < locations.length; i++) {
        var point = locations[i];
        var myLatLng = new google.maps.LatLng(point.lng, point.lat);
        var markerImg = new google.maps.MarkerImage(point.icon);
        if (point.anchor != false)
            markerImg.anchor = new google.maps.Point(point.anchor.x, point.anchor.y);
        var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            draggable: false,
            icon: markerImg
        });
        marker.mycategory = point.categorie;
        categories[point.catid] = true;
        marker.mytags = createTagArray(point.tags);
        gmarkers.push(marker);

        addClickListenerMarkerInfoBox(marker, point)

    }
}

function fillRoutes(locations) {
    for (var j = 0; j < locations.length; j++) {
        var area = locations[j];
        var countyPolygon = [];
        var countyCoordinates = [];

        for (var i = 0; i < area.lnglats.length; i++) {
            countyCoordinates[i] = new google.maps.LatLng(area.lnglats[i][0], area.lnglats[i][1]);
        }

            countyPolygon[j - 1] = new google.maps.Polyline({
                path: countyCoordinates,
                strokeColor: area.color,
                strokeOpacity: 1.0,
                strokeWeight: 3,
                fillOpacity: 0
            });

        countyPolygon[j - 1].mycategory = area.categorie;
        categories[area.catid] = true;
        countyPolygon[j - 1].setMap(null);
        gpolygons.push(countyPolygon[j - 1]);
        //                  
       
        addClickListenerPolygonInfoBox(countyPolygon[j - 1], area, countyCoordinates[0]);

        // add start/end marker for landschap
        var marker_start = new google.maps.Marker({
            position: countyCoordinates[0],
            map: map,
            draggable: false,
            icon: new google.maps.MarkerImage(locations[j].icon)
        });
        marker_start.mycategory = area.categorie;
        marker_start.setVisible(false);
        gmarkers.push(marker_start);
        addClickListenerMarkerInfoBox(marker_start, locations[j]);
    }
}

function addClickListenerMarkerInfoBox(marker, point) {
    google.maps.event.addListener(marker, 'click', function () {
        if (infowindow) infowindow.close();
        if (infoBox)
            infoBox.remove();

        var contentString = "<div class=\"infowindowtext\">";
        contentString += buildContentString(point);
        contentString += "      </div>";

        infoBox = new _InfoBox({ latlng: marker.getPosition(), map: map, content: contentString, href: point.pagehref });
    });
}

function addClickListenerPolygonInfoBox(polygon, area, latlng) {
    google.maps.event.addListener(polygon, 'click', function () {
        if (infowindow) infowindow.close();
        if (infoBox)
            infoBox.remove();

        var contentString = "<div class=\"infowindowtext\">";
        contentString += buildContentString(area);
        contentString += "      </div>";

        infoBox = new _InfoBox({ latlng: latlng, map: map, content: contentString, href: area.pagehref });
    });
}


function buildContentString(data) {
    var ret = "";
    ret += "<h2>" + data.title + "</h2>";
    ret += data.description;
    //ret += "<div class=\"readmore\">";
    //ret += "<a href='" + data.pagehref + "'>Meer informatie</a>";
    //ret += "</div>";

    return ret;
}

function hasTrue(input) {
    if (!input)
        return true;

    var hasKeys = false;
    for (key in input) {
        hasKeys = true;
        if (input[key] == true)
            return true;
    }

    return !hasKeys;
}

function show_cat(box, category) {

    categories[category] = true;

    //points
    for (var i = 0; i < gmarkers.length; i++) {
        if (gmarkers[i].mycategory == category) {
            if (hasTrue(gmarkers[i].mytags))
                gmarkers[i].setVisible(true);
        }
    }
    //areas
    for (var a = 0; a < gpolygons.length; a++) {
        if (gpolygons[a].mycategory == category) {
            if (hasTrue(gpolygons[a].mytags))
                gpolygons[a].setMap(map);
        }
    }
    if (box)
        box.checked = true;

}

function hide_cat(box, category) {

    categories[category] = false;

    //points
    for (var i = 0; i < gmarkers.length; i++) {
        if (gmarkers[i].mycategory == category) {
            gmarkers[i].setVisible(false);
        }
    }
    //areas
    for (var a = 0; a < gpolygons.length; a++) {
        if (gpolygons[a].mycategory == category) {
            gpolygons[a].setMap(null);
        }
    }
    if (box)
        box.checked = false;
    if (infowindow)
        infowindow.close();
}

function boxclick(box, category) {
    if (box.checked) {
        show_cat(box, category);
    } else {
        hide_cat(box, category);
    }
}

function routeSelect(box, category, zoom) {

    //points
    var markerToOpen
    for (var i = 0; i < gmarkers.length; i++) {
        if (gmarkers[i].mycategory == category) {
            gmarkers[i].setVisible(true);
            markerToOpen = gmarkers[i];
        } else {
            gmarkers[i].setVisible(false);
        }
    }
    //areas
    for (var a = 0; a < gpolygons.length; a++) {
        if (gpolygons[a].mycategory == category) {
            gpolygons[a].setMap(map);
            //map.setCenter(gpolygons[a].position);
            //map.setZoom(zoom);
        } else {
            gpolygons[a].setMap(null);  
        }
    }
    if (box)
        box.checked = true;

    if (markerToOpen) {
        map.setCenter(markerToOpen.position);
        map.setZoom(zoom);
        //google.maps.event.trigger(markerToOpen, 'click');
    }
}

$(document).ready(function () {
    initialize_GMap();
});