/******************************************************
    * Prototype plug-in
    * Easy Background Image Resizer
    * Developed by J.P. Given (http://johnpatrickgiven.com)
    * Some modifcations by Hay Kranen < http://www.haykranen.nl >
    * Useage: anyone so long as credit is left alone
    * based on jQuery plug-in above, translated to prototype
    * OCJ (http://mediameg.com)
******************************************************/

var containerObj;
var center = false;
// plugin definition
var ObjBgResize = {
    BgResize : function(element, center) {            
        
        center = center || false;
        containerObj = $(element);
        // we hidden image
        containerObj.setStyle({visibility : "hidden"});

        // we change style of body
        // this bizarre syntax is due to prototype
        $$('body').each(function(elt) {
            elt.setStyle({overflowX:"hidden"});
        });

        // since page is loaded we resized to actual size
        containerObj.resizeImage(center);

        // set listener, so every resize we call this funciton
        Event.observe(window, 'resize', function() {
            containerObj.resizeImage(center);
        });

    },
    resizeImage : function(element, center){
  
        $(element).setStyle({
            position:"fixed",
            top:"0px",
            left:"0px",
            zindex:"-1",
            overflow:"hidden",
            width:getWindowWidth() + "px",
            height:getWindowHeight() + "px"
        });

        var image = containerObj.down(0);

        // get original mesures from image
        var image_width = image.getWidth();
        var image_height = image.getHeight();

        // ratio aspect
        var fRatio = 0;       

        // now let's calculate this thing
        if (getWindowWidth() > getWindowHeight()) {

            // if original image width is bigger than original height
            if (image_width > image_height) {
                
                fRatio = image_width/image_height;
                image.setStyle({width : getWindowWidth() + "px"});
                image.setStyle({height : Math.round( getWindowWidth() * (1/fRatio))+"px"});
                
                var newIh = Math.round(getWindowWidth() * (1/fRatio));

                //if new image height is smal than window height we correct this fact
                if(newIh < getWindowHeight()) {                    
                    fRatio = image_height/image_width;
                    image.setStyle({height : getWindowHeight()+"px"});
                    image.setStyle({width :Math.round(getWindowHeight() * (1/fRatio))+"px"});
                }
            } else {               
                // means original height is bigger than original width
                fRatio = image_height/image_width;
                image.setStyle({height : getWindowWidth()+"px"});
                image.setStyle({width : Math.round(getWindowHeight() * (1/fRatio))+"px"});                 
            }
        }
        else{ // means window  height is bigger than width            
            fRatio = image_height/image_width;
            image.setStyle({height: getWindowHeight()+"px"});
            image.setStyle({width : Math.round(getWindowHeight() * (1/fRatio))+"px"});            
        }

        // now that aspects are done we will show image
        image.setStyle({visibility : "visible"});
        
        // Center BG Image
        if (center) {
            image.setStyle({position: "relative"});

            //if image width is bigger than container
            if (image.getWidth() > containerObj.getWidth()) {
                // we will adjust width diference by lefting image
                var wDiff = (image.getWidth() - containerObj.getWidth()) / 2;
                image.setStyle({left : "-" + wDiff + "px"});
            }
        }

    }
}

// Dependable function to get Window Height
function getWindowHeight() {
        var windowHeight = 0;
        if (typeof(window.innerHeight) == 'number') {
            windowHeight = window.innerHeight;
        }
        else {
            if (document.documentElement && document.documentElement.clientHeight) {
                windowHeight = document.documentElement.clientHeight;
            }
            else {
                if (document.body && document.body.clientHeight) {
                    windowHeight = document.body.clientHeight;
                }
            }
        }
        return windowHeight; 
}

// Dependable function to get Window Width
function getWindowWidth() {
     var windowWidth = 0;
        if (typeof(window.innerWidth) == 'number') {
            windowWidth = window.innerWidth;
        }
        else {
            if (document.documentElement && document.documentElement.clientWidth) {
                windowWidth = document.documentElement.clientWidth;
            }
            else {
                if (document.body && document.body.clientWidth) {
                    windowWidth = document.body.clientWidth;
                }
            }
        }
        return windowWidth;    
}




Element.addMethods(ObjBgResize);