@php $technicalRating = ($record->technical_rating) ?? 0;
$communicationRating = ($record->communication_rating) ?? 0;
$behavioralRating = ($record->behavioral_rating) ?? 0;
$evaluationBy = ($record->reviewed_by) ?? Auth::user()->id;
@endphp

<div class="card w-100">
  <div class="card-body">
    <h4 class="card-title">Submit Evaluation</h4>


    <form method="post" id="updateEvaluationInfo">
      <div class="container-fluid">

        <div class="row">
          <div class="col-sm-4 col-lg-4">
            <label for="fname">Evaluation Type</label>
            {!! Form::select('type', $evaluation, ($record->type) ?? "", array('class' => 'form-control', 'placeholder' => 'Please Select...', 'id' => 'eval_type')) !!}
          </div>
          <div class="col-sm-4 col-lg-4">
            <label for="fname">Evaluation By <span>*</span></label>
            {!! Form::select('reviewed_by', $users, $evaluationBy, array('class' => 'form-control', 'placeholder' => 'Please Select...', 'id' => 'eval_by')) !!}
          </div>
          <div class="col-sm-4 col-lg-4">
            <label for="fname">Hiring Recommendation</label>
            {!! Form::select('hiring_recommendation', $hiringR, ($record->hiring_recommendation) ?? "", array('class' => 'form-control', 'placeholder' => 'Please Select...', 'id' => 'hiring')) !!}
          </div>
          <div class="col-md-4 py-4">
            <label for="fname">Technical competency</label>

            <div class="rating-stars">
              <ul class='stars'>
                <li class='star @if($technicalRating >= 1){{"selected"}}@endif' title='Poor' data-value='1'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($technicalRating >= 2){{"selected"}}@endif' title='Fair' data-value='2'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($technicalRating >= 3){{"selected"}}@endif' title='Good' data-value='3'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($technicalRating >= 4){{"selected"}}@endif' title='Excellent' data-value='4'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($technicalRating >= 5){{"selected"}}@endif' title='WOW!!!' data-value='5'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
              </ul>
              <input type="hidden" class="ratinginput" name="technical_rating" value="{{$technicalRating}}">
            </div>
            {!! Form::textarea('technical_summary', ($record->technical_summary) ?? "", array( 'class' => 'form-control','id' => "tech_comp", 'rows' => 5)) !!}
          </div>
          <div class="col-md-4 py-4">
            <label for="fname">Communication competency</label>
            <div class="rating-stars">
              <ul class='stars'>
                <li class='star @if($communicationRating >= 1){{"selected"}}@endif' title='Poor' data-value='1'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($communicationRating >= 2){{"selected"}}@endif' title='Fair' data-value='2'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($communicationRating >= 3){{"selected"}}@endif' title='Good' data-value='3'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($communicationRating >= 4){{"selected"}}@endif' title='Excellent' data-value='4'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($communicationRating >= 5){{"selected"}}@endif' title='WOW!!!' data-value='5'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
              </ul>
              <input type="hidden" class="ratinginput" name="communication_rating" value="{{$communicationRating}}">
            </div>
            {!! Form::textarea('communication_summary', ($record->communication_summary) ?? "", array( 'class' => 'form-control','id' => "com_comp", 'rows' => 5)) !!}
          </div>
          <div class="col-md-4 py-4">
            <label for="fname">Behavioral Analysis</label>
            <div class="rating-stars">
              <ul class='stars'>
                <li class='star @if($behavioralRating >= 1){{"selected"}}@endif' title='Poor' data-value='1'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($behavioralRating >= 2){{"selected"}}@endif' title='Fair' data-value='2'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($behavioralRating >= 3){{"selected"}}@endif' title='Good' data-value='3'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($behavioralRating >= 4){{"selected"}}@endif' title='Excellent' data-value='4'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
                <li class='star @if($behavioralRating >= 5){{"selected"}}@endif' title='WOW!!!' data-value='5'>
                  <i class='fa fa-star fa-fw'></i>
                </li>
              </ul>
              <input type="hidden" class="ratinginput" name="behavioral_rating" value="{{$behavioralRating}}">
            </div>
            {!! Form::textarea('behavioral_summary', ($record->behavioral_summary) ?? "", array( 'class' => 'form-control','id' => "analysis", 'rows' => 5)) !!}
          </div>
          <div class="col-sm-4 col-lg-4">
            <label for="fname">Top 3 Key Strengths</label>
            {!! Form::textarea('key_strengths', ($record->key_strengths) ?? "", array( 'class' => 'form-control','id' => "strengths", 'rows' => 5)) !!}
          </div>
          <div class="col-sm-4 col-lg-4">
            <label for="fname">Top 3 Key Concerns</label>
            {!! Form::textarea('key_concerns', ($record->key_concerns) ?? "", array( 'class' => 'form-control','id' => "concerns", 'rows' => 5)) !!}
          </div>
          <div class="col-sm-4 col-lg-4">
            <label for="fname">Recommended Next Steps</label>
            {!! Form::textarea('recommended_next_steps', ($record->recommended_next_steps) ?? "", array( 'class' => 'form-control','id' => "next_steps", 'rows' => 5)) !!}
          </div>
          
        </div>
        <div class="row mt-3">
          <div class="col-sm-3">
            <button class="btn btn-primary btn-lg btn-block" type="button" onclick="updateEvaluation('{{($record->id) ?? 0}}')">Update</button>
          </div>
        </div>

      </div>
    </form>
  </div>
</div>
  


<script>
  $(document).ready(function() {

    /* 1. Visualizing things on Hover - See next part for action on click */
    $('.stars li').on('mouseover', function() {
      var onStar = parseInt($(this).data('value'), 10); // The star currently mouse on

      // Now highlight all the stars that's not after the current hovered star
      $(this).parent().children('li.star').each(function(e) {
        if (e < onStar) {
          $(this).addClass('hover');
        } else {
          $(this).removeClass('hover');
        }
      });

    }).on('mouseout', function() {
      $(this).parent().children('li.star').each(function(e) {
        $(this).removeClass('hover');
      });
    });


    /* 2. Action to perform on click */
    $('.stars li').on('click', function() {
      var onStar = parseInt($(this).data('value'), 10); // The star currently selected
      var stars = $(this).parent().children('li.star');

      for (i = 0; i < stars.length; i++) {
        $(stars[i]).removeClass('selected');
      }

      for (i = 0; i < onStar; i++) {
        $(stars[i]).addClass('selected');
      }
      $(this).closest('ul').next('.ratinginput').val(i);
    });


  });
</script>