include mixins
include mixins_day

- var actual_background = "yellow";

mixin do_actor(actor)
	- var my_class;
	- if(actor.available === false) my_class = "panel-danger";
	- actual_actor_id === actor.id ? my_class = "panel-success" : my_class="panel-default";
	
	.panel(class=my_class, id=actor.id, data-actorname=actor.name, data-actor="", data-status="#{actor.status}", data-available="#{actor.available}")
		.panel-heading(onclick="select_actor('#{actor.id}');")
			- var my_cursor = "cursor: pointer;";
			//- actor.available ? my_cursor = "cursor: pointer;" : my_cursor = "cursor: auto;"
			h4.panel-title(style=my_cursor)
				| #{actor.name}
				if(actor.available === false)
					.small(style="color: #a94442; margin-bottom: 0px;")
						i Abwesend
						| &nbsp; &nbsp;
						| !{actor.unavailable_reason}
		if(actor.other_events_today.length > 0)
			.panel-body
				p(style="margin-bottom: 0px;")
					| Heute bereits eingebunden in:
				each ev in actor.other_events_today
					+pevent_with_thereafter_timeline("", ev, false)
				//- ul(style="margin-bottom: 0px; padding-inline-start: 15px;")
				//-	each ev in actor.other_events_today
				//-		li
				//-			i !{ev.name}
				//-			| 
				//-			span.small !{ev.name_secondary}
				//-			.small !{ev.time}
				//-			if(ev.is_involved_in_mainevent === false)
				//-				.small [Nicht direkt in Haupt-Ereignis eingebunden.]
				//-			if(ev.roles !== "")
				//-				.small Mitwirkung: #{ev.roles}
				//-			if(ev.thereafterevents.length > 0)
				//-				ul(style="margin-bottom: 0px; padding-inline-start: 15px;")
				//-					each tev in ev.thereafterevents
				//-						li
				//-							i !{tev.name}
				//-							| 
				//-							span.small !{ev.name_secondary}
				//-						.small !{tev.time}
				//-						if(tev.roles !== "")
				//-							.small Mitwirkung: #{tev.roles}

mixin do_unit(unit)
	- var my_uid = generateUID();
	- var my_border_color = unit.is_pastoral ? "border-color: "+ unit.color +"; " : "";
	- var my_background_image = unit.is_pastoral ? "background-image: linear-gradient(to bottom,"+unit.color+" 50%, #ffffff 100%); border-color: #ffffff; background-color: #ffffff; border-top-left-radius: 0px; border-top-right-radius: 0px;" : "";
	- var my_border_top_color = unit.is_pastoral ? "border-top-color: #ffffff;" : "";
	- var in_class = unit.subunits.length > 0 ? "in" : "";
	.panel.panel-default.panel_group_and_unit(id=my_uid, data-elemname=unit.name, data-parishdb="", data-dn=unit.dn, data-elemtype="unit", data-depth=unit.depth, style=my_border_color )
		.panel-heading(style=my_background_image)
			h4.panel-title(data-toggle="collapse", data-target="#PANEL_"+my_uid, aria-expanded="false", aria-controls="PANEL_"+my_uid) #{unit.name}
			//-  border-bottom: 2px solid #{elem.color};
		.panel-collapse.collapse(class=in_class, id="PANEL_"+my_uid)
			.panel-body(style="padding: 10px; "+my_border_top_color)
				if unit.actors.length > 0
					each actor in unit.actors
						+do_actor(actor)
				if unit.subunits.length > 0
					each sub in unit.subunits
						+do_unit(sub)

.subroot
	.new_flex_zero(style="margin-bottom: 20px;")
		.container-fluid
			h4 Beteiligten aus der Liste hinzufügen
		
			label
				input(type="checkbox", id="show_retired")
				//- checked
				span 
				span Ausgeschiedene anzeigen
	
			form(class="form-horizontal", method="POST", action="", id="form_actorselector")
				input(type="hidden", name="actual_actor_id", id="actual_actor_id", value="#{actual_actor_id}")
				input(type="hidden", name="actual_actor_name", id="actual_actor_name", value="#{actual_actor_name}")
				input(type="hidden", name="for_role", id="for_role", value="#{for_role}")
				button(class="btn btn-success btn-sm", type="submit", id="submit_button") 
					span(class="glyphicon glyphicon-ok", aria-hidden="true")
					span 
					span Übernehmen
				//- goto_mainpage();
				button(class="btn btn-warning btn-sm", type="button", onclick="history.back();") 
					span(class="glyphicon glyphicon-remove-circle", aria-hidden="true")
					span 
					span Abbrechen
					
				p.small(style="margin-top: 7px; margin-bottom: 0px; font-weight: bold;") Aktuell ausgewählt
				p(style="font-size: 100%; font-weight: bold; margin-bottom: 0px;")
					- var actual_name = (actual_actor_name === "" ? "–" : actual_actor_name)
					span#actual_name #{actual_name}
				#errorpane

	.new_flex_one(style="padding-bottom: 200px;")
		.container-fluid
			for unit in units
				+do_unit(unit)
							
	script.
		pcal_pentry_edit_manager.show_searchbar("adjust_visible_actors(this);");
		
		if("#{actual_actor_id}" === "")
			$("#submit_button").prop('disabled', true);
			
		$("#show_retired").change(function()
			{
				if(this.checked)
					$("[data-status='retired']").show();
				else
					$("[data-status='retired']").hide();
			});
		$("[data-status='retired']").hide();	
			
		
		select_actor = function(actor_id)
		{
			console.log("SELECTED: " + actor_id);
			var actual_id = $("#actual_actor_id").val();
			console.log(actual_id);
			if(actual_id === actor_id)
			{
				console.log("NOTHIN CHANGED");
				return;
			}
			
			var new_panel = $("#" + actor_id).closest('.panel');
			//if(new_panel.hasClass("panel-danger")) // i. e.: not available 
			//	return;
				
			if(actual_id !== "") {
				var replace_class = "panel-default";
				var old_panel = $("#" + actual_id).closest('.panel');
				console.log(old_panel.data("available"));
				console.log(old_panel);
				if(old_panel.data("available") == false) replace_class = "panel-danger";
				old_panel.removeClass('panel-success').addClass(replace_class);
			}

			var replace_class = 'panel-default';
			if(new_panel.hasClass("panel-danger"))
				replace_class = "panel-danger";
			new_panel.removeClass(replace_class).addClass('panel-success');
	
									
			$("#actual_actor_id").val(actor_id);
			var actorname = $("#"+actor_id).data("actorname");
			$("#actual_actor_name").val(actorname);
			
			$("#actual_name").text(actorname);
		
			$("#errorpane").empty();
			$("#submit_button").prop('disabled', false);
		}
		
		function set_visibility_according_to_filter(substrRegex, elems) {
			var units_are_shown = false;
		
			if(!units_are_shown) {
				$("[data-elemtype='unit']").each(function(index) {
					var panel_id = "#PANEL_" + $(this).prop('id');
					$(panel_id).collapse('show');
				});
				console.log('SHOW ALL UNITS');
				units_are_shown = true;
			}
		
			var actual_id = $("#actual_actor_id").val();
			
			elems.each(function(index) {
				my_panel = $(this);
				var txt = my_panel.data("actorname");
				var id =  my_panel.prop('id');
				
				if(substrRegex.test(txt)) {
					my_panel.show();
					if(actual_id === id) {
						$("#submit_button").prop('disabled', false);
						$("#errorpane").empty();
					}
				}
				else {	
					my_panel.hide();
					if(actual_id === id) {
						$("#submit_button").prop('disabled', true);
						$("#errorpane").html(get_compiled_message("danger", "Auswahl ungültig", "Durch die Filterangabe wurde Ihre Auswahl ungültig!"));
					}
				}
			});
		}
		
		function adjust_visible_actors(my_input) {
			console.log(my_input.value);
			
			// regex used to determine if a string contains the substring `q`
			substrRegex = new RegExp(my_input.value, 'i');
			
			set_visibility_according_to_filter(substrRegex, $("[data-status='active']"));
			
			if(	$("#show_retired").prop('checked') ) {
				set_visibility_according_to_filter(substrRegex, $("[data-status='retired']"));
			}
		}
		
		$("#form_actorselector").on('submit', function(e) {
			var data = {
				for_role: $("#for_role").val(),
				name 	: $("#actual_actor_name").val(),
				id   	: $("#actual_actor_id").val()
			};
			pcal_pentry_edit_manager.add_involved(data);
			
			e.preventDefault();
		});
		
