//$specialOfferDIV = '<div class=\"TabsContainer\"></div>';
//**$specialOfferDIV = '<div class=\"TabsContainer\"></div>'; **/- $specialOfferDIV globally defined to avoid W3C standard errors"

$(document).ready(function () {

    //open lightbox1
    $('.showLightbox1').click(function () {
        showLightBox('lightBox1', $('.lightBox1').width());
        return false;
    });

    //close lightbox1
    $('.lightBox1 .closeButton, #overlay a').click(function () {
        $('.lightBox1, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox2
    $('.showLightbox2').click(function () {
        showLightBox('lightBox2', $('.lightBox2').width());
        $('.panelOverlayHandsetContainer').each(function () {
            var $biggestPanel = 0;
            $('.panelDetails', this).each(function () {
                if ($(this).height() > $biggestPanel) {
                    $biggestPanel = $(this).height()
                }
            });
            $('.panelDetails', this).height($biggestPanel);
        });
        return false;
    });

    //close lightbox2
    $('.lightBox2 .closeButton, #overlay a').click(function () {
        $('.lightBox2, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox3
    $('.showLightbox3').click(function () {
        showLightBox('lightBox3', $('.lightBox3').width());
        return false;
    });

    //close lightbox3
    $('.lightBox3 .closeButton, #overlay a').click(function () {
        $('.lightBox3, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox4
    $('.showLightbox4').click(function () {
        showLightBox('lightBox4', $('.lightBox4').width());
        return false;
    });

    //open lightbox5
    $('.showLightbox5').click(function () {
        showLightBox('lightBox5', $('.lightBox5').width());
        return false;
    });

    //close lightbox5
    $('.lightBox5 .closeButton, #overlay a').click(function () {
        $('.lightBox5, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox7
    $('.showLightbox7').click(function () {
        showLightBox('lightBox7', $('.lightBox7').width());
        return false;
    });

    //close lightbox7
    $('.lightBox7 .closeButton, #overlay a').click(function () {
        $('.lightBox7, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox8
    $('.showLightbox8').click(function () {
        showLightBox('lightBox8', $('.lightBox8').width());
        return false;
    });

    //close lightbox8
    $('.lightBox8 .closeButton, #overlay a').click(function () {
        $('.lightBox8, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox9
    $('.showLightbox9').click(function () {
        showLightBox('lightBox9', $('.lightBox9').width());
        return false;
    });

    //close lightbox9
    $('.lightBox9 .closeButton, #overlay a').click(function () {
        $('.lightBox9, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox10
    $('.showLightbox10').click(function () {
        showLightBox('lightBox10', $('.lightBox10').width());
        return false;
    });

    //close lightbox10
    $('.lightBox10 .closeButton, #overlay a').click(function () {
        $('.lightBox10, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox11
    $('.showLightbox11').click(function () {
        showLightBox('lightBox11', $('.lightBox11').width());
        return false;
    });

    //close lightbox11
    $('.lightBox11 .closeButton, #overlay a').click(function () {
        $('.lightBox11, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open lightbox12
    $('.showLightbox12').click(function () {
        showLightBox('lightBox12', $('.lightBox12').width());
        return false;
    });

    //close lightbox12
    $('.lightBox12 .closeButton, #overlay a').click(function () {
        $('.lightBox12, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //SIMONLY ENHANCE LIGHTBOXES
    //open soLightbox1
    $('.showsoLightbox1').click(function () {
        showLightBox('soLightbox1', $('.soLightbox1').width());
        return false;
    });

    //close soLightbox1
    $('.soLightbox1 .closeButton, #overlay a').click(function () {
        $('.soLightbox1, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open soLightbox2
    $('.showsoLightbox2').click(function () {
        showLightBox('soLightbox2', $('.soLightbox2').width());
        return false;
    });

    //close soLightbox2
    $('.soLightbox2 .closeButton, #overlay a').click(function () {
        $('.soLightbox2, #overlay').hide();
        $('.overlay').hide();
        return false;
    });

    //open soLightbox3
    $('.showsoLightbox3').click(function () {
        showLightBox('soLightbox3', $('.soLightbox3').width());
        return false;
    });

    //close soLightbox3
    $('.soLightbox3 .closeButton, #overlay a').click(function () {
        $('.soLightbox3, #overlay').hide();
        $('.overlay').hide();
        return false;
    });


    //move Tariff Info to lightbox
    $('#tariffInfoInline .tariffInfo').appendTo('.tariffInfoPlaceholder');

});


//args - class of lightbox you want to display, width of content in pixels
function showLightBox($lightBoxID, $lightboxWidth) {
    $lightBoxID = '.' + $lightBoxID; //add a dot to the class name
    var $positionFromTop = 100; //pixels from the top of window or use percentage ($(window).height()/10)
    var $scrollposition = $(window).scrollTop() + $positionFromTop; //calculate how far down the lightbox should be	
    $(window).width(); //get the window width so we can center the lightbox
    $($lightBoxID).css(
		{
		    top: $scrollposition,
		    width: $lightboxWidth,
		    marginLeft: -($lightboxWidth / 2)
		}
		).show(); //show the lightbox
    $('#overlay').show(); //show the overlay
}

function showLightBoxWithIndex($lightBoxID, $lightboxWidth) {
    $lightBoxID = '.' + $lightBoxID; //add a dot to the class name
    var $positionFromTop = 50; //pixels from the top of window or use percentage ($(window).height()/10)
    var $scrollposition = $(window).scrollTop() + $positionFromTop; //calculate how far down the lightbox should be	
    
    $(window).width(); //get the window width so we can center the lightbox
    $lightbox = $($lightBoxID).children('.lightBox11')[0];

    $($lightbox).css(
              {
                  top: $scrollposition,
                  //width: $lightboxWidth,
                  marginLeft: -($lightboxWidth / 2)
              }
              ).show(); //show the lightbox  

    $('#overlay1').appendTo('.pageContainer').show(); //show the overlay
}

function hideAllLightBoxes() {
    $('.lightBox1, #overlay').hide();
    $('.lightBox2, #overlay').hide();
    $('.lightBox3, #overlay').hide();
    $('.lightBox4, #overlay').hide();
    $('.lightBox5, #overlay').hide();
    $('.lightBox6, #overlay').hide();
    $('.lightBox7, #overlay').hide();
    $('.lightBox8, #overlay').hide();
    $('.lightBox9, #overlay').hide();
    $('.lightBox10, #overlay').hide();
    $('.lightBox11, #overlay1').hide();
    $('.overlay').hide();
    $('#overlay').hide();
    return false;
}

function ShowBundleSelectionLightBox(lightBoxId) {
    hideAllLightBoxes();
    showLightBoxWithIndex(lightBoxId, 861);
}

function ShowBasketError(error) {
    $infoId = '.' + 'info'; //add a dot to the class name
    $($infoId).text(error);
    hideAllLightBoxes();
    showLightBox('lightBox4', $('.lightBox4').width());
}

function ShowUpdate(lightBoxID) {

    $('.lightBox8 .closeButton, #overlay a').click(function () {
        $('.lightBox8, #overlay1').hide();
        $('.overlay').hide();
        return false;
    });
    hideAllLightBoxes();
    showLightBoxUpdate(lightBoxID, 861);
}



function showLightBoxUpdate($lightBoxID, $lightboxWidth) {
    $lightBoxID = '.' + $lightBoxID; //add a dot to the class name
    var $positionFromTop = 50; //pixels from the top of window or use percentage ($(window).height()/10)
    var $scrollposition = $(window).scrollTop() + $positionFromTop; //calculate how far down the lightbox should be	

    $(window).width(); //get the window width so we can center the lightbox
    var x = $($lightBoxID)
    $lightbox = $($lightBoxID).children('.lightBox8')[0];

    $($lightbox).css(
              {
                  top: $scrollposition,
                  //width: $lightboxWidth,
                  marginLeft: -($lightboxWidth / 1.5)
              }
              ).show(); //show the lightbox  

    $('#overlay1').appendTo('.pageContainer').show(); //show the overlay
}