var bFadeIn = true;

function FullScreenBG() { 
  var $Site = $("#site");
  
  var ContentContainer        = $("#site");
  var BackContainer           = $("#background");
  var BackContainerImage      = BackContainer.find('img');
  var ImageWidth              = BackContainerImage.width();
  var ImageHeight             = BackContainerImage.height();

  var ContentContainerHeight  = parseInt(ContentContainer.outerHeight()); 
  var ContentContainerWidth   = parseInt(ContentContainer.outerWidth());
  
  BackContainer.css("overflow", "hidden");
  BackContainerImage.css("position", "absolute");
  
  var SiteHeight              = parseInt($Site.innerHeight());
  var ContainerHeight         = SiteHeight;

  BackContainer.height(ContainerHeight); // set height of the container so no scrollbar is measured
  
  var WindowHeight            = parseInt($(window).height());
  var WindowWidth             = parseInt($(window).width());
  
  BackContainer.width(WindowWidth);
  BackContainer.css("width", "100%");

  if(WindowWidth < ContentContainerWidth) {
    BackContainerImage.css('width', ContentContainerWidth + "px");
  } else {
    BackContainerImage.css('width', WindowWidth + "px");
  }
  BackContainer.css("width", BackContainerImage.width() + "px");
  
  var NewImageHeight = GetDimensionChange(ImageWidth, BackContainerImage.width(), ImageHeight);
  if(NewImageHeight > ContainerHeight) {
    BackContainerImage.css("top", (Math.floor(NewImageHeight - ContainerHeight) / 2) * -1 + "px");
    BackContainerImage.height(NewImageHeight);
    BackContainerImage.css("left", "0px");
  } else {
    BackContainerImage.css("top", "0px");
    BackContainerImage.height(ContainerHeight);
    var NewImageWidth = GetDimensionChange(ImageHeight, ContainerHeight, ImageWidth);
    BackContainerImage.width(NewImageWidth);
    if(WindowWidth < ContentContainerWidth) {
      BackContainerImage.css("left", (Math.floor(NewImageWidth - ContentContainerWidth) / 2) * -1 + "px");
    } else {
      BackContainerImage.css("left", (Math.floor(NewImageWidth - WindowWidth) / 2) * -1 + "px");
    }
  }

  BackContainer.height(parseInt($Site.innerHeight())); // height changes during process, so don't use SiteHeight.

  if(bFadeIn) {
    BackContainerImage.animate({opacity: 1}, "slow");  
    bFadeIn = false;
  } else {
    BackContainerImage.show();
  }
}

function GetDimensionChange(SrcDimension, NewDimension, DimensionValue)
{
  return DimensionValue * (NewDimension/SrcDimension);
}

function CheckImageSizes(){
  var $BackgroundDiv = $('#background');
  var $BackgroundImage = $BackgroundDiv.find('img');
  var isiPad = navigator.userAgent.match(/iPad/i) != null;
  var isiPhone = navigator.userAgent.match(/iPhone/i) != null;
  if(isiPad || isiPhone){
    $BackgroundImage.css({ width : 'auto' , height : 'auto'});
  }
  
  var BrowserHeight = parseInt($(window).height());
  var BrowserWidth = parseInt($(window).width());
  
  var BgImageHeight = parseInt($BackgroundImage.height());  
  var BgImageWidth = parseInt($BackgroundImage.width());

  //console.log("BgImageHeight: " + BgImageHeight + " BrowserHeight: " + BrowserHeight + " BgImageWidth: " + BgImageWidth + " BrowserWidth" + BrowserWidth );
  
  if(!isiPad && !isiPhone) {
    
    if(BrowserHeight > BgImageHeight) {  
      $BackgroundImage.css({ height : '100%', width : 'auto' });
    }
    
    if(BrowserHeight == BgImageHeight && BgImageWidth > BrowserWidth) {
      $BackgroundImage.css({ height : '100%', width : 'auto' });
      return false;  
    }
    
    if(BrowserWidth == BgImageWidth && BgImageHeight > BrowserHeight) {
      $BackgroundImage.css({ height : 'auto', width : '100%' });
      return false;  
    }
    
    if(BgImageWidth < BrowserWidth) {
      $BackgroundImage.css({ height : 'auto', width : '100%' });
    } else {
      if(BrowserWidth > BrowserHeight) {
        if(BrowserHeight > BgImageHeight) {  
          $BackgroundImage.css({ height : '100%', width : 'auto' });
        } else { 
          $BackgroundImage.css({ height : 'auto', width : '100%' });
        }
      }
    }  
    $BackgroundDiv.css({ 'display':'block', 'visibility':'visible'});
  
  } else {
    var SiteHeight = parseInt($("#site").height());
    
    if(SiteHeight > BgImageHeight) {
      $BackgroundImage.css({ height : SiteHeight, width : 'auto' });
    }
    
    if(BgImageWidth < BrowserWidth) {
      $BackgroundImage.css({ height : 'auto', width : '100%' }) 
    }
    $("#background").css('visibility','visible');
  }  
}

$(window).resize(function(){   
  if($.browser.msie && $.browser.version < 7){ 
    FullScreenBG();
  } else { 
    CheckImageSizes();  
  }
});

$(window).load(function() {
  $(window).trigger('resize');
});

