jQuery( function( $ ) {
	
	//add setup when only one Incontinention line that the removeIncontinention button can be hide.
	var dbmaterialCount = $("#dbmaterial div.dbmaterial").length;
	if (dbmaterialCount == 1) {
		$(".removeDiabetics").hide();
	}	
	
	$("input[name$='[type]']").on('focusout', nameChangesOnfocusOut);

	//koppelen aan de id addIncontinention
	$('#addDiabetics').on('click', function() { 
		//wanneer maar 1 materialregel deze wel weer gaan tonen omdat er straks 1 bij gaat komen
		var dbmaterialCount = $("#dbmaterial div.dbmaterial").length;
		if (dbmaterialCount == 1) {
			$(".removeDiabetics").show();
		}

		//clonen van de eerste
		var newDiabeticsLine= $("#dbmaterial div.dbmaterial").eq(0).clone(false);

		//dynamicly add event handlers because we clone with no even handlers
		newDiabeticsLine.find('.removeDiabetics').on('click', removeDiabetics);
		newDiabeticsLine.find("input[name$='[type]']").on('focusout', nameChangesOnfocusOut);
		
		//evt gedisplayed error verwijderen.
		newDiabeticsLine.find("span[id$='-error']").remove();
		
		//naamgeving aanpassen aan de materialCount voor de id, naam
		newDiabeticsLine.find('input').each(function() {
			this.name= this.name.replace(/\d+/, dbmaterialCount);
			this.id = this.id.replace(/\d+/, dbmaterialCount);
			//waarde resetten
			this.value = '';
			
			//onderstaande is fixed, geen moeilijke formule
			$(this).removeAttr('aria-describedby');
		});

		//label for aanpassen
		newDiabeticsLine.find('label').each(function() {
			$(this).attr('for', $(this).attr('for').replace(/\d+/, dbmaterialCount));
		});

		//legend_name_name aanpassen naar standaard waarde
		newDiabeticsLine.find('span[name="legend_name_name"]').text('Diabetesmateriaal (' + (dbmaterialCount+1) + ')');
		
		//h3 aanpassen naar de standaard waarde
		newDiabeticsLine.find('h3').text('Diabetesmateriaal (' + (dbmaterialCount+1) + ')');

		//standaard waarde		
		newDiabeticsLine.find('.removeDiabetics').text('Diabetesmateriaal verwijderen');
		
		//uiteindelijk toevoegen
		$('#dbmaterial').append(newDiabeticsLine);

		//focus op het eertse veld
		newDiabeticsLine.find('input').first().trigger('focus');

		return false;
	});

	//koppelen aan de removeIncontinention class (zijn meerdere)
	$('.removeDiabetics').on('click', removeDiabetics);
});

var removeDiabetics = function () {
	var input_with_focus_obect = jQuery('#pharmacy');
	if (jQuery(this).closest('div.dbmaterial').next().length) {
		input_with_focus_obect = jQuery(this).closest('div.dbmaterial').next().find('input').first();	
	}

	jQuery(this).closest('div.dbmaterial').remove();

	//wanneer maar 1 regel is overgebleven hoeft de removeIncontinention niet voor deze regel getoont te worden.
	var dbmaterialCount = jQuery("#dbmaterial div.dbmaterial").length;
	if (dbmaterialCount == 1) {
		input_with_focus_obect = jQuery('#addDiabetics');
		jQuery(".removeDiabetics").hide();
	}
		
	//omdat er 1 verwijderd moet wat er nu is wel weer genummerd zijn als 0,1,2 etc. Er mogen geen gaten inzitten
	var index = 0;
	jQuery("#dbmaterial div.dbmaterial").each(function() {
		jQuery(this).find('input').each(function() {
			this.name= this.name.replace(/\d+/, index);
			this.id = this.id.replace(/\d+/, index);
		});
		jQuery(this).find('label').each(function() {
			jQuery(this).attr('for', jQuery(this).attr('for').replace(/\d+/, index));		
		});

		//vervangt (n). Dus wanneer alleen naam van iets anders 
		var legend_span_name_name_text = jQuery(this).find('span[name="legend_name_name"]').text();
		jQuery(this).find('span[name="legend_name_name"]').text(legend_span_name_name_text.replace(/(\d+)/, (index+1)));

		//vervangt (n) h3 aanpassen, dit is visueel daarom +1
		var h3_text = jQuery(this).find('h3').text();
		jQuery(this).find('h3').text(h3_text.replace(/(\d+)/, (index+1)));
		
		index++;
	});

	jQuery(input_with_focus_obect).trigger('focus');

	return true;
}

var nameChangesOnfocusOut = function() {
	//this.value;
	var diabetics_name = jQuery(this).val();
	var index = jQuery(this).closest('div.dbmaterial').index();

	if (!diabetics_name) {
		jQuery(this).closest('div.dbmaterial').find('h3').text('Diabetesmateriaal (' + (index + 1) + ')');	
		jQuery(this).closest('div.dbmaterial').find('span[name="legend_name_name"]').text('Diabetesmateriaal (' + (index + 1) + ')');
	} else {
		jQuery(this).closest('div.dbmaterial').find('h3').text(diabetics_name);
		jQuery(this).closest('div.dbmaterial').find('span[name="legend_name_name"]').text(diabetics_name);
	}

	//button aanpassen
	if (!diabetics_name) {
		jQuery(this).closest('div.dbmaterial').find('.removeDiabetics').text('Diabetesmateriaal verwijderen');
	} else {
		jQuery(this).closest('div.dbmaterial').find('.removeDiabetics').text(diabetics_name + ' verwijderen');
	}
	//$(this).css("background-color", "#FFFFFF");
}
