@php
$mark_update = true;
$q_type = $answer_details->getQuestionType->question_type;
  if($q_type != 1 || $q_type != 2) {
     //$answer = $answer_details->exam_answer;
    $answer = $answer_content;
} else{
    $answer = $answer_details->getOption ? ($answer_details->getOption->options ? $answer_details->getOption : '') : '';
}
if(empty($answer))
{
  $mark_update = false;
}
@endphp
@php
function getextension($path){
$extension = pathinfo($path, PATHINFO_EXTENSION);
$explode = explode('?',$extension);
return $explode[0];
}
$image_count = [];
@endphp
<style>
#score-table {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#score-table td, #score-table th {
  border: 1px solid #ddd;
  padding: 8px;
}

#score-table tr:nth-child(even){background-color: #f2f2f2;}

#score-table tr:hover {background-color: #ddd;}

#score-table th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #659e03;
  color: white;
}
</style>
<div class="md-content  modal-w-980">
    <button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close hme-modal-close js-pro-invidual-question-close-btn" ><span class="hiremee-multiply f-18"></span></button>

    <div class="row p-l-15 p-r-15 ">
      <div class="col-sm-12 col-lg-12 min-h-200">
        
        <div class="page-header-title m-t-10 m-b-20">
            <h4 class="g-l-b">Question</h4>
        </div>

        <div class="row form-group m-b-8">
            <div class="col-md-4 text-left f-w-400 m-b-8"> Question :</div>
            <div class="col-md-8 w-b-all text-left f-w-400 m-b-8 max-h-250"> {!! $list ? $list->question : "" !!}</div>
        </div> 

        <div class="row form-group m-b-8">
            <div class="col-md-4 text-left f-w-400 m-b-8"> Answer :</div>
            <div class="col-md-8 w-b-all text-left f-w-400 m-b-8">
                {!! $answer !!}
            </div>
        </div>

        @if($list->sub_question_upload == 1)
          @if(count($subj_doc_list))
          <div class="row form-group m-b-8">
              <div class="col-md-4 text-left f-w-400 m-b-8"> Documents :</div>
              <div class="col-md-8 w-b-all text-left f-w-200 m-b-8">
                  <table class="table tbl-truncate pro-list-table">
                    <tbody>
                      <tr>
                        <th> # </th>
                        <th> Files</th>
                      </tr>

                      <div class="hme-loading-mask" style="height: 100%;">
                          <div class="hme-loading-container" >
                              <div class="hme-dual-ring"></div>
                              <div>Please wait, Loading...</div>
                          </div>
                      </div>
                      @php $i=1; @endphp
                      @foreach($subj_doc_list as $doc)
                        @php
                          $s3_url= $doc ? \HireMeeHelper::getAWSImageUrl($doc->s3_id,config('filesystems.disks.hiremeeprodev.bucket'),'hiremeeprodev') : "";
                          $check_extn = getextension($s3_url);
                        @endphp

                        <tr>
                            <td>{{ $i++ }}</td>
                            <td>
                              @if($check_extn == 'pdf')
                              <a href="javascript:" class="btn btn-primary btn-sm js-pro-subjective-tooltip sub_doc_download" data-toggle="tooltip" data-placement="top"  title="" data-original-title="View File" data-url="{{$s3_url}}"> <em class="fa fa-eye"> </em> </a>

                              <a href="javascript:" class="btn btn-primary btn-sm js-pro-subjective-tooltip sub_doc_download_show" data-toggle="tooltip" data-placement="top" title="" data-original-title="PDF Download File" data-url="{{$s3_url}}" data-s3_id="{{$doc->s3_id}}"> <em class="fa fa-download"> </em> </a>

                              @else
                              @php $image_count[] = getextension($s3_url); @endphp
                              <input type="hidden" name="bulk_image[]" value="{{$s3_url}}" id="bulk_image">
                              <a href="javascript:" class="btn btn-primary btn-sm js-pro-subjective-tooltip sub_img_download" data-toggle="tooltip" data-placement="top"  title="" data-original-title="View File" data-url="{{$s3_url}}"> <em class="fa fa-eye"> </em> </a>

                               <a href="javascript:" class="btn btn-primary btn-sm js-pro-subjective-tooltip sub_doc_download_show" data-toggle="tooltip" data-placement="top" title="" data-original-title="Image Download File" data-url="{{$s3_url}}" data-s3_id="{{$doc->s3_id }}"> <em class="fa fa-download"> </em> </a>

                               <a href="javascript:" class="btn btn-primary btn-sm js-pro-subjective-tooltip image_pdf_download" data-toggle="tooltip" data-placement="top" title="" data-original-title="Image PDF Download File" data-url="{{$s3_url}}" data-s3_id="{{$doc->s3_id }}"> <em class="fa fa-file-pdf-o fa-2x"> </em> </a>

                              @endif
      
                              <!--<a href="javascript:" class="btn btn-primary btn-sm js-pro-subjective-tooltip sub_doc_download_show" data-toggle="tooltip" data-placement="top" title="" data-original-title="Download File" data-url="{{$s3_url}}" data-s3_id="{{$doc->s3_id }}"> <em class="fa fa-download"> </em> </a>-->
                            </td>
                        </tr>
                      @endforeach
                    </tbody>
                  </table>
              </div>
          </div>
            @php $mark_update = true; @endphp
          @elseif(empty($answer) && count($subj_doc_list)==0)
               @php $mark_update = false; @endphp
          @endif
        @endif

        <div class="row form-group m-b-8">
           @if(count($image_count) > 1)
              <div class="col-md-4 text-left f-w-400 m-b-8"></div>
              <div class="col-md-8 text-truncate text-left f-w-400 m-b-8"> Click here to download the all images as PDF &nbsp;&nbsp;<a href="javascript:" class="btn btn-primary btn-sm js-pro-subjective-tooltip image_pdf_download" data-toggle="tooltip" data-placement="top" title="" data-original-title="" data-url="" data-s3_id=""> <em class="fa fa-file-pdf-o fa-2x "> </em> </a></div>
            @endif
            <div class="col-md-4 text-left f-w-400 m-b-8"> Max Marks :</div>
            <div class="col-md-8 text-truncate text-left f-w-400 m-b-8"> <label class="badge f-16 badge-primary">{{$list ? $list->score : ""}}</label></div>
        </div>

        @php 
        $readonly = ($list->question_wise_score == 1)?'readonly':''; 
        $candidateMark = ($list->question_wise_score == 1)?$candidate_mark:0;
        @endphp

         <div class="row form-group">
            <div class="col-md-4 text-left f-w-400 m-b-8"> Marks :</div>
            <div class="col-md-4 text-truncate text-left f-w-400 m-b-8">
             <input type="text" name="subjective_score" class="form-control js-tooltip-validate js-pro-individual-subjective_score decimal"  placeholder="" data-max="{{$list ? $list->score : 0}}"  data-answer="{{ $answer }}"   id="js-pro-subjective_score_{{$testpin}}_{{$assign_id}}" onpaste="return false;" value="{{ $candidateMark }}" minlength="1" maxlength="5" {{$readonly}}>
            </div>
        
        @if($list->question_wise_score == 1)
          <div class="col-md-4 text-left f-w-400 m-b-8"><a href="javascript:void(0);" data-placement="top" title="" data-original-title="Edit" class="m-r-10" id="subjective_ques_wise_score_view"><label class="badge f-16 badge-primary" style="cursor: pointer;">Update question wise score</label></a></div>
          
          @endif
        </div>
                        
        <div class="row m-t-20">
            <input type="hidden" name="candidate_id" class="candidate_id" value="">
            <div class="col-sm-12 d-flex justify-content-center">
              <button type="submit" class="btn btn-primary f-16 pull-right js-pro-invidual-question-score-update" data-qtype="{{$q_type}}" data-qid="{{$list->id}}" data-testpin="{{$testpin}}"  data-ass_id="{{$assign_id}}" data-answer="{{ $answer }}"   data-assessment_id="{{$assessment_id}}" data-status="{{ $mark_update }}" data-testinventory="2"> Update</button>
            </div>
            <div class="col-md-2"></div>
        </div>
      </div>
    </div>
                   
</div>

<div class="animation-model test-modal">           
  <div class="md-modals md-effect-13" data-backdrop="false" id="js-subjective-doc-load-iframe" >
    <div class="md-content">
      <button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn" id="clear_frame_modal"><span class="hiremee-multiply f-18"></span></button>
      <div class="hme-loading-mask" style="height: 100%;">
          <div class="hme-loading-container" >
            <div class="hme-dual-ring"></div>
            <div>Please wait, Loading...</div>
          </div>
      </div>
      <div class="row p-l-15 m-h-700 p-r-15">
        <div class="col-sm-12 col-lg-12">
          <div class="page-header-title m-t-10 m-b-20">
               <h4 class="g-l-b"></h4>
          </div>
          <div class="min-h-550">
              <iframe id="js-load-doc-data" width='100%' height='570' allowfullscreen>Download</iframe>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="md-overlay"></div>
</div>

 <!-- IMG Preview Modal -->
<div class="animation-model test-modal">           
  <div class="md-modals md-effect-13" data-backdrop="false" id="js-subjective-img-load-iframe" style="width: 1070px;">
    <div class="md-content">
      <button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn" id="clear_frame_modal"><span class="hiremee-multiply f-18"></span></button>
      <div class="hme-loading-mask" style="height: 100%;">
          <div class="hme-loading-container" >
            <div class="hme-dual-ring"></div>
            <div>Please wait, Loading...</div>
          </div>
      </div>
      <div class="row p-l-15 m-h-700 p-r-15">
        <div class="col-sm-12 col-lg-12">
          <div class="page-header-title m-t-10 m-b-20">
               <h4 class="g-l-b"></h4>
          </div>
          <div class="min-h-550">
               <img id="js-load-img-data" class="img-pr"  style="width:100%; height:570px; object-fit: contain;" allowfullscreen></img>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="md-overlay"></div>
</div>
@if($list->question_wise_score == 1)
<div class="animation-model test-modal">           
  <div class="md-modals md-effect-13" style="top: 60%" data-backdrop="false" id="subjective_ques_wise_score_model" >
    <div class="md-content" style="width: 60%">
      <div class="hme-loading-mask" style="height: 100%;">
          <div class="hme-loading-container" >
            <div class="hme-dual-ring"></div>
            <div>Please wait, Loading...</div>
          </div>
      </div>
      <div class="row p-l-15 m-h-700 p-r-15">
        <div class="col-sm-12 col-lg-12">
          <div class="page-header-title m-t-10 m-b-20">
               <h4 class="g-l-b">Question wise score</h4>
               <!-- Question wisw subjetive score table starts -->
                <input type="hidden" name="question_wise_score" id="question_wise_score" value="{{$list->question_wise_score}}">
                  @if(count($subjective_candidate_score) > 0)
                    <input type="hidden" id="isSubjectiveCanidateScore" value="update">
                  @else
                    <input type="hidden" id="isSubjectiveCanidateScore" value="add">
                  @endif
                  <div class="row form-group">
                    <div class="col-md-12" style="overflow-y: scroll ;max-height: 400px;">
                       <table class="table" id="score-table">
                        <thead>
                          <tr>
                            <th>Question No.</th>
                            <th>Max Marks</th>
                            <th>Secured Marks</th>
                          </tr>
                        </thead>
                        @php $i = 1; $k = 1; @endphp
                        @forelse($subjective_candidate_score as $score)
                        <tr>
                          <td>{{ $i++ }}</td>
                          <td>{{ $score->matrix->questions_scores }}</td>
                          <td><input class="form-control dynamic-score" type="text" name="secured_marks[]" id="secured_marks{{ $score->id }}" value="{{ round($score->score,2) }}" onpaste="return false;" onkeypress="return isNumberKey(event,this.value)"  onkeyup="return validateAndUpdateScore(event,{{$score->matrix->questions_scores}},'js-pro-subjective_score_{{$testpin}}_{{$assign_id}}','dynamic')"><input type="hidden" name="matrix_ids[]" value="{{$score->matrix->id}}"><input type="hidden" name="score_ids[]" value="{{$score->id}}"></td>
                        </tr>
                        @empty
                          @forelse($subjective_matrix_score as $matrix_data)
                            @php
                              $questionCount = $matrix_data->no_of_question;
                              $questionMaxScore = $matrix_data->questions_scores;
                            @endphp
                            @for($j=1;$j<=$questionCount;$j++)
                              <tr>
                                <td>{{ $k }}</td>
                                <td>{{ $questionMaxScore }}</td>
                                <td><input class="form-control static-score" type="text" name="secured_marks[]" id="secured_marks{{ $k }}" value="0" onpaste="return false;" onkeypress="return isNumberKey(event,this.value)"  onkeyup="return validateAndUpdateScore(event,{{$matrix_data->questions_scores}},'js-pro-subjective_score_{{$testpin}}_{{$assign_id}}','static')"><input type="hidden" name="matrix_ids[]" value="{{$matrix_data->id}}"></td>
                              </tr>
                              @php
                                $k++;
                              @endphp
                            @endfor
                          @empty
                          <tr>
                            <td colspan="3" >No data to show</td>
                          </tr>
                          @endforelse
                        @endforelse
                      </table>
                    </div>
                  </div>
                <!-- Question wisw subjetive score table ends -->
          </div>
        </div>
        <div class="col-sm-12 col-lg-12">
          <button type="button" class="btn btn-primary" id="clear_frame_modal_score"><span>OK</span></button>
        </div>
      </div>
    </div>
  </div>
  <div class="md-overlay" style="width: 105%;height: 110%;top: -25px;left: -25px;"></div>
</div>
@endif

<script type="text/javascript">
  function isNumberKey(evt,value)
   {  
    var character = String.fromCharCode(evt.keyCode)
    var newValue = value + character;
    var charCode = (evt.which) ? evt.which : evt.keyCode;

    if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)){
       return false;
    }else{
      if (isNaN(newValue) || hasDecimalPlace(newValue, 3)) {
          return false;
      }else{
        return true;
      }
    }
   }

   function validateAndUpdateScore(evt,limit,marks_id,action)
   {
       if($('#'+evt.target.id).val() > limit ){
        $('#'+evt.target.id).val('');
        swal({
          html: true, 
          title: '', 
          text: 'Secured mark should be less than max marks',
          type: "warning",
          showCancelButton: false,
          confirmButtonText: "OK",
          closeOnConfirm: false,
           confirmButtonColor: '#ffbc01',
        });
        sumTheScores(limit,marks_id,action);
        return false;
      }else{
        sumTheScores(limit,marks_id,action);
        return true;
      }
   }

  function sumTheScores(limit,marks_id,action){
    var sum = 0;
        var securedmarksarray = 
         $("."+action+"-score").each(function () {
             if (!isNaN(this.value) && this.value.length != 0) {
                 sum += parseFloat(this.value);
             }
         });
         $('#'+marks_id).val(parseFloat(sum).toFixed(2));
   }

  function hasDecimalPlace(value, x) {
      var pointIndex = value.indexOf('.');
      return  pointIndex >= 0 && pointIndex < value.length - x;
  }

  $(document).on('click','#subjective_ques_wise_score_view',function(){
        $('#subjective_ques_wise_score_model').addClass('md-show');
  });

  $(document).on('click','#clear_frame_modal_score',function(){
        $('#subjective_ques_wise_score_model').removeClass('md-show');
  });
</script>