// Javascript functions for Google map-based index page

// The map
var map;

// Return a random integer between x and y, inclusive
function randomBetween(x,y)
{
    return x + Math.floor((y-x+1)*Math.random());
}

// Set a style attribute for all elements in a certain class
function setClassStyle(cls, props)
{
    var elems = (document.getElementsByTagName)
                        ? document.getElementsByTagName('*')
                        : document.all;
    var i;
    var p;

    for (i=0; i<elems.length; i++) {
        // Note: does not properly support multiple classes
        if (elems[i].className == cls) {
            for (p in props) {
                elems[i].style[p] = props[p];
            }
        }
    }
}

// Determine the browser height and width
function browserSize()
{
    var mySize = { width: 0, height: 0 };

    if (typeof(window.innerHeight) == 'number' ) {
        mySize.height = window.innerHeight;
    } else if (document.documentElement &&
                                document.documentElement.clientHeight) {
        mySize.height = document.documentElement.clientHeight;
    } else if (document.body && document.body.clientHeight) {
        mySize.height = document.body.clientHeight;
    }

    if (typeof(window.innerWidth) == 'number' ) {
        mySize.width = window.innerWidth;
    } else if (document.documentElement &&
                                document.documentElement.clientWidth) {
        mySize.width = document.documentElement.clientWidth;
    } else if (document.body && document.body.clientWidth) {
        mySize.width = document.body.clientWidth;
    }

    return mySize;
}

// Font size in (rounded) pixels
function fontSizePx(pix)
{
    return Math.round(pix) + 'px';
}

// Load the background Google Map
function loadGoogleMap(lang) {
    var ovMap;

    if ((typeof(GBrowserIsCompatible) != 'undefined')
                                        && GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map"));

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

        if (lang == 'en') {
            initLangControl('Nederlands', 'nl',
                            'Na naar de Nederlandse versie', 'index.nl.html');
        } else {
            initLangControl('English', 'en',
                            'Switch to the English version', 'index.en.html');
        }
        map.addControl(new LangControl());

        ovMap = new GOverviewMapControl();
        map.addControl(ovMap);
        ovMap.hide(true);

        // Map types: G_NORMAL_MAP, G_SATELLITE_MAP, G_HYBRID_MAP

        var now = new Date();
        var startTrip = Date.UTC(2006, 11, 20, 0, 0, 0);
        var endTrip = Date.UTC(2006, 11, 28, 0, 0, 0);
        if ((startTrip <= now) && (now <= endTrip)) {
            //// Lavik
            //map.setCenter(new GLatLng(61.104677, 5.512326),
            //        randomBetween(6,13), G_SATELLITE_MAP);
            // Edinburgh
            map.setCenter(new GLatLng(55.952118, -3.220215),
                    randomBetween(6,19), G_SATELLITE_MAP);
        } else {
            // Amstelveen
            map.setCenter(new GLatLng(52.283089, 4.863671),
                    randomBetween(6,19), G_SATELLITE_MAP);
        }

        map.enableDoubleClickZoom();
        map.enableContinuousZoom();
    }
}

// Add a language control to the page
function LangControl()
{
}

function initLangControl(langStr, lang, langLabel, url)
{
    LangControl.prototype = new GControl();

    LangControl.prototype.initialize = function(map) {
        var container = document.createElement("div");
        var langDiv = document.createElement("div");
        var langIcon = document.createElement("img");

        this.setButtonStyle_(langDiv);
        container.appendChild(langDiv);
        langDiv.appendChild(document.createTextNode(langStr + " "));
        langIcon.src = "flag/" + lang + ".png";
        langDiv.appendChild(langIcon);
        langDiv.title = langLabel;
        GEvent.addDomListener(langDiv, "click", function() {
            window.location.href = url;
        });

        map.getContainer().appendChild(container);
        return container;
    }

    LangControl.prototype.getDefaultPosition = function() {
        return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 35));
    }

    LangControl.prototype.setButtonStyle_ = function(button) {
        button.style.textDecoration = "none";
        button.style.color = "#000000";
        button.style.backgroundColor = "white";
        button.style.font = "12px Arial";
        button.style.border = "1px solid black";
        button.style.padding = "2px 12px";
        button.style.marginBottom = "3px";
        button.style.textAlign = "center";
        button.style.width = "auto";
        button.style.cursor = "pointer";
    }
}

// Jump the map to a certain known location
function mapJump(loc)
{
    if (map) {
        if (loc == 'marne') {
            //map.panTo(new GLatLng(52.285120, 4.862309));
            // Logger, really
            map.panTo(new GLatLng(52.283089, 4.863671));
        } else if (loc == 'logger') {
            map.panTo(new GLatLng(52.283089, 4.863671));
        } else if (loc == 'populierenlaan') {
            map.panTo(new GLatLng(52.293738,4.844686));
        } else if (loc == 'koolwitjestraat') {
            map.panTo(new GLatLng(52.279823,4.802592));
        } else if (loc == 'lavik') {
            if (map.getZoom() > 13) {
                map.setZoom(13);
            }
            map.panTo(new GLatLng(61.104677,5.512326));
        }
    }
}

// Resize the title field, based on the current browser height
function resizeFonts()
{
    var mySize = browserSize();
    var titleFontSize;
    var baseFontSize;
    var footerFontSize;

    if (mySize.height > 0) {
        // Determine title, base content and footer font size based on the
        // dimensions of the browser window.  Experimentally found optimal
        // values.
        titleFontSize = 0.075*mySize.height;
        baseFontSize = 0.0135*mySize.height + 0.005*mySize.width;
        footerFontSize = 0.02*mySize.height;

        setClassStyle('title', { 'fontSize': fontSizePx(titleFontSize) });
        setClassStyle('contents', { 'fontSize': fontSizePx(baseFontSize) });
        setClassStyle('colhdr', { 'fontSize': fontSizePx(1.25*baseFontSize) });
        setClassStyle('subhdr', { 'fontSize': fontSizePx(1.125*baseFontSize) });
        setClassStyle('footer', { 'fontSize': fontSizePx(footerFontSize) });
    }
}

// On load, load the Google map, and resize the title field
function doOnLoad(lang)
{
    loadGoogleMap(lang);
    resizeFonts();
}

// On unload, unload the Google map
function doOnUnload()
{
    if (typeof(GUnload) != 'undefined') {
        GUnload();
    }
}

// On resize, resize the title field
function doOnResize()
{
    resizeFonts();
}