@extends('layouts.main')
@section('title',trans('core.title_search_candidate'))
@section('content')
<style>
.chart {
width: 800px;
height: 220px;
}
.pie-title-center {
display: inline-block;
position: relative;
text-align: center;
padding-right: 20px;
}
.pie-value {
display: block;
position: absolute;
height: 40px;
top: 50%;
left: 0;
right: 18px;
margin-top: -10px;
line-height: 55px;
font-weight: 600;
font-size: 25px;
text-align: center;
}
.graph_render_loader{
margin-top: 50px;	
}
</style>
<link rel="stylesheet" href="{{ secure_url('assets/css/psychometric-report.css') }}">
@if(count($psychometric_section_exists)>0 && $multifacet_section_count>0)
<script src="{{ secure_url('assets/js/pie-chart2.js') }}" type="text/javascript"></script>
@else
<script src="{{ secure_url('assets/js/pie-chart.js') }}" type="text/javascript"></script>
@endif
<script src="{{ secure_url('assets/js/jspdf.min.js') }}" defer></script>
<script src="{{ secure_url('assets/js/html2canvas.js') }}" defer></script>

<div class="pcoded-content">
	<div class="hme-loading-mask">
	    <div class="hme-loading-container">
	        <div class="hme-dual-ring"></div>
	        <div>Please wait, Loading...</div>
	    </div>
  	</div>
	<div class="pcoded-inner-content p-0">
		<div class="main-body">
			<div class="page-wrapper p-0">
				<div class="page-header p-15 m-b-0 pro-page-heading1">
					<div class="page-header-title">
						<h4>Test Result</h4>
					</div>
					<div class="page-header-breadcrumb p-r-10">
						<ul class="breadcrumb-title">
							<li class="breadcrumb-item"> <a href="{{secure_url('college/dashboard') }}"> <span class="hiremee-home"></span> </a> </li>
							<li class="breadcrumb-item"><a href="{{ secure_url('gold/college/pro-result-search') }}">Test Result</a> </li>
						</ul>
					</div>
				</div>
				<div class="page-body">
					<div class="pageheader">
						<div class="row">
							<div class="col col-md-6 d-flex align-items-center">
							@if(!empty($personal_information))
								<h5>Result For <i><span class="c-info"> {{ $personal_information['full_name'] ??'--'}} </span></i>  </h5>
							@endif	
							</div>
							<div class="col col-md-6 text-right">
								@if(!$is_psychometric_only)
								<a href="javascript:;" class="btn btn-primary pro-green c-white" id="js-pro-proctoring-pdf-button"> Preview PDF</a>
								@endif
							</div>
						</div>
					</div>
					<div id="pro-preview-page"></div>
					<div class="card borderless-card m-b-0">
						<div class="card-block p-0">
							<div class="row">
								<div class="col-xs-12 col-md-12 pro-scroll-tab">
									<ul class="nav nav-tabs pro-result-page-tab pl-0 pr-0" id="myTab" role="tablist">
										<li class="nav-item">
											<a class="nav-link f-16 active" id="section-manual-tab" data-toggle="tab" data-id="personal-info" href="#section-manual" role="tab" aria-controls="section-manual-tab" aria-selected="true">
												<span>Report Summary</span>
											</a>
										</li>
					
										<li class="nav-item">
											<a class="nav-link f-16" id="js-pro-proctoring-tab" data-toggle="tab" href="#test_result-proctored" role="tab" aria-controls="section-auto-tab" aria-selected="false" data-id="proctoring-report">
												<span>Proctoring Report</span>
											</a>
										</li>

										@if(!$is_psychometric_only)
											<li class="nav-item">
												<a class="nav-link f-16" data-toggle="tab" href="#test_result-simple-mcq" role="tab" aria-controls="section-auto-tab" aria-selected="false" data-id="simple-mcq">
													<span>Section Score</span>
												</a>
											</li>
											@if($coding_section_exists)
												<li class="nav-item">
													<a class="nav-link f-16" data-toggle="tab" href="#test_result-coding-simulation" role="tab" aria-controls="section-auto-tab" aria-selected="false" data-id="coding-simulation">
														<span>Coding Simulation</span>
													</a>
												</li>																
											@endif
										@endif

										@if(count($psychometric_section_exists)>0)
											<li class="nav-item">
												<a class="nav-link f-16" data-toggle="tab" href="#test_result-psychometric-section" role="tab" aria-controls="section-auto-tab" aria-selected="false" data-id="psychometric-section">
													<span>Psychometric Section Report</span>
												</a>
											</li>																
										@endif
									</ul>
													
									{!! Form::hidden('assign_id',$assign_id,['id'=>'js-pro-test-assign_id']) !!}
									{!! Form::hidden('test_pin',$test_pin,['id'=>'js-pro-test-test_pin_id']) !!}
									{!! Form::hidden('candidate_id',$candidate_id,['id'=>'js-pro-test-candidate_id']) !!}
									{!! Form::hidden('section_id',$section_id,['id'=>'js-pro-test-section_id']) !!}
									{!! Form::hidden('sections',$sections,array('id'=>'pre-js-pro-sections'))!!}
									{!! Form::hidden('assessment_id',$assessment_id,['id'=>'js-pro-test-assessment_id']) !!}
									{!! Form::hidden('is_custom_form',$is_custom_form,['id'=>'js-pro-test-is_custom_form']) !!}
									{!! Form::hidden('is_feedback',$is_feedback,['id'=>'js-pro-test-is_feedback']) !!}
									{!! Form::hidden('test_event_id',$test_event_id,['id'=>'js-pro-test-test_event_id']) !!}
									<div class="tab-content" id="js-pro-test-result-data">				
										@include('gold.college.promapped.personal-info-render')											
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
function getPDF(){
  $(".download").hide();   
  var HTML_Width = $(".canvas_div_pdf").width();
  var HTML_Height = $(".canvas_div_pdf").height();
  var top_left_margin = 15;
  var PDF_Width = HTML_Width+(top_left_margin*2);
  var PDF_Height = (PDF_Width*1.5)+(top_left_margin*2);
  var canvas_image_width = HTML_Width;
  var canvas_image_height = HTML_Height;

  var totalPDFPages = Math.ceil(HTML_Height/PDF_Height)-1;

  html2canvas($(".canvas_div_pdf")[0],{allowTaint:false}).then(function(canvas) {
    canvas.getContext('3d');
    var imgData = canvas.toDataURL();
    // var imgData=canvas.toDataURL("image/png").replace("image/png", "image/octet-stream"); 
    var pdf = new jsPDF('p', 'pt',  [PDF_Width, PDF_Height]);
    pdf.addImage(imgData, 'JPG', top_left_margin, top_left_margin,canvas_image_width,canvas_image_height);
    for (var i = 1; i <= totalPDFPages; i++) {
    pdf.addPage(PDF_Width, PDF_Height);
    pdf.addImage(imgData, 'JPG', top_left_margin, -(PDF_Height*i)+(top_left_margin*4),canvas_image_width,canvas_image_height);
    }
      pdf.save($("#js-download-pdf").val());
    });
};
{{-- PROEX 22.0 --}}
document.addEventListener("DOMContentLoaded", function(){
    sectionReport("section-div");
});
</script>
@endsection