var inMenuArea = false;
var overlayVisible = false;
var delayLength = 400;
var fadeInSpeed = 200;
var fadeOutSpeed = 200;
var submenuInterval = 20;
var overlayTimer = null;
var submenuTimer = null;
var traceOutput = false;

$(function () {
    $('#TopMenu').bind('mouseleave', function () {
        // Hide the grey shaded overlay
        // and set the flag to indicate we are no longer in the Menu area
        HideOverlay();
        inMenuArea = false;
    });

    $('#TopMenu>ul>li').bind('mouseenter', function () {
        var $selectedItem = $(this);

        // if this menu item does not have sub pages then hide the overlay
        if (!$(this).hasClass('subPages')) {
            HideOverlay();
        }
        // if this menu item does have sub pages then show the overlay
        if ($(this).hasClass('subPages')) {

            // selected the hovered over menu item and apply the menuHover class
            ShowOverlay($selectedItem);
        }
        ShowMenuItem($selectedItem);
    }).bind('mouseleave', function () {
        HideMenuItem($(this));
        if (!inMenuArea) {
            HideOverlay();
        }
    })
}

);

// show the grey shaded page overlay
// Also show menu item overlays
function ShowOverlay(selected) {
    var $MenuOverlay = $('#MenuOverlay');

    if (overlayTimer != null) clearTimeout(overlayTimer);

    // If we are already with the menu area then the delay needs to be much shorter!
    var overlayDelay = (inMenuArea || overlayVisible) ? submenuInterval : delayLength;

    overlayTimer = setTimeout(function () {
        if (traceOutput) console.log('Show Overlay....');
        $(this).dequeue();
        inMenuArea = true;

        $MenuOverlay.css({
            zIndex: 98,
            width: '100%',
            height: '100%'
        }).stop(true, false).fadeTo(fadeInSpeed, 0.6);

        overlayVisible = true;
    }, delayLength);
};

// hide the grey shaded page overlay
function HideOverlay() {
    var $MenuOverlay = $('#MenuOverlay');
    clearTimeout(overlayTimer);

    $MenuOverlay.stop(true, false).delay(150).fadeOut(fadeOutSpeed);
    overlayVisible = false;
    if (traceOutput) console.log('Hide overlay (' + inMenuArea + ')');
};

function ShowMenuItem(item) {
    // add "hover" class
    item.addClass('menuHover');

    var $MenuItemOverlays = $('#TopMenu ul li div.opacity').parents();

    // If we are already with the menu area then the delay needs to be much shorter!
    var submenuDelay = (inMenuArea && overlayVisible) ? submenuInterval : delayLength;

    submenuTimer = setTimeout(function () {
        if (item.hasClass('subPages')) {
            $('div.topSubMenu', item).stop(true, false).css('opacity', 0).css('display', 'block').animate({ opacity: 1 }, fadeInSpeed);

            if (traceOutput) console.log('Show Submenu item - opacity layers (state:' + inMenuArea + ')');

            $('div.opacity', $MenuItemOverlays).filter(function (i) { return $(this).parent().hasClass('menuHover') != true }).each(function (index) {
                $(this).css({
                    width: $(this).parent().css('width')
                });
                $(this).stop(true, false).fadeTo(fadeInSpeed, 0.6);
            });
        }
        if (traceOutput) console.log('Show Submenu item (state:' + inMenuArea + ')');
    }, submenuDelay);

    if (traceOutput) console.log('Show menu item (state:' + inMenuArea + ')');
};

function HideMenuItem(item) {
    clearTimeout(submenuTimer);
    item.removeClass('menuHover');
    var $MenuItemOverlays = $('#TopMenu ul li div.opacity').parents();
    $('div.opacity', $MenuItemOverlays).stop(true, false).delay(150).fadeOut(fadeOutSpeed);
    $('div.topSubMenu', item).animate({ opacity: 0 }, fadeOutSpeed, function () {
        $(this).css('display', 'none');
        $(this).parent().removeClass('menuHover');
    });

    if (traceOutput) console.log('Hide menu item (state:' + inMenuArea + ')');

};





var carouselItems;
var carouselSize;

$(window).bind("load", function () {

    var sparePixels = 940;
    $('#TopMenu ul li a span.navText').each(function () {
        sparePixels -= $(this).width();
    });

    var items = $('#TopMenu ul li').length;
    var itemsWithSubItems = $('#TopMenu ul li.subPages').length;

    // Remove the margins.
    sparePixels -= ((items * 2) + 1);

    // Remove pixels for drop down arrows
    sparePixels -= itemsWithSubItems * 12;

    var leftOverPixels = sparePixels % items;
    var sparePixelsPerItem = (sparePixels - (leftOverPixels)) / items;

    var Pixels = 0;
    var addVal = 2;
    $('#TopMenu ul li a span.navText').each(function () {
        leftPixel = ((sparePixelsPerItem - (sparePixelsPerItem % 2)) / 2) + (sparePixelsPerItem % 2);
        if (leftOverPixels > 0) {
            leftPixel += 1;
            leftOverPixels -= 1;
        }

        rightPixel = ((sparePixelsPerItem - (sparePixelsPerItem % 2)) / 2);
        if ($(this).parent().parent().hasClass('subPages')) {
            rightPixel += 12;
        }

        Pixels += $(this).width();
        Pixels += leftPixel;
        Pixels += rightPixel;

        $(this).css('padding-left', leftPixel);
        $(this).css('padding-right', rightPixel);
        $(this).css('width', ($(this).width() + 1) + 'px');
        $(this).parent().parent().css('width', ($(this).width() + addVal + rightPixel + leftPixel) + 'px');
        addVal = 1;
    });

    $('#TopMenu UL').css('visibility', 'visible');
});

//searchText is defined in the site template and is a Umbraco Dictionary Item (Search)
$(document).ready(function () {
    $('.searchbox').val(searchText);
    $('.printIcon').click(function () {
        window.print();
        return false;
    });

    $('.searchbox').focus(function () {
        if ($(this).val() == searchText) {
            $(this).val('');
            $(this).addClass('focused');
        }
    }).blur(function () {
        if ($(this).val() == '') {
            $(this).val(searchText);
            $(this).removeClass('focused');
        }
    });

    $("a.image-lightbox").colorbox();

    //GS: Add a div to the start of each LI which will contain the +/- graphic
    $("ul.hideRevealModule li").each(function () {
        $(this).prepend("<div class='hideRevealIcon'>&nbsp;</div>");
    });

    $("ul.hideRevealModule li div.hideRevealIcon").click(
   function () {
       var $this = $(this);
       $this.parent().toggleClass("expanded");
   });


    //GS: If a title breaks onto 2 lines, adjust the visible area
    $(".carouselTextContainer .carouselText span.h3").each(function () {
        if ($(this).height() > 20) {
            $(this).parent().parent().css('height', '65px');
            $(this).parent().parent().css('top', '-30px');
        }
    });

    //GS: Show / Hide text panel on each carousel item
    //$(".carouselTextContainer").hover(
    $(".carouselLink").hover(
   function () {
       var $this = $(this);
       $("span.carouselTextContainer", this).delay(100).animate({ top: '-88', height: '122' }, '50');
       $("span.p", this).delay(100).animate({ 'padding-top': '0' }, '50');
   },
   function () {
       var $this = $(this);
       var titleh = $(this).find("span.h3").height();
       var h = (titleh > 20) ? 65 : 45;
       var t = (titleh > 20) ? -30 : -11;
       $("span.carouselTextContainer", this).stop(true, true).delay(150).animate({ top: t, height: h }, '50');
       $("span.p", this).stop(true, true).delay(150).animate({ 'padding-top': '10' }, '50');
   });

    //GS: set the size of Carousel and number of items variables
    carouselItems = $("#CarouselUL li").length;
    if ($('#Carousel').is('.styleFour')) {
        carouselSize = 4;
    } else {
        carouselSize = 5
    }

    //options( 1 - ON , 0 - OFF)  
    var auto_slide = 1;
    var hover_pause = 1;
    var key_slide = 1;

    //speed of auto slide(  
    var auto_slide_seconds = 5000;
    /* IMPORTANT: i know the variable is called ...seconds but it's 
    in milliseconds ( multiplied with 1000) '*/

    /*move the last list item before the first item. The purpose of this is 
    if the user clicks to slide left he will be able to see the last item.*/
    if (carouselSize < carouselItems) {
        //GS: position the last item off the scrren / carousel
        if ($('#Carousel').is('.styleFour')) {
            $('#CarouselUL').css({ 'left': '-240px' });
        } else {
            $('#CarouselUL').css({ 'left': '-200px' });
        }
        $('#CarouselUL li:first').before($('#CarouselUL li:last'));
    }

    //check if auto sliding is enabled  
    if (auto_slide == 1) {
        /*set the interval (loop) to call function slide with option 'right' 
        and set the interval time to the variable we declared previously */
        var timer = setInterval('slide("right")', auto_slide_seconds);

        /*and change the value of our hidden field that hold info about 
        the interval, setting it to the number of milliseconds we declared previously*/
        $('#hidden_auto_slide_seconds').val(auto_slide_seconds);
    }

    //check if hover pause is enabled  
    if (hover_pause == 1) {
        //when hovered over the list  
        $('#CarouselUL').hover(function () {
            //stop the interval  
            clearInterval(timer)
        }, function () {
            //and when mouseout start it again  
            timer = setInterval('slide("right")', auto_slide_seconds);
        });

    }

    //check if key sliding is enabled  
    if (key_slide == 1) {

        //binding keypress function  
        $(document).bind('keypress', function (e) {
            //keyCode for left arrow is 37 and for right it's 39 '  
            if (e.keyCode == 37) {
                //initialize the slide to left function  
                slide('left');
            } else if (e.keyCode == 39) {
                //initialize the slide to right function  
                slide('right');
            }
        });

    }

});

//FUNCTIONS BELLOW  
function CheckSearchForm() {

    if ($('.searchbox').val() == 'Bing search') {
        $('.searchbox').val('');
    }

    return true;
}

function css_browser_selector(u) { var ua = u.toLowerCase(), is = function (t) { return ua.indexOf(t) > -1 }, g = 'gecko', w = 'webkit', s = 'safari', o = 'opera', m = 'mobile', h = document.documentElement, b = [(!(/opera|webtv/i.test(ua)) && /msie\s(\d)/.test(ua)) ? ('ie ie' + RegExp.$1) : is('firefox/2') ? g + ' ff2' : is('firefox/3.5') ? g + ' ff3 ff3_5' : is('firefox/3.6') ? g + ' ff3 ff3_6' : is('firefox/3') ? g + ' ff3' : is('gecko/') ? g : is('opera') ? o + (/version\/(\d+)/.test(ua) ? ' ' + o + RegExp.$1 : (/opera(\s|\/)(\d+)/.test(ua) ? ' ' + o + RegExp.$2 : '')) : is('konqueror') ? 'konqueror' : is('blackberry') ? m + ' blackberry' : is('android') ? m + ' android' : is('chrome') ? w + ' chrome' : is('iron') ? w + ' iron' : is('applewebkit/') ? w + ' ' + s + (/version\/(\d+)/.test(ua) ? ' ' + s + RegExp.$1 : '') : is('mozilla/') ? g : '', is('j2me') ? m + ' j2me' : is('iphone') ? m + ' iphone' : is('ipod') ? m + ' ipod' : is('ipad') ? m + ' ipad' : is('mac') ? 'mac' : is('darwin') ? 'mac' : is('webtv') ? 'webtv' : is('win') ? 'win' + (is('windows nt 6.0') ? ' vista' : '') : is('freebsd') ? 'freebsd' : (is('x11') || is('linux')) ? 'linux' : '', 'js']; c = b.join(' '); h.className += ' ' + c; return c; }; css_browser_selector(navigator.userAgent);

//slide function  
function slide(where) {

    //GS: are there enough items to slide?
    if (carouselSize >= carouselItems) { return; }

    //get the item width  
    var item_width = $('#CarouselUL li').outerWidth() + 20;

    /* using a if statement and the where variable check 
    we will check where the user wants to slide (left or right)*/
    if (where == 'left') {
        //...calculating the new left indent of the unordered list (ul) for left sliding  
        var left_indent = parseInt($('#CarouselUL').css('left')) + item_width;
    } else {
        //...calculating the new left indent of the unordered list (ul) for right sliding  
        var left_indent = parseInt($('#CarouselUL').css('left')) - item_width;

    }

    //make the sliding effect using jQuery's animate function... '  
    $('#CarouselUL:not(:animated)').animate({ 'left': left_indent }, 500, function () {

        /* when the animation finishes use the if statement again, and make an ilussion 
        of infinity by changing place of last or first item*/
        if (where == 'left') {
            //...and if it slided to left we put the last item before the first item  
            $('#CarouselUL li:first').before($('#CarouselUL li:last'));
        } else {
            //...and if it slided to right we put the first item after the last item  
            $('#CarouselUL li:last').after($('#CarouselUL li:first'));
        }

        //...and then just get back the default left indent - GS: correct for the number of items being shown 
        if ($('#Carousel').is('.styleFour')) {
            $('#CarouselUL').css({ 'left': '-240px' });
        } else {
            $('#CarouselUL').css({ 'left': '-200px' });
        }
    });

}