@extends('layouts.app_admin')

  @section('content')
    <main class="page-content course_page">
    <div class="container-fluid"> 
      <div class="breadcrumb1">
        <ul>
          <li><a href="{{ url('admin-dashboard') }}">Dashboard ></a></li>
          <li><a href="{{ url('course-list')}}">Course List ></a></li>
          <li>Post Job</li>
        </ul>
      </div>
      <!-- Breadcumb End -->
      <div class="form-wrapper form-with-info add-field">
        <form action="{{ url('add-course') }}" method="post" enctype='multipart/form-data' id="add-course">
          {{ csrf_field() }}
        <div class="basic-info-sec1">
            <div class="row">
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">
                    <label for="course_name_en">Course Name (English)</label>
                    <input type="text" class="form-control" id="course_name_en" placeholder="Enter Course Name (English)" name="course_name_en" onchange="get_my_hindi_text(this.value,this);" data-rule-required="true" data-msg-required="Enter course name in English" >
                    @if ($errors->has('course_name_en'))
                    <span for="course_name_en" class="error_validate" style="display:block;">
                        {{ $errors->first('course_name_en') }}
                    </span>
                    @endif
                    <div class="loader_div_element">
                        <img src="{{url('/public/admin_assets/images/admin_loader.gif')}}" style="width:50px;height:50px;"><span>Please wait we are translating your text..</span>
                    </div>
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="course_name_hn">Course Name (Hindi)</label>
                    <input type="text" class="form-control" id="course_name_hn" placeholder="Enter Course Name (Hindi)" name="course_name_hn" data-rule-required="true" data-msg-required="Enter course name in Hindi.">
                    @if ($errors->has('course_name_hn'))
                    <span for="course_name_hn" class="error_validate" style="display:block;">
                        {{ $errors->first('course_name_hn') }}
                    </span>
                    @endif
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="authority_id">Course Authority</label>
                    <div class="select-box">
                        <select  class="select2 form-control" name="authority_id" id="authority_id" data-rule-required="true" data-msg-required="Please select course authority">
                            <option value="">Select Coures Authority</option>
                            @forelse($authority as $auth)
                            <option value="{{ $auth->authority_id }}">{{ $auth->authority_name_en }}</option>
                            @empty
                            <option value="">No Authority Found</option>
                            @endforelse
                        </select>
                        <span for="authority_id" class="error_validate"></span>
                    </div>
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="course_category_id">Course Category</label>
                    <div class="select-box">
                        <select  class="test form-control" name="course_category_id[]" id="course_category_id" multiple="multiple" data-rule-required="true" data-msg-required="Please select course category.">
                            <option value="">Select Coures Category</option>
                            @forelse($course_category as $cat)
                            <option value="{{ $cat->course_category_id }}">{{ $cat->course_category_name_en }}</option>
                            @empty
                            <option value="">No Course Category Found</option>
                            @endforelse
                        </select>
                    </div>
                </div>
               <!--  <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="participant_level">Course Participants</label>
                    <div class="select-box">
                        <select  class="test form-control" name="participant_level[]" id="participant_level" multiple="multiple" data-rule-required="true" data-msg-required="Please select Participants Lavel">
                            <option value="">Select Coures Participants</option>
                            @forelse($participant_level as $part)
                            <option value="{{ $part->participants_id }}">{{ $part->participants_name_en }}</option>
                            @empty
                            <option value="">No Course Participants Found</option>
                            @endforelse
                        </select>
                    </div>
                </div> -->
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="course_duration">Duration in Days</label>
                    <input type="text" class="form-control" name="course_duration" id="course_duration" placeholder="Enter Duration in Days" name="duration_in_days" data-rule-required="true" digits="true" data-msg-required="Enter duration in days.">
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="calender_description_en">Calender Description(English)</label>
                    <textarea type="text" class="form-control" id="calender_description_en" placeholder="Enter calender description in English." name="calender_description_en" onchange="get_my_hindi_text(this.value,this);" data-rule-required="true" data-msg-required="Please enter calender description in English."></textarea>
                    <div class="loader_div_cal_desc" style="display: none;">
                        <div>
                            <img src="{{url('/public/admin_assets/images/admin_loader.gif')}}" style="width:50px;height:50px;"><span>Please wait we are translating your text..</span>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="calender_description_hn">Calender Description(Hindi)</label>
                    <textarea type="text" class="form-control" id="calender_description_hn" placeholder="Enter calender description in Hindi." name="calender_description_hn" onchange="get_my_hindi_text(this.value,this);" data-rule-required="true" data-msg-required="Please enter calender description in Hindi."></textarea>
                </div>
                <div class="col-lg-12 col-xl-6 form-group">            
                    <label for="course_description_en">Course Description(English)</label>
                    <textarea  type="text" class="form-control editor1" id="course_description_en" placeholder="Enter Course Description(English)" name="course_description_en" data-rule-required="true" data-msg-required="Enter course description in English."></textarea> 
                    <span for="course_description_en" class="error_validate"></span>
                    <div class="want-hindi">            
                         <input type="checkbox" class="form-control" id="wanthindi" name="wanthindi">
          
              
                         <label for="wanthindi">Do you want to covert in Hindi ?</label>
                    </div>
                    <div class="loader_div_element_content">
                        <div>
                            <img src="{{url('/public/admin_assets/images/admin_loader.gif')}}" style="width:50px;height:50px;"><span>Please wait we are translating your text..</span>
                        </div>
                    </div>
                </div>
                <div class="col-lg-12 col-xl-6 form-group">            
                    <label for="course_description_hn">Course Description(Hindi)</label>
                    <textarea  type="text" class="form-control editor2" id="course_description_hn" placeholder="Enter Course Description(Hindi)" name="course_description_hn" ></textarea> 
                    <span for="course_description_hn" class="error_validate"></span>
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="meta_title">Meta Title</label>
                    <input type="text" class="form-control" id="meta_title" placeholder="Enter Meta Title" name="meta_title" >
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="meta_key">Meta Key</label>
                    <input type="text" class="form-control" id="meta_key" placeholder="Enter Meta Key" name="meta_key">
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="meta_description">Meta Description</label>
                    <textarea  type="text" class="form-control" id="meta_description" placeholder="Enter Meta Description" name="meta_description" ></textarea> 
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="meta_value">Meta Value</label>
                    <textarea  type="text" class="form-control" id="meta_value" placeholder="Enter Meta Value" name="meta_value"></textarea> 
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="course_img">Course Image</label>
                    <div class=" browse-file-section">
                        <input type="file" name="course_img" class="file" style="visibility: hidden;position: absolute;" data-rule-required="true" data-msg-required="Please select course image">
                        <div class="input-group col-xs-12">
                          <input type="text" class="form-control" disabled placeholder="Upload Image">
                          <span class="input-group-btn">
                          <button class="browse btn btn-primary input-lg" type="button"><i class="fa fa-upload" aria-hidden="true"></i> Browse</button>
                          </span>
                        </div>
                        <span for="course_img" class="error_validate"></span>
                    </div>
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="course_pdf">Course Pdf (English).</label>
                    <div class="browse-file-section">
                        <input type="file" name="course_pdf" class="file" style="visibility: hidden;position: absolute;" >
                        <div class="input-group col-xs-12">
                            <input type="text" class="form-control" disabled placeholder="Upload Pdf">
                            <span class="input-group-btn">
                            <button class="browse btn btn-primary input-lg" type="button"><i class="fa fa-upload" aria-hidden="true"></i> Browse</button>
                            </span>
                        </div>
                        <span for="course_pdf" class="error_validate"></span>
                    </div>
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="course_pdf_hindi">Course Pdf (Hindi).</label>
                    <div class="browse-file-section">
                        <input type="file" name="course_pdf_hindi" class="file" style="visibility: hidden;position: absolute;" >
                        <div class="input-group col-xs-12">
                            <input type="text" class="form-control" disabled placeholder="Upload Pdf">
                            <span class="input-group-btn">
                            <button class="browse btn btn-primary input-lg" type="button"><i class="fa fa-upload" aria-hidden="true"></i> Browse</button>
                            </span>
                        </div>
                        <span for="course_pdf_hindi" class="error_validate"></span>
                    </div>
                </div>
                <div class="col-lg-6 col-xl-3 col-md-6 form-group">            
                    <label for="course_status">Course Status</label>
                    <div class="select-box">
                        <select class="select2" name="course_status" id="course_status" data-rule-required="true" data-msg-required="Please select course status">
                            <option value="" selected>Select Course Status</option>
                            <option value="active">Active</option>
                            <option value="inactive">Inactive</option>
                        </select>
                        <span for="course_status" class="error_validate"></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
           <div class="col-lg-12 form-group">
              <label for="pstatus">Add Topic</label>
           </div>
           <div class="col-lg-12" id="attribute_section_add_main">
              <div class="row_div" id="attribute_section_add" style="clear:both;">
                 <div class="row topic-name">
                    <div class="col-lg-4 col-md-6 form-group">
                       <div class="form-group" for="lecture_name_en">

                        <input type="text" name="lecture_name_en[]" id="lecture_name_en_0" placeholder="Topic Name English" onkeypress="autolecture(this);" class="lecture_name_en" onchange="get_my_hindi_text_clone(this.value,this);" data-rule-required="true" data-msg-required="Please enter topic name in English.">
                        <input type="hidden" name="lecture_id[]" class="lec_id">
                       </div>
                    </div>
                    <div class="col-lg-4 col-md-6 form-group">
                       <div class="form-group">
                        <input type="text" name="lecture_name_hn[]" id="lecture_name_hn_0" placeholder="Topic Name English" class="lecture_name_hn" data-rule-required="true" data-msg-required="Please enter topic name in Hindi.">
                       </div>
                    </div>

                    <div class="col-lg-4 col-md-6 form-group">
                       <div class="form-group">
                        <input type="text" name="lecture_duration[]" placeholder="Topic Duration (in minutes.)"  onchange="get_my_hindi_text_clone(this.value,this);" class="lecture_duration" digits="true" data-rule-required="true" data-msg-required="Please enter topic Duration in minutes.">
                       </div>
                    </div>
                    <div class="col-lg-4 col-md-6 form-group topic-name">
                       <div class="form-group">
                        <textarea id="textarea_description_en_0" name="lecture_description_en[]" placeholder="Topic Description in English" class="lecture_description_en" onchange="get_my_hindi_text_clone(this.value,this);" data-rule-required="true" data-msg-required="Please enter topic description in English."></textarea>
                       </div>
                    </div>
                    <div class="col-lg-4 col-md-6 form-group topic-name">
                       <div class="form-group">
                        <textarea id="textarea_description_hn_0" name="lecture_description_hn[]" placeholder="Topic Description in Hindi" class="lecture_description_hn" data-rule-required="true" data-msg-required="Please enter topic description in Hindi."></textarea>
                       </div>
                    </div>
                    <div class="col-lg-4 col-md-6 form-group topic-name">       
                      <a href="javascript:void(0);" class="btn btn-primary btn-green" title="Add" onclick="attribute_cloning_add();">
                       <i class="fa fa-plus"></i>
                      </a>
                      <a  href="javascript:void(0);" id="attribute_cloning" class="btn btn-primary btn-red" title="Remove" onclick="remove_current_div_venues($(this));">
                       <i class="fa fa-minus"></i>
                      </a>
                    </div>
                 </div>
              </div>
           </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div class="text-center form-btn">
              <button class="common-btn active" id="page_sub_btn">Add</button>
              <a href="{{ url('course-list') }}" class="common-btn">Cancel</a>
             </div>
          </div>
        </div>
    
    
      </form>
      </div>
    </div> <!-- container fluid -->
  </main>
  <!-- page-content" -->
</div>
<!-- page-wrapper -->

<link href="{{ asset('public/admin_assets/css/jquery-ui.css') }}" rel="stylesheet"/>
<script type="text/javascript" src="{{ asset('public/admin_assets/js/jquery-ui.js') }}"></script>
<script src="{{ url('/public/admin_assets/developer_validate/jquery.validate.min.js')}}"></script>
<script src="{{ url('/public/admin_assets/developer_validate/custom_validate.js')}}"></script>

<script type="text/javascript">
    $('#add-course').validate({
        ignore: [],
        onfocusout: function(element) {
        this.element(element);
        },
        errorClass: 'error_validate',
        errorElement:'span',
        highlight: function(element, errorClass) {
        $(element).removeClass(errorClass);

        },
        submitHandler:function(form)
        {
    
       $('#page_sub_btn').prop("disabled", true);
       form.submit();
        }
    });
 
  $(document).on('click', '.browse', function(){
    var file = $(this).parent().parent().parent().find('.file');
    file.trigger('click');
  });
  $(document).on('change', '.file', function(){
    $(this).parent().find('.form-control').val($(this).val().replace(/C:\\fakepath\\/i, ''));
  });
  


 jQuery(function(){
 jQuery('#course_start_date').datetimepicker({
  timepicker: false,
   format: 'Y-m-d',
   formatDate: 'Y-m-d',
  onShow:function( ct ){
   this.setOptions({
    maxDate:jQuery('#course_end_date').val()?jQuery('#course_end_date').val():false
   })
  },

 });

 jQuery('#course_end_date').datetimepicker({
  timepicker: false,
   format: 'Y-m-d',
   formatDate: 'Y-m-d',
  onShow:function( ct ){
   this.setOptions({
    minDate:jQuery('#course_start_date').val()?jQuery('#course_start_date').val():false
   })
  },
  
 });
});


  $(function() {
      // turn the element to select2 select style
    CKEDITOR.replace( 'course_description_en' );
    CKEDITOR.replace( 'course_description_hn' );
    });
  
  $(function() {
            $('.test').fSelect();
        });
    
   $(function() {
      // turn the element to select2 select style
      $('.select2').select2();
    });



function CK_jQ() {
    for (instance in CKEDITOR.instances) {
        CKEDITOR.instances[instance].updateElement();
    }
}




  /******For Convert In Hindi Text Start*********/
    
    function get_my_hindi_text(get_text,get_attr){

        if(get_text != ''){

          var get_attr_id = $(get_attr).attr("id");
          // alert(get_attr_id);
          if (get_attr_id == 'course_name_en') {

            $("#course_name_hn").attr("disabled","disabled");

            $('.loader_div_element').css('display','block');

            $.ajax({
              
                type:'POST',
               
                url:'{{ url("/hindi-translate-method1") }}',
               
                data:{ get_english_text : get_text, "_token" : '