include mixins

- var actual_background = "yellow";

mixin punit(pu)
	- style="cursor: pointer; ";
	- style_text="";
	- if(actual_punit_dn === pu.dn) { style+="background-color: " + actual_background; style_text="font-weight: bold;" }
	li(class="list-group-item", style=style, onclick="select_pastoralunit('#{pu.dn}');")
		span(id="#{pu.dn}", style=style_text) #{pu.name}
	if pu.subunits.length > 0
		ul(class="list-group", style="margin-left: 12px; margin-bottom: 0px;")
			each sub in pu.subunits
				+punit(sub)

.subroot(style="height: 100%;")
	.new_flex_zero(style="padding-left: 15px; padding-right: 15px;")
		p.
			Wählen Sie den zugehörigen pastoralen Kontext aus!

		form(class="form-horizontal" method="POST", action="", id="form_punitselector", style="padding-bottom: 20px;")
			input(type="hidden", name="actual_punit_dn", id="actual_punit_dn", value="#{actual_punit_dn}")
			input(type="hidden", name="actual_punit_name", id="actual_punit_name", value="#{actual_punit_name}")
			button(class="btn btn-success btn-xs", type="submit") 
				span(class="glyphicon glyphicon-ok", aria-hidden="true")
				span 
				span Übernehmen
				
			button(class="btn btn-warning btn-xs", type="button", onclick="goto_mainpage();") 
				span(class="glyphicon glyphicon-remove-circle", aria-hidden="true")
				span 
				span Abbrechen
	
	.new_flex_one(style="overflow: auto; padding-left: 15px; padding-right: 15px;")
		ul(class="list-group")
			for pu in pastoralunits
				+punit(pu)

		script.
			select_pastoralunit = function(punit_dn)
			{
				console.log("SELECTED: " + punit_dn)
				actual = $("#actual_punit_dn").val();
				if(actual === punit_dn)
				{
					console.log("NOTHIN CHANGED");
					return;
				}
				
				actual_jquery = actual.replace(/\//g, "\\/");
				$("#"+actual_jquery).css("font-weight", "normal");
				$("#"+actual_jquery).parent().css("background-color", "#fff");
				
				punit_dn_jquery = punit_dn.replace(/\//g, "\\/");
				console.log(punit_dn_jquery);
				
				$("#"+punit_dn_jquery).css("font-weight", "bold");
				$("#"+punit_dn_jquery).parent().css("background-color", "#{actual_background}");
				
				$("#actual_punit_dn").val(punit_dn);
				$("#actual_punit_name").val($("#"+punit_dn_jquery).text());
			}
			
			$("#form_punitselector").on('submit', function(e) {
				var data = {
					name : $("#actual_punit_name").val(),
					dn   : $("#actual_punit_dn").val()
				};
				pcal_pentry_edit_manager.set_pastoralunit(data);
				
				e.preventDefault();
			});