<%@ include file="/includes.jsp"%>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Patient Meeting History</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link rel="stylesheet" href="../css/webapp.css" type="text/css" />
<link rel="stylesheet" href="../meetings/css/summary.css" type="text/css" />
<link rel="icon" href="../images/emdt.ico" type="image/x-icon" />
<link rel="shortcut icon" href="../images/emdt.ico" type="image/x-icon" />
<script src="../js/jquery/jquery-3.7.1.min.js"></script>
<script src="../js/jquery/jquery-ui.min.js"></script>

<%-- Styles common to screen and print --%>
<style type="text/css" media="all">
body {
	margin: 10px;
	font-family: Helvetica, sans-serif;
}

table {
	border: none;
}

td {
	padding: 4px;
}

th {
	padding: 4px;
	background: #eee;
}

hr {
	color: #ddd;
	size: 1px;
}

h4 {
	color: #333;
}

h5 {
	font-size: 10pt;
	color: #777;
}

.meetingTitle h2 {
	color: #555;
	font-size: 12pt;
}

.meetingTitle h3 {
	color: #777;
	font-size: 10pt;
}

.tools, .summaryPageHeader, .summarySectionHeader {
	display: none;
}

.summaryTileContainer table {
	width: 100%;
	border: none;
}

td.summaryFieldTitle {
	width: 30%;
}

td.summaryFieldValue {
	width: 70%;
}

.summaryFormisEmptyMessage {
	color: #888888;
}

pre {
	font-family: Arial, sans-serif;
	white-space: pre-wrap; /* css-3 */
	white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
	word-wrap: break-word; /* Internet Explorer 5.5+ */
	width: 99%; /* remove horizontal scroll-bar when viewing in IE7 */
}

.fixedtable {
	width: 100%;
	table-layout: fixed;
}

.summaryPagesContainer {
	display: block;
}

.meetingTitle {
	font-size: 12pt;
}

.meetingNotesContainer {
	margin-bottom: 50px;
	page-break-before: always;
}

.meetingSummaryContainer {
	margin-bottom: 50px;
}

.showAllToggler {
	display: none;
}

.table tr {
	border: none;
}

.table {
	border: none;
}
</style>

<%-- styles we want to be displayed on screen --%>

<style type="text/css" media="screen">
.meetingBodyContainer {
	display: none;
}

.meetingToggler {
	width: 100%;
	text-align: right;
	cursor: pointer;
}

.meetingTitleTable {
	width: 100%;
	border: none;
}

#controls {
	width: 100%;
	text-align: right;
	margin-bottom: 20px;
}

#closer {
	display: inline-block;
}

#pdfdiv {
	display: inline-block;
	margin-right: 20px;
}
</style>

<%-- styles we want to be visible in the PDF or printed version --%>
<style type="text/css" media="print">
.showAllToggler {
	display: none;
}

.meetingBodyContainer {
	display: block;
}

.meetingToggler {
	width: 100%;
	text-align: right;
	display: none;
}

.meetingTitleTable {
	width: 100%;
	border: none;
}

#closer {
	display: none;
}

.noprint {
	display: none;
}

div.pageBreak {
	page-break-after: always;
}
</style>


<!--  CSS voodoo to make the header and footer appear when printed or as PDF  -->

<style type="text/css" media="screen">
div.header {
	display: none;
}

div.footer {
	display: none;
}
</style>
<style type="text/css" media="print">
body {
	font-family: sans-serif;
}

@page {
	-fs-flow-top: "header";
	-fs-flow-bottom: "footer";
	-fs-flow-left: "left";
	-fs-flow-right: "right";
}

@page { @top-center { content:element(header, last-except)
	
}

}
@page { @bottom-center { content:element(footer)
	
}

}
div.header {
	font-size: 90%;
	font-style: italic;
	-fs-move-to-flow: "header";
	position: running(header);
}

.footer {
	font-size: 90%;
	font-style: italic;
	-fs-move-to-flow: "footer";
	position: running(footer);
}

#pagenumber:before {
	content: counter(page);
}

#pagecount:before {
	content: counter(pages);
}
</style>

<script type="text/javascript">
	$(document).ready( function() {

		$(".meetingToggler").click( function() {
			$(this).parent().parent().parent().parent()
					.parent().parent().children(".meetingBodyContainer")
					.slideToggle(400);
		});

	});
</script>

</head>

<body>
	<c:set var="patient"
		value="${emdt.currentMeeting.currentItem.patientDiscussed}"/>

	<div class="header">
		MDT Meeting
		<fmt:formatDate value="${emdt.currentMeeting.date}"/>"
			pattern="dd MMMM yyyy" />
		: Patient '<c:out value="${patient.fullName}"/>', hospital number
		<c:out value="${patient.hospitalNumber}"/>, Date of birth
		<fmt:formatDate value="${patient.dateOfBirth}" pattern="dd MMMM yyyy" />
	</div>
	<div class="footer">
		Page <span id="pagenumber" /> of <span id="pagecount" />
	</div>


	<div id="controls">
		<div id="pdfdiv" class="noprint">
			<a href="#"
				onclick="window.location.href = '../emdt/convertJspToPdf.form?jspUrl=meetings/patientMeetingHistoryReport.form?patient=${emdt.currentMeeting.currentItem.patientDiscussed.guid}&amp;isLandscapePrint=N';"><img
				src="../emdt/images/16x16/pdf.gif" alt="pdf" /> Download report as
				PDF </a>
			<%--
			this report uses CSS-generated headers and footers, but can add them via java too like this:
			<c:set var="headerString" value="Patient Name : ${patient.fullName}, Hospital Number :  ${patient.hospitalNumber } "></c:set>
			<a href="#"  onclick="window.location.href = '../emdt/convertJspToPdf.form?jspUrl=meetings/patientMeetingHistoryReport.form&amp;isLandscapePrint=N&amp;headerString=<c:out value="${headerString}&amp;addPageNumbers=true';"><img src="../emdt/images/16x16/pdf.gif" alt="pdf"/> Download report as PDF </a>
			 --%>
		</div>
		<div id="closer">
			<a href="#" onclick="window.close()"><img
				src="../images/16x16/exit.png" alt="exit" /> Close window </a>
		</div>

	</div>

	<h2>Meeting History for Patient '<c:out value="${patient.fullName}"/>'</h2>
	<h3>Hospital Number: <c:out value="${patient.hospitalNumber}"/></h3>
	<h3>
		Date of Birth:
		<fmt:formatDate value="${patient.dateOfBirth}" pattern="dd MMMM yyyy" />
	</h3>
	<hr size="1" />

	<c:forEach var="patientMeetingReportDto" items="${patientMeetingReportDtoList}">
		<div class="header"> 
			MDT Meeting <fmt:formatDate value="${patientMeetingReportDto.meetingDate}" pattern="dd MMMM yyyy" />: Patient '<c:out value="${patient.fullName}"/>', hospital number <c:out value="${patient.hospitalNumber}"/>, Date of birth <fmt:formatDate value="${patient.dateOfBirth}" pattern="dd MMMM yyyy" />
		</div>

		<div class="allMeetingsDiv">

			<div class="meetingContainer">
				<div class="meetingHeaderContainer">
					<table class="meetingTitleTable" summary="">
						<tr>
							<td>
								<div class="meetingTitle">
									<h2><c:out value="${patientMeetingReportDto.meetingTitle}"/>&nbsp;</h2>
									<h3>
										Speciality:
										<webapp:listValue domain="EMDT" listName="Speciality" key="${patientMeetingReportDto.meetingSpeciality}" />
									</h3>
									<h3>
										Date:
										<fmt:formatDate value="${patientMeetingReportDto.meetingDate}" pattern="dd MMMM yyyy, HH:mm" />
										to
										<fmt:formatDate value="${patientMeetingReportDto.meetingEndDate}" pattern="HH:mm" />
									</h3>
									<h3>Location: <c:out value="${patientMeetingReportDto.meetingHospitalName}"/>&nbsp;
										<c:out value="${patientMeetingReportDto.meetingLocation}"/></h3>
								</div>
							</td>
							<td valign="top">
								<div class="meetingToggler">
									<a>Show / hide meeting detail <img src="../images/add.png"
										alt="+" title="Toggle meeting display" /></a>
								</div>
							</td>
						</tr>
					</table>
				</div>

				<div class="meetingBodyContainer">
					<div style="margin-left: 15px; margin-bottom: 50px;">
						<table>
							<tr>
								<td><b>Attendee name</b></td>
								<td><b>Attended?</b></td>
							</tr>
							<c:forEach var="att" items="${patientMeetingReportDto.attendeeAttendedMap}"
								varStatus="attendeeIndex">
								<tr>
									<td><c:out value="${att.key}"/></td>
									<td align="center"><c:out value="${att.value}"/></td>
								</tr>
							</c:forEach>
						</table>

					</div>

					<div class="meetingSummaryContainer">
						<c:if test="${patientMeetingReportDto.summaryId != null }">
							<h3>Meeting Summary <c:out value="${patientMeetingReportDto.view.label}"/></h3>
							<table width="100%" summary="">
								<tr id="summary<c:out value="${patientMeetingReportDto.itemId}"/>">
									<td colspan="3">
										<div class="summaryTileContainer">
											<tiles:insertTemplate template="/emdt/tiles/patientSummaryTile.jsp?readonly=1" flush="true">
												<tiles:putAttribute name="summary" value="${patientMeetingReportDto.view}" />
											</tiles:insertTemplate>
										</div>
									</td>
								</tr>
							</table>
						</c:if>
					</div>

					<%-- Virtual Meeting Discussion Blog --%>
					<div class="pageBreak">
						<!-- start meeting blog on new page -->
					</div>
					<div class="meetingBlogContainer">
						<h3>Virtual Meeting Discussion</h3>
						<c:choose>
							<c:when test="${empty patientMeetingReportDto.blogComments}">
								(No virtual meeting discussion was found for this patient)
							</c:when>
							<c:otherwise>
								<c:forEach items="${patientMeetingReportDto.blogComments}" var="blog">
									<div class="blogRow">
										<div class="blogUser"><c:out value="${blog.userMakingComment.fullName}"/>
											<br />
											<div class="blogHospital"><c:out value="${blog.userMakingComment.hospital.hospitalName}"/></div>
											<div class="blogDate">
												<fmt:formatDate value="${blog.dateOfComment}" pattern="dd MMM yyyy,  HH:mm" />
											</div>
										</div>
										<pre class="blogComment"><c:out value="${blog.comment}"/></pre>
									</div>
								</c:forEach>
							</c:otherwise>
						</c:choose>
					</div>

					<div class="meetingNotesContainer">
						<c:if
							test="${patientMeetingReportDto.meetingFormPath != null and fn:length(patientMeetingReportDto.meetingFormPath)>0 }">
							<h3>Meeting Notes</h3>
							<table width="100%" summary="">
								<tr id="note<c:out value="${item.guid}"/>">
									<td colspan="3">
										<emdt:getNote meetingId="${patientMeetingReportDto.meetingGuid}" itemId="${patientMeetingReportDto.itemGuid}" />
										<tiles:insertTemplate template="/meetings/printForm.jsp" /></td>
								</tr>
							</table>
						</c:if>
					</div>

					<c:if test="${patientMeetingReportDto.nationalMeeting}">
						<div class="meetingSection" style="clear: both;">
							<div style="clear: both;">
								<div style="clear: both; height: 0px;"></div>
							</div>
							<div style="clear: both;">
								<h2>Actions and Response</h2>
							</div>
							<div style="clear: both; padding: 5px;">
								<div style="clear: both; border-bottom: 1px solid #eee;">
									<div style="clear: both;">
										<div style="clear: both; height: 0px;"></div>
									</div>
									<div style="clear: both;">
										<div style="clear: both;">
											<h2>Response</h2>
										</div>
										<div style="clear: both"
											 class="meetingActionAndReponseLabel padding5pix">
											<b>Date of Information :</b> &nbsp; &nbsp;
											<c:out value="${patientMeetingReportDto.meetingResponse.dateOfInformation}"/>
										</div>
										<div style="clear: both"
											 class="meetingActionAndReponseLabel padding5pix">
											<b>Title : </b>&nbsp; &nbsp; <c:out value="${patientMeetingReportDto.meetingResponse.title}"/>
										</div>
										<div style="clear: both"
											 class="meetingActionAndReponseLabel padding5pix">
											<b>Response to Primary Clinician Submitting patient:</b> &nbsp;
											&nbsp; <c:out value="${patientMeetingReportDto.meetingResponse.responsetoPrimaryClinician}"/>
										</div>
										<div style="clear: both; height: 0px;"></div>
									</div>
								</div>
								<div style="clear: both;">
									<div style="clear: both; padding: 5px;">
										<div style="clear: both;">
											<div style="clear: both;">
												<div style="clear: both; height: 0px;"></div>
											</div>
											<div style="clear: both;">
												<div style="clear: both;">
													<h2>Actions</h2>
												</div>
												<div style="clear: both" class="padding5pix">
													<div style="display: inline;">
														<c:choose>
															<c:when
																	test="${patientMeetingReportDto.discussed ne null and item.discussed eq true}">Patient has been discussed in this meeting</c:when>
															<c:otherwise>Patient has not been discussed in this meeting</c:otherwise>
														</c:choose>
													</div>
												</div>
												<div style="clear: both"
													 class="meetingActionAndReponseLabel padding5pix">
													<b>Actions from Meeting:</b> &nbsp;
													&nbsp;<c:out value="${patientMeetingReportDto.meetingItemAction}"/>
												</div>
												<div style="clear: both" class="padding5pix">
													<c:choose>
														<c:when
																test="${patientMeetingReportDto.meetingItemActionCompleted ne null and patientMeetingReportDto.meetingItemActionCompleted eq true }">These Actions have  been Completed</c:when>
														<c:otherwise>These Actions have not been Completed</c:otherwise>
													</c:choose>
												</div>
												<div style="clear: both; height: 0px;"></div>
											</div>
										</div>
									</div>
									<div style="clear: both; height: 0px;"></div>
								</div>
							</div>
						</div>
					</c:if> <!-- is national -->
				</div>
			</div>

		</div>
		<hr size="1" />
	</c:forEach>
	<emdt:getNote meetingId="${emdt.currentMeeting.guid}" itemId="${emdt.currentMeeting.currentItem.guid}" />
</body>
</html>
