@extends('layouts.app')

	@section('breadcrumb')
		<ul class="breadcrumb">
			<li><a href="/home">{!! trans('messages.home') !!}</a></li>
			<li><a href="/job-application">{!! trans('messages.job').' '.trans('messages.application') !!}</a></li>
			<li class="active">{{$job_application->Job->title}}</li>
		</ul>
	@stop

	@section('content')
		<div class="row">

			{{-- Job Application Details --}}
			<div class="{{ (env('COMPANY_ID') == 89 || env('COMPANY_ID') == 123) ? 'col-md-12' : 'col-md-4' }}">
				<div class="box-info full">
					<h2 style="display:flex; justify-content:space-between;">
						<b>{{trans('messages.job').' '.trans('messages.post')}}: {{$job_application->Job->title}} {{!empty($job_application->designation_id) ? ' | '.trans('messages.applying_for').': '.$job_application->designation->name : '' }}</b>
						{{-- Download application form as PDF --}}
						@if (Laratrust::isAbleTo('download-application-form'))
						<a target="_blank" href="/job-application/{{$job_application->id}}/download-detail" class="btn btn-xs btn-default"><i class="fa fa-download" data-toggle="tooltip" title={{trans('messages.download')}}></i></a>
						@endif
					</h2>
					<div id="load-job-application-detail" data-extra="&id={{$job_application->id}}" data-source="/job-application/detail"></div>
				</div>
			</div>

			@if (env('COMPANY_ID') == 123)
				{!! Form::open(['url' => '/job-application/updateCustomField/'.$job_application->id, 'id' => 'signature-form', 'data-submit' => 'noAjax']) !!}
					<div class="col-md-12">
						<div class="box-info full">
							<h2><b>Questionaire</b></h2>
							<div class="col-sm-6">
								<div class="form-group">
									{!! Form::label('designation',trans('messages.applying_for'),['class'=>'required'])!!}
									{!! Form::select('designation_id', App\Designation::whereIn('id',[8,9,10,11,12])->pluck('name','id')->all() , isset($job_application) ? $job_application->designation_id : '',['class'=>'form-control show-tick','title' => trans('messages.select_one')]) !!}
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									{!! Form::label('assignment','Intended Workplace',['class'=>'required']) !!}
									{!! Form::select('applicant_site',$locations,isset($job_application) ? $job_application->applicant_site : '',['class'=>'form-control show-tick','title'=>trans('messages.select_one')]) !!}
								</div>
							</div>
							<div class="col-md-12">
								{{-- Get custom fields ONLY for edit --}}
								@if(config('config.enable_custom_field'))
								{{ getCustomFields('job-application-edit-form',$custom_edit_values) }}
								@endif
							</div>
						</div>
					</div>

					<div class="col-sm-12">
						<div class="box-info">
							<h2 class="required"><b>Interviewee Signature</b></h2>
							<div class="row">
								<div class="col-sm-12">
									<div class="form-group">
										<div id="drawSign" scroll="false" style="width:100%; margin:0 auto; display: flex; justify-content: center;">
											<canvas id="cSign" style="border: 2pt solid black;"></canvas>
										</div>
									</div>
								</div>
							</div>
							<div class="row" style="display:flex; justify-content: center;">
								<div class="col-md-12" style="display:flex; justify-content: space-between; width: 100%; max-width: 600px;">
									<div class="form-group">
										<a id="clear-canvas" class="btn btn-success">{!! trans('messages.clear').' '.trans('messages.signature') !!}</a>
									</div>
								</div>
							</div>
							{!! Form::hidden('img_string','',['id' => 'signature_string'])!!}

							<div class="col-sm-12">
								{!! Form::submit(isset($buttonText) ? $buttonText : trans('messages.save').' Questionaire',['id'=>'m-submit', 'class'=>'btn btn-primary pull-right']) !!}
							</div>
						</div>
					</div>
				{!! Form::close() !!}
			@endif

			<div class="{{ (env('COMPANY_ID') == 89 || env('COMPANY_ID') == 123) ? 'col-md-12' : 'col-md-8' }}">
				{{-- Employment Contract --}}
				@if($job_application->status == "recruited")
					<div class="box-info collapse" id="sign-detail">
						<h2><b>{!! trans('messages.employment') !!}</b> {!! trans('messages.contract') !!}</h2>
						<div class="additional-icon">
							<button class="btn btn-sm btn-primary" data-toggle="collapse" data-target="#sign-detail"><i class="fa fa-minus icon"></i> {!! trans('messages.hide') !!}</button>
						</div>
						{!! Form::open(['url' => '/job-application/showContract?src=job&id='.$job_application->id, 'id' => 'signature-form', 'data-submit' => 'noAjax']) !!}
						@if(!empty(env('COMPANY_ID')))
							@if (View::exists('job_application.signature_'.env('COMPANY_ID')))
								@include('job_application.signature_'.env('COMPANY_ID'))
							@else
								@include('job_application.signature')
							@endif
						@else
							@include('job_application.signature')
						@endif
						{!! Form::close() !!}
					</div>
				@endif

				{{-- Application Status Update --}}
				@if($job_application->applicant_user_id != Auth::user()->id)
					<div class="box-info">
						<h2><b>{{trans('messages.status')}}</b> {{trans('messages.update')}}</h2>
						<div class="additional-icon" style="display:flex;">
							@if($job_application->status == "recruited")
							{{-- ESS Job Scope --}}
							@if(env('COMPANY_ID') == 34)
							{!! Form::open(['url'=>'/job-application/showContract?src=job&doc_type=job_scope&id='.$job_application->id,'id'=>'job-scope-form','data-submit'=>'noAjax']) !!}
							{!! Form::button('<i class="fa fa-pencil-square-o"></i> '.trans('messages.officer').' '.trans('messages.job_scope'), ['class' => 'btn btn-sm btn-primary', 'type' => 'submit', 'formtarget' => '_blank']) !!} &nbsp;
							{!! Form::close() !!}
							@endif
							<a href="#" data-toggle="collapse" data-target="#sign-detail"><button class="btn btn-sm btn-primary"><i class="fa fa-plus icon"></i> {!! trans('messages.employment').' '.trans('messages.contract') !!}</button></a>
							@endif
						</div>

						{!! Form::model($job_application,['method' => 'POST','route' => ['job-application.update-status',$job_application] ,'class' => 'job-application-status-detail-form','id' => 'job-application-status-detail-form','data-table-refresh' => 'job-application-status-table','data-refresh' => 'load-job-application-detail']) !!}
						<div class="row">
							<div class="col-sm-6">
								<div class="form-group">
									{!! Form::label('job_id',trans('messages.job').' '.trans('messages.title'),[])!!}
									{!! Form::select('job_id',$jobs,isset($job_application) ? $job_application->job_id : '',['class'=>'form-control show-tick','title' => trans('messages.select_one')])!!}
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									{!! Form::label('status',trans('messages.status'),[])!!}
									{!! Form::select('status',$job_application_status,isset($job_application) ? $job_application->status : '',['class'=>'form-control show-tick','title' => trans('messages.select_one'),'id'=>'application_status','onchange'=>'showExtraFields()'])!!}
								</div>
							</div>
						</div>

						<div class="form-group">
							{!! Form::label('remarks',trans('messages.remarks'),[])!!}
							{!! Form::textarea('remarks','',['size' => '30x3', 'class' => 'form-control', 'placeholder' => trans('messages.remarks'),"data-show-counter" => 1,"data-limit" => config('config.textarea_limit'),'data-autoresize' => 1])!!}
							<span class="countdown"></span>
						</div>

						{{-- Only displayed when status == Recruited --}}
						<div id="recruited" style="display:none;">
							<div class="row">
								<div class="col-sm-4">
									<div class="form-group">
										{!! Form::label('nric',trans('messages.nric'),['class'=>'required']) !!}
										<input type="text" class="form-control text-input" name="nric" placeholder="{{trans('messages.nric')}}" value="{{!empty($applicant_nric) ? $applicant_nric->value : ''}}">
									</div>
								</div>
								<div class="col-sm-4">
									<div class="form-group">
										{!! Form::label('designation_id',trans('messages.designation').' (Hired As)',['class'=>'required']) !!}
										{!! Form::select('designation_id', App\Designation::whereIn('id', [8,9,10,11,12])->pluck('name','id')->all(),'',['class'=>'form-control show-tick','title'=>trans('messages.select_one'),'id'=>'list_id'])!!}
									</div>
								</div>
								@if($applicant_nationality && $applicant_nationality->value == 'Singapore PR')
								<div class="col-sm-4">
									<div class="form-group">
										{!! Form::label('pr_date_issued',trans('messages.pr_date_issued'),['class'=>'required']) !!}
										{!! Form::date('pr_date_issued' , NULL ,['class'=>'form-control show-tick','title'=>trans('messages.select_one'),'id'=>'pr_date_issued'])!!}
									</div>
								</div>
								@endif
							</div>
							<b>NOTE:</b> After status has been changed to "Recruited", new user account will be automatically created in the system.<br><br>
						</div>

						{!! Form::submit(trans('messages.save'),['class' => 'btn btn-primary pull-right']) !!}
						{!! Form::close() !!}
					</div>
				@endif

				{{-- List Application Status --}}
				<div class="box-info full">
					<h2><b>{!! trans('messages.list_all').'</b> '.trans('messages.status').' '.trans('messages.update') !!} </h2>
					<div class="table-responsive">
						<table data-sortable class="table table-hover table-striped ajax-table show-table" id="job-application-status-table" data-source="/job-application/list-status" data-extra="&id={{$job_application->id}}">
							<thead>
								<tr>
									<th>{!! trans('messages.status') !!}</th>
									<th>{!! trans('messages.remarks') !!}</th>
									<th>{!! trans('messages.user').' '.trans('messages.w_updated') !!}</th>
									<th>{!! trans('messages.created_at') !!}</th>
									@if($job_application->applicant_user_id != Auth::user()->id)
									<th data-sortable="false"></th>
									@endif
								</tr>
							</thead>
							<tbody></tbody>
						</table>
					</div>
				</div>
			</div>

		</div>

		<script>
			function showExtraFields() {
				var e = document.getElementById("application_status").value;
				if(e == "recruited") {
					document.getElementById("recruited").style.display = "block";
				}
				else {
					document.getElementById("recruited").style.display = "none";
				}
			};
		</script>

		@if (env('COMPANY_ID') == 123)
			{!! Html::script('https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.22/fabric.min.js') !!}
			<script>
				var btn_submit = document.getElementById('m-submit');
				var element = document.getElementById("drawSign");
				var width = element.offsetWidth ;   // width of canvas
				var height = element.offsetHeight;  // height of canvas
				var canvas = new fabric.Canvas('cSign');

				canvas.isDrawingMode = true;
				canvas.selection = false;
				fabric.Object.prototype.selectable = false; // prevent drawing objects to be draggable or clickable
				canvas.freeDrawingBrush.width = 4;    // size of the drawing brush

				// Event to check when something is drawn on the canvas
				canvas.on('path:created', function(event){
					btn_submit.disabled = false;
				})

				function responsive() {
					var width = 600 ;
					var height = 400;
					if (element.offsetWidth < 600) { width = element.offsetWidth; height =  width * 2/3; }
					canvas.setHeight(height);
					canvas.setWidth(width);
					canvas.setDimensions({'width':width,'height':height},{'backstoreOnly':false,'cssOnly':true});
				}
				responsive();

				@if($job_application->getSignature('interview'))
					var myDataURL = "{{'data:image/png;base64,'.base64_encode(File::get(storage_path().config('constant.storage_root').$job_application->getSignature('interview')))}}";
					var img = new Image();
					img.onload = function(){
						var imgInstance = new fabric.Image(img, {
							width: 600,
							height: 400
						});
						canvas.add(imgInstance);
					}
					img.src = myDataURL
				@else
					btn_submit.disabled = true;
				@endif

				// Resize canvas
				window.addEventListener('resize', function(){ responsive(); });

				var btn_clear = document.getElementById('clear-canvas');
				btn_clear.onclick = function(){
					btn_submit.disabled = true;
					canvas.clear();
				};

				// Convert signature to data url upon submit
				btn_submit.onclick = function(){
					var dataURL = canvas.toDataURL({ format: 'png', quality: 0.8 });
					var signature_field = document.getElementById('signature_string');
					signature_field.value = dataURL;
				};
			</script>
		@endif

	@endsection