function delay_carousel() {
   $('div.examples li').css('opacity', '0.5');
   $('div.examples').append('<div id="loading_block" style="position: absolute; width:'+$('div.examples').width()+'px;height: 500px; z-index: 999; top: 0; background: url(/images/i-loading.gif) 50% 50% no-repeat;"></div>');
}
function clear_delay_carousel() {
   $("div#loading_block").remove();
   $('div.examples li').css('opacity', '1.0');
}

$(function(){
  
   $("div.examples ul.hidden").show();
   delay_carousel();
	if ($.jcarousel) {
		$('div.examples').jcarousel({
			scroll: 1,
         start: window.jCarouselExamplesStart,
			buttonNextHTML: '<div class="png"></div>',
			buttonPrevHTML: '<div class="png"></div>',
         itemFirstInCallback: examples_FirstInCallback,
         initCallback: function (carousel, state) {
            delay_carousel();
         },
         itemVisibleInCallback: {
            onBeforeAnimation: function(carousel, item, idx, state) {
               //clear_delay_carousel();
            },
            onAfterAnimation:  function(carousel, item, idx, state) {
               clear_delay_carousel();
            }
         }
		});
		$('div.outstanding').jcarousel({
			scroll: 2,
			buttonNextHTML: '<div class="png"></div>',
			buttonPrevHTML: '<div class="png"></div>'
		});
	}
   
   function examples_FirstInCallback(carousel, item, idx, state) {
      $("#project_h1").html(projects[idx].h1);
      $("#project_h3").html(projects[idx].h3);
   }
	
	//IMPORTANT init DD_belatedPNG after jcarousel
	if (window.DD_belatedPNG) DD_belatedPNG.fix('.png');
	
	$('#services li').hover(
		function(){
			var $this = $(this);
			if (!$this.hasClass('current')) $this.find('p').stop().slideDown(100);
		},
		function(){
			var $this = $(this);
			if (!$this.hasClass('current')) {
				$this.find('p').stop().slideUp(100, function() {
					$(this).height('auto');
				});
			}
		}
	);
	
	$('#content div.projects a').hover(
		function(){
			$('<span style="display:none;"></span>')
				.text($(this).attr('titlepopup'))
				.appendTo(this)
				.fadeIn(500);
		},
		function(){
			$('span', this).stop().fadeOut(500, function(){
				$(this).remove();
			});
		}
	);
   
});