$(function() {
    $("img.infoButton,img.infoButtonReplace,img.infoButtonExisting").hover(
        function(){$(this).attr("src","/library/offers/hd/images/btn_info_over.gif");},
        function(){$(this).attr("src","/library/offers/hd/images/btn_info.gif");}
    )
        
    // Position the entertainment mix information box to its associated link
    $("a#hdrstandardPopup").click(function() {
        link = $(this);
        renderPopup (-10, 20, 'div#hdrstandardInfo div.content div.content', '');        
        return false;
    });
    $("a.oneEntertainmentPopup").click(function() {
        link = $(this);
        renderPopup (400, 180, 'div#oneEntertainmentInfo div.content div.content', '');        
        return false;
    });
    $("a.oneRightEntertainmentPopup").click(function() {
        link = $(this);
        renderPopup (400, -215, 'div#oneEntertainmentInfo div.content div.content', '');        
        return false;
    });
    $("a.hdPackPopup").click(function() {
        link = $(this);
        renderPopup (400, 180, 'div#hdPackInfo div.content div.content', '');        
        return false;
    });
    $("a#hdPack1Popup").click(function() {
        link = $(this);
        renderPopup (400, 180, 'div#hdPack1Info div.content div.content', '');        
        return false;
    });
    $("a#hdPack2Popup").click(function() {
        link = $(this);
        renderPopup (400, 180, 'div#hdPack2Info div.content div.content', '');        
        return false;
    });
    $("a#hdPack3Popup").click(function() {
        link = $(this);
        renderPopup (400, -210, 'div#hdPack3Info div.content div.content', '');        
        return false;
    });
    $("a#skyTV6EntPopup").click(function() {
        link = $(this);
        renderPopup (400, -210, 'div#skyTV6EntInfo div.content div.content', '');        
        return false;
    });
    $("a#skyTV1EntPopup").click(function() {
        link = $(this);
        renderPopup (390, 180, 'div#skyTV1EntInfo div.content div.content', '');        
        return false;
    });
    $("a#skyTV6EntPacksPopup").click(function() {
        link = $(this);
        renderPopup (400, 180, 'div#skyTV6EntPacksInfo div.content div.content', '');        
        return false;
    });
    $("a#hdPackExistingPopup").click(function() {
        link = $(this);
        renderPopup (830, 220, 'div#hdPackExistingInfo div.content div.content', '');        
        return false;
    });
    
    $("a#hdPackExistingMultiPopup").click(function() {
        link = $(this);
        renderPopup (1180, 220, 'div#hdPackExistingMultiInfo div.content div.content', '');        
        return false;
    });
    
    $("a#skyMultiRoomPopup").click(function() {
        link = $(this);
        renderPopup (1180, 220, 'div#skyMultiRoomInfo div.content div.content', '');        
        return false;
    });
    
    
    
});

// Render an information box popup
function renderPopup (offsetY, offsetX, target, source){

    $('div.infoBox').css({left:'-100em'});
    
    var infoBox = $(link).attr('href').split('#')[1];
    
    // Only if the content hasn't already been loaded
    if ($(target).children().length == 0 && source != ''){
        // Load and inject content in DOM
        $(target).load(source, function(){
            
            // Position the injected content relative to the calling link
            var infoBoxX = $(link).position().left;
            var infoBoxY = $(link).position().top;    
            $('div#' + infoBox).css({top:infoBoxY + offsetY, left:infoBoxX + offsetX});           

        });        
    } else {
        // Position the injected content relative to the calling link
        var infoBoxX = $(link).position().left;
        var infoBoxY = $(link).position().top;    
        $('div#' + infoBox).css({top:infoBoxY + offsetY, left:infoBoxX + offsetX});

    }
    
    // For all popups
    $(target).after('<a href=\"#close\" class=\"close\"><strong>Close X</strong></a>');                
    $('div#' + infoBox + ' a.close').click(function(){
       $ ('div#' + infoBox).css({left:'-100em'});
        return false;
    });
}