// JavaScript Document

function change_maingroup() {
	// init
	var old_value = 'xxx';
	var maingroup = $('#maingroup').val();
	var counter = 0;
	var template_value = '';
	
	//empty and hide depending comboboxes
	$('#template').show();  $('#template').empty();
	$('#subgroup').hide();  $('#subgroup').empty();
	$('#collection').hide();$('#collection').empty();
	$('#size').hide();      $('#size').empty();
	
	$('#template').append(
		$('<option></option>').val('').html(templatetext)
	);
	$('#template').append(
		$('<option></option>').val('').html('---------------------------------')
	);
	
	// loop through all combinations
	for (var i=0; i<gr.length; i++) {
		var current_group=gr[i];
		if (current_group.split('|')[0] == maingroup) {
			// yes, this is a valid combination
			var option_value = current_group.split('|')[5];
			var option_text = tpl[option_value];
			if (option_value != old_value) {
				counter++;
				if (counter == 1) {
					template_value = option_value;
				}
				$('#template').append(
					$('<option></option>').val(option_value).html(option_text)
				);
			}
			var old_value = option_value;
		}
	}
	
	// add manual option
	$('#template').append(
		$('<option></option>').val('m').html(tpl['m'])
	)
	
	// fill the next combobox
//	$('#template').val(template_value);
	if (template_value != 'm') {
//		change_template();
	}
	$('#button_search').hide();
}

function change_template() {
	// init
	var old_value = 'xxx';
	var maingroup = $('#maingroup').val();
	var template  = $('#template').val();
	var counter = 0;
	var subgroup_value = '';

	//empty and hide depending comboboxes
	$('#size').hide();      $('#size').empty();
	$('#collection').empty();$('#collection').hide();
	
	
	if (template != 'm') {
		$('#subgroup').empty();$('#subgroup').show();
		
		$('#subgroup').append(
			$('<option></option>').val('').html(subgrouptext)
		)
		$('#subgroup').append(
			$('<option></option>').val('').html('---------------------------------')
		)
		
		// loop through all combinations
		for (var i=0; i<gr.length; i++) {
			var current_group=gr[i];
			if (current_group.split('|')[0] == maingroup && current_group.split('|')[5] == template) {
				// yes, this is a valid combination
				var option_value = current_group.split('|')[1];
				var option_text = sg[option_value];
				if (option_value != old_value) {
					// only add one value
					counter++;
					if (counter == 1) {
						subgroup_value = option_value;
					}
					$('#subgroup').append(
						$('<option></option>').val(option_value).html(option_text)
					)
				}
				var old_value = option_value;
			}
		}
			
		// fill the next combobox
//		$('#subgroup').val(subgroup_value);
//		change_subgroup();
	} else {
		// manuals, hide subgroup
		$('#subgroup').empty();$('#subgroup').hide();
	}
	// enable or disable search button
	if ($('#template').val()=='m') {
		$('#button_search').show();
	} else {
		$('#button_search').hide();	
	}
}

function change_subgroup() {
	// init 
	var old_value = 'xxx';
	var maingroup = $('#maingroup').val();
	var template  = $('#template').val();
	var subgroup  = $('#subgroup').val();
	var counter = 0;
	var collection_value = '';
	
	//empty and hide depending comboboxes
	$('#size').hide();$('#size').empty();
	$('#collection').empty();$('#collection').hide();

	
	$('#collection').append(
		$('<option></option>').val('').html(collectietext)
	)
	$('#collection').append(
		$('<option></option>').val('').html('---------------------------------')
	)
	
	// loop through all combinations
	for (var i=0; i<gr.length; i++) {
		var current_group=gr[i];
		if (current_group.split('|')[0] == maingroup && current_group.split('|')[5] == template && current_group.split('|')[1] == subgroup) {
			// yes, this is a valid combination
			var option_value = current_group.split('|')[2];
			var option_text = cl[option_value];
			if (option_value != old_value) {
				counter++;
				if (counter == 1) {
					collection_value = option_value;
				}
				$('#collection').append(
					$('<option></option>').val(option_value).html(option_text)
				)
			}
			var old_value = option_value;
		}
	}
	
	// show or hide button
	if ($('#template').val()=='o' && $('#subgroup').val() != '') {
		$('#button_search').show();
	} else {
		$('#button_search').hide();	
	}
	
	// fill the next combobox
	if (template != 'o') {
		if (counter == 1) {
			// only one option
			// remove "select... options"
			$('#collection option[value=""]').remove();
			$('#collection').val(collection_value);
			change_collection();
		}
		$('#collection').show();
	}
	

}

function change_collection() {
	var maingroup = $('#maingroup').val();
	var template  = $('#template').val();
	var subgroup  = $('#subgroup').val();
	var collection  = $('#collection').val();
	var counter = 0;
	var size_value = '';
	//empty and hide depending comboboxes
	$('#size').show();$('#size').empty();
	
	$('#size').append(
		$('<option></option>').val('').html(groottetext)
	)	
	$('#size').append(
		$('<option></option>').val('').html('---------------------------------')
	)	
		
	for (var i=0; i<gr.length; i++) {
		var current_group=gr[i];
		if (current_group.split('|')[0] == maingroup && current_group.split('|')[5] == template && current_group.split('|')[1] == subgroup && current_group.split('|')[2] == collection) {
			// yes, this is a sub-option
			counter++;
			if (counter == 1) {
				size_value = option_value;
			}
			var option_value = current_group.split('|')[3];
			var option_text = option_value;
			$('#size').append(
				$('<option></option>').val(option_value).html(option_text)
			)
		}
	}

	// show or hide button
	if (counter > 1) {
		$('#button_search').hide();
	} else {
		// only one option
		// remove "Select a size" options
		$('#size option[value=""]').remove();
		
		// show button
		$('#button_search').show();	
		
		// no more need to show it
		$('#size').hide();
	}

}

function change_size() {
	if ($('#size').val() == '') {
		$('#button_search').hide();	
	} else {
		$('#button_search').show();	
	}
}


