@extends('layouts.master')

@section('content')

<meta http-equiv="content-type" content="text/html;CHARSET=UTF-8"> 
<style>
	table, th, td {
		border: 1px solid black;
		border-collapse: collapse;
	}
	th, td {
		padding: 5px;
		text-align: left;    
	}
	
 	
	.vetualHolder{position:relative;}
	.pogessimg img { 
		width: 50px; 
	}
	#button-style-switcher img{
		width: 50px;
	}
    #recording-instructions{margin:15px 4px;}
	#button-style-switcher {
		background: #fff;
		box-shadow: 0 4px 14px rgba(0,0,0,.14); 
		position: fixed;
		top: 156px;
		width: 180px; 
		transition: all 1s ease;
		right:0;
	}	
	#button-style-switcher div {
		padding: 5px 10px;
	}
	#button-style-switcher div h3 {
		color: #2d2d2d;
		font-size: 16px;
		margin: 8px 3px 12px;
	}		
	ul.buttons {
		list-style: none outside none;
		margin: 10px 0 10px;
		overflow: hidden;
		padding: 0;
	}		
	ul.buttons li {
		float: left;
		margin: 2px;
	}
	
	ul.buttons li a.active {
		position: relative;
	}		
	#button-style-switcher .bottom {
		padding: 0;
	}
	#button-style-switcher .bottom a.settings {
		background-color: #fff;
		box-shadow: -7px 2px 14px 0 rgba(0,0,0,.14);
		display: block;
		height: 45px;
		position: absolute;
		left: -45px;
		top: 0;
		width: 45px;
		text-align: center;
	}
	ul.buttons li a {
		cursor: pointer;
		display: block;
		height: 35px;
		width: 35px;
		border-radius: 2px;
		-webkit-border-radius: 2px;
	}		

	#button-style-switcher .bottom a i {
		font-size: 24px;
		line-height: 45px;
	}

	#button-style-switcher .bottom a i {
		color: #3c8dbc;
	}		
	
	.alert-box { 
		border-radius: 4px;  
	}
	.alert-box p{margin:0px;} 
	.success {
		color: #3c763d;
		background-color: #dff0d8;
		border-color: #d6e9c6; 
		text-align: center; 
		z-index: 999; 
		position: fixed;
		top: 50%;
		left: 50%; 
		transform: translate(-50%, -50%);	
	}
	.success p{
		font-family: Montserrat;
		font-weight: normal;
	}
	.toggleIn-out{
		right: -180px !important;
	} 
	#recording-instructions{
		position:relative;
		padding-left:20px;
	}
	#recording-instructions:before {
		content: "\f05a";
		font-family: FontAwesome;
		font-style: normal;
		font-weight: normal;
		text-decoration: inherit;
		color: #3c8dbc;
		font-size: 16px;
		padding-right: 0.5em;
		position: absolute; 
		left: 0;
	} 
	.content-wrapper, .right-side{
		float:left;
		width:100%;
	}
	.content-header{
		width: 21cm;  
		padding-right: 0px;
		padding-left: 0px;
	}
	.content-header>.breadcrumb {
		float: right;
		padding-right: 0px;
		right: 0px;
	}   
	.subpage{float: left !important;}
	.spce-btm{margin-bottom:50px;}
    .space-top{margin-top:50px;}
	.spce-btm{margin-bottom:50px;}
    .mrT{margin-top:1cm !important;}
    .defoultpage{padding:40px;}	
	.defoultpage td, th, p, span{word-spacing: 3px !important;font-weight: normal !important;}
</style>
    <section class="content-header on-print-hide">
		<h1> Medical Examination </h1>
		<p id="recording-instructions">
			 Press the <strong>Start Recognition</strong> button and allow access.
		</p>
		<ol class="breadcrumb">
			<li><a href="/"><i class="fa fa-dashboard"></i> Home</a></li>
			<li class="active">Dashboard</li>
			<li class="active">Medical Examination</li>
		</ol> 
        @include('layouts.partials._actionlink') 
    </section> 
	
	
    <div id="appendreport">
	@if(!empty($data))
	{!!  $data !!}
	@else	
	<div class="defoultpage" style="width:21cm;min-height: 29.5cm;background:#fff;float:left;">  
			<!--- START TOP TEMPLATE HEADER --->
			<div style="width:100%;float:left;"> 
				<div style="font-size:15px;width:100%;float:left;"> 
					<div style="width:40%;float:left;"> 
						<div style="width:100%;">  
							<span>  Case FIR/DD No.   </span>
							<div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word;min-width:160px;width:auto;border-bottom:1px solid #000;" class="keyboard"></div> 
						</div> 
					</div>
					<div style="float: left; width:22%;"> 
						<div style="width: 100%;">  
							<span> Date   </span>
							<div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word;min-width:116px;width:auto;border-bottom:1px solid #000;" class="keyboard"></div>
						</div>  
					</div>

					<div style="float: right; width: 38%;"> 
						<div style="width: 100%;">  
							<span> U/Sec.   </span>
							<div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word;min-width:220px;width:auto;border-bottom:1px solid #000;" class="keyboard"></div>
						</div>  
					</div>				
				</div>   
				  
				<div style=" float: left;  width: 100%; padding:5px 0px;font-size:15px;">
					<ul style="margin: 0px; padding: 0px;width: 100%;">
						<li style="list-style: none;float:left;width:40%;">  
							<div style="width: 100%;">
							   <span>P.S </span>
							   <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:250px;width:auto;border-bottom:1px solid #000;margin-top:15px;" class="keyboard"></div>
							</div>   
					   </li>
					   <li style="list-style: none;float:left;width:30%"> 
							<div style="width: 100%;">
							   <span>   Distt.  </span>
							  <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:166px;width:auto;border-bottom:1px solid #000;margin-top:15px;" class="keyboard"></div>
							</div> 			   
					   </li>
					   <li style="list-style: none;float:left;width:30%"> 
							<div style="width: 100%;">
							   <span>  Delhi</span>
							  <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:176px;width:auto;border-bottom:1px solid #000;margin-top:15px;" class="keyboard"></div>
							</div> 		   
					   </li>  
					</ul>
				</div> 			
				<div style=" float: left;  width: 100%;	font-size:15px;">   
					<div style="width: 100%;"> 
					   <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:100%;width:auto;border-bottom:1px solid #000;margin-top:15px;" class="keyboard"></div>
					</div> 
				</div>				
			</div>
            <!--- END TOP TEMPLATE HEADER --->
			
			
			<!--- APPLICATION MEDICAL OFFICER START HERE --->
			<div style="float:left;padding-left: 163px;margin-top: 30px;">
			    <span>To.</span>
				<div style="width:100%;float:left;padding-left:60px;margin-top:10px;">
					<div>
						<span style="display:block;">The Chief Medical Officer</span>
						<div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:290px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
					</div>
					
					<div> 
						<div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:250px;width:auto;border-bottom:1px dashed #000;margin-top: 15px; " class="keyboard"></div>
						<span>Delhi</span>
					</div>				
				</div>				
			</div>
			<!--- APPLICATION MEDICAL OFFICER END HERE --->
			
			<!--- START TEMPLATE TITLE --->
			<div style="text-align:center;float:left;width:100%;margin:30px 0px">
			    <h4 style="text-align: center;display: inline-block;font-size:26px;margin:0px;border-bottom:1px solid #000;">
				Subject: Request for Medical Examination
				</h4>
			</div>   
			<!--- END TEMPLATE TITLE --->
			
			<!--- START TEMPLATE FILL OUT AREA --->
			<div style="width:100%;float:left;margin-bottom:20px;">
			    <span>Sir, </span> 	  
			</div> 			
			<div style="width:100%;float:left;margin-bottom:20px;">
			    <span style="padding-right:5px;padding-left: 40px;">With due respect I am sending Mr./Mrs </span>
			    <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:421px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div> 	  
			</div>
			
			<div style="float:left;margin-bottom:20px;">
				<span style="padding-right:5px;">S/o, d/o. W/o Sh</span>
				<div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:300px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>			
				<span style="padding-right:5px;">R/o</span>
				<div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:273px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
			</div>
			<div style="float:left;margin-bottom:20px;width:100%;"> 
			   <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:100%;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
			</div> 

			<div style="float:left;margin-bottom:20px;width:100%;"> 
				<div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:140px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
				<span style="padding-right:5px;">Age</span>
			    <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:168px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
			    <span style="padding-right:5px;">  in the custody / protection of 1. const   </span>
			    <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:122px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
			</div>	

			<div style="float:left;margin-bottom:20px;width:100%;">
			   <span style="padding-right:5px;">No </span>  
			   <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:190px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div> 
			   <span style="padding-right:5px;">2. W/Const </span>
			   <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:242px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
			   <span style="padding-right:5px;">No</span>
			   <div contenteditable="true" style="display:inline-block;outline:none;word-break: break-word; min-width:147px;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
			</div> 	

			<div style="float:left;margin-bottom:20px;width:100%;"> 
			    <span style="padding-right:5px;padding-left: 40px;">It is therefore, requested that patient may kindly be medically examined and  opinion for the same.</span> 
			</div> 
			
			<div style="float:left;margin-bottom:20px;width:100%;"> 
			    <span style="padding-right:5px;padding-left: 80px;">Thanking You,</span> 
			</div>			
 				
			<!--- END TEMPLATE FILL OUT AREA --->
			
			<div style="width:100%;">
			    <div style="width:50%;float:right;margin-top:40px;"> 
				    <div style="width:100%;float:left;margin-bottom:15px;">
					    <div style="width:33%;float:left;text-align:right;">
						    <span style="padding-right: 15px;">   Name of I.O. </span>   
						</div>
					    <div style="width:67%;float:right;">
						    <div contenteditable="true" style="outline:none;word-break: break-word; min-width:100%;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
						</div>
					</div>
					
				    <div style="width:100%;float:left;margin-bottom:15px;">
					    <div style="width:33%;float:left;text-align:right;">
						    <span style="padding-right: 15px;"> P.S.</span>   
						</div>
					    <div style="width:67%;float:right;">
						    <div contenteditable="true" style="outline:none;word-break: break-word; min-width:100%;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
						</div>
					</div>

				    <div style="width:100%;float:left;margin-bottom:15px;">
					    <div style="width:33%;float:left;text-align:right;">
						    <span style="padding-right: 15px;"> Distt.</span>   
						</div>
					    <div style="width:59%;float:left;">
						    <div contenteditable="true" style="outline:none;word-break: break-word; min-width:100%;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
							 
						</div>
						
					    <div style="width:8%;float:right;"> 
							<span> Delhi</span> 
						</div>						
					</div>	

				    <div style="width:100%;float:left;">
					    <div style="width:33%;float:left;text-align:right;">
						    <span style="padding-right: 15px;"> Date.</span>   
						</div>
					    <div style="width:67%;float:right;">
						    <div contenteditable="true" style="outline:none;word-break: break-word; min-width:100%;width:auto;border-bottom:1px dashed #000; " class="keyboard"></div>
						</div>
					</div>					
				</div>
			</div>

			<style type="text/css" media="print">
				@media  print {  
					.space-top{margin-top:0px !important;}	
					.mrT{margin-top:0cm !important;}	 
					.defoultpage{padding:0px !important;}	 
					.alignJ{text-align:justify !important;}
					.alignJ span{text-align:justify !important;}
					.bordernone{border:none !important;}
					.defoultpage td, th, p, span{word-spacing: 3px !important;font-weight: normal !important;}
					.print_Mode{min-height:29.7cm !important;} 
					.printTime{margin:30px 0 !important;}
					table, th, td {
						border: 1px solid black;
						border-collapse: collapse;
					}						
				}
			</style>		
			
		</div>
	@endif	
	</div>	
		
    <script src="{{ URL::asset('assets/VoiceSoftware/ready-lang-script.js') }}"></script> 
   <script src="{{ URL::asset('assets/VoiceSoftware/printThis.js') }}"></script>
    <script> 
	$('#PrntBtn').on("click", function () {
      //$('.printable').printThis();
      $('#appendreport').printThis();
      //window.print();
    });	
   </script>
   
   
   @endsection