$(document).ready(function(){
	
	//LOGIN POPUP
	//=====================================================
	$("#login").click(function(){
		if($("#loginpopup").css("display") != "block"){
			$("#loginpopup").slideDown(200);
		} else {
			$("#loginpopup").slideUp(200);
		}
	});
	
	//SAFE URL FROM PHP MIRRORED
	//=====================================================
	function safe_url(url){
		url = url.replace('é','e');
		url = url.replace(' ','-');          
		url = url.replace('/','-');     
		url = url.replace('?','-'); 
		url = url.replace('&','-');
		url = url.replace('`','');  
		url = url.replace('ç','A');  
		url = url.replace('ˆ','a');
		url = url.replace('‰','a');
		url = url.replace('å','A');  
		url = url.replace('‡','a');  
		url = url.replace('Ž','e'); 
		url = url.replace('','e');
		url = url.replace('é','E');
		url = url.replace('ƒ','E');  
		url = url.replace('Ž','e');  
		url = url.replace('Ÿ','u');
		url = url.replace('œ','u');  
		url = url.replace('ë','i');
		url = url.replace('’','i');
		url = url.replace('ê','I');   
		url = url.replace('™','o');
		url = url.replace('š','o');  
		url = url.replace('—','o');
		url = url.replace('','');    
		url = url.replace('\'','');  
		url = url.replace('.','');
		url = url.replace(/ /gi, "-");
		url = url.toLowerCase();
		return url;
	}
	
	//FILTERBAR FUNCTIONS
	//=====================================================
	$("#stap5").change(function(){
    	window.location="/producten/"+safe_url($("select#stap5 option:selected").text())+"/"+$("#stap5").val();
    });
    $("#stap6").change(function(){
        window.location="/producten/"+safe_url($("select#stap5 option:selected").text())+"/"+$("#stap5").val()+"/"+safe_url($("select#stap6 option:selected").text())+"/"+$("#stap6").val();
    });
    $("#stap7").change(function(){
        window.location="/producten/"+safe_url($("select#stap5 option:selected").text())+"/"+$("#stap5").val()+"/"+safe_url($("select#stap6 option:selected").text())+"/"+$("#stap6").val()+"/"+$("#stap7").val();
    });
    $("#stap8").change(function(){
        window.location="/producten/"+safe_url($("select#stap5 option:selected").text())+"/"+$("#stap5").val()+"/"+safe_url($("select#stap6 option:selected").text())+"/"+$("#stap6").val()+"/"+$("#stap7").val()+"/"+safe_url($("select#stap8 option:selected").text())+"/"+$("#stap8").val();
    });
    $("#soortenbox").change(function(){
		window.location="/producten/"+safe_url($("select#stap5 option:selected").text())+"/"+$("#stap5").val()+"/"+safe_url($("select#stap6 option:selected").text())+"/"+$("#stap6").val()+"/"+$("#stap7").val()+"/"+safe_url($("select#stap8 option:selected").text())+"/"+$("#stap8").val()+"/"+safe_url($("#soortenbox option:selected").text())+"/"+$("#soortenbox").val();
    });
    
  //POPUP WINKELWAGEN
	//=====================================================
    $('a.box_a').click(function(event){
    	event.preventDefault();
    	$('body').append("<div id='popup'><div id='popwin'><h2 style='margin-bottom:10px;'>Product toegevoegd</h2>Het product is toegevoegd aan uw winkelwagen.<br/><br/><a id='closer' style='text-decoration:none' href='#'>sluit venster</a></div></div>");
    	$('#popwin').animate({
		    width: '300px',
		    height: '100px'
		  }, 100, function() {
		    // Animation complete.
		  });
    });
    $('#popwin a#closer').live('click', function(e) {
    	e.preventDefault();
    	$('#popwin').slideUp(300);
  		$('#popup').animate({
		    opacity: 0
		  }, 200, function() {
		   	$('#popup').remove();
		   	location.reload();
		  });
	});
  
  //POPUP VOORRAAD
	//=====================================================
    $('a.box_b').click(function(event){
    	event.preventDefault();
    	$('body').append("<div id='popup'><div id='popwin'><h2 style='margin-bottom:10px;'>Houd me op de hoogte</h2>Vul uw emailadres in en ontvang een bericht wanneer dit product weer op voorraad is.<br/><br/>Emailadres:<br><form method=post><input type=hidden name=action value=send6><input type=text name=email size=30 maxlength=100><br><input type=submit value=verzenden></form><br><br><br><a id='closer' style='text-decoration:none' href='#'>sluit venster</a></div></div>");
    	$('#popwin').animate({
		    width: '300px',
		    height: '300px'
		  }, 100, function() {
		    // Animation complete.
		  });
    });
    $('#popwin a#closer').live('click', function(e) {
    	e.preventDefault();
    	$('#popwin').slideUp(300);
  		$('#popup').animate({
		    opacity: 0
		  }, 200, function() {
		   	$('#popup').remove();
		   	location.reload();
		  });
	});  

	//PRODUCT PAGE TABS
	//=====================================================

	//Default Action
	$(".tab_content").hide(); //Hide all content
	$("ul.tabs li:first").addClass("active").show(); //Activate first tab
	$(".tab_content:first").show(); //Show first tab content
	
	//On Click Event
	$("ul.tabs li").click(function() {
		$("ul.tabs li").removeClass("active"); //Remove any "active" class
		$(this).addClass("active"); //Add "active" class to selected tab
		$(".tab_content").hide(); //Hide all tab content
		
		
		var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
		$(activeTab).fadeIn(); //Fade in the active content
		return false;
	});
	
	//video tab: video playlist
	$('.ytsmall').click(function(){
		$('#vid_main').html('<iframe width="440" height="234" src="http://www.youtube.com/embed/'+$(this).find('span').text()+'" frameborder="0" allowfullscreen></iframe>');
	});
	
	//360 + LARGER IMAGE POPUP
	//=====================================================
	$('.poplarge').click(function(event){
		event.preventDefault();
		var im = $(this).attr('href');
		$('body').append("<div id='popup'><div id='popwin2'><img src='"+im+"' alt='' /><a id='closer' style='text-decoration:none' href='#'>sluit venster</a><div style='clear:both;'></div></div></div>");
		$('#popwin2 img').css('width','600px');
	});
	$('.pop360_flash').click(function(event){
		//deze moet nog gemaakt worden voor de 360 view. geen IMG inladen maar een flash of quicktime
		event.preventDefault();
		var im = $(this).attr('href');
		$('body').append("<div id='popup'><div id='popwin2'><object classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000 codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0 width=470 height=313><param name=movie value=http://www.carstyle.nl/movies/"+im+" /><param name=quality value=high /><embed src=http://www.carstyle.nl/movies/"+im+" quality=high pluginspage=http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash type=application/x-shockwave-flash width=470 height=313></embed></object><a id='closer' style='text-decoration:none' href='#'>sluit venster</a><div style='clear:both;'></div></div></div>");
		$('#popwin2 img').css('width','600px');
	});
	$('.pop360_quicktime').click(function(event){
		//deze moet nog gemaakt worden voor de 360 view. geen IMG inladen maar een flash of quicktime
		event.preventDefault();
		var im = $(this).attr('href');
		$('body').append("<div id='popup'><div id='popwin2'><object CLASSID=clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B width=470 height=313 CODEBASE=http://www.apple.com/qtactivex/qtplugin.cab><param name=src value=http://www.carstyle.nl/movies/"+im+"><param name=qtsrc value=rtsp://realmedia.uic.edu/itl/ecampb5/demo_broad.mov><param name=autoplay value=true><param name=loop value=false><param name=controller value=true><embed src=http://www.carstyle.nl/movies/"+im+" qtsrc=rtsp://realmedia.uic.edu/itl/ecampb5/demo_broad.mov width=470 height=313 autoplay=true loop=false controller=true pluginspage=http://www.apple.com/quicktime/></embed></object><a id='closer' style='text-decoration:none' href='#'>sluit venster</a><div style='clear:both;'></div></div></div>");
		$('#popwin2 img').css('width','600px');
	});  
	$('#popwin2 a#closer').live('click', function(e) {
		e.preventDefault();
    	$('#popwin2').slideUp(300);
  		$('#popup').animate({
		    opacity: 0
		  }, 200, function() {
		   	$('#popup').remove();
		  });
	});
	$('ul#thumbs li a').click(function(event){
		event.preventDefault();
		var lin = $(this).attr('href');
		var plarge = lin.replace('groot','extra');
		var p360 = lin.replace('groot','extra');
		$('.photos_large .btns .poplarge').attr('href',plarge);
		$('.photos_large .btns .pop360').attr('href',p360);
		$('.photos_large img#largeimage').hide();
		$('.photos_large img#largeimage').attr('src',lin);
		$('.photos_large img#largeimage').fadeIn();
	});
	
	//CARROUSSEL FOR PRODUCT IMAGES
	//=====================================================
	//only show arrows for scrolling if there is something to scroll
	var n = $("ul#thumbs li").length;
	var posi = 1;
	if(n > 3){
		$('a#scroll_right').css('display','inline-block');
		$('a#scroll_left').css('display','inline-block');
	}
	$('a#scroll_right').click(function(){
		if(posi >= n-2){
			$('ul#thumbs').animate({left: '-=20'},200,function(){
				$("ul#thumbs").animate({left: "+=20"}, 100 );
			});
		} else {
			$("ul#thumbs").animate({left: "-=95"}, 200 );
			posi = posi + 1;
		}
	});
	$('a#scroll_left').click(function(){
		if(posi <= 1){
			$('ul#thumbs').animate({left: '+=20'},200,function(){
				$("ul#thumbs").animate({left: "-=20"}, 100 );
			});
		} else {
			$('ul#thumbs').animate({left: '+=95'},200);
			posi = posi - 1;
		}
	});

	
	//TOOLTIP
	//=====================================================
	$("a.tooltippert").hover(
		function(){
			$(this).append('<span class="tipje"><span class="inner">'+$(this).attr('rel')+'</span></span>');
	
			var tt = $('.tipje').outerHeight();
			var position = $(this).position();
			$('.tipje').css('top',(position.top-tt)+'px');
			$('.tipje').css('left',(position.left-10)+'px');
			
		}, 
		function(){
			$(".tipje").remove();
		}
	);
	
	
	//FORM VINKJES
	//=====================================================
	$('input.check').change(function(){
		if( !$(this).val() ) {
			$(this).parent().find('.filled').remove();
      	} else {
      		$(this).parent().append("<span class='filled'><img src='img/accept.png' /></span>");
      	}
	});
	
	
	//AFLEVERADRES GHOSTEN
	//=====================================================
	$('input[name=adres]').change(function(){
		$('input[name=adres_aflever]').css('color','#999');
		$('input[name=adres_aflever]').val($('input[name=adres]').val());
	});
	$('input[name=pc]').change(function(){
		$('input[name=pc_aflever]').css('color','#999');
		$('input[name=pc_aflever]').val($('input[name=pc]').val());
	});
	$('input[name=plaats]').change(function(){
		$('input[name=plaats_aflever]').css('color','#999');
		$('input[name=plaats_aflever]').val($('input[name=plaats]').val());
	});
	
	$('input[name=adres_aflever]').focus(function() {
  		$(this).css('color','#000');
	});
	$('input[name=pc_aflever]').focus(function() {
  		$(this).css('color','#000');
	});
	$('input[name=plaats_aflever]').focus(function() {
  		$(this).css('color','#000');
	});
	
	//TOON UNIVERSELE PRODUCTEN
	//=====================================================
	$('#toonuniverseel').live('click', function(){
		if($('#toonuniverseel').text() == "toon ook universele producten"){
			$('#waitimage').html("<img src='img/ajax-loader.gif' style='float:right;' />");
			$.get('require/filterproducten_uni.php', function(data) {
				$('#toonuniverseel').text('verberg universele producten');
				$('#waitimage').html("");
				var toappend = "<div id='unispul'>"+data+"</div>";
  				$("#main").append(toappend);
			});	
		} else {
			$('#unispul').remove();
			$('#toonuniverseel').text('toon ook universele producten');
		}
	});
	
	//MENU DROPDOWNS
	//=====================================================
	$('#nav li').hover(
		function (){
			//bij moeilijkheden not animating er tussenuit halen
			$(this).find('.submenu').not(':animated').slideDown(200);
		}, 
		function (){
			$(this).find('.submenu').slideUp(200);
		}
	);
	
	//KENMERK FILTER SPUL
	//=====================================================
	$('.kenmerkfilter').live('change',function(){
		$('#nomore').html("");
		//get filter values and rework to array
		var filterme = "";
		$('.kenmerkfilter').each(function(){
			var km = '#'+$(this).attr('rel');
			var va = $(this).val();
			filterme += km+":"+va+",";	
		});
		filterme = filterme.substring(0,filterme.length-1);	
		var filterarray = filterme.split(',');

		//run by all products
		$('.productbox').each(function(){
			//make all products filterable again
			$(this).addClass('filterme');
			
			for(i=0; i<filterarray.length; i++){
				var fv = filterarray[i].split(':');
				//do not filter '0'
				if(fv[1] != "0"){
					//check all entered values (remove class if untrue)
					if($(this).find(fv[0]).text() != fv[1]){
		     			$(this).removeClass('filterme');
		     		} 
				}				
			}
		});
		$('.productbox').hide();
		$('.filterme').show();
		if($('.filterme').size() == 0){
			$('#nomore').html("Er zijn geen producten gevonden die voldoen aan je filter-instellingen...");
		}
	});
	
	/* resize filter block if it's multiline */
	var newh = $('#filterz').height()-14;
	if($('#filterz').html() != ""){
		$('#kenmerkfilter').css('margin-bottom',newh+'px');
	}




});