include mixins_week

mixin show_changes(pentrys, n)
	if(pentrys.length > 0)
		fieldset
			legend !{n}
			each pentry in pentrys
				- var my_uid = generateUID();
				.panel.panel-primary(style="margin-left: 10px;")
					.panel-heading
						h3.panel-title(data-toggle="collapse", data-target="#"+my_uid, style="cursor: pointer;") !{pentry.name}
							.small(style="font-size: 85%;")
								i !{pentry.punit}
					.panel-collapse.collapse(id=my_uid)
						.panel-body
							ul.nav.nav-tabs
								each c in pentry.changes
									- var cls = (c.idx === 0 ? "active" : "");
									- c.tab_id = generateUID();
									- var color = c.type === "new" ? "green" : (c.type==="remove" ? "red" : "gold")
									li(class=cls, style="border-bottom: 3px solid " + color +";")
										a(data-toggle="tab", href="#"+c.tab_id) 
											b !{c.user}
									
							.tab-content(style="padding-left: 10px; padding-right: 10px;")
								each c in pentry.changes
									- var cls = (c.idx === 0 ? "active" : "");
									- var clss = ["tab-pane", cls]
									div(class=clss, id=c.tab_id)
										.btn-group.btn-group-sm(style="margin-top: 10px;")
											button.btn.btn-success Akzeptieren
											button.btn.btn-danger(data-toggle="modal", data-target="#confirmReject") Ablehnen

										.changes_details
											if(c.type !== "new")
												if(pentry.punit !== c.punit)
													p(style="margin-bottom: 10px;")
														b !{c.punit}
												else
													p.small(style="margin-bottom: 10px;")
														b Gleicher pastoraler Kontext.

											if(c.diff !== "")
												p(style="margin-bottom: 0px;")
													b Diff
												pre
													code !{c.diff}
											p(style="margin-bottom: 0px;")
												b Roh-Daten
											pre
												code !{c.data}

mixin pday_with_changes(pday)
	.panel.panel-default(data-date=pday.date)
		.panel-heading
			h3.panel-title(data-toggle="collapse", data-target="#PANEL_#{pday.date}", aria-expanded="false", aria-controls="PANEL_#{pday.date}", style="cursor: pointer;") !{pday.date_pretty}
		.panel-collapse.collapse(id="PANEL_#{pday.date}")
			.panel-body(style="padding: 10px;")
				- var celebration_printed = false;
				.day_details
					table(width="100%")
						+week_day_mobile(pday.day)
				

mixin show_pentry_changes(pentry, data)
	- var cls_pentry = (data.idx === 0 ? "active" : ""); data.idx++;
	- var clss_pentry = ["tab-pane", cls_pentry]
	div.pentry_marker(class=clss_pentry, id=pentry.uid, style="height: 100%; padding-left: 15px;", data-pentry-uuid=pentry.uuid, data-pentry-type=pentry.pentry_type)
		div(style="height: 100%; display: flex; flex-direction: column;")
			ul.nav.nav-tabs
				each c in pentry.changes
					- var cls = (c.idx === 0 ? "active" : "");
					- c.tab_id = generateUID();
					- var color = c.type === "new" ? "green" : (c.type==="remove" ? "red" : "gold")
					li(class=cls, style="border-bottom: 3px solid " + color +";")
						a(data-toggle="tab", href="#"+c.tab_id) 
							b !{c.user}
					
			.tab-content(style="padding-left: 10px; padding-right: 10px; flex: 1; overflow: auto;  border-left: 1px solid #ddd;")
				each c in pentry.changes
					- var cls = (c.idx === 0 ? "active" : "");
					- var clss = ["tab-pane", cls]
					div(class=clss, id=c.tab_id, style="height: 100%;", data-change-idx=c.idx, data-change-type=c.type)
						.btn-group.btn-group-sm(style="margin-top: 10px;")
							button.btn.btn-success Akzeptieren
							button.btn.btn-danger(data-toggle="modal", data-target="#confirmReject") Ablehnen

						.changes_details
							p.change_info(style="display: none; margin-bottom: 10px;")
							if(c.age !== "") 
								p(style="margin-bottom: 10px;")
									b Alter: !{c.age}
							if(c.type !== "new")
								if(pentry.punit !== c.punit)
									p(style="margin-bottom: 10px;")
										b !{c.punit}
								else
									p.small(style="margin-bottom: 10px;")
										b Gleicher pastoraler Kontext.

							if(c.diff !== "")
								p(style="margin-bottom: 0px;")
									b Diff
								pre
									code !{c.diff}
							p(style="margin-bottom: 0px;")
								b Roh-Daten
							pre
								code !{c.data}

mixin show_pentry_changes_menu(pentries, name, data)
	if(pentries.length > 0)
		p(style="margin-bottom: 0px;")
			b !{name}
		
		each elem in pentries
			- var cls_elem = (data.idx === 0 ? "active" : ""); data.idx++;
			- elem.uid = generateUID();
			li(class=cls_elem)
				a(data-toggle="pill", href="#" + elem.uid) !{elem.name}
					.small !{elem.punit}
		hr

div(style="width: 200px; overflow: auto; padding-left: 15px;")
	ul.nav.nav-pills.nav-stacked
		- var idx = 0;
		each pday in changes
			- var cls = (idx === 0 ? "active" : ""); idx++;
			- pday.uid = generateUID();
			li(class=cls) 
				a(data-toggle="pill", href="#"+pday.uid) !{pday.date_pretty}
		
div(style="flex: 1; padding-left: 20px;")
	.tab-content(style="height: 100%;")
		- var idx = 0;
		each pday in changes
			- var cls = (idx === 0 ? "active" : ""); idx++;
			- var clss = ["tab-pane", cls]
			div(class=clss, id=pday.uid, style="height: 100%;")
				div(style="display: flex; flex-direction: column; overflow: hidden; height: 100%;")
					//- var celebration_printed = false;
					.day_details(style="border-bottom: 2px solid #000000;")
						table(style="width: 100%;")
							+week_day_mobile(pday.day)
					.subroot.pday_marker(style="flex: 1; flex-direction: row; padding-top: 10px;", data-pday-date=pday.date)
						div(style="width: 250px; overflow: auto;")
							- var data = { idx: 0 };
							ul.nav.nav-pills.nav-stacked
								+show_pentry_changes_menu(pday.events, "Ereignisse", data)
								+show_pentry_changes_menu(pday.todos, "Zu Tun", data)
								+show_pentry_changes_menu(pday.away, "Abwesenheiten", data)
								+show_pentry_changes_menu(pday.keep_in_mind, "Zu Beachten", data)
								+show_pentry_changes_menu(pday.vehicle_use, "Fahrzeugbenutzung", data)
						div(style="flex: 1;")
							.tab-content(style="height: 100%;")
								- var data = { idx: 0 };
								each pentry in pday.events
									+show_pentry_changes(pentry, data)
								each pentry in pday.todos
									+show_pentry_changes(pentry, data)
								each pentry in pday.away
									+show_pentry_changes(pentry, data)
								each pentry in pday.keep_in_mind
									+show_pentry_changes(pentry, data)
								each pentry in pday.vehicle_use
									+show_pentry_changes(pentry, data)
