@extends('layouts.front')
@section('content')
<section>
  <div class="lgx-banner lgx-banner-inner">
    <div class="lgx-inner">
      <div class="container">
        <div class="row">
          <div class="col-xs-12">
            <div class="lgx-heading-area">
              <div class="lgx-heading lgx-heading-white">
                <h2 class="heading-title">Welcome To Vidya Shree Academy Jaipur e-Class</h2>
            </div>
            <ul class="breadcrumb">
                <li><a href="{{ url('/') }}"><i class="icon-home6"></i>Home</a></li>
                <li class="active">e-Book</li>
            </ul>
        </div>
    </div>
</div><!--//.ROW-->
</div><!-- //.CONTAINER -->
</div><!-- //.INNER -->
</div>
</section>
<!--PHOTO GALLERY-->
<section>
  <div class="lgx-inner">
    <div class="container">
        <h3>Class</h3>
        <h2 style="margin-bottom: 0px;color: #f30101;border: 2px solid #444444;width: 104px;border-radius: 8px;padding: 0px 5px;font-size: 15px;font-weight: bold;">Select Class</h2>
        @if(isset($class) && !empty($class))
        <div class="row" style="padding-top: 4%;">
            @foreach($class as $key => $value)
            <div class="col-lg-2 col-xs-6" style="padding-bottom: 2%;">
                <a href="{{ route('ebook','class_id=' . $value->id) }}">
                    <div style="border: 1px solid #69696942;border-radius: 6px;border-left: 4px solid #e42d2dcf;border-right: 4px solid #e42d2dcf;background: #2c69ac21;">
                        <h3 class="text-center">{{ $value->class_name }}</h3>
                    </div>
                </a>
            </div>       
            @endforeach
        </div>
        @else
        <div class="row" style="padding-top: 4%;">
            <div class="col-lg-12">
                <h2 class="text-center">Class not Found</h2>
            </div>
        </div>
        @endif        
    </div> 
</div>
</section>
<!--PHOTO GALLERY END-->
@endsection


@section('script')
<script type="text/javascript">
    $("#class_id").on("change", function () {
      var class_id = $("#class_id option:selected").attr('value');
      if (class_id) {
        $.ajax({
          beforeSend: function(){
            $("#class_loader i").show();
        },
        type : 'POST',
        url : '{{ route('get-subject') }}',
        data : {'_token' : '{{ csrf_token() }}', 'class_id': class_id},
        dataType : 'html',
        success : function (data){
            $("#class_loader i").hide();
            $('#subject_id').empty();
            $('#subject_id').append(data);
        }
    });
    }
});

</script>
@endsection