@extends(request()->input('popupmode') ? 'layouts.empty' : 'layouts.template')
<?php
/** @var \App\Models\Client $patient */
?>
<?php
$trimLayout = true;
$routeName = request()->route()->getName();
$isVisitNote = ($routeName === 'pros.view.notes.view.dashboard' && @$note && !!$note->visitTemplate);
$isOldClient = (date_diff(date_create(config('app.point_impl_date')), date_create($patient->created_at))->invert === 1);
?>
<style media="screen">
	.pt-name {
		font-size: 1.5rem !important;
	}
</style>
@section('content')
	<div class="container-fluid h-100">
		<div class="main-row h-100 {{ !request()->input('popupmode') ? '' : 'px-0' }} {{$isVisitNote ? 'autohide-leftnav' : ''}}">
			@if(!request()->input('popupmode'))
			<nav id="sidebarMenu" class="d-block bg-light sidebar collapse px-0">
				<div class="sidebar-sticky pt-3">
					<ul class="nav flex-column mcp-theme-1">
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.dashboard') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.dashboard', ['patient' => $patient]) }}">Dashboard</a>
						</li>
                        
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.calendar') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.calendar', ['patient' => $patient]) }}">Calendar</a>
						</li>
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.appointments') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.appointments', ['patient' => $patient, 'forPro' => 'all', 'status' => 'all']) }}">Appointments</a>
						</li>
						
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.notes') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.notes', ['patient' => $patient]) }}">Notes</a>
						</li>
						
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.handouts') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.handouts', ['patient' => $patient]) }}">Handouts</a>
						</li>
						
						
						<li class="nav-item">
							<a class="nav-link {{ $routeName === 'pros.view.sms' ? 'active' : '' }}"
							   href="{{ route('pros.view.sms', ['patient' => $patient]) }}">SMS</a>
						</li>
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.sms-numbers') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.sms-numbers', ['patient' => $patient]) }}">SMS Numbers</a>
						</li>
						
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.settings') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.settings', ['patient' => $patient]) }}">Settings</a>
						</li>
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.sms-reminders') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.sms-reminders', ['patient' => $patient]) }}">SMS Reminders</a>
						</li>
						
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.pros') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.pros', ['patient' => $patient]) }}">Pros</a>
						</li>
						@if($performer->pro->pro_type == 'ADMIN')
						<li class="nav-item">
							<a class="nav-link {{ strpos($routeName, 'pros.view.client-pro-access') === 0 ? 'active' : '' }}"
							   href="{{ route('pros.view.client-pro-access', ['patient' => $patient]) }}">Client Pro Access</a>
						</li>
						@endif
					
					</ul>
					<div class="mt-3 mcp-theme-1">
						@yield('left-nav-content')
					</div>
				</div>
			</nav>
			@endif
			<main role="main" class="w-100 {{$trimLayout || $isVisitNote ? 'p-0' : ''}}">
			
				<div class="card {{$trimLayout || $isVisitNote ? 'card m-0 border-0 rounded-0' : 'my-3'}}" id="patient-header">
					<div id="patient-header-content">
					<div class="card-header @if($patient->client_engagement_status_category == 'DUMMY') alert-warning @endif py-1 hide-inside-ticket-popup">
						<?php
						$thumbnail = $patient->profile_picture_base64;
						$initials = !$thumbnail ? substr($patient->name_first, 0, 1) . substr($patient->name_last, 0, 1) : '';
						$online = $patient->is_online ? 'online' : '';
						$patientName = implode(', ', array_filter([$patient->name_last, $patient->name_first]));

						$confirmedCell = empty($patient->cell_number) ? '-' : $patient->cell_number;
						$confirmedEmail = empty($patient->email_address) ? '-' : $patient->email_address;

						$location = implode(', ', array_filter([$patient->home_address_city, $patient->home_address_state]));
						$location = empty($location) ? '-' : $location;

						$mcpName = $patient->mcp ? implode(', ', array_filter([$patient->mcp->name_last, $patient->mcp->name_first])) : null;
						$cmName = $patient->cm ? implode(', ', array_filter([$patient->cm->name_last, $patient->cm->name_first])) : null;

						$memberSince = date_diff(date_create($patient->created_at), date_create('now'))->days;
						if ($memberSince > 30) $memberSince = date('F, Y', strtotime($patient->created_at));
						else if ($memberSince > 1) $memberSince .= ' days ago';
						else if ($memberSince === 1) $memberSince = 'yesterday';
						else if ($memberSince === 0) $memberSince = 'today';
						?>

						<div class=z>
							<div class=header>
								@if($patient->is_duplicate)
									<div class="alert alert-secondary border-dark mcp-theme-1 screen-only">
										<span class="text-dark">This chart is a duplicate of&nbsp;</span>
										<a class="font-weight-bold"
										   href="/patients/view/{{ $patient->duplicateOf->uid }}">
											{{ $patient->duplicateOf->displayName() }}
										</a>
									</div>
								@endif
								<div class="hbox mr-auto">

									
									<section>
										<div class="hbox">
											<h4 class="pt-name">{{$patientName}}</h4>
											<div class="screen-only mr-1 patient-presence-indicator thumbnail {{$online}}"
											data-patient-uid="{{$patient->uid}}"
											style="background-image:<?=$thumbnail?>"><?=$initials?></div>
											<div class="d-inline-flex align-items-baseline">
												<i class="chart mr-2">#{{$patient->chart_number}}</i>
												<span class="on-hover-show d-inline-block on-hover-opaque">
													<i class="fa fa-info-circle ml-1 text-primary"></i>
													<div class="on-hover-content py-2 pl-3 text-nowrap">
														Joined <?=$memberSince?>
														<div class="mt-1">
															Created by <b>{{$patient->creator ? $patient->creator->displayName() : '-'}}</b>
														</div>
														<div class="mt-1">
															Created on <b>{{friendly_date_time($patient->created_at)}}</b>
														</div>
													</div>
												</span>
											</div>
										</div>
										<div class=separators>
											<div class="screen-only">
												<label>Status:</label>
												<b>{{$patient->client_engagement_status_category ? ucwords(strtolower(str_replace('_', ' ', $patient->client_engagement_status_category == 'DUMMY' ? 'Test Chart' : $patient->client_engagement_status_category))) : '-'}}</b>
											</div>
										</div>
										
                                    </section>
                                

									<section class="mr-4 align-self-start mt-2 ml-auto">
										<div>
											<label>Sticky Note:</label> <span class="text-secondary">{{$patient->sticky_note ?? '-' }}</span>
											<div moe relative wide class="ml-2 hide-inside-popup">
												<a start show><i class="fa fa-edit"></i></a>
												<form url="/api/client/updateStickyNote" class="mcp-theme-1" right>
													<input type="hidden" name="uid" value="{{$patient->uid}}">
													<div class="mb-2">
														<label class="text-secondary text-sm">Sticky Note</label>
														<textarea name="stickyNote" class="form-control" rows="8" cols="80">{{$patient->sticky_note}}</textarea>
													</div>
													<div>
														<button submit class="btn btn-sm btn-primary mr-1">Submit
														</button>
														<button cancel class="btn btn-sm btn-default border">
															Cancel
														</button>
													</div>
												</form>
											</div>
										</div>
										
									</section>
									<ul class="vbox mt-2 align-self-start patient-header-address ">
										
										@if($patient->cell_number)
											<li>
												<span class="aligned-icon">
													<i class="fa fa-phone-alt" aria-hidden="true"></i>
												</span>
												{{$patient->shadowOfPro->cell_number}}
												
											</li>
										@endif
										
										<li class="d-flex align-items-baseline">
											<div class="">
												{{$patient->shadowOfPro->email_address}}
											</div>
											
										</li>

										<li class="d-flex align-items-baseline">
											<div>
												<div moe relative>
													<a href="#" start show class="d-flex align-items-baseline">Send SMS</span></a>
													<form url="/api/clientSms/createOutgoing" right class="mcp-theme-1" noreload>
														<input type="hidden" name="uid" value="{{ $patient->uid }}">
														<div class="mb-2">
															<label for="" class="text-sm text-secondary mb-1">Cell
																Number</label>
															<input type="text" class="form-control form-control-sm"
																name="cellNumber" value="{{$patient->cell_number}}">
														</div>
														<div class="mb-2">
															<label for=""
																class="text-sm text-secondary mb-1">Message</label>
															<textarea type="text" class="form-control form-control-sm"
																	name="message"></textarea>
														</div>
														<div class="d-flex align-items-center">
															<button class="btn btn-sm btn-primary mr-2" submit>Send</button>
															<button class="btn btn-sm btn-default mr-2 border" cancel>
																Cancel
															</button>
														</div>
													</form>
												</div>
											</div>
										</li>

										<li class="d-flex align-items-baseline">
											
											<div class="d-inline-flex screen-only">
												@include('app.patient.send_email')
											</div>
										</li>
									</ul>
									
								</div>
								
							</div>
						</div> <!-- z -->
					</div>
					</div>
					@if($pro->pro_type === 'ADMIN')
						<div class="screen-only card-header py-2 d-flex align-items-center mcp-theme-1 bg-aliceblue hide-inside-popup">
							<b class="">Tags ({{count($patient->clientTags)}}):</b>
							@foreach($patient->clientTags as $tag)
								<div class="d-inline-flex align-items-center ml-2 py-1 px-2 rounded bg-aliceblue text-info">
									<span class="text-sm">{{$tag->tag}}</span>
									<div moe relative class="ml-2">
										<a href="" start show><i class="fa fa-times text-secondary on-hover-opaque"></i></a>
										<form url="/api/clientTag/cancel" class="mcp-theme-1 min-width-200px">
											<input type="hidden" name="uid" value="{{$tag->uid}}">
											<p class="text-nowrap text-dark">Cancel this tag?</p>
											<div>
												<button submit class="btn btn-sm btn-primary mr-2">Submit</button>
												<button cancel class="btn btn-sm btn-default border">Cancel</button>
											</div>
										</form>
									</div>
								</div>
							@endforeach
							<div moe relative class="ml-2">
								<a href="" start show class="text-sm">+ Add</a>
								<form url="/api/clientTag/create" class="mcp-theme-1">
									<input type="hidden" name="clientUid" value="{{$patient->uid}}">
									<div class="mb-2">
										<label class="text-secondary text-sm">Tag</label>
										<input type="text" class="form-control form-control-sm"
											   name="tag"
											   placeholder="Tag" required>
									</div>
									<div>
										<button submit class="btn btn-sm btn-primary mr-2">Submit</button>
										<button cancel class="btn btn-sm btn-default border">Cancel</button>
									</div>
								</form>
							</div>
						</div>
					@endif
					{{--<div class="text-container border-bottom d-flex align-items-center mcp-theme-1 px-3">

						@if($patient->mcp_pro_id !== $pro->id && $patient->active_mcp_request_id)
							<div moe relative class="ml-2">
								<a href="" start show class="btn btn-sm btn-success text-white font-weight-bold small">Claim as MCP</a>
								<form url="/api/mcpRequest/claim" class="mcp-theme-1" right>
									<input type="hidden" name="clientUid" value="{{$patient->uid}}">
									<p>Claim this patient?</p>
									<div>
										<button submit class="btn btn-sm btn-primary mr-2">Yes</button>
										<button cancel class="btn btn-sm btn-default border">Cancel</button>
									</div>
								</form>
							</div>
						@endif
					</div>--}}
					<div class="card-body {{$routeName === 'pros.view.notes.view.dashboard' ? 'p-0' : ''}}">
						{{--<h1 class="h3">@yield('section-title')</h1>--}}
						<div class="mcp-theme-1">
							@yield('inner-content')
						</div>
					</div>
				</div>
			</main>
		</div>
	</div>
	<script>
		(function() {
			function init() {
				$('.note-method-select').change(function() {
					let form = $(this).closest('form');
					if(this.value === 'IN_CLINIC') {
						form.find('.if-in-clinic').show();
					}
					else {
						form.find('.if-in-clinic').hide();
					}
				});

				$('.note-method-select').each(function() {
					let form = $(this).closest('form');
					if(this.value === 'IN_CLINIC') {
						form.find('.if-in-clinic').show();
					}
					else {
						form.find('.if-in-clinic').hide();
					}
				});
			}
			addMCInitializer('patient-add-note-popup', init, '#patient-header')
		}).call(window);
	</script>
	<script>
		(function() {
			function init() {
				$('#sidebarMenu')
					.off('scroll')
					.on('scroll', function() {
						localStorage.sidebarMenuScrollTop = $(this).scrollTop();
					});
				if(localStorage.sidebarMenuScrollTop) {
					$('#sidebarMenu').scrollTop(+localStorage.sidebarMenuScrollTop);
				}
			}
			addMCInitializer('sidebarMenu', init, '#sidebarMenu')
		}).call(window);
	</script>
@endsection