function mycarousel_initCallback(carousel) {
    $('.jcarousel-control a').bind('click', function() {
        // set active
        $(".slider_button").removeClass("slider_button_active");
        $(".slider_button", this).addClass("slider_button_active");
        
        // scroll to the item
        var int = $(this).attr("rel");
        carousel.scroll(jQuery.jcarousel.intval(int));
        
        // stop automatic scrolling
        carousel.startAuto(0);
        
        return false;
    });

    $('#mycarousel-next').bind('click', function() {
        carousel.next();
        carousel.startAuto(0);
        return false;
    });

    $('#mycarousel-prev').bind('click', function() {
        carousel.prev();
        carousel.startAuto(0);
        return false;
    });
    
    // pauze automatic scrolling on mouseover
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
};

$(window).load(function() {
    $('#slider').nivoSlider({
    	effect: 'fade',
    	animSpeed: 1000,
    	pauseTime: 4000,
    	directionNav: false,
    	controlNav: false
    });
});

function mycarousel_itemVisibleInCallbackBeforeAnimation(carousel, item, idx, state) {
	$(".slider_button").removeClass("slider_button_active");
	$("#slider_button_" + idx).addClass("slider_button_active");
	$("#slider_header")
		.empty()
		.append($("#slider_button_" + idx).text());
};

$(document).ready(function() {
	$("ul.sf-menu").supersubs({ 
		minWidth:    15,
		maxWidth:    27,
		extraWidth:  1
	}).superfish();
	
    $("#jcarousel").jcarousel({
        scroll: 1,
        auto: 5,
        wrap: 'last',
        initCallback: mycarousel_initCallback,
        buttonNextHTML: null,
        buttonPrevHTML: null,
        itemVisibleInCallback: {
            onBeforeAnimation:  mycarousel_itemVisibleInCallbackBeforeAnimation
        }
    });
    
    $("#jcarousel_brand").jcarousel({
		scroll: 1,
		auto: 3,
		wrap: 'circular',
		buttonNextHTML: null,
		buttonPrevHTML: null
    });
    
    /* validate forms */
	$(".validate").validate({
		ignore: "table:not(:visible) input"
	});
	$.metadata.setType("attr", "validate");
	
	/* input fields with default values */
	$("input.default-value").each(function() {
		$("input.default-value").css("color", '#444444');
			var default_values = new Array();
			$(this).focus(function() {
				if (!default_values[this.id]) {
					default_values[this.id] = this.value;
				}
				if (this.value == default_values[this.id]) {
					this.value = '';
					this.style.color = '#000000';
				}
			$(this).blur(function() {
				if (this.value == '') {
					this.style.color = '#444444';
					this.value = default_values[this.id];
				}
			});
		});
	});
	
	/* text resize */
	$(".fontsize a").click(function() {
		var klasse = $(this).attr("rel");
		
		$("body").removeClass("text_small text_medium text_large");
		$("body").addClass(klasse);
		
		$.post("/api.php?section=fontsize", {"fontsize": klasse});
	});
	
	$("#tabs").tabs();
	
	$("#auto_submit input").change(function() {
		this.form.submit();
	});
	
	$("#auto_submit select").change(function() {
		this.form.submit();
	});
	
	/* tell a friend dialog box */
	$("a#tellafriend").click(function() {
		$("#dialog").dialog({
			bgiframe: true,
			height: 250,
			width: 400,
			modal: true,
			resizable: false,
			draggable: false,
			close: function(ev, ui) { $(this).dialog("destroy"); } 
		});
		
		$("#dialog input:first").focus();
	});
	
	/* add to bike compare */
	$("a.compare").click(function() {
		var id = $(this).attr("rel");
		$.get('/api.php?section=fietsenvergelijker&action=add&id=' + id, function(data) {
			alert('De fiets is toegevoegd aan de vergelijker.');
			window.location = location.href;
		});
	});
	
	/* remove bike from compare */
	$("a.remove").click(function() {
		var id = $(this).attr("rel");
		$.get('/api.php?section=fietsenvergelijker&action=delete&id=' + id, function(data) {
			$("#compare_" + id).fadeOut("slow");
		});
		
		var width = $(".horizontal_container").width() - 250;
		$(".horizontal_container").css("width", width + "px");
	});
});

function Goto(page) {
	$("tr.highlight").click(function (event) {
		if ($(event.target).is('td')) {
			document.location.href = page;
		}
	});
}