var stock = "";
var tamponKleuren = new Array('zwart', 'wit', 'lichtblauw', 'donkerblauw', 'groen', 'rood', 'geel', 'goud', 'zilver','pms');

$(function() 
{	
	var aantal 		= $("#aantal"),
		cliche 		= $("input[name='cliche']"),
		kleuren 	= $("#kleuren"),
		bedrukking 	= $("input[name='bedrukking']"),
		drukkeuze 	= $("select[name='drukkeuze']"),
		allFields 	= $([]).add(aantal).add(cliche).add(bedrukking).add(drukkeuze),
		tips 		= $("#validateTips"),
		prijs 		= $("#prijs").val(),
		handling 	= $("#handling").html(),
		xOpdruk     = $("#xOpdruk"),
		kleur_2     = $('#kleuren_2'),
		typeXopdruk = $('input[name=typeXopdruk]'),
		xOpdrukDrukKleur = $('select[name=xOpdrukDrukKleur]'),
		
		bedrukkingI = false,
		aantalDruk	= $("select[name='drukkeuze'] option").size(),
		keuzeI 		= $("select[name='drukkeuze'] option:first").val(), //(aantalDruk > 1) ? "0" : 
		aantalI 	= "0",
		kleurenI 	= "1",
		clicheI 	= "1",
		oppI		= ($("#opp").size() > 0 ) ? $("#opp").val() : 0,
		oppI2       = ($("#opp2").size() > 0) ? $("#opp2").val() : 0,
		totaalBed	= 0,
		
		drukkleur1 	= "",
		drukkleur2 	= "",
		
		pms1 		= false,
		pms2 		= false,
		
		height 		= 710,
		cat			= $("#categorie option:selected").attr('label'),
		
		fabricant	= $("#FAB").html(),
		min_afname	= parseInt($("#min_afname").html()),
		
		batterij 	= ( $('#batterij').length ) ? parseFloat( $('#batterij').html()) : 0,
		lamp 		= ( $('#lamp').length ) ? parseFloat( $('#lamp').html()) : 0,
		recupel     = ( $('#recupel').length ) ? parseFloat( $('#recupel').html() ) : 0,
		
		gewicht     = $('input[name=gewicht]').val();
		
	    staffel		= (fabricant == "MOB") ? ( $(".CATstaffel").attr('title') ).split('_') : 100000,
		staffelKort = 0,
		eenheidsprijs = prijs;
	
	// opent dialoog met extra info over de bijdrage kost
	$(".bijdrage").bijdrage();
	
	// opent dialoog met de staffelprijzen
	$(".CATstaffel").showStaffel();
	
	// opent dialoog met info over de druktechnieken
	$(".drukInfo").drukInfo();
	
	$('.leveringskostenBekijken').hide();
	$('.leveringskostenBekijken').click(function() {
		$('.totaalLeveringskost').show();
	});
	
	
	$("#BerekenPrijsForm").keypress(function(e) { if(e.which == 13){ return false; } });
	
	// als men over kleine foto's gaat, toont men de grote
	$("#artThumbs li").changeImage();
	
	if($("#colorList li").size() == 1)
	{
		if($('#dialog-stock table td.stock').html() != "op aanvraag")
		{
			stock = parseInt($('#dialog-stock table td.stock').html());
		}else{
			stock = "aanvraag";
		}
	}
	
	
	$(".UMAtech").each(function(index, item)
	{	
		var art = $(item).attr('rel');
		
		var src = $url+'/assets/prod/UMA/tec/'+ art +'.jpg';
		var content = $("<img/>").attr({'src': src});
			
		$(item).qtip(
		{
			 content: content,
			 position: {
			  	corner: {
				 	target: 'bottomLeft',
				 	tooltip: 'bottomRight'
			  	}
		   	},
			style: { width: { max: 550 } }
		});
	});
	
	$(".help").click(function()
	{
		drukID = $(this).parent().attr('title');
		help = $(this);
		
		$.post( $url+"/druk/help",
		{ 
			druk: drukID
		},
		function(data)
		{
			/*help.qtip(
			{
				 content: data,
				 show: { delay: 0 },
				 position: { target: 'mouse', adjust: { mouse: true, y:-70, x: -370 } },
				 style: { width: { max: 350 } }
			});*/
			var dialog = $('<div />').attr('title', 'Wat is dit?')
									 .html(data)
									 .dialog({
									 	modal : false,
										width: 300,
										height: 500,
										buttons: {
											'Sluit' : function() {
												$(this).dialog('destroy').remove();
											}
										}
									 });
			
			
		});
	});
	
	$('#kleurKeuze').changeColor();
	
	$("#dialog-artikel").dialog({
		bgiframe: true,
		autoOpen: false,
		height: height,
		width: 700,
		modal: true,
		position: [400,20],
		buttons: {
			
			'Cancel': function() {
				
				$(this).dialog('close');
				$("#dialog-drukInfo").dialog('close');
			},
			
			'Print uw offerte': function() {
				
				if(aantal.val() != "") {
					window.print();
				}else{
					alert("Gelieve een aantal op te geven.");
				}
			},
		
			'Bestel dit artikel': function() { 
					
				controleSubmit('bestelling');
			}
		},
		close: function() {
			allFields.val('').removeClass('ui-state-error');
			$("#dialog-drukInfo").dialog('close');
		}
	});
	
	$("#dialog-stock").dialog({
		bgiframe: true,
		autoOpen: false,
		height: 200,
		width: 250,
		modal: true,
		buttons: {
			'Sluit': function() 
			{
				$(this).dialog('close');
			}
		},
		close: function() {
			allFields.val('').removeClass('ui-state-error');
		}
	});
	
	
	// als role = 5 offerte knop toevoegen aan het dialoog venster
	if(role == '5') {	
		
		var buttons = $('#dialog-artikel').dialog('option', 'buttons'); 
		
		buttons['offerte'] = { text: "Offerte", click: function() { controleSubmit('offerte')  } }; 
		
		$('#dialog-artikel').dialog('option', 'buttons', buttons); 
		
	}
	
	//methods
	aantal.checkINT().keyup(function()
	{
		aantalI = aantal.val();
		var gewichtT = aantalI * gewicht;
		var leveringsKostItem = 0;
		
		$("#aantal-element span, #aantal-element br").remove();
		
		if(parseInt(aantalI) > stock && stock != "" && stock != "aanvraag")
		{
			$("dd#aantal-element").append("<br/><span style='color:white;font-size:0.9em'>slechts <b>"+ stock +"</b> in stock</span>");
		}
		
		$("#berekenPrijs .berekenAan").html(aantalI +" x "+ prijs);
		$("#berekenPrijs .totaalArt").html("&euro; " + (prijs * aantalI).toFixed(2));
		
		if (gewichtT > 30) {
			leveringsKostItem = 45;
		} else {
			leveringsKostItem = 15;
		}
		
		$('.totaalLeveringskost').html('&euro; ' + leveringsKostItem.toFixed(2));
		
		
		
		if(aantalI >= parseInt(staffel[0]))
		{
			if (! $('#Artstaffel').length ) { 
				var tr = $('.totaalArt').parent();
				$('<tr/>').attr({'id': 'Artstaffel'}).html('<th colspan="2">Staffelkorting:</th><td id="staffelKorting"></td>').insertAfter(tr);
			}
			
			if(aantalI >= parseInt(staffel[0]) * 1.5){
				if(aantalI >= parseInt(staffel[0]) * 2){
					staffelKort = (( 1 - parseFloat(staffel[3])) * prijs ).toFixed(2) * aantalI;
					eenheidsprijs = (parseFloat(staffel[3]) * prijs ).toFixed(2);
				}else{
					staffelKort = ((1 - parseFloat(staffel[2]))  * prijs).toFixed(2) * aantalI;
					eenheidsprijs = (parseFloat(staffel[2]) * prijs ).toFixed(2);
				}
			}else{
				staffelKort = ( (1 - parseFloat(staffel[1])) * prijs).toFixed(2) * aantalI;
				eenheidsprijs = (parseFloat(staffel[1]) * prijs ).toFixed(2);
			}
			$("#staffelKorting").addClass('right').html("- &euro; "+ (staffelKort).toFixed(2) ); 
			
		}else{
			$("#Artstaffel").remove(); 
			staffelKort = 0;
		}
		
		
		
		if(batterij > 0 || lamp > 0 || recupel > 0)
		{
			$('.berekenBij').html( aantalI+ " x "+ (batterij + lamp + recupel).toFixed(3)  );
			$('.totaalBij').html("&euro; " +  (aantalI * ( batterij + lamp + recupel)).toFixed(3)); 
		}


		if (parseInt(aantalI) > 0) {
			$('.leveringskostenBekijken').show();
		} else {
			$('.leveringskostenBekijken').hide();
			$('.totaalLeveringskost').hide();
		}
		
		
		if(bedrukkingI == 1)
		{ 
			getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI); 
		}else{
			berekenTotaal();
		}
	});
	
	
	function controleSubmit(actie) {
		
		kleur = ($('#kleurKeuze').is("*")) ? $('#kleurKeuze').val() : "0";
		typeOpdruk = $('input[name=typeXopdruk]:checked').val();
		
		drukkleur1 = (!$('#drukkleur1').val()) ? "" : $('#drukkleur1').val();
		drukkleur2 = (!$('#drukkleur2').val()) ? "" : $('#drukkleur2').val();
		
		if (isNaN( kleur_2.val() )) {
			kleurenI = parseInt(kleurenI) + parseInt(kleur_2.val());
		}
		
		if (isNaN(kleurenI)) {
			kleurenI = "0";
		}
		
		if(cat == 'golf' || kleur != "0") {
			
			if(aantal.val() != "") {
				
				if(cat == 'golf' || (parseInt(aantal.val()) < stock) || stock == "aanvraag") {
					
					if(fabricant == 'UMA' && parseInt(aantal.val()) < min_afname) {
						
						alert("Minimum afname van dit artikel is " +min_afname + " stuks");		
					}else{
						var totaalBed = $("#drukPrijs").val();
						
						
						$.post($url + "/bestellijst/add-item", { 
						
							artID: $('#artID').html(), kleur: kleur, aantal: aantalI, bedrukt: bedrukkingI, drukkeuze: keuzeI, kleuren: kleurenI, kleuren2: kleur_2.val(), drukkleur1: drukkleur1, drukkleur2: drukkleur2, cliche: clicheI, opp: oppI, bedrukking: 1, drukPrijs: totaalBed, eenheidsprijs: eenheidsprijs, actie: actie, recupel: recupel, batterij: batterij, zaklamp: lamp, gewicht: gewicht, opdrukType: typeOpdruk 
						},
						function(data) {
								
							if(actie == 'offerte') {
								var oiID = data;
								$("#dialog-artikel").html('<h4>Aan welke offerte moet dit item toegevoegd worden</h4><input type="radio" name="offerte_naam" value="new"/><label>Nieuwe offerte: <input type="text" id="nieuweOfferte"/><label><hr/>Bestaande offertes:<br/>')
														 
								$.getJSON($url + "/admin/offerte/get-offertes", 
									
									{ },
									
										function(data) {
											
											$.each(data, function(index, value) { 
												
												$('<input type="radio" name="offerte_naam" value="'+ value +'"/><label>'+ value + '<label><br/>').appendTo("#dialog-artikel");
											});
											var options = { buttons: {
															
															'Cancel': function() {
																
																$(this).remove();
															},
															
															'Voeg toe': function() {
																	
																var offerte_naam = $('input[name="offerte_naam"]:checked').val();
																offerte_naam = (offerte_naam == 'new') ? $('#nieuweOfferte').val() : offerte_naam;
																
																$.post($url + "/admin/offerte/insert-offerte", 
																
																	{ orderItems_id: oiID, offerte_naam: offerte_naam },
																	
																		function(data) {
															
																			if(data){
																			
																				$("#dialog-artikel").html("<h4>Artikel werd toegevoegd</h4><a href='"+$url+"/bestellijst/'>Bekijk overzicht van uw offerte</a><br/><a href='"+$url+"/cataloog'>De cataloog verder bekijken.</a></p>");
																				var options = { buttons: { } };
																				
																				$("#dialog-artikel").dialog('option', options);
																			}
																			
																		}
																)
															
															},
														} 	
												};
											$("#dialog-artikel").dialog('option', options);
										});
							
							}else{
								if(data) {
									
									$("#dialog-artikel").html("<h4>Bedankt, dit artikel werd in uw winkelmandje geplaatst. <a href='"+$url+"/bestellijst/'>Verder naar kassa</a></h4><p><a href='"+$url+"/bestellijst/'>Bekijk overzicht van uw bestelling</a><br/><a href=''>De cataloog verder bekijken.</a></p>");
									var options = { buttons: { } };
									$("#dialog-artikel").dialog('option', options);
								}
							}
							
						});
					}
				}else{
					alert("Er zijn slechts "+ stock +" artikels in stock. Gelieve uw aantal aan te passen!");
					$(aantal).focus();
				}
			}else{
				alert("Gelieve een aantal op te geven.");
				$(aantal).focus();
			}
		}else{
			alert("Gelieve een kleur aan te duiden");
			$('#kleurKeuze').focus();
		}
	}
	
	function berekenTotaal()
	{
		var totaal = prijs * aantalI + totaalBed - staffelKort;
		
		if( batterij > 0 || lamp > 0 || recupel > 0)
		{
			totaal+= aantalI * ( batterij + lamp + recupel);	
		}
		
		$('#totaal').html("&euro; " + (totaal).toFixed(2));
		$('#btw').html("&euro; " + (totaal * 0.21).toFixed(2));
		$('#alltotaal').html("&euro; " + (totaal * 1.21).toFixed(2));
	}
	
	function getDruk(drukkeuze, aantal, kleuren, cliche, handling, opp) // :)
	{
		
		var xOpdruk = $("#xOpdruk").val(),
			kleuren2 = kleur_2.val();
			
		if (oppI2 != 0 && oppI2) {
			opp = parseInt(opp) + parseInt(oppI2);
		}
		
		//console.log(oppI2);
		
		if(drukkeuze != 'X')
		{
			$.getJSON($url + "/druk/get-druk/module/default",
			{ 
				drukkeuze: drukkeuze, aantal: aantal, kleuren: kleuren, cliche: cliche, handling: handling, opp: opp, xOpdruk: xOpdruk, kleuren_2: kleuren2
			},
			function(data)
			{
				$("#berekenPrijs .berekenPrijs:eq(0)").html("&euro; "+ data.instelKost);
				$("#berekenPrijs .berekenPrijs:eq(1)").html("&euro; "+ data.clicheKost);
				drukKost = parseFloat(data.drukKost);
				drukKost += (pms1) ? 17 : 0;
				drukKost += (pms2) ? 17 : 0;
				$("#berekenPrijs .berekenPrijs:eq(2)").html("&euro; "+ drukKost);
				$("#berekenPrijs .berekenPrijs:eq(3)").html("&euro; "+ data.handlingKost);
	 
				totaalKost = parseFloat(data.totaal);
				totaalKost += (pms1) ? 17 : 0;
				totaalKost += (pms2) ? 17 : 0;
				$("#berekenPrijs #totaalBed").html("&euro; "+ (totaalKost).toFixed(2));
				
				$("#drukPrijs").val(totaalKost);
				
				totaalBed = totaalKost;
				berekenTotaal();
			});
		}else{
			artDruk = parseFloat( ($(".drukcode").html()).replace("X-", "") );
			totaalBed = artDruk * aantalI;
			$("#berekenPrijs #totaalBed").html("&euro; "+ (totaalBed).toFixed(2));	
			
			berekenTotaal();
		}
	}
	
	bedrukking.change(function()
	{
		bedrukkingI = ($("#bedrukking-1").attr('checked')) ? "1" : "0";
		
		var drukCodeText = (drukkeuze.val() != 0) ? '(' + drukkeuze.val() + ')' : '';
		
		$('.bedrukking-selected').html(drukCodeText);
		
		if(bedrukkingI == 1)
		{	
		
			$("#BerekenPrijsForm").find('.hTr:not(:last)').removeClass('hTr');
			$("#BerekenPrijsForm").find('.hTr:last').addClass('hTr');
			$("#BerekenPrijsForm").find('.hTr:last').prev().addClass('hTr');
			//$("#BerekenPrijsForm").find('.hTr:last').prev().prev().prev().addClass('hTr');
			
			$("#opp").removeAttr("disabled").keyup(function(){ oppI = $(this).val(); getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI); });
			$("#drukkleur1").removeAttr("disabled")
							.change(function()
							  {
								 pms1 = ($(this).val() == "pms") ? true : false; 
								 drukkleur1 = $(this).val();
								 
								 getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
							  });
			kleuren.removeAttr("disabled");
			drukkeuze.removeAttr("disabled");
			cliche.removeAttr("disabled");
			
			// keer testen he
			if(keuzeI== 'P1' || keuzeI == 'P2' || keuzeI == 'P3') {
				if($('#drukkleur1').length == 0)
				{
					$('#kleuren').parent().parent().after('<tr><td id="drukkleur-label"><label disableFor="1" class="required">Druk kleur:</label></td><td id="drukkleur-element"></td></tr>');
					
					var select = $("<select/>").attr({'id': 'drukkleur1'});
					
					$.each(tamponKleuren, function(index, value)
					{
						if(value != "pms")
						{
							$("<option/>").html(value).attr({'value': value }).appendTo(select);
						}else{
							$("<option/>").html('eigen PMS (+&euro;17)').attr({'value': value }).appendTo(select);
						}
					});
					
					select.appendTo($('#drukkleur-element'))
						  .change(function()
						  {
							 pms1 = ($(this).val() == "pms") ? true : false; 
							 getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
							 
							 drukkleur1 = $(this).val();
						  });
				}
				// eidne test
			}
			
			
			
			if(aantalDruk == 1 || keuzeI != "1"){ 
				getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI); 
			}
			//drukkeuze.change();
		}else{
			kleuren.parent().parent().addClass('hTr');
			drukkeuze.parent().parent().addClass('hTr');
			cliche.parent().parent().parent().addClass('hTr');
			xOpdruk.parent().parent().addClass('hTr');
			kleur_2.parent().parent().addClass('hTr');
			typeXopdruk.parent().parent().parent().addClass('hTr');
			//xOpdrukDrukKleur.parent().parent().parent().addClass('hTr');
			
			$("#drukkleur1, #opp").parent().parent().addClass('hTr');
			
			$("#berekenPrijs .berekenPrijs:eq(0)").html("&euro; 0");
			$("#berekenPrijs .berekenPrijs:eq(1)").html("&euro; 0");
			$("#berekenPrijs .berekenPrijs:eq(2)").html("&euro; 0");
			$("#berekenPrijs .berekenPrijs:eq(3)").html("&euro; 0");
			$("#berekenPrijs #totaalBed").html("&euro; 0");
			
			totaalBed = 0;
			$('#drukPrijs').val('');
			berekenTotaal();
		}
		
	});
	
	
	kleuren.change(function()
	{ 
		kleurenI = $("#kleuren").val();
		
		if(keuzeI== 'P1' || keuzeI == 'P2' || keuzeI == 'P3')
		{
			if($('#drukkleur2').length == 0 && kleurenI == 2)
			{
				$('#drukkleur1').parent().parent().after('<tr><td id="drukkleur2-label"><label disableFor="1" class="required">Tweede kleur:</label></td><td id="drukkleur2-element"></td></tr>');
			
				var select = $("<select/>").attr({ 'id': 'drukkleur2' });
				
				$.each(tamponKleuren, function(index, value)
				{
					if(value != "pms")
					{
						$("<option/>").html(value).attr({'value': value }).appendTo(select);
					}else{
						$("<option/>").html('eigen PMS (+&euro;17)').attr({'value': value }).appendTo(select);
					}
				});
				
				select.appendTo($('#drukkleur2-element'))
					  .change(function()
					  {
						 pms2 = ($(this).val() == "pms") ? true : false; 
						 drukkleur2 = $(this).val();
						 
						 getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
					  });
				
				  
				
			}else{
				$('#drukkleur2, #drukkleur2-label').parent().remove();
			}
		}
		
		kleur_2.html($('#kleuren').html());
		getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
	});
	
	
	cliche.change(function()
	{ 
		clicheI = ($("#cliche-1").attr('checked')) ? 1 : 0;
		getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
	});
	
	xOpdruk.change(function() {
		
		$('#opp2-label').remove();
		$('#opp2-element').remove();
		
		if ($(this).val() == 2) {
			kleur_2.removeAttr('disabled').parent().parent().removeClass('hTr');
			xOpdrukDrukKleur.removeAttr('disabled').parent().parent().removeClass('hTr');
			
			if(keuzeI== 'E' || keuzeI == 'TD' || keuzeI == 'DL') {
				if($('#opp2').length == 0){
				
				$('#kleuren_2-label').parent().after('<tr><td id="opp2-label"><label disableFor="1" class="required">Druk opp (max.):</label></td><td id="opp2-element"><input type="text" size="3" id="opp2">cm&sup2;</td></tr>');
				
				var drukOpp = ($("#drukOpp").html()).split("x");
				
				oppI = Math.round((parseFloat(drukOpp[0]) * parseFloat(drukOpp[1]))/100);
				oppI2 = oppI;
				
				$('#opp2').val(oppI).keyup(function() { 
					oppI = $('#opp').val();
					oppI2 = $(this).val();
					getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI); 
				});
				
				}
			} else {
				oppl = 0;
			}
			
			
		} else {
			kleur_2.parent().attr('disabled', 'disabled').parent().addClass('hTr');
			xOpdrukDrukKleur.parent().parent().addClass('hTr');
			oppI2 = 0;
		}
		
		if ($(this).val() == 0) {
			typeXopdruk.parent().parent().parent().addClass('hTr');
			oppI = $('#opp').val();
			oppI2 = 0;
		} else {
			typeXopdruk.parent().parent().parent().removeClass('hTr');	
		}
		
		kleur_2.html($('#kleuren').html());
		getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
		
	});
	
	/*xOpdrukDrukKleur.change(function() {
		
		var waarde = $(this).val();
		alert(waarde);
		
	});*/
	
	kleur_2.change(function() {
		
		var aantal_kleuren = $(this).val();
				
		//alert(aantal_kleuren);
		
		getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
	});
	
	drukkeuze.change(function()
	{ 
		keuzeI = $('#drukkeuze').val();
		
		var drukCodeText = (drukkeuze.val() != 0) ? '(' + drukkeuze.val() + ')' : '';
		
		$('.bedrukking-selected').html(drukCodeText);
	
		var maxKleuren = $("td[title='"+keuzeI+"'] span").html();
		$('#kleuren option').remove();
		
		if(keuzeI== 'E' || keuzeI == 'TD' || keuzeI == 'DL')
		{
			if($('#opp').length == 0){
				
				var drukOpp = ($("#drukOpp").html()).split("x");
				
				oppI = Math.round((parseFloat(drukOpp[0]) * parseFloat(drukOpp[1]))/100);
				
				$('#kleuren-label').parent().after('<tr><td id="opp-label"><label disableFor="1" class="required">Druk opp (max.):</label></td><td id="opp-element"><input type="text" size="3" id="opp">cm&sup2;</td></tr>');
				
				if (xOpdruk.val() == 2) {
					$('#kleuren_2-label').parent().after('<tr><td id="opp2-label"><label disableFor="1" class="required">Druk opp (max.):</label></td><td id="opp2-element"><input type="text" size="3" id="opp2">cm&sup2;</td></tr>');
					oppI2 = oppI;
				}			
	
				
				$('#opp2').val(oppI); //fixed
				$('#opp').val(oppI).keyup(function(){ 
					oppI = $(this).val(); 
					oppI2 = $('#opp2').val(); 
					//$(this).keyyp();
					getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI); 
				});
			}
			
		}else if(keuzeI== 'P1' || keuzeI == 'P2' || keuzeI == 'P3'){
			$('#opp-label').remove();
			$('#opp-element').remove();
			
			$('#opp2-label').remove();
			$('#opp2-element').remove();
			
			if($('#drukkleur1').length == 0)
			{
				$('#kleuren').parent().parent().after('<tr><td id="drukkleur-label"><label disableFor="1" class="required">Druk kleur:</label></td><td id="drukkleur-element"></td></tr>');
				
				var select = $("<select/>").attr({'id': 'drukkleur1'});
				
				$.each(tamponKleuren, function(index, value)
				{
					if(value != "pms")
					{
						$("<option/>").html(value).attr({'value': value }).appendTo(select);
					}else{
						$("<option/>").html('eigen PMS (+&euro;17)').attr({'value': value }).appendTo(select);
					}
				});
				
				select.appendTo($('#drukkleur-element'))
					  .change(function()
					  {
						 pms1 = ($(this).val() == "pms") ? true : false; 
						 getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
						 
						 drukkleur1 = $(this).val();
					  });
					  
			}
		}else{
			$('#opp-label').remove();
			$('#opp-element').remove();
			$('#opp2-label').remove();
		    $('#opp2-element').remove();
			$('#drukkleur-label').parent().remove();
			$('#drukkleur2-label').parent().remove();
		}
		
		for (var x = 1; x <= maxKleuren; x++){
			if(x == 1){ kleurenI = 1; }
	   		$("<option/>").val(x).html(x).appendTo('#kleuren');
	   	}

		getDruk(keuzeI, aantalI, kleurenI, clicheI, handling, oppI);
	});
	
	
	$('.artRow').click(function() {
		var artikel = $(this).children(':eq(0)').html();
		var aantal = $(this).children(':eq(2)').html();
		var titel = $(this).children(':eq(1)').html();
		var id = $(this).attr('id');
	  
		$('#dialog-artikel #top img').attr({'src': '/media/artikels/'+ artikel+'.jpg'});
		
		$.getJSON($url + "/bestellijst/get-item",
		{ 
			id: id, aantal: aantal
		},
		function(data)
		{
			var tech = $('#bottom #tech');
			tech.children('h3:first').html(titel);
			tech.children('p:first').html(data.NLlang);
			tech.children('span:eq(0)').html(data.artID);
			tech.children('span:eq(1)').html(data.afmetingen);
			tech.children('span:eq(2)').html(data.printopp);
		});	
		
		$('#dialog-artikel').dialog('open');
	})
	
	$('.berekenDrukwerk, #bekijkStock').button()
		.mousedown(function(){
		$(this).addClass("ui-state-active");
		if($(this).attr('id') == 'bekijkStock')
		{
			$('#dialog-stock').dialog('open');
		}else if($(this).hasClass('berekenDrukwerk')){
			$('#dialog-artikel').dialog('open');
		}
	})
});


$(function()// als men over kleur gaat, foto veranderen
{
	$('ul#colorList li span').mouseover(function()
	{
		var kleurcode = $(this).html(),
			activeSpan = $('ul#colorList li span.selected'),
			activeKleur = activeSpan.html();
		
		activeSpan.removeClass('selected');
		$(this).addClass('selected');
		
		$(".kleurID").html("-"+kleurcode);
		
		stockArt = $('#artID').html() + "-" + kleurcode;
		stock = $('#dialog-stock table td:contains('+stockArt+')').next().html();
		stock = (stock != "op aanvraag") ? parseInt(stock) : "aanvraag";
		
		$('.itemImage').each(function(index, item)
		{	
	 		$(item).attr({ 'src': $(item).attr('src').replace('_' + activeKleur, '_' + kleurcode) });
			$('#kleurKeuze').val(kleurcode);
		});
	});
});


$.fn.showStaffel = function()
{
	return this.click(function()
	{
	
		var staffel = ($("#FAB").html() == "MOB") ? ( $(".CATstaffel").attr('title') ).split('_') : 100000;
		var div = $("<div/>").attr({ 'class': 'staffelPrijzen', 'title': 'Staffel kortingen' })
							 .appendTo('#content')
							 .dialog({
								resizable: false,
								height:140,
								modal: true,
								position: [700,150],
								buttons: {
									"Sluit": function() {
										$( this ).dialog( "close" );
									}
								}
							});
	
		var table = $("<table/>").html('<tr><th>1</th><th>+ '+staffel[0]+'</th><th>+ '+parseInt(staffel[0]) * 1.5 +'</th><th>+ '+parseInt(staffel[0]) * 2 +'</th></tr>').attr({'width': '100%', 'cellspacing': '0'}).appendTo(div);
		
		var prijsFloat = parseFloat($("#prijs").val());
		
		$('<tr/>').html('<td>&euro; '+prijsFloat+'</td><td>&euro; '+(prijsFloat * parseFloat(staffel[1])).toFixed(2)+'</td><td>&euro; '+(prijsFloat * parseFloat(staffel[2])).toFixed(2)+'</td><td>&euro; '+(prijsFloat * parseFloat(staffel[3])).toFixed(2)+'</td>').appendTo(table);
	});
}


$.fn.checkINT = function()
{
	return this.bind('keypress', function(e) 
	{
		var charCode = e.keyCode;
		
       	if (charCode > 31 && (charCode < 48 || charCode > 57)) {
        	return false;
		}
		
		if(($(this).val()).length > 5) {
			return false;
		}
	});
}


$.fn.changeColor = function() {
	
	return this.change(function() {
		
		var kleurcode = $(this).val(),
			activeSpan = $('ul#colorList li span.selected'),
			activeKleur = activeSpan.html();
		
		if(kleurcode != "0") {
			
			stockArt = $('#artID').html() + "-" + kleurcode;
			
			stock = $('#dialog-stock table td:contains('+stockArt+')').next().html();
			stock = (stock != "op aanvraag") ? parseInt(stock) : "aanvraag";
			
			activeSpan.removeClass('selected');
			
			$('ul#colorList li span:contains('+ kleurcode +')').addClass('selected');
			
			$(".kleurID").html("-"+kleurcode);
			
			$('.itemImage').each(function(index, item) {	
			
				$(item).attr({ 'src': $(item).attr('src').replace('_' + activeKleur, '_' + kleurcode) });
				$('#kleurKeuze').val(kleurcode);
			});
		}
	});
}


$.fn.changeImage = function() {

	return this.mouseover(function() {
	
		var src = ($(this).find('img').attr('src')).replace('thu', 'img');
		
		$("#itemImage").attr({ 'src': src });
	})
}


$.fn.bijdrage = function()
{
	return this.click(function()
	{
		var div = $('<div/>').attr({ 'title': 'Bijdrage taksen' })
							 .appendTo('body')
							 .dialog({ width:750, height:460, modal: true,
								buttons: {
									"Sluit": function() {
										$( this ).dialog( "close" );
									}
								}});
		
		$.get($url + '/cataloog/taksen', function(data) 
		{
			$(div).html(data);
		});
	})
}


$.fn.drukInfo = function()
{
	return this.click(function()
	{
		var drukcodes = $('#ber').attr('rel'),
			div       = $('<div/>').attr({  'title': 'Bedrukkingstechnieken', 'id': '#dialog-drukInfo' } )
								 .appendTo('body')
								 .dialog({ 
								 		bgiframe: true,
										height: 530,
										width: 270,
										position: [100,60], 
										modal: false,
										buttons: {
											"Sluit": function() {
												$( this ).dialog( "close" );
												}
											}
										});
			
		$.get($url + '/cataloog/druk-info', { drukcodes: drukcodes }, function(data) 
		{
			$(div).html(data);
		});
	});
}