$(document).ready(function(){

	//toggle delivery address group

	var $element = $('select[name="delivery_address_select"]');

	$element.change(function(){
		toggleDeliveryGroup($(this));
	});

	toggleDeliveryGroup($('select[name="delivery_address_select"]'));

	function toggleDeliveryGroup($element){

		if($element.val() == 1){
			$('#deliveryGroup').hide();
			$('#deliveryGroup input, #deliveryGroup select').addClass('ignore');
		} else {
			$('#deliveryGroup').show();
			$('#deliveryGroup input, #deliveryGroup select').removeClass('ignore');
		}
	}
});

$(document).ready(function(e){
	$('#frmAddToBasket').submit(function(e){
		$form = $(this);
		var size = $('select[name="size"]', $form).val();
		if(size <= 0){
			$.fancybox({
				content:['<h1>U geeft geen framemaat geselecteerd.</h1>',
				         '<p><button class="large" onclick="$.fancybox.close();"><span>Sluiten</span></button></p>',
				         '<h2>Hoe bepaald u de juiste framemaat?</h2>',
				         '<p><img src="/image/framemaat_fohn001.jpg" border="0" align="right">Wilt u straks na aflevering van uw fiets zeker van zijn dat u fiets lekker zit en fietst? Volg dan de volgende stappen:</p>',
				         '<ol>',
					         '<li>Ga zonder schoenen rechtop staan met de voeten  parallel en &plusmn; 15 cm uit elkaar</li>',
					         '<li>Meet de lengte van uw been (binnenzijde gemeten)</li>',
					         '<li>De uitkomst van deze lengte vermenigvuldigt u met 0,66<br>',
					         '<i>Voorbeeld: uw binnenbeenlengte is 86 cm (86 x 0,66 = 56,7). Vervolgens kiest u de framemaat die het dichtst bij deze uitkomst ligt.</i></li>',
				         '</ol>',
				         '<p>U kunt ook de framemaat van uw oude fiets opmeten. Dit is de afstand vanaf het einde van de zitbuis tot aan het hart van de trapas.</p>',
				         ].join("\n")
			});
			return false;
		}

		e.preventDefault();

		$.ajax({
			type: 'POST',
			cache: false,
			url: $form.attr('action'),
			data: $form.serializeArray(),
			json:true,
			success: function(data){
				if($('#frmAddToBasket input[name="actie"]').val() == 'compare'){
					document.location.href=data;
				} else {
					$.fancybox(data);
				}
			}
		});

		return false;
	});

	$('.fancybox').fancybox();
	$('.check-framesize').fancybox({
		'autoDimensions':false,
		'width':600,
		'height':450
	});

	$('#actionCompare').click(function(){
		$('#frmAddToBasket input[name="actie"]').val('compare');
	});

	$('#actionOrder').click(function(){
		$('#frmAddToBasket input[name="actie"]').val('order');
		setCookie('acc', '', 60);
	});

	$('.cloud-zoom-gallery').each(function(){
		eval('var a = {' + $(this).attr('rel') + '}');
		$(this).attr('gender', a.gender).attr('color', a.color);
	});

	$('.cloud-zoom-gallery').click(function(){
		var color = $(this).attr('color');
		var gender = $(this).attr('gender');

		$('input[name="gender"]').removeAttr('checked');
		$('input[name="gender"][value="'+gender+'"]').attr('checked', 'checked');

		$('select[name="color"]').val(color);

	});

	$('#deliveryMethod').change(function(){
		onChangeDeliveryMethod();
	});

	onChangeDeliveryMethod();

	registerCloseButtons();
});

function registerCloseButtons(){
	$('.close-modal').unbind().click(function(){
		$.fancybox.close();
		return false;
	});
}

function onChangeDeliveryMethod(){
	var total = 0.00;
	var totalPrice = parseFloat($('#totalPriceValue').val());

	var serviceCostValue = parseFloat($('#serviceCostValue').val());
	var nofBikes = parseFloat($('#nofBikes').val());

	var deliveryCostOne = parseFloat($('#deliveryCostOne').val());
	var deliveryCostMore = parseFloat($('#deliveryCostMore').val());

	var method = $('#deliveryMethod option:selected').val();

	var serviceCost = (serviceCostValue * nofBikes);
	var deliveryCost = 0;

	if(method == '1' && nofBikes >= 0){

		if(nofBikes == 1){
			deliveryCost += deliveryCostOne;
		} else {
			deliveryCost += deliveryCostMore;
		}
	}

	var bedragTotalServiceCost = formatBedrag(serviceCost);
	$('.servicekosten-update span').html('&euro; ' + bedragTotalServiceCost[0] + ',' + bedragTotalServiceCost[1]);


	total = totalPrice + deliveryCost + serviceCost;

	//totaal
	var bedrag = formatBedrag(total);
	$('.totaalprijs-update').html('Totaalbedrag (incl. btw): <span>&euro; <em>' + bedrag[0] + ',<em>' + bedrag[1] + '</em></em></span>');


	var bedragTotalServiceCost = formatBedrag(serviceCost + deliveryCost);
	$('.servicekosten-update span').html('&euro; ' + bedragTotalServiceCost[0] + ',' + bedragTotalServiceCost[1]);

}

function formatBedrag(total){
	total = (parseFloat(total) + '').split('.');

	total[1] = (typeof total[1] == 'undefined') ? '00' : total[1];
	if(total[1].length == 1){
		total[1] = total[1] + '0';
	}

	return total;
}

function ProductImages(){

	/* PRIVATE MEMBERS */

	var maleModels = new Array();
	var femaleModels = new Array();

	var me = this;

	/* PUBLIC METHODS */

	this.add = function(data){

		if(data.gender == 1){
			maleModels.push(data);
		} else {
			femaleModels.push(data);
		}
	}

	this.register = function(){

		$('#frmAddToBasket input[name="gender"]').change(function(){
			onChangeGender();
		});

		$('#frmAddToBasket select[name="color"]').change(function(){
			onChangeColor();
		});

		var me = this;

		$('#frmAddToBasket select[name="gear"]').change(function(){
			onChangeGears(me);
		});

		if(maleModels.length == 0){
			$('#frmAddToBasket label[for="gender1"]').hide();
			$('#frmAddToBasket input[name="gender"][value="1"]').hide();
		}

		if(femaleModels.length == 0){
			$('#frmAddToBasket label[for="gender2"]').hide();
			$('#frmAddToBasket input[name="gender"][value="2"]').hide();
		}

		$('#accessoires a.delete').click(function(e){
			onDeleteAccessory($(this), e);
		});

		onChangeGender();
	}


	this.updatePrice = function(){
		$form = $('#frmAddToBasket');
		var gender = $('input[name="gender"]:checked', $form).val();

		if(gender == 1){
			models = maleModels;
		} else {
			models = femaleModels;
		}

		gears = $('select[name="gear"] option:selected', $form).val();

		$.each(models, function(key, val){
			if(val.versnellingItemid == gears){
				$('#frmAddToBasket a.product span.prijs').html('<em class="oud">' + val.advies_prijs + '</em><em>' + val.aanbieding_prijs + '</em>')

				var accessoryTotals = 0;
				$('.inputAccessoryTotal').each(function(){
					accessoryTotals += parseFloat($(this).val());
				});

				var total = ((parseFloat(accessoryTotals) + parseFloat(val.aanbieding_prijs)) + '').replace('.', ',').split(',');

				var euro = total[0];
				var cent = typeof total[1] == 'undefined' ? '00' : total[1];
				if(cent.length == 1){
					cent += '0';
				}

				$('#frmAddToBasket .totaalprijs').html('Totaalprijs <span>&euro; <em>' + euro + ',<em>' + cent + '</em></em></span>')

				return false;
			}
		});
	}


	/* PRIVATE METHODS */

	var onChangeGender = function(){
		fillFields();
		updatePicture();

		me.updatePrice();
	}

	var onChangeColor = function(){
		updatePicture();
	}

	var onChangeGears = function(el){
		el.updatePrice();
	}

	var fillFields = function(){

		$form = $('#frmAddToBasket');
		var gender = $('input[name="gender"]:checked', $form).val();

		if(gender == 1){
			models = maleModels;
		} else {
			models = femaleModels;
		}

		var originalSize = $('select[name="size"] option:selected').attr('rel');
		var originalColor = $('select[name="color"] option:selected').attr('rel');

		$('select[name="size"]').find('option').remove();
		$('select[name="color"]').find('option').remove();

		var sizes = {};
		var colors = {};

		for(i=0;i<models.length;i++){
			model = models[i];

			sizes['_' + model.framemaatItemid] = {itemid:model.framemaatItemid, framemaat:model.framemaat};
			colors['_' + model.colorItemid] = {itemid:model.colorItemid, color:model.color};
		}

		$('select[name="size"]').append('<option value="-1">Kies uw framemaat</option>');
		$.each(sizes, function(key, value){
			$('select[name="size"]').append('<option rel="' + value.framemaat + '" value="' + value.itemid + '">' + value.framemaat + '</option>');
		});

		$.each(colors, function(key, value){
			$('select[name="color"]').append('<option rel="' + value.color + '" value="' + value.itemid + '">' + value.color + '</option>');
		});

		$('select[name="size"] option[rel="' + originalSize + '"]').attr('selected', 'selected');
		$('select[name="color"] option[rel="' + originalColor + '"]').attr('selected', 'selected');

	}

	var updatePicture = function(){
		$form = $('#frmAddToBasket');
		var gender = $('input[name="gender"]:checked', $form).val();

		if(gender == 1){
			models = maleModels;
		} else {
			models = femaleModels;
		}

		var color = $('select[name="color"] option:selected', $form).attr('rel');
		$.each(models, function(key, val){
			if(val.color == color){
				$('#zoom img').attr('src', '/' + val.largeFile);
				$('#zoom').attr('href', '/' + val.zoomFile);
				if(val.imageAvailable){
					$('#zoom').CloudZoom();
				} else {
					$('#zoom').CloudZoom(); //?
				}
				return false;
			}
		});
	}

}

function onDeleteAccessory(el, e){
	e.preventDefault();

	eval('var data = {' + el.attr('rel') + '}');
	var aid = data.accessoryId;

	newItems = deleteItemFromCookie(aid);

	$('#accessoires').load('/include/php/inc.accessories.php?acc=' + newItems.join(','), function(){
		onChangeAccessories();

		$('#accessoires a.delete')
			.unbind()
			.click(function(e){
				return onDeleteAccessory($(this), e);
			});
	});

	return false;
}

function onChangeAccessories(){
	productImages.updatePrice();
}

function getItemsFromCookie(){
	var items = getCookie('acc');
	if(items){
		items = items.split(',');
	} else {
		items = new Array();
	}
	return items;
}

function addItemToCookie(id){
	var items = getItemsFromCookie();
	items.push(id);
	items = $.unique(items);
	setCookie('acc', items.join(','), 60);

	return items;
}

function deleteItemFromCookie(id){

	var items = (getCookie('acc') || '').split(',');
	var newItems = new Array();
	$.each(items, function(key, val){
		if(val != id){
			newItems.push(val);
		}
	});

	setCookie('acc', newItems.join(','), 60);

	return newItems;
}

function registerAccessoryButtons(){

	$('.accessoires-container .voeg-toe, .accessoires-container .toegevoegd').click(function(e){
		e.preventDefault();
		var aBtn = $(this);

		eval('var data = {' + aBtn.attr('rel') + '}');

		//toevoegen
		if(aBtn.hasClass('voeg-toe')){
			items = addItemToCookie(data.accessoryId);

			aBtn
			.removeClass('voeg-toe')
			.addClass('toegevoegd')
			.html('<span>Toegevoegd</span><em>Verwijder</em>')
			;

			$('#accessoires').load('/include/php/inc.accessories.php?acc=' + items.join(','), function(){
				onChangeAccessories();

				$('#accessoires a.delete')
				.unbind()
				.click(function(e){
					return onDeleteAccessory($(this), e);
				});
			});
		} else {
			onDeleteAccessory($(this), e);
			items = getItemsFromCookie();

			aBtn
			.removeClass('toegevoegd')
			.addClass('voeg-toe')
			.html('<span>Voeg toe</span>')
			;
		}

		return false;
	});
}

var productImages = new ProductImages();