/* Variables for sub_menu rollover*/
var menu;


/*Set heights for sidebar sub_menus*/
function initMenu() {
    switch (navigator.appName) {
        case "Netscape":
            document.getElementById("menu_whats_on").style.top = "140px";
            document.getElementById("menu_previous_productions").style.top = "167px";
            document.getElementById("menu_sales").style.top = "194px";
            document.getElementById("menu_FAQ").style.top = "221px";
            document.getElementById("menu_contact").style.top = "248px";
            break;
        case "Microsoft Internet Explorer":
            document.getElementById("menu_whats_on").style.top = "148px";
            document.getElementById("menu_previous_productions").style.top = "175px";
            document.getElementById("menu_sales").style.top = "202px";
            document.getElementById("menu_FAQ").style.top = "229px";
            document.getElementById("menu_contact").style.top = "256px";
            break;
        default:
            document.getElementById("menu_whats_on").style.top = "140px";
            document.getElementById("menu_previous_productions").style.top = "167px";
            document.getElementById("menu_sales").style.top = "194px";
            document.getElementById("menu_FAQ").style.top = "221px";
            document.getElementById("menu_contact").style.top = "248px";
    }
}

/* Shows the passed sidebar sub_menu*/
function showMenu(menuIn) {
    var width;

    if(menu != menuIn) {
        fadeOut();
        menu = menuIn;
    }
    
    //Make sure the menu is in the right place
    document.getElementById(menu.replace("menu","sidebar")).style.backgroundColor = "#A2CFE1";
    width = Math.round(document.body.clientWidth * 0.015 + 145);
    document.getElementById(menu).style.left = width + "px";

    //do a fade
    fadeIn(menu);
}

/* Hides the passed sidebar sub_menu*/
function hideMenu(menuIn) {
    fadeOutSoon();
    document.getElementById(menuIn.replace("menu","sidebar")).style.backgroundColor = "#BADCEA";
}

/*
 * Fades in the passed HTML node
 * FireFox only currently
 */
var fadeTimeout;
var fadeSoonTimeout;
var htmlFadeElement;
var opacity;
function fadeIn(htmlElement) {
    var rate = 1;
    var step = 0.05;
    var ie = (navigator.appName == "Microsoft Internet Explorer") ? 1 : 0;
    var repeat = true;
            
    //Clear timeouts
    clearTimeout(fadeTimeout);
    clearTimeout(fadeSoonTimeout);

    //If this is the start of a new loop set everything to the start conditions
    if (htmlElement !== undefined && htmlElement != htmlFadeElement) {
        htmlFadeElement = htmlElement;
        opacity = 0.0;
        if(!ie) {
            document.getElementById(htmlFadeElement).style.opacity = opacity + "";
        } else {
            document.getElementById(htmlFadeElement).style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
        }
        document.getElementById(htmlFadeElement).style.visibility = "visible";
    }
    
    //Increment the opacity
    if (opacity + step >= 1.0) {
        opacity = 1.0;
        repeat = false;
    } else {
        opacity += step;
    }
    
    //Change the style/filter
    if(!ie) {
        document.getElementById(htmlFadeElement).style.opacity = opacity + "";
    } else {
        document.getElementById(htmlFadeElement).filters.item("DXImageTransform.Microsoft.Alpha").opacity = (100 * opacity);
    }

    //On and on
    if(repeat) {fadeInTimeout = setTimeout("fadeIn()", rate);}
}

/* Fades out the passed element soon, if fade in or out in is not called before */
function fadeOutSoon() {
    clearTimeout(fadeTimeout);
    fadeSoonTimeout = setTimeout("fadeOut()", 10);
}


/* Hides the passed passed HTML node */
function fadeOut() {
    //Clear timeouts
    clearTimeout(fadeTimeout);
    clearTimeout(fadeSoonTimeout);

    if (htmlFadeElement !== undefined) {
        document.getElementById(htmlFadeElement).style.visibility = "hidden";
    }
    htmlFadeElement = undefined;
}
/*
 * Slide Show
 * On being passed an array of image links we create a pop-up window with a lovely little side show
 * neat huh?
 */

var ssWin;
var arrImages;
var currentImage;
var eleFrame;
var eleCurrentImage;
var elePrevious;
var eleNext;
 
function openSlideShow(strName) {
    //Starting out with a design for pictures 600*400 max

    //URL to slide show php script
    var strURL = "http://www.lltc.co.uk/slide_show.php?name=";

    //Add the slide show name
    strURL += strName;

    //open the window
    var ssWin = window.open(strURL,
                "lltcSlideShow",
                "width=624, height=480, scrollbars=no, status=yes, top=20, left=20, resizable=yes, toolbar=no");
    ssWin.focus();
}

function initSlideShow(arrData) {
    //initilse our globals
    eleFrame = document.getElementById("imageFrame");
    eleCurrentImage = document.getElementById("mainImage");
    elePrevious = document.getElementById("buttPrevious");
    eleNext = document.getElementById("buttNext");
    
    //set up our image array
    arrImages = new Array();
    
    //Set our title
    document.title = arrData[0];

    //Fetch up the images
    for (i = 1; i < arrData.length; i++) {
        arrImages[i-1] = new Image();
        arrImages[i-1].src = arrData[i];
    }
    
    //set up elements
    eleCurrentImage.style.visibility = "hidden";
    eleCurrentImage.style.position = "relative";

    //Go
    goToStart();
}

function goToStart() {
    currentImage = 0;
    setImage(currentImage);
}

function nextImage() {
    if (currentImage < arrImages.length - 1) {
        currentImage++;
        setImage(currentImage);
    }
}

function previousImage(){
    if (currentImage > 0) {
        currentImage--;
        setImage(currentImage);
    }
}

function showImage(){
    //Set our dimensions and Top border
    eleCurrentImage.height = arrImages[currentImage].height;
    eleCurrentImage.width =  arrImages[currentImage].width;
    eleCurrentImage.style.top = (400 - arrImages[currentImage].height)/2 + "px";

    //Do the fade
    fadeIn(eleCurrentImage.id);
}

function hideImage(){
    //hide the image and put up the loadding screen
    fadeOut();
    eleCurrentImage.style.top = "200px";
}


function setImage(intImageNo) {

    //hide the image and put up the loading screen
    hideImage();
    
    //Start loading the image
    eleCurrentImage.src = arrImages[intImageNo].src;

    //Show the image (wait if it's not loaded yet)
    eleCurrentImage.onload = function(){showImage();}

    //adjust the conrtols
    if (currentImage == 0) {
        elePrevious.style.color = "#CCCCCC";
        elePrevious.style.cursor = "auto";
    } else {
        elePrevious.style.color = "#000000";
        elePrevious.style.cursor = "pointer";
    }
    
    if (currentImage == arrImages.length - 1) {
        eleNext.style.color = "#CCCCCC";
        eleNext.style.cursor = "auto";
    } else {
        eleNext.style.color = "#000000";
        eleNext.style.cursor = "pointer";
    }
}