@extends('layouts.default', ['appTopMenu' => true])
@section('title','Display Content') 
@push('scripts')

<link rel="stylesheet" href="{{ asset('css/jquery-ui.css')}}" />
<script src="{{ asset('js/jquery-ui.js') }}"></script>

<script src="{{ asset('js/hcrti/application.js')}}"></script>
 
 <meta name="csrf-token" content="{{ csrf_token() }}" />
 <link href="/assets/plugins/select2/dist/css/select2.min.css" rel="stylesheet" />

<script src="/assets/plugins/select2/dist/js/select2.min.js" defer></script>
<link href="/assets/plugins/bootstrap-datepicker/dist/css/bootstrap-datepicker.css" rel="stylesheet" />
<script src="/assets/plugins/bootstrap-datepicker/dist/js/bootstrap-datepicker.js" defer></script>

<script src="/assets/plugins/sweetalert/dist/sweetalert.min.js"></script>


<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>

 <script type="text/javascript">
 
 

  $(".date").datepicker({
  todayHighlight: true,
    autoclose: true,
	opens: "right",
    dateFormat: "dd-mm-yy"
  });
 
  $.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});
</script>
@endpush

@section('content')
<div class="card mb-3">

            <div class="card-header card-bg-color ">View Content Ebook </div>
                <div class="card-body">
                <div class="container">
  <div class="row">
    <div class="col">
    <select name="ebook" id="ebook" class="form-select form-select-sm @error('lst_case') border border-danger @enderror"> 
                                    <option value="0" selected> Select Book</otpion>
                                      @foreach($listOfBooks as $ebook)
                                        <option value="{{$ebook->id}}"> {{$ebook->ebook_name}}</otpion>
                                            @endforeach
                                            </select>

                                    @error('app_type')
                                        <small class="help-block text-danger">{{ $message }}</small>
                                    @enderror
    </div>
    <div class="col">
    <select name="chapter" id="chapter"  class="form-select form-select-sm @error('lst_case') border border-danger @enderror"> 
                                    <option  value="0" selected> Select Chapter</otpion>
                                            </select>
    </div>
    <div class="col">
    <select name="heading" id="heading"  class="form-select form-select-sm @error('lst_case') border border-danger @enderror"> 
                                    <option value="0" selected> Select Heading</otpion>
                                            </select>
    </div>
    <div class="col">
    <select name="sub_heading" id="sub_heading"  class="form-select form-select-sm @error('lst_case') border border-danger @enderror"> 
                                    <option value="0" selected> Select Sub Heading</otpion>
                                            </select>
    </div>
    <div class="col">
    <select name="subsubheading" id="subsubheading"  class="form-select form-select-sm @error('lst_case') border border-danger @enderror"> 
                                    <option value="0" selected> Select Sub Sub Heading</otpion>
                                            </select>
    </div>
  </div>
</div>
<div class="container">
<div class="row">
   OR 
</div>
</div>


                    <div class="row">
                        <div class="col-xl-6 mb-6">
                                <div class="col-sm-3 mb-3">
                                    <input type="text" name="search_term" id="search_term"  class="form-control form-control-sm" placeholder="Enter Term to Search"> 
                                </div>
                            </div>
                            <div class="row">
                            </div>


                            <div class="row">
                            <div class="col-sm-6 mb-6">
                              <input type="button" value="Show Content" class="btn btn-primary" id="showContent" />
</div>
</div>


<div class="row">
                                <div class="col-sm-9 mb-9" id="content_of_chapter" style="margin-top:40px;">
 

</div>
</div>

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


            </form>
        </div>
       

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


<script>
$(document).ready(function(){
// alert("its working");
$("#ebook").change(function(){
  $("#chapter").empty().append('<option value="0" selected="selected">Select Chapter</option>');
var ebook=$("#ebook").val();
  $.ajax({
   url:"get-chapter-list",
   data:"ebook="+ebook,
   method:"GET",
   success:function(data){
                    $("#chapter").append(data);
   }
  });
});


$('body').on('click', '#showContent', function () {
  $("#content_of_chapter").html('');
  var book=$("#ebook").val();
  var chapter=$("#chapter").val();
  var heading=$("#heading").val();
  var sub_heading=$("#sub_heading").val();
  var search_term=$("#search_term").val();
  $.ajax({
   url:"get-content-of-chapter",
   data:"chapter="+chapter+"&book="+book+"&heading="+heading+"&search_term="+search_term+"&sub_heading="+sub_heading,
   method:"GET",
   success:function(data){
    $("#content_of_chapter").html(data);
//    $("#content_of_chapter").css("border","2px solid #0083d8");
   } 
  });
})   

$('body').on('change', '#chapter', function () {
  $("#heading").empty().append('<option value="0" selected="selected">Select Heading</option>');
var chapter=$("#chapter").val();
  $.ajax({
   url:"get-heading-list",
   data:"chapter="+chapter,
   method:"GET",
   success:function(data){
                    $("#heading").append(data);
   }
  });
});

$('body').on('change', '#heading', function () {
  $("#sub_heading").empty().append('<option value="0" selected="selected">Select Sub Heading</option>');
var heading=$("#heading").val();
  $.ajax({
   url:"get-sub_heading-list",
   data:"heading="+heading,
   method:"GET",
   success:function(data){
                    $("#sub_heading").append(data);
   }
  });
});


$( "#date" ).datepicker();


$(".numeric").keypress(function (e) {
                if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
                    $(".errmsg").html("Digits Only").show().fadeOut("slow");
                    return false;
                }
            });

$("#buttonSubmitChapter").click(function(){

  var ebook=$("#ebook").val();
  var chapter_number=$("#chapter_number").val();
  var chapter_title=$("#chapter_title").val();
  var chapter_content=$("#chapter_content").val();
  var chapter_number_amendment_date=$("#chapter_number_amendment_date").val();
  // var heading=$("#heading").val();
  // var sub_heading=$("#sub_heading").val();
  // var sub_sub_heading=$("#sub_sub_heading").val();

  function resetForm(){
//    $("#chapter_entry_detail").html("");
    $("#txtcaseno").val("");
    document.getElementById("copyingApplicationForm").reset();
  }
//data:"ebook_name="+ebook_name+"&heading="+heading+"&sub_heading="+sub_heading+"&sub_sub_heading="+sub_sub_heading,

  $.ajax({
url:"add_chapter",
data:"ebook="+ebook+"&chapter_number="+chapter_number+"&chapter_title="+chapter_title+"&chapter_content="+chapter_content+"&chapter_number_amendment_date="+chapter_number_amendment_date,
method:"POST",
success:function(data){
  resetForm();
console.log(data);
$("#chapter_entry_detail").addClass("alert alert-success");
$("#chapter_entry_detail").html(data);
$("#amount_total").text("");
}
});

})


// $('.document_count').on('click', function() {
//     // Loop through all checkboxes
//     $('.document_count').each(function() {
//       // Check if the checkbox is checked
//       if ($(this).prop('checked')) {
//         console.log('Checkbox ' + $(this).val() + ' is checked');
//       } else {
//         console.log('Checkbox ' + $(this).val() + ' is unchecked');
//       }
//     });
//   });


});


function get_total(pages_num,check_box_index){
//alert(this);
var chk_box='chk'+eval(check_box_index);
//alert($(this));
// alert("Amount to be count based on selected pages");
var current_amount=parseInt($("#current_amount").val());
var app_type=$("#app_type").val();
if(app_type=="Ordinary"){
amount_per_page=5;
}
else 
if(app_type=="Express"){
amount_per_page=8;
}

//alert(chk_box);

var getVal=document.getElementById(chk_box).checked //JavaScript

if (getVal==true) {

  page_amount=parseInt(pages_num) * (parseInt(amount_per_page));
total_amount=current_amount+page_amount;
}
else {
  page_amount=parseInt(pages_num) * (parseInt(amount_per_page));
total_amount=current_amount-page_amount;
}
$("#current_amount").val(total_amount);

//alert("total amount="+total_amount);

$("#amount_total").text("Total Amount ="+total_amount);

}




</script>


@endsection

@push('scripts')