$(document).ready(function() {
    
    $('#webdesign').click(function(){
      $('#categories a').toggleClass('inactive');
      $('#portfolio .loading').show();
      $("#carousel ul").jcarousel({ itemLoadCallback: c_loadWebdesign }).jcarousel('reset'); 
    });
    
    $('#logos').click(function(){
      $('#categories a').toggleClass('inactive');
      $('#portfolio .loading').show();
      $("#carousel ul").jcarousel({ itemLoadCallback: c_loadLogos }).jcarousel('reset');
    });
      
    function c_initCallback(carousel) {
      $('#btn-carousel-next').click(function() { carousel.next(); });
      $('#btn-carousel-prev').click(function() { carousel.prev(); });
    }

    function c_btnPrevCallback(carousel, button, enabled) {
      if (enabled) {
        $('#btn-carousel-prev').removeClass('btn-disabled').hover(function(){$(this).addClass('btn-over')},function(){$(this).removeClass('btn-over')});
      } else {
        $('#btn-carousel-prev').addClass('btn-disabled');
      }
    }
    
    function c_btnNextCallback(carousel, button, enabled) {
      if (enabled) {
        $('#btn-carousel-next').removeClass('btn-disabled').hover(function(){$(this).addClass('btn-over')},function(){$(this).removeClass('btn-over')});
      } else {
        $('#btn-carousel-next').addClass('btn-disabled');
      }
    }
    
    function c_loadWebdesign(carousel, state) {
      if (state != 'init') { return; }

      $.get('webdesign.html', function(data){ c_itemAddCallback(carousel, carousel.first, carousel.last, data); });
    };
    
    function c_loadLogos(carousel, state) {
      if (state != 'init') { return; }

      $.get('logos.html', function(data){ c_itemAddCallback(carousel, carousel.first, carousel.last, data); });
    };
    
    function c_itemAddCallback(carousel, first, last, data) {
      carousel.size($('li', data).length);
    
      $('li', data).each(function(i) {
        var item = $('li', data)[i];
        carousel.add(first + i, item);
      });
      
    $("#carousel").hover(
      function() {},
      function() {
        $('#carousel li a').fadeTo("fast", 1.0); 
      }
    );
    
    $("#carousel li").hover(
      function(){
        $(this).siblings().find('a').stop().fadeTo("fast", 0.3);
        $(this).find('a').stop().fadeTo("fast", 1.0);
      },
      function(){}
    );
    
    if ($.browser.opera) {
      $("#carousel li img").load(function() {
        $(this).wrap(function(){
          return '<span class="portfolio-img" style="background:url(' + $(this).attr('src') + ') no-repeat center center; width: ' + $(this).width() + 'px; height: ' + $(this).height() + 'px;" />';
        });
        $(this).css("opacity","0");
      });
    }
      $('#portfolio .loading').fadeOut();

      initLightbox();
    };
    
    $("#carousel ul").jcarousel({
      scroll: 5,
      visible: 5,
      buttonNextHTML: null,
      buttonPrevHTML: null,
      initCallback: c_initCallback,
      itemLoadCallback: c_loadWebdesign,
      buttonNextCallback: c_btnNextCallback,
      buttonPrevCallback: c_btnPrevCallback
    });
    
    function initLightbox () {
      $('#carousel a').lightBox({
        overlayOpacity: 0.9,
        fixedNavigation: true,
        imageLoading: 'images/loading.gif',
        imageBtnClose: 'images/blank.gif',
        imageBtnPrev: 'images/btn-lightbox-prev.png',
        imageBtnNext: 'images/btn-lightbox-next.png',
        imageBlank: 'images/blank.gif',
        containerResizeSpeed: 350,
        containerBorderSize: 0
      });
    }
  });