/* initiate slider */
$(window).load(function() {
  $('#slider').nivoSlider({
  	effect:'boxRainGrow',
    boxCols: 12,
    boxRows: 8,
  	controlNav:false,
  	directionNav:false,
  	animSpeed:700,
    pauseTime:3000
  });
});

// main nav click interaction
$('header div strong').hover(function(){
  $(this).children('.front').stop().animate({'top':'30px'},400);
}, function() {
  $(this).children('.front').stop().animate({'top':'0'},200);
});


// scroll to section
$('header div').delegate('a','click',function(event){
	var $anchor = $(this);

	$('html, body').stop().animate({
		scrollTop: $($anchor.attr('href')).offset().top
	}, 1500,'easeInOutQuad');
	
	event.preventDefault();
});

// scroll to top
$('.backtop').click(function(event){
  
  $('html, body').stop().animate({
		scrollTop: 0
	}, 1500,'easeInOutQuad');

  event.preventDefault();

});
  

// projects loading
var animType = 'easeOutQuad';
var animSpeed = 900;
var selectedFile = 'projects.html #';
var projectName;
var selectedProp;
var selectedImg;
var currentImg;
var img = new Image();

//control hover states for property preview images
$('#projects ul li a > img').mouseover(function(){
  $(this).addClass('border-hover');
});
$('#projects ul li a > img').mouseout(function(){
  $(this).removeClass('border-hover');
});

$('#projects ul a').click(function(e){
  
  // set variables to reference the correct property
  projectName = $(this).attr('href');
  selectedProp = selectedFile + projectName;
  
  // animate rows out of the way and load property
  $('#top').animate({top: -280},{duration: animSpeed, easing: animType });
  $('#bottom').animate({bottom: -380},{duration: animSpeed, easing: animType, complete: loadContent });

  function loadContent() { 
    $('#loader').delay(200).load(selectedProp,'',showNewContent).hide();
  };
  
  // fade in the new content and load the first image  
  function showNewContent(){
    $('#loader').fadeIn();
    $('#gallery').prepend('<p/>');
    currentImg = '01';
    loadNewImage(currentImg);
  };
  
  // asign click handler to load each of the images once the property is loaded.
  $('#gallery a').live('click',function(e){
     
    selectedImg = $(this).attr('hash').replace('#','');
    
    // check if current image is loaded, if not load new image
    if(currentImg != selectedImg){
      
      currentImg = selectedImg;
      loadNewImage(selectedImg);
      
    }

    e.preventDefault();
    
  });

  function loadNewImage (imageToLoad) {
    
    var image = 'images/gallery/'+ projectName +'/lrg/' + imageToLoad +'.jpg';
    
    $('#gallery p').addClass('loading');
    
    $(img).hide().one('load',function() {
    
      $('#gallery p').prepend(this);
      $('#gallery p').removeClass('loading');
      $(this).fadeIn('slow');
    
    }).attr({
      src: image,
      width: 900,
      height: 540
    });
    
  }
  
  e.preventDefault();
    
});

$('.closeProject').live('click',function(e){
 
  $('#loader').fadeOut(function(){

    $(this).html('');
    $('#top').animate({top:0}, { duration: animSpeed, easing: animType });
    $('#bottom').animate({ bottom:0}, { duration: animSpeed, easing: animType });

  })
  
  e.preventDefault();
  
});

//setup up html5 with flash fallback
var flvPlayer = "http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf";
var flashvars = {};
    flashvars.src = "http://ue.kitchensinkstudios.com/video/kcal-tv-ad.mp4";

var params = {};
    params.allowfullscreen = "true";
    params.allowscriptaccess = "always";
    params.wmode = "transparent";

var attributes = {};

swfobject.embedSWF(flvPlayer,"player","320","240","10.1.0","js/expressInstall.swf", flashvars, params, attributes);