@extends('hiremee-revamp.layouts.main-layout')
@section('pageTitle', 'Best Assessment Platform for Students | HireMee')
@section('content')
<style type="text/css">
  .active_nav{
    font-weight: 600 !important;
  }
  .hm-b2c-asses-card-list ul li.active_nav a{
    color: #1E1E1E;
  }
</style>
<link rel="stylesheet" href="{{secure_asset('assets/hiremee-revamp/css/b2c.css')}}"> 

<!-- <img src="{{ URL::asset('assets/hiremee-revamp/images/solutions/voice-proficiency-assessment/voice-proficiency-assessment-banner-img.png')}}" alt=""> -->

<div class="hm-b2c-assessment-page">
   <!-- Breadcrumbs Start -->
   <div class="container-fluid innerBannerBottom darkGreen-bg">
      <nav id="breadcrumbs">
         <ul>
            <li><a href="/">Home</a></li>
            <li>Assessments</li>
         </ul>
      </nav>
   </div>
   <!-- Breadcrumbs End  -->
   <section class="hm-b2c-assess-sec">
      <div class="container">
         <div class="hm-b2c-assess-header">
          <div class="row">
            <div class="col-md-12" id="custom_assessment_header_div">
            <h2>Assessments</h2>
            <p>Students can take control of their education and career paths by identifying strengths, exploring interests, and setting realistic goals.</p>
            </div>
          </div>

         </div>
         <div class="row row-gap-2r">
          {{-- <div class="col-md-6 col-lg-4">
               <div class="hm-b2c-asses-card hm-b2c-filter">
               <h4>FILTER</h4>
               <div class="hm-b2c-asses-card-list">
                <div class="hm-b2c-asses-card-list-title active">
                    <h5>Test Type</h5>
                </div>
                <ul>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Psychometric">Psychometric</a></li>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Talent_Management">Talent Management</a></li>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Coding">Coding</a></li>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Coding">Online Assessment Solutions</a></li>
                </ul>

               </div>
               <div class="hm-b2c-asses-card-list border-0">
                <div class="hm-b2c-asses-card-list-title active">
                    <h5>Categories</h5>
                </div>
                <ul>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Coding">Talent Assessments</a></li>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Coding">Aptitude Assessments</a></li>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Coding">Industry Specific Assessments</a></li>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Coding">Talent Acquisition</a></li>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Coding">Freshers Hiring</a></li>
                  <li><a href="javascript:void(0)" class="filter-nav" id="Coding">Lateral Hiring</a></li>
                </ul>

               </div>
               </div>
            </div> --}}
            <div class="col-lg-12 custom_assessment_render_div" id="custom_assessment_render_div">
                  <!-- Card Item Star  -->
                  <div class="custom_assessment_render_section">
                    {!! $component!!}
                  </div>
                  <!-- Card Item End  -->                  
            </div>

            <div class="col-lg-8 col-md-6 d-none b2c-stock-up-div" id="b2c-stock-up-div">
              <div class="hm-b2c-stock-up-sec-wrapper">
                <img src="{{ URL::asset('assets/hiremee-revamp/images/b2c-web/assessment-stock-up.png')}}" class="img-fluid px-6" alt="Hiremee Assessments">
                <div class="hm-b2c-stock-up-text">
                  <h4>We'll stock up with more assessments.</h4>
                  <p>Keep an eye on this page for further updates.</p>
                </div>
              </div>
            </div>

      </div>
   </section>
</div>

<script>
$(document).ready(function () {
  $(".hm-b2c-asses-card-list-title").click(function () {
    $(this).toggleClass("active").next("ul").slideToggle();
  });  
});
$('body').on('click', '.custom-assessment-pagination a', function(e) {  
  e.preventDefault();
  var url = $(this).attr('href');
  $.ajax({
    url: url,
    success: function(data) {
        $('.custom_assessment_render_section').html(data.component);
    }
   });
});
$('.filter-nav').on('click', function(e) {
  e.preventDefault();
  $('li').removeClass('active_nav');
  $(this).closest('li').addClass('active_nav');
  getAnchorValue(e.target.id)
});
function getAnchorValue(anchorValue) {
    if(anchorValue == 'Psychometric'){
      var test1 = document.getElementById("custom_assessment_render_div");
      if(test1.classList.contains('d-none')){
        $('.custom_assessment_render_div').removeClass('d-none'); 
      }
      var test2 = document.getElementById("b2c-stock-up-div");
      if(!test2.classList.contains('d-none')){
        $('.b2c-stock-up-div').addClass('d-none'); 
      }
      $.ajax({
        url :"{{secure_url('assessments')}}",
        type:"get",
        data:{fiter_value:anchorValue},
        success: function(response){
          if(response.status == 200){
            $('.custom_assessment_render_section').html(response.component);
            var scrollDiv = document.getElementById("custom_assessment_header_div").offsetTop;
            window.scrollTo({ top: scrollDiv, behavior: 'smooth'});
          }
        }
      })
    }else{
      var test1 = document.getElementById("custom_assessment_render_div");
      if(!test1.classList.contains('d-none')){
        $('.custom_assessment_render_div').addClass('d-none'); 
      }
      var test2 = document.getElementById("b2c-stock-up-div");
      if(test2.classList.contains('d-none')){
        $('.b2c-stock-up-div').removeClass('d-none');
        var scrollDiv = document.getElementById("custom_assessment_header_div").offsetTop;
        window.scrollTo({ top: scrollDiv, behavior: 'smooth'});
      }
    }    
}
$(document).on('click','.waiting-assessment', function() { 
   swal({
         html: true, 
         title: '<span class="sweet-danger-text">Waiting for schedule</span>', 
         text: "Assessment not mapped",
         type: "warning",
         showCancelButton: false,
         confirmButtonText: "OK",
         closeOnConfirm: false
       });
 });
</script>


@endsection