/* Author: Jason @ Use All Five

*/

$(document).ready(function() {

//$('img').hide();

//$('body.home #middle footer').hide();
$('body').imagesLoaded( function( $images ) {
  // callback provides one argument, the jQuery object of child images
  $('img').css({'opacity': 1});
  $('img').hide();
  $('.preloader').fadeOut();
  $('img').fadeIn();
  $(window).resize();
  //$('body.home #middle footer').css({'opacity': 1});
  //$('body.home #middle footer').fadeIn();
  console.log( $images.length + ' images have been loaded in ' + this );
});
  

  $('.slider').cycle({
  		fx: 'fade',
  		speed:  300
  });
	$('.slider').cycle('pause'); 
	/*
  if($('.image-scale-horizontal').height() > $('#tester').height())
  {
    $('.image-scale-horizontal').css({'height': $('#tester').height() + 'px', 'width' : 'auto'});
  }
  else
  {
    $('.image-scale-horizontal').css({'width': '100%', 'height' : 'auto'});
  }
  */

  $('a.next').click(function() {
    
    $('.slider').cycle('next');
  });
  
  $('a.prev').click(function() {
    $('.slider').cycle('prev');
  });
  
  $('.slider img.slide').each(function(index) {
    $(this).data('dims', {'oriWidth': $(this).width(), 'oriHeight': $(this).height() } )
    
   // resize($(this), $(this).parent('li').height(),  $(this).data('dims').oriHeight, $(this).data('dims').oriWidth)
    
    var newSize = scaleSize($(this).parent('li').width(), $(this).parent('li').height(), $(this).data('dims').oriWidth, $(this).data('dims').oriHeight);
    
    $(this).css({'width':newSize[0] + 'px', 'height':newSize[1] + 'px'});

   // $('.info #middle ul li div').css({'width':newSize[0] + 'px', 'height':newSize[1] + 'px'});
    
    
    
    /*
    if($(this).data('dims').oriWidth > $(this).data('dims').oriHeight)
    {
      //horiz
      console.log('horiz')
      
    }
    else
    {
      //vert&square:
      
    }*/
  
  });
  
  backgroundSizeScale($('.home #middle'));
  backgroundSizeScale($('.info #middle'));

});
function scaleSize(maxW, maxH, currW, currH){  
  var targetW = 0;
  var targetH = 0;
  
  
  if(currW > currH){
     targetW = maxW;
     targetH = (currH * maxW)/currW;
     
     
     if(targetH > maxH)
     {
       targetH = maxH;
       targetW = (maxH * currW)/currH;
     }
  }
  else
  {
     
     targetH = maxH;
     targetW = (currW * maxH)/currH;
     
     
     if(targetW > maxW)
     {
       targetW = maxW;
       targetH = (maxW * currH)/currW;
     }
  }
  
  return [targetW, targetH];
}


if(!isPropertySupported('background-size'))
{
  /*
  var img = new Image();
  $('body.home').prepend(img);
  $(img).load(function () {
      //$(this).css('display', 'none'); // .hide() doesn't work in Safari when the element isn't on the DOM already
      $(this).hide()
      $('#loader').removeClass('loading').append(this);
      $(this).fadeIn();
      $(img).css({'position':'absolute'});
      $(img).css({'top': $('.home #middle').offset().top +'px'});
      $('.home #middle').css({'background':'none'})
      resizeImg($(img),$('.home #middle'));
      $(window).resize(function() {
        resizeImg($(img),$('.home #middle'));
      });
  }).error(function () {
      // notify the user that the image could not be loaded
  }).attr('src', '../img/homepage-background.jpg');
  */
}


function backgroundSizeScale(object)
{

  if(object.length < 1 )
  {
    return;
  }
  if(isPropertySupported('background-size'))
  {
    return;
  }
  
  var patt=/\url|\(|\"|\"|\'|\)/g;
  var fileName = object.css('background-image');
  fileName = '../img/' + fileName.split('/').pop().replace(patt,'');
  var img = new Image();
  var imgcontainer = document.createElement('div');

  $(imgcontainer).css({'position':'absolute','overflow':'hidden', 'width':object.width() +'px', 'height':object.outerHeight() +'px'});
  $(imgcontainer).css({'top': object.offset().top +'px'});
  $(imgcontainer).css({'left': object.offset().left +'px'});
  
  $(imgcontainer).prepend(img);
  $('body').prepend(imgcontainer);
  
  $(img).load(function () {
      //$(this).css('display', 'none'); // .hide() doesn't work in Safari when the element isn't on the DOM already
      $(this).hide();
      $(this).fadeIn();
      object.css({'background':'none'})
      resizeImg($(img),object);
      $(window).resize(function() {
        resizeImg($(img),object);
        $(imgcontainer).css({'position':'absolute','overflow':'hidden', 'width':object.width() +'px', 'height':object.outerHeight() +'px'});
        $(imgcontainer).css({'top': object.offset().top +'px'});
       $(imgcontainer).css({'left': object.offset().left +'px'});
      });
  }).error(function () {
      // notify the user that the image could not be loaded
  }).attr('src',fileName);
}



function resizeImg(bgImg, container) {
  var imgwidth = bgImg.width();
  var imgheight = bgImg.height();

  var winwidth = container.width();
  var winheight = container.height();

  var widthratio = winwidth / imgwidth;
  var heightratio = winheight / imgheight;

  var widthdiff = heightratio * imgwidth;
  var heightdiff = widthratio * imgheight;

  if(heightdiff>winheight) {
    bgImg.css({
      width: winwidth+'px',
      height: heightdiff+'px'
    });
  } else {
    bgImg.css({
      width: widthdiff+'px',
      height: winheight+'px'
    });		
  }
} 

function isPropertySupported(property)
{
	return property in document.body.style;
}






$(window).resize(function() {
  
  //$('body.home footer').css({'top': newSize[1]-$('body.home footer').height() + 'px'});
  // $('body.home footer').css({'top': $('#middle').height()  + 'px'});

  $('.slider img.slide').each(function(index) {
    var newSize = scaleSize($(this).parent('li').width(), $(this).parent('li').height(), $(this).data('dims').oriWidth, $(this).data('dims').oriHeight);
    $(this).css({'width':newSize[0] + 'px', 'height':newSize[1] + 'px'});
    
    
   // $('.info #middle ul li div').css({'width':newSize[0] + 'px', 'height':newSize[1] + 'px'});

  });
});