//
//This is the JavaScript file.
//

function load() {

    if(GBrowserIsCompatible()) {
        var hybridLayer = new Array();

        hybridLayer[0] = G_NORMAL_MAP.getTileLayers()[0];

        hybridLayer[1] = new GTileLayer(new GCopyrightCollection('MMID'), 10, 19);
        
        hybridLayer[1].getTileUrl = function(a, b) {return "/images/" + tileToQuadKey(a.x, a.y, b) + ".png";};

        hybridLayer[1].getCopyright = function(a, b) {return "MMID"};
        hybridLayer[1].getOpacity = function() {return 0.4;};
        hybridLayer[1].isPng = function() {return true;};

        var wcocoMap = new GMapType(hybridLayer, G_SATELLITE_MAP.getProjection(), 'Custom', {errorMessage :"Could not create custom map"});

        wcocoMap.getTextColor = function() {return "#FFFFFF";};

        var wcocoTypes = new Array();

        wcocoTypes[0] = wcocoMap;
        wcocoTypes[1] = G_NORMAL_MAP;

        map = new GMap2(document.getElementById("map_canvas"), {mapTypes : wcocoTypes});

        // If a placemark is given, create the mark centred on the placemark.
        mapCenter = new GLatLng(52.220228, -7.628131);

        suppliedPlacemarkid = extractPlacemarkidFromURL();

        if(suppliedPlacemarkid) {
            createMapCenter(suppliedPlacemarkid);

            var refocus = confirm("Refocus and zoom in to co-ordinates " + mapCenter + "?");

            if(refocus) {
                map.setCenter(mapCenter, 13);
                initialCategory = "all";
                globalCategory = initialCategory;
            } else {
                window.location = "/mapsApplication.html";
            }
            // Otherwise show the normal map
        } else {
            map.setCenter(mapCenter, 9);
            initialCategory = "townsandvillages";
            globalCategory = initialCategory;
        }

        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());

        placemarkerList = new Array();
        iconList = new Array();

        categoryVisibility = new Array();
        categoryKML = new Array();
        overlayKML = new Array();

        GDownloadUrl("generateCategories.php", createCategories);
        GDownloadUrl("generatePlacemarks.php", createPlacemarks);

        categoryKML["drivingroutes"]       = new Array("drivingroutes.kml");
        categoryKML["walkingroutes"]       = new Array("walkingroutes.kml");

        categoryKML["cyclingrouteseasy"]   = new Array("cyclingrouteseasy.kml");
        categoryKML["cyclingroutesmedium"] = new Array("cyclingroutesmedium.kml");
        categoryKML["cyclingrouteshard"]   = new Array("cyclingrouteshard.kml");

        return;
    }
}


function extractPlacemarkidFromURL() {
    var url = window.location.search.substring(1);

    var placemarkid = url.replace("placemarkid=", "");

    return placemarkid;
}

function createMapCenter(placemarkid) {
    GDownloadUrl("generatePlacemarks.php?id=" + placemarkid, setMapCenter);

    return;
}

function setMapCenter(data) {
    var xml = GXml.parse(data);

    var placemarks = xml.documentElement.getElementsByTagName("marker");

    var i = 0;

    var id       = placemarks[i].getAttribute("id");
    var name     = placemarks[i].getAttribute("name");
    var addr     = placemarks[i].getAttribute("address");
    var info     = placemarks[i].getAttribute("info");
    var lat      = placemarks[i].getAttribute("lat");
    var lng      = placemarks[i].getAttribute("lng");
    var category = placemarks[i].getAttribute("category");

    mapCenter = new GLatLng(lat, lng);

    return;
}

function createCategories(data) {
    var xml = GXml.parse(data);

    var categorydiv = document.getElementById("div_category_list");

    var categorytable = document.createElement("table");
    categorytable.setAttribute('id', 'categorytable');
    var categorytablebody = document.createElement("tbody");
    categorytablebody.setAttribute('id', 'categorytablebody');

    var categories = xml.documentElement.getElementsByTagName("category");

    for ( var i = 0; i < categories.length; i++) {
        var catcode = categories[i].getAttribute("code");
        var catname = categories[i].getAttribute("name");

        // Create a table row for the category
        var tablerow = document.createElement('tr');
        tablerow.setAttribute('id', 'categoryrow_' + i);
        tablerow.setAttribute('class', 'categoryrow');

        // Create a cell for the checkbox image
        var checkcell = document.createElement('td');
        checkcell.setAttribute('id', 'checkcell_' + catcode);
        checkcell.setAttribute('class', 'checkcell');

        var catbox = document.createElement('img');
        catbox.setAttribute('id', 'checkboximg_' + catcode);
        catbox.setAttribute('src', 'images/unchecked.gif');

        checkcell.appendChild(catbox);

        tablerow.appendChild(checkcell);

        // Create the text element
        var cattext = document.createElement('td');
        cattext.setAttribute('id', 'cattext_' + catcode);
        cattext.setAttribute('class', 'cattext');
        cattext.innerHTML = catname;

        tablerow.appendChild(cattext);

        // Clicking on tablerow toggles the category visibility
        GEvent.addDomListener(tablerow, 'click', changeCategory(catcode));

        categorytablebody.appendChild(tablerow);

        var icon = createCategoryIcon(catcode);

        iconList[catcode] = icon;

        categoryVisibility[catcode] = false;

        placemarkerList[catcode] = new Array();
        overlayKML[catcode] = new Array();
    }

    // Create a 'show all' category
    catcode = "all";
    catname = "Show All";

    // Create a table row for the category
    var tablerow = document.createElement('tr');
    tablerow.setAttribute('id', 'categoryrow_' + i);
    tablerow.setAttribute('class', 'categoryrow');

    // Create a cell for the checkbox image
    var checkcell = document.createElement('td');
    checkcell.setAttribute('id', 'checkcell_' + catcode);
    checkcell.setAttribute('class', 'checkcell');

    var catbox = document.createElement('img');
    catbox.setAttribute('id', 'checkboximg_' + catcode);
    catbox.setAttribute('src', 'images/unchecked.gif');

    checkcell.appendChild(catbox);

    tablerow.appendChild(checkcell);

    // Create the text element
    var cattext = document.createElement('td');
    cattext.setAttribute('id', 'cattext_' + catcode);
    cattext.setAttribute('class', 'cattext');
    cattext.innerHTML = catname;

    tablerow.appendChild(cattext);

    // Clicking on tablerow toggles the category visibility
    GEvent.addDomListener(tablerow, 'click', changeCategory(catcode));

    categorytablebody.appendChild(tablerow);
    categorytable.appendChild(categorytablebody);
    categorydiv.appendChild(categorytable);

    return;
}

function createCategoryIcon(catcode) {
    var icon = new GIcon(G_DEFAULT_ICON);

    icon.image = '/images/' + catcode + '48.png';
    icon.iconSize = new GSize(48, 48);
    icon.shadow = '/images/' + catcode + '48.png';
    icon.shadowSize = new GSize(48, 48);

    return icon;
}

function changeCategory(catcode) {
    return function() { displayCategory(catcode); };
}

function createPlacemarks(data) {
    var xml = GXml.parse(data);

    var placemarks = xml.documentElement.getElementsByTagName("marker");

    for ( var i = 0; i < placemarks.length; i++) {
        var id = placemarks[i].getAttribute("id");
        var name = placemarks[i].getAttribute("name");
        var addr = placemarks[i].getAttribute("address");
        var info = placemarks[i].getAttribute("info");
        var lat = placemarks[i].getAttribute("lat");
        var lng = placemarks[i].getAttribute("lng");
        var category = placemarks[i].getAttribute("category");

        if(!placemarkerList[category]) {
            placemarkerList[category] = new Array();
        }

        var marker = createMarker(id, new GLatLng(lat, lng), name, addr, info, category);

        placemarkerList[category][id] = marker;

        map.addOverlay(marker);
    }

    displayCategory(initialCategory);

    return;
}

function displayCategory(category) {

    categoryVisibility[category] = !categoryVisibility[category];


    for(var catcode in placemarkerList) {
        if(categoryVisibility[catcode] || category == "all") {
            var checkimg = document.getElementById('checkboximg_' + catcode);
            checkimg.setAttribute('src', 'images/checked.gif');

            for(var index in categoryKML[catcode]) {
                kmlfile = categoryKML[catcode][index];
                overlayKML[catcode][index] = new GGeoXml("http://wcoco.multimedia-instruction.com/routes/" + kmlfile);
                map.addOverlay(overlayKML[catcode][index]);
            }

            if(suppliedPlacemarkid) {
                for(var i in placemarkerList[catcode]) {
                    var marker = placemarkerList[catcode][i];
                    if(catcode != "townsandvillages") {
                        placemarkerList[catcode].show();
                    } else {
                        placemarkerList[catcode].hide();
                    }
                }
            } else {
                for(var j in placemarkerList[catcode]) {
                    placemarkerList[catcode][j].show();
                }
            }
        } else {

            var removecheckimg = document.getElementById('checkboximg_' + catcode);
            removecheckimg.setAttribute('src', 'images/unchecked.gif');

            if((catcode == category) && overlayKML[catcode] && overlayKML[catcode].length > 0) {
                for(var removeindex in categoryKML[catcode]) {
                    if(overlayKML[catcode][removeindex]) {
                        map.removeOverlay(overlayKML[catcode][removeindex]);
                    }
                }
            }

            for(var i in placemarkerList[catcode]) {
                placemarkerList[catcode][i].hide();
            }
        }
    }
    
    
    return;
}

function createMarker(id, latlng, name, address, info, category) {
    var marker = new GMarker(latlng, {icon: iconList[category], title: name});

    var text = "<strong><a target='_parent' href='" + address + "'>" + name + "</a></strong><br />" + info;

    if(category == "townsandvillages") {
        GEvent.addListener(marker, 'click', function() {window.location = "mapsApplication.html?placemarkid=" + id;});
    } else {
        GEvent.addListener(marker, 'click', function() {marker.openInfoWindowHtml(text);});
    }

    return marker;
}

function tileToQuadKey(x, y, zoom) {
    var quad = "";

    for(var i = zoom; i > 0; i--) {
        var mask = 1 << (i - 1);
        var cell = 0;

        if((x & mask) != 0) {
            cell++;
        }
        if((y & mask) != 0) {
            cell += 2;
        }

        quad += cell;
    }

    return quad;
}