/*  Reusable modal popup object using jQuery.

    Example use:
        var modal = new ModalPopup({
            popupSelector: ".smallPopup", 
            triggerSelector: ".roundedBoxBody input[type='image']:eq(1)",
            closeSelector:".smallPopupX, .smallPopup input"
        });
        
        All the options parameters are used as jQuery selectors. So all CSS3 selectors + jQuery extensions can be used.
        
        popupSelector - element containing the modal popup
        triggerselector - element(s) that will trigger the popup
        closeSelector - element(s) that will cause popup to close    
*/

//Set options for Modal Popup

var ModalPopup = function(options)        
{
    var popupSelector = options.popupSelector,
        closeSelector = options.closeSelector,
        triggerSelector = options.triggerSelector,
        opacity = options.opacity || 0.55,
        fadeSpeed = options.fadeSpeed || "slow",        
        smallPopup = jQuery(popupSelector),
        center = (options.center === undefined) ? true : options.center,
        allSelectBoxes = jQuery("select"),
        popupSelectBoxes = jQuery("select", popupSelector),
        alternatePos = (options.alternatePos === undefined) ? true : options.alternatePos,
        modalBackground = options.modalBackground || "#000000",
        otherCallbacks = options.otherCallbacks || {};
        
        
    CreateOverlay();
    var overlay = jQuery('#modalBackground');
    
    // set up the events
    if(IsCookied == "N")
    {
        jQuery(triggerSelector).click(Show);    
    }
    
    jQuery(closeSelector).click(Hide); 
    //jQuery(window).resize(AdjustOverlay);
    
    //custom callbacks for tracking etc
    for(selector in otherCallbacks) 
    {
        if(otherCallbacks.hasOwnProperty(selector))
        {
            jQuery(selector).click(otherCallbacks[selector]);
        }
    }
                   
    if(center === true)
    {
        jQuery(window).resize(Center);           
        jQuery(window).scroll(Center);    
    }
    
    if(alternatePos === true)
    {
        alternatePosition();
    }
            
    // methods
            
    function Show()
    {       
        if(center) { Center(); }     
        //AdjustOverlay();
        
        jQuery('#iPhoneTutorial').css('visibility', 'hidden'); // Hide YouTube Flash Video
        /* IE6 fix to select zindex bug */
        if((jQuery.browser.msie === true) && (jQuery.browser.version == '6.0'))        
        {   
            allSelectBoxes.css("visibility", "hidden");                  
            popupSelectBoxes.css("visibility", "visible");
        }        
        overlay.css("opacity", opacity);
        overlay.fadeIn(fadeSpeed, function(){
            if(options.slide)
            {
                smallPopup.slideDown(fadeSpeed);            
            }
            else
            {
                smallPopup.show();            
            }
        });                                                                                     
        return false;                
    }
                    
    function Hide()
    {              
        //debugger;
        jQuery('#iPhoneTutorial').css('visibility', 'visible'); // Show YouTube Flash Video
        if((jQuery.browser.msie === true) && (jQuery.browser.version == '6.0'))        
        {
            allSelectBoxes.css("visibility", "visible"); 
        }
        overlay.fadeOut(fadeSpeed);                                    
        
        if(options.slide)
        {
            smallPopup.hide();
        }
        else
        {
            smallPopup.fadeOut(fadeSpeed);          
        }
        return false;
    }        
    
    function Center()
    {
        var windowWidth = jQuery(window).width();
        var windowHeight = jQuery(window).height();
        var scrollLeft = jQuery(window).scrollLeft();
        var scrollTop = jQuery(window).scrollTop();
        var popupWidth = smallPopup.width();
        var popupHeight = smallPopup.height();

        if(jQuery.browser.safari)
        {

              windowHeight = document.documentElement.clientHeight; 

        }
        var leftPos = (windowWidth - popupWidth) / 2 + scrollLeft;
        var topPos = (windowHeight - popupHeight) / 2 + scrollTop;         
        
        smallPopup.css({
            "left" : leftPos,
            "top" : topPos                    
        })         
    }
    
    function alternatePosition()
    {
        jQuery(triggerSelector).click(function(){
            var imageTop = jQuery('#orderNowBtn').offset().top;
            //Get width of object
            var imageWidth = jQuery('#orderNowBtn').offset().left;
            imageWidth = imageWidth - 75;
            
            //Set position of hover different if on homepages
            if(document.body.className == 'yeti' || document.body.className == 'slinky')
            {
                imageWidth = imageWidth + 35;
            }
            imageTop = imageTop - 10;

            jQuery(popupSelector).css({'top':imageTop, 'left':imageWidth, 'z-index':'999', 'position':'absolute'});
        });
    } 
    

	function CreateOverlay()
    {
        if(!jQuery('#modalBackground').length)
        {
            var modalBack = document.createElement('div');
            var modalId = "modalBackground";
            modalBack.setAttribute("id", modalId);
            document.body.appendChild(modalBack);
            jQuery(modalBack).css({"display": "none", "background-color": modalBackground, "opacity": opacity, "z-index": "50"});
        }
    }       
    
    function AdjustOverlay()
    {
        var windowWidth = jQuery('body').width();
        var windowHeight = jQuery('body').height();
        //jQuery('#modalBackground').css({"width":windowWidth, "height":windowHeight});
    }        
}