﻿/**  $(this).jBox().showWindow('content here', true); **/
;(function($) {
    var tempID = 0;
    var version = '1.0';
    
    $.fn.jBox = function(options){   
        var o = { s: this.selector, c: this.context };
        var myBox;
        var overlay;
        var instance = (new Date()).valueOf();        
        var myContainer = '#myContainer_' + instance;
        var myScroll;
        var myResize;
        var iCounter = 0;
        
        //READ IN THE CUSTOM SETTINGS
        var settings = { 
            'fadeInDelay':300,
            'fadeOutDelay':300,
            'backgroundcolor':'white', 
            'border':'2px solid black', 
            'autoHide': 0, 
            'showClose':true, 
            'fixedWidth': '',
            'fixedHeight': '',
            'zIndex': 99999,
            'clickToClose':true
        };      
          
        $.extend(settings, options);   

        function closePopup(){
            $(window).unbind('scroll', myScroll);
            $(window).unbind('resize', myResize);
            $(myContainer).find(".overlay").hide().remove();
            $(myContainer).find(".myBox").hide().remove();
        }
        
        this.close = function(){
            closePopup();
            return this;
        };               
        
        this.getInstance = function(){ return myContainer; }
        
        this.position = function(){
            rePosition();
        };
        var checkTop = true;
        function rePosition(){     
            //CHECK SETTINGS.AUTOHIDE 
            if (eval(settings.autoHide) > 0)
                setTimeout(function(){closePopup();}, eval(settings.autoHide));
                
            //CHECK SETTINGS.FIXEDWIDTH
            if (settings.fixedWidth != '')
                $(myContainer).find(".myBox").css('width', settings.fixedWidth);
            
            //CHECK SETTINGS.FIXEDHEIGHT            
            if (settings.fixedHeight != '')
                $(myContainer).find(".myBox").css('height', settings.fixedHeight);
                
            //CHECK SETTINGS.ZINDEX
            if (settings.zIndex != ''){
                $(myContainer).find(".overlay").css("z-index", eval(settings.zIndex)-1);
                $(myContainer).find(".myBox").css("z-index", eval(settings.zIndex)-1);
                $(myContainer).find(".closeButton").css("z-index", eval(settings.zIndex));              
            }
            
            var x = (($(window).width() / 2) - ($(myContainer).find(".myBox").outerWidth() / 2)) + jQuery(window).scrollLeft();
            var y = (($(window).height() / 2) - ($(myContainer).find(".myBox").outerHeight() / 2) + jQuery(window).scrollTop());     
            
            //check to see if there is a custom frame present
            $(myContainer).find(".myDynamicFrame").css("top",y + "px").css("left",x + "px").css("height",$(myContainer).find(".myBox").css('height')).css("width",$(myContainer).find(".myBox").css('width'));
            
            if ($(myContainer).find(".myBox").outerHeight() > $(window).height()){                
                y = jQuery(window).scrollTop();
                
                if (checkTop){
                    $(myContainer).find(".myBox").css("left", x + "px").css("top", y + "px");
                }
                else {
                    $(myContainer).find(".myBox").css("left", x + "px"); 
                }
                
                checkTop = false;
            }
            else {
                checkTop = true;
                $(myContainer).find(".myBox").css("left", x + "px").css("top", y + "px");           
            }                        
        }       
         
        this.showContainer = function(id){
            var mContainer = $("#" + id).html();
            this.showWindow(mContainer, true);
        };

        this.showFrame = function(url){
            var frame = "<iframe class='myDynamicFrame' frameborder='0' src='" + url + "'></iframe>";
            this.showWindow(frame, true);
        };
               
        this.showWindow = function(html){                                         
            $(myContainer).remove();
            
            if (eval(settings.showClose)) {
                $("body").append('<div id="' + 'myContainer_' + instance + '"><div class="overlay"></div><div class="myBox"><div class="closeButton"></div><div class="boxContent"></div></div></div>');
            }
            else {
                $("body").append('<div id="' + 'myContainer_' + instance + '"><div class="overlay"></div><div class="myBox"><div class="boxContent"></div></div></div>');
            }
            
            $(myContainer).find(".myBox").css('background-color', settings.backgroundcolor);        
            $(myContainer).find(".myBox").css('border', settings.border);
            
            $(myContainer).find(".boxContent").css('background-color', settings.backgroundcolor);                       
            $(myContainer).find(".boxContent").append(html);
            
            $(myContainer).find(".boxContent").find(".closeBtn").click(function(){ closePopup(); });
            
            rePosition();                                                   
            myScroll = function(){ rePosition(); };
            myResize = function(){ rePosition(); };
            
            $(window).bind('scroll', myScroll);
            $(window).bind('resize', myResize);
            
            if (settings.clickToClose){
                $(myContainer).find(".overlay").click(function(){ closePopup(); });
            }
            
            $(myContainer).find(".overlay").show(); //(eval(settings.fadeInDelay));
            $(myContainer).find(".myBox").show(); //(eval(settings.fadeInDelay));
            
            if (eval(settings.showClose)) {
                $(myContainer).find(".closeButton").click(function(){
                    closePopup();
                });
                
                $(myContainer).find(".closeButton").mouseover(function(){$(this).css("top", (parseInt($(this).css("top")) + 1) + 'px');});                
                $(myContainer).find(".closeButton").mousedown(function(){$(this).css("top", (parseInt($(this).css("top")) + 2) + 'px');});                
                $(myContainer).find(".closeButton").mouseout(function(){$(this).css("top", '-10px');});                
                $(myContainer).find(".closeButton").mouseup(function(){$(this).css("top", '-10px');});              
            }
            return this;                        
        };                 
        return this;
    };                     
})(jQuery);
