//base code courtesy of Adrian Mato Gondelle (modified by pvirk Apr.20/09)
//http://yensdesign.com/2008/09/how-to-create-a-stunning-and-smooth-popup-using-jquery/

$(document).ready(function() {

    //runs whenever a "popuplink" tag has been clicked
    $(".popuplink").click(function() {

//alert("HERE");

        //1. get the truetail DOM element for this div wrapper
        var truetail = $(this).parent().find(".truetail");

if (truetail == null)
{
	alert("HERE-2");
}
    var popupHeight = $(this).parent().find(".truetail").height();
	

        //2. position the truetail popup window via css
        centerPopup(truetail);

        //3. load the truetail popup window
        loadPopup(truetail);
    });

    //the following events will close all popups and return focus to the background ...

    //'X-click' event
    $(".close").click(function() {
        unloadPopup();
    });

    //'Click out' event
    $("#background").click(function() {
        unloadPopup();
    });

    //'Press Escape' event
    $(document).keypress(function(event) {
        if (event.keyCode == 27) {
            unloadPopup();
        }
    });

}); //End $(document).ready

//centers the popup on the screen
//
function centerPopup(element) {
    //1. get the height and width vars here
    var windowWidth = document.documentElement.clientWidth;
    var windowHeight = document.documentElement.clientHeight;
    var popupHeight = $(element).height();
    var popupWidth = $(element).width();

    //2. center the popup pane

    var zValue = 999;
    var topValue = document.documentElement.scrollTop + 170;
    var leftValue = windowWidth / 2 - popupWidth / 2;

    $(element).css({
        "position": "absolute",
        "z-index": zValue,
        "top": topValue,
        "left": leftValue
    });

    //3. quick hack here - need to force this attribute for IE6
    $("#background").css({
        "height": windowHeight
    });
}

//loads the popup
//
function loadPopup(element) {
    //use animation
    $("#background").css("opacity", "0.7");
    $("#background").fadeIn("500");
    $(element).fadeIn("500");
}

//unloads all popups (should really only be one visible at a time)
//
function unloadPopup() {
    //use animation
    $("#background").fadeOut("500");
    $(".truetail").fadeOut("500");
}