// This file contains javascript functions that implement the dynamic behaviour of the page, including the
// "tab" buttons that control the elements visibility.

// This requires jQuery in order to run some functions, but it can be included after this unit.

// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
var map=null;
function getInternetExplorerVersion()
{
    var rv = -1; // Return value assumes failure.
    if (navigator.appName == 'Microsoft Internet Explorer')
    {
        var ua = navigator.userAgent;
        var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
        if (re.exec(ua) != null)
            rv = parseFloat( RegExp.$1 );
    }
    return rv;
}

// Determine if IE is running, and if so what version. We have special handling for IE6 and other IE versions.
var isRunningIE6 = false;
var isRunningIEAny = false;

var ieVer = getInternetExplorerVersion();
if (ieVer >= 6.0 && ieVer < 7)
    isRunningIE6 = true;
if (ieVer > 0)
    isRunningIEAny = true;

// remembers the tab state
var tabState = "init";
var photosShowing = false;
var mapShowing = false;



function tab_click(tab)
{
    if (tab == "toggle")
    {
        tab = (tabState == "all") ? "init" : "all";
        $('#toggle_all_button').text(tab == "init" ? tabshowall : tabhideall);
    }

    tabState = tab;

    switch (tab)
    {
        case "init":
            // To start with, only show the hotel details and room types.
            hide('#infoTools');
            show('#hotelDetails');
            show('#roomTypes');
            hide('#allPhotos');
            break;

        case "all":
            // Display "infoTools", then "allPhotos", then all hotelDetails, then roomTypes
            show('#infoTools');
            show('#hotelDetails');
            show('#roomTypes');
            $('#allPhotos').insertAfter('#infoTools');
            show('#allPhotos');
            redisplayMap();
            break;

        case "photos":
            // Display "allPhotos" -> "hotelDetails" -> "roomTypes"
            if (photosShowing)
                hide('#allPhotos');
            else
            {
                $('#allPhotos').insertBefore('#infoTools');
                show('#allPhotos');
            }
            break;

        case "map":
            // Display "infoTools" -> "hotelDetails" -> "roomTypes";
            if (mapShowing)
                hide('#infoTools');
            else
            {
                if (photosShowing)
                    $('#allPhotos').insertAfter('#infoTools');

                show('#infoTools');
                redisplayMap();
            }
            break;
    }
}

function setPhotosVisibility(visible)
{
    photosShowing = visible;
    if (visible)
        $('#toggle_photos_button').text(tabhidephotos);
    else
        $('#toggle_photos_button').text(tabshowphotos);
}

function setMapVisibility(visible)
{
    mapShowing = visible;
    if (visible)
        $('#toggle_map_button').text(tabhidemap);
    else
        $('#toggle_map_button').text(tabshowmap);
}

function show(element)
{
    // IE6 blows up with animation
    if (element == '#infoTools' && isRunningIE6 || !map)
        $(element).show();
    else if (element == '#infoTools' && isRunningIEAny)
    {
        // IE7 doesn't animate the map properly as firefox does. So we animate the map div
        // directly rather than it's container, and we control the container separately.
        $('#map').hide();
        $('#infoTools').show();
        $("#map").show(500, function()
                            {
                                redisplayMap();
                            });
    }
    else
        $(element).show(500, function()
                             {
                                 redisplayMap();
                             });

    if (element == "#allPhotos")
        setPhotosVisibility(true);
    else if (element == "#infoTools")
        setMapVisibility(true);
}

function redisplayMap()
{
    if (map)
        map.checkResize();
}

function hide(element)
{
    // IE6 blows up with animation
    if (element == '#infoTools' && isRunningIE6)
        $(element).hide();
    else if (element == '#infoTools' && isRunningIEAny)
    {
        // IE7 doesn't handle the animation of the map very well. So we
        // hide the map itself with animation, and then hide the whole infoTools when done
        $('#map').hide(500, function()
                            {
                                $('#infoTools').hide();
                            });
    }
    else
        $(element).hide(500);

    if (element == "#allPhotos")
        setPhotosVisibility(false);
    else if (element == "#infoTools")
        setMapVisibility(false);
}