// The Fucking Magic

var bound = false
var bindScroller = function() {
   if(bound) {
    return;
   }
   bound = true;
   var articles = $('article');
   var sectionTop = 100;
   
   articles.each(function(i, article) {
     var article = $(article);
     var last = $(article.find('.last'));
     var top = article.position().top;
     var desc = $(article.find('.description'));
     var back = $(article.find('.back'));
     var descHeight = desc.height();

     $(window).scroll(function() {
       var scrollTop = $(window).scrollTop();
       var height = article.height();
       
       if(top  + sectionTop > scrollTop) {
         desc.css('position', 'absolute');
         desc.removeClass('bottom');
         back.removeClass('display');
       } else if (top + height - descHeight + sectionTop < scrollTop) {
         desc.css('position', 'absolute');
         desc.addClass('bottom');
         back.removeClass('display');
       } else if (top + sectionTop <= scrollTop) {
         desc.css('position', 'fixed');
         desc.removeClass('bottom');
         back.addClass('display');
         History.pushState({ portfolio: article.attr('id') }, null , '/portfolio/' + $(article).attr('id'));
         
       }

       if(top + height - descHeight < scrollTop && top + height > scrollTop) {
         var diff = top + height - scrollTop;
         desc.css('opacity', diff / descHeight);
         last.css('opacity', diff / descHeight);
       } else if(top + height <= scrollTop) {
         desc.css('opacity', 0);
         last.css('opacity', 0);
       } else {
         desc.css('opacity', 1);
         last.css('opacity', 1);
       }
     });
   });
 };

// Page Switching + URL Changing

  $(window).load(function() {
   //$($('.page').get(0)).show();

   var switchPage = function(caller, callback) {
     $('a.switch.current').removeClass('current');
     $(caller).addClass('current');
       
     var el = $('.page:visible').length == 0 ? $('#' + $(caller).attr('rel')) : $('.page:visible');
     
     $('#' + $(caller).attr('rel')).hide();
     $('.wrapper').hide();       
 
     $(el).fadeOut(1000, function(){
       $('#' + $(caller).attr('rel')).fadeIn(400, function() {
         $('.wrapper').fadeIn(400, function() { 
           if(callback) {
             callback();
           }
         });
       });         
     });
   	 return false;							  
   }
   
   $('a.switch').click(function() {
    History.pushState({ rel: $(this).attr('rel') },$(this).text(),$(this).attr('href'));
    return false;
   });
   
   History.Adapter.bind(window, 'statechange', function() {
     var state = History.getState();
     if(state.data.rel) {
       switchPage($('a[rel="' + state.data.rel + '"]'), function() {
         if($('a[rel="' + state.data.rel + '"]').attr('rel') == "portfolio") {
           bindScroller();
         }
       })
     }
   });
 
   var initialURL = History.getShortUrl(window.location.href);
   
   if(initialURL.indexOf('/portfolio/') == 0) {
     switchPage($('a[href="/portfolio"]'), function() {   
       $('nav a[href="' + initialURL + '"]').addClass("current");
       if($('#' +  initialURL.substring('/portfolio/'.length)).length > 0) {
         $.scrollTo($('#' +  initialURL.substring('/portfolio/'.length)), {
           duration: 1000
         });
       }
       bindScroller();
     });
   } else {
     switchPage($('a[href="' + initialURL + '"]'), function() {
       if($('a[href="' + initialURL + '"]').attr('rel') == "portfolio") {
         bindScroller();
       }
     });
   }


}); 

$(window).load(function() {
    $('.image-slider').each(function(i) {
        $(this).before('<div class="nav nav'+i+'">').cycle({
            fx:     'scrollLeft',
            speed:  '600',
            timeout: 8000,
            pager:  '.nav' + i
            });
        });
    });