$(document).ready(function() {
 
    //move the image in pixel
    var move = -15;
     
    //zoom percentage, 1.2 =120%
    var zoom = 1.2;
 
    //On mouse over those thumbnail
    $('.item').hover(function() {
         
        //Set the width and height according to the zoom percentage
        width = $('.item').width() * zoom;
        height = $('.item').height() * zoom;
         
        //Move and zoom the image
        $(this).find('img').stop(false,true).animate({'width':width, 'height':height, 'top':move, 'left':move}, {duration:200});
         
        //Display the caption
        $(this).find('div.caption').stop(false,true).fadeIn(200);
    },
    function() {
        //Reset the image
        $(this).find('img').stop(false,true).animate({'width':$('.item').width(), 'height':$('.item').height(), 'top':'0', 'left':'0'}, {duration:100});    
 
        //Hide the caption
        $(this).find('div.caption').stop(false,true).fadeOut(1200);
    });
 
});


$(document).ready(function(){
	$('article.intro').cycle()
  });

$(document).ready(function(){
    $('#frame').bxSlider({
    	auto: true,
    	mode: 'horizontal',
    	speed: 800,
    	pause: 6000,
    	infiniteLoop: true,
    	pager: true
    
    });
  });
  
$(document).ready(function(){
    $('#hp-frame').bxSlider({
    	auto: true,
    	mode: 'horizontal',
    	speed: 800,
    	pause: 6000,
    	infiniteLoop: true,
    	pager: true
    
    });
  });

// stick the slideshow to the page

$(function () {
  
  var msie6 = $.browser == 'msie' && $.browser.version < 7;
  
  if (!msie6) {
    var top = $('body#inspiration #sticky').offset().top - parseFloat($('body#inspiration  #sticky').css('margin-top').replace(/auto/, 0));
    $(window).scroll(function (event) {
      // what the y position of the scroll is
      var y = $(this).scrollTop();
      
      // whether that's below the form
      if (y >= top) {
        // if so, ad the fixed class
        $('body#inspiration #sticky').addClass('fixed');
      } else {
        // otherwise remove it
        $('body#inspiration #sticky').removeClass('fixed');
      }
    });
  }  
});

// isotoping the portfolio page

$('#projects').isotope({
  // options
  animationEngine: 'jquery',
  animationOptions: {
     duration: 500,
     easing: 'linear',
     queue: false
   },
  itemSelector : '.item',
  layoutMode : 'fitRows'
});

$('#filters a').click(function(){
  var selector = $(this).attr('data-filter');
  $('#projects').isotope({ filter: selector });
  return false;
});






// $(function(){
//       
//       var $container = $('#projects');
//  
//       $container.isotope({
//         itemSelector : '.element'
//       });
//       
//       
//       var $optionSets = $('#filters .option-set'),
//           $optionLinks = $optionSets.find('a');
//  
//       $optionLinks.click(function(){
//         var $this = $(this);
//         // don't proceed if already selected
//         if ( $this.hasClass('selected') ) {
//           return false;
//         }
//         var $optionSet = $this.parents('.option-set');
//         $optionSet.find('.selected').removeClass('selected');
//         $this.addClass('selected');
//   
//         // make option object dynamically, i.e. { filter: '.my-filter-class' }
//         var options = {},
//             key = $optionSet.attr('data-option-key'),
//             value = $this.attr('data-option-value');
//         // parse 'false' as false boolean
//         value = value === 'false' ? false : value;
//         options[ key ] = value;
//         if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' ) {
//           // changes in layout modes need extra logic
//           changeLayoutMode( $this, options )
//         } else {
//           // otherwise, apply new options
//           $container.isotope( options );
//         }
//         
//         return false;
//       });
//  
//       
//     });