function gotoPrev() {
    jQuery(".imageTabs").data("tabs").prev();
  }
  
  function gotoNext() {
    jQuery(".imageTabs").data("tabs").next();
  }
  
	jQuery.fn.image = function(src, f){
		return this.each(function(){
			var img = new Image();
			img.src = src;
			
			this.appendChild(img);
		});
	};
  
  jQuery.tools.tabs.addEffect("ajaxImage", function(i, done) {
		var src = this.getTabs().eq(i).attr("href");
		
		var link = jQuery('<a class="hover" href="#">&nbsp;</a>');

		var image = jQuery('<div class="image"></div>');
		image.image(src);
		/* here you'll write your effect. the 'this' variable points to the API */
		
		this.getPanes().eq(0).empty();
		
		this.getPanes().eq(0).append(link);
		this.getPanes().eq(0).append(image);
		

  });

  jQuery(document).ready(function() {

  	/*jQuery('body').prependTo(jQuery('imageSimpleOverlay'));
	jQuery('#imageSimpleOverlay').remove();*/

	jQuery(".imageScrollable").scrollable({
	  next: '.imageScrollableNext',
	  prev: '.imageScrollablePrev',
	  circular: true,
	  speed: 400
	});
	var tabs = jQuery(".imageTabs").tabs(".imageSlides > div", {
		effect: 'ajaxImage',
		fadeOutSpeed: "slow",
		rotate: true
	}).slideshow({
		autoplay: true,
		interval: 7000,
		clickable: false
	});
	
	jQuery(".imageScrollable img").each(function(intIndex){
		jQuery(this).bind("click", function(){
			jQuery(".imageTabs").data("tabs").click(intIndex-2).getIndex(); //-2 due to rotation
		});
	});
	
	var tabs = jQuery(".imageOverlayTabs").tabs(".imageOverlaySlides > div", {
		effect: 'ajaxImage',
		fadeOutSpeed: "slow",
		rotate: true,
		onClick: function(event, index) {
			var tab = jQuery(this).getCurrentTab();
			jQuery("prevOverlaySlide").height(tab.height());
			alert("sdf");
		}
	}).slideshow({
		autoplay: false,
		interval: 7000,
		clickable: false,
		next: '.nextOverlaySlide',
		prev: '.prevOverlaySlide'
	});



	jQuery(".imageSlides").attr("rel", "#imageOverlay");
	jQuery("div[rel]").overlay({
		closeOnClick: false,
		fixed: false,
		mask: {
			color: '#333',
			loadSpeed: 200,
			opacity: 0.9
		},
		onBeforeLoad: function(event) {
			var intIndex = jQuery(".imageTabs").data("tabs").getIndex();
			jQuery(".imageOverlayTabs").data("tabs").click(intIndex).getIndex();
		},
		onClose: function(event) {
			var intIndex = jQuery(".imageOverlayTabs").data("tabs").getIndex();
			jQuery(".imageTabs").data("tabs").click(intIndex).getIndex();
		}
	});
	
  });