var timeout    = 500;
var closetimer = 0;
var ddmenuitem = 0;

function jsddm_open()
{  jsddm_canceltimer();
   jsddm_close();
   ddmenuitem = $(this).find('ul').css('visibility', 'visible');}

function jsddm_close()
{  if(ddmenuitem) ddmenuitem.css('visibility', 'hidden');}

function jsddm_timer()
{  closetimer = window.setTimeout(jsddm_close, timeout);}

function jsddm_canceltimer()
{  if(closetimer)
   {  window.clearTimeout(closetimer);
      closetimer = null;}}

$(document).ready(function()
{  $('#jsddm > li').bind('mouseover', jsddm_open)
   $('#jsddm > li').bind('mouseout',  jsddm_timer)

    //get the height and width of the page
    var window_width = $(window).width();
    var window_height = $(window).height();

    //vertical and horizontal centering of modal window(s)
    /*we will use each function so if we have more then 1
    modal window we center them all*/
    $('.modal_window').each(function(){

        //get the height and width of the modal
        var modal_height = $(this).height();
        var modal_width = $(this).width();

        //calculate top and left offset needed for centering
        var top = (window_height-modal_height)/2;
        var left = (window_width-modal_width)/2;

        //apply new top and left css values
        $(this).css({'top' : top , 'left' : left});

    });

        $('.activate_modal').click(function(){

              //get the id of the modal window stored in the name of the activating element
              var modal_id = $(this).attr('name');

              //use the function to show it
              show_modal(modal_id);

        });

        $('.close_modal').click(function(){

            //use the function to close it
            close_modal();

        });

    });

    //THE FUNCTIONS

    function close_modal(){

        //hide the mask
        $('#mask').fadeOut(500);

        //hide modal window(s)
        $('.modal_window').fadeOut(500);

    }
    function show_modal(modal_id){

        //set display to block and opacity to 0 so we can use fadeTo
        $('#mask').css({ 'display' : 'block', opacity : 0});

        //fade in the mask to opacity 0.8
        $('#mask').fadeTo(500,0.8);

         //show the modal window
        $('#'+modal_id).fadeIn(500);

    }


// Popup window code
function newPopup(url) {
	popupWindow = window.open(
		url,'popUpWindow','height=320,width=400,left=10,top=10,resizable=no,scrollbars=no,toolbar=no,menubar=no,location=no,directories=no,status=no')
}