// Rollover behaviour for USE menu on dricon page
// Rollover behaviour for product links too
// Phosphor Essence / Jon Ward / Dec 2009


$(document).ready(function(){

    // dricon menu


$('.productUses td')

.click(function(){

    if (!$(this).data('highlight')) {

        /* find all ids of products */
        var productIds = $(this).attr('class').split(',');

        /* stop all animation on products and hide them */
        $('.driconProducts li')
        .data('rollover',false)
        .stop()
        .animate({opacity:0.1},{duration:100});

        /* show only products in productIds */
        $.each(productIds, function(el){
            $('.driconProducts li.'+this)
            .data('rollover',true)
            .stop()
            .animate({opacity:1},200,function(){$(this).css('opacity','')});
            
        });

        /* turn off all menu items */
        $('.productUses td').removeClass('selected');
        $('.productUses td').data('highlight',false);

        /* turn on only this menu item */
        $(this).addClass('selected');
        $(this).data('highlight',true);

    } else {

        /* show all products */
        $('.driconProducts li')
        .css('border','none')
        .data('rollover',true)
        .stop()
        .animate({opacity:1},500,function(){$(this).css('opacity','')});
        
        /* turn off this menu item */
        $(this).removeClass('selected');
        $(this).data('highlight',false);
    };
});

// tooltips

$('.driconProducts li a')
.parents('li')
.data('rollover',true);

$('.driconProducts li a')
.mouseenter(function(e){
    if($(this).parents('li').data('rollover')) {

        /* get current product id */
        var currentid = $(this).parents('li').attr('class');

        /* turn on all menu items with same id as this product */
        $('.productUses td').each(function(){
            var ids=$(this).attr('class').split(',');
            if($.inArray(currentid, ids)!=-1){
                $(this).addClass('selected');
            }
        });

        /* hide all visible tooltips */
        $('.driconProducts li .summary:visible').stop().css('opacity','').hide();

        /* calculate half way on the page and show tooltip depending on product position */
        var container = $('.driconProducts'),
        halfway = (container.width()/2) + container.offset().left,

        summaryBox = $(this).parents('li:first').find('.summary');

        if ($(this).offset().left > halfway) {
            summaryBox.css({
                left:'-230px',
                backgroundPosition:'top right',
                paddingRight:'20px',
                paddingLeft:'10px'
            });

        /* Fix for IE position:relative issue */
        $('.driconProducts li').css('position','');
        $(this).parents('li').css('position','relative');

        } else {
            summaryBox.css({
                left:'86px'
            });

            /* Fix for IE position:relative issue */
            $('.driconProducts li').css('position','');
            $(this).parents('li').css('position','relative');
        };

        /* Show the tooltip for this product */
        summaryBox.show();
    };
})
    .mouseleave(function(){
        if($(this).parents('li').data('rollover')) {

        /* hide tooltip for this product */
        $('.driconProducts li .summary:visible').fadeOut(500);

        /* get product id */
        var currentid = $(this).parents('li').attr('class');

        /* turn off all menu items that weren't chosen */
        $('.productUses td')
        .filter(function(){
            return !$(this).data('highlight');
        })
        .removeClass('selected');
            
      
        };
    });

    /* add scroll hint to page */

    var viewportHeight = $(window).height();
    var pageHeight = $(document).height();
    var scrollHint = $('.scrollHint');
    var scrollHintHeight = scrollHint.height();
    var scrollHintOffSet = $('#dricon').offset().top + 10;
    var driconHeight = $('#dricon').outerHeight();
   

    scrollHint.css({
        'height':scrollHintHeight,
        'top':viewportHeight + $(window).scrollTop() - scrollHint.outerHeight() - scrollHintOffSet
    });

    if (viewportHeight+$(window).scrollTop() < driconHeight + scrollHintOffSet) {
        scrollHint.show();
    };

   
    $(window).bind('scroll resize',function(){
        
        var viewportHeight = $(window).height();
        var offSet = viewportHeight + $(window).scrollTop() - scrollHint.outerHeight() - scrollHintOffSet;

        if (viewportHeight+$(window).scrollTop() < driconHeight + scrollHintOffSet) {
            
        scrollHint.stop().css('opacity','').animate({'top':offSet},400);
        scrollHint.show();
        } else {
            scrollHint.fadeOut();
        };
    
    })


 



});
