$(function() {	
	
	jQuery.httpbase = function( ){
		return $('base')[0].href;
	}
	
	//als class firstlink is dan hele blok als link door middel van 1 a tag
	$('.firstlink').each(function() {
		$(this).click(function() {
			document.location.href = $(this).find('a[href]').get(0).href;
			return false;
		});
		$(this).bind('mouseenter',function() {
			$(this).find('a[href]').eq(0).addClass('hover');
		});
		$(this).bind('mouseleave',function() {
			$(this).find('a[href]').eq(0).removeClass('hover');
		});
	})
	
		// a tag met de class new-window openen in een nieuw venster
	$('a.new-window').click(function(){
	   window.open(this.href);
	   return false;
	});
	
	// rollover images links bij detail scherm. Vervangt ook grote foto
	$('a.image_small').each( function(){
		$(this).mouseover(function() {
			$('a.image_small').removeClass('active');
			$(this).addClass('active');
			var newsrc = $(this).find('img').get(0).src.replace('/100/','/460/').replace('/80/','/460/');
			$("#detail_image").find('img').get(0).src = newsrc;
		});
	});
	$('a.image_small').eq(0).addClass('active');
	$('div#detail_image').click(function() {
		$('a.image_small.active').eq(0).click();
	});	
	$('div#detail_image').css('cursor','pointer');
	
	// prettyphoto:
	$("a[rel^='prettyPhoto']").prettyPhoto({
		animationSpeed: 'fast', 		/* fast/slow/normal */
		opacity: 0.80, 					/* Value between 0 and 1 */
		showTitle: true, 				/* true/false */
		allowresize: true, 				/* true/false */
		counter_separator_label: '/', 	/* The separator for the gallery counter 1 "of" 2 */
		theme: 'light_square', 			/* light_rounded / dark_rounded / light_square / dark_square / facebook */
		hideflash: false, 				/* Hides all the flash object on a page, set to TRUE if flash appears over prettyPhoto */
		wmode: 'opaque', 				/* Set the flash wmode attribute */
		autoplay: true, 				/* Automatically start videos: True/False */
		modal: false
	});
	
	$('.maten .maat').click( function() {
		$('.maten .maat').removeClass('active');
		$(this).addClass('active');
		$('input',this).attr('checked','checked');
	});
	
	$('.bestellen .info').each( function(i,info) {
		$("input",info).focus(function() {
			if($(info).is(":has(span)")) {				
				$.showTooltip(info,$("span",info).html());	
			}
		});	
	});
	
	$("form[name='gegevens']").each(function() {		
		$.copyAfleveradres( this );
		
		$(this).bind("focus blur click keypress change", function(){
			$.copyAfleveradres( this );
		});		
	});

	$("form[name='bestelForm']").submit( function() {			
		if($(this).is(":has(input[type='radio'][name='maat'])")) {
			if(!$("input[type='radio'][name='maat']:checked").val()) {
				$('.warning',this).show();
				return false;
			}
		}
	});
	
	$(".betalen .betaalwijze").each(function() {
		$(this).click(function() {
			if(!$(this).is('.active')) {				
				$(".betalen .betaalwijze .betaalmethodes").hide('fast');
				$(".betalen .betaalwijze").removeClass('active');
				$(".betalen .betaalwijze .betaalmethodes input[name='betaalmethode']").removeAttr("checked");

				
				$(".betaalmethodes",this).show("normal");
				$(this).addClass("active");
				$(".betaalmethodes .betaalmethode",this).click(function() {
					$("input[name='betaalmethode']",this).attr("checked","checked");
				});
			}				
		});
	});
	
	$('form.creditcard input[type="button"]').click(function(){			
		$.getJSON($.httpbase()+"bestel/creditcardvalidate",$('form.creditcard').serialize(),function( data ){
			if (data['succes']){
				$('form.creditcard').submit();
    		}else{
    			$('.warnings').remove();
    			$('.fieldset').prepend(data['html']);    			
    		}
    	});	
	});
	
});

jQuery.copyAfleveradres = function( form ){
	if( !form["afleveradres"].checked ){
		$('#afleveradres').hide();
	} else if( form["afleveradres"].checked && $('#afleveradres').css('display') == 'none' ) {
		$('#afleveradres').show();	
	} 
}

jQuery.showTooltip = function(element,data) {	
	
	tooltip = '<div class="tooltip">';
	tooltip += '<div class="top"></div>';
	tooltip += '<div class="content">'+data+'</div>';   
    tooltip += '<div class="bottom"></div>';
    tooltip += '</div>';   
		
	$(element).prepend(tooltip);			
	$('.tooltip', element).css('left',$('input',element).width());
	$(element).css('z-index','5');			
	
	$('input',element).blur(function() {
		$('.tooltip', element).remove();
		$(element).css('z-index','1');
	});	
}