@extends('layouts.adminapp')

@section('content')
<style>
.richTextBtn{
    padding: 3px;
    font-size: 13px;
}
</style>

{{-- APPLICATION FORM --}}
<x-app-flash/>
  
  <div class="card">
    <div class="card-header">     
      <div class="row">
          <div class="col-sm-12 col-md-6 col-lg-7">
            <h1 class="h3 mb-2 text-gray-800">{{__('lng.CreateCertificate')}} </h1> 
          </div>
          <div class="col-sm-12 col-md-6 col-lg-5">
            <label for="">{{__('lng.SelectCertificate')}}</label>
            <select class="form-control" onchange="SelectCertificate(this.value)">
              @foreach ($ApplicationForms as $ApplicationForm)
                <option value="{{$ApplicationForm->id}}" {{$ApplicationForm->id == $SelectedApplication? 'Selected':''}}>{{$ApplicationForm->title}}</option>
              @endforeach
            </select>
          </div>           
      </div>    
    </div>
        <div class="card-body" id="result-body">
        </div>
        <div class="card-footer">
        </div>
  </div>

<script>
    SelectCertificate('{{$SelectedApplication}}');

    function SelectCertificate(Value){
        $.ajax({
            url: '{{ route('SelectCertificate') }}',
            method: "get",
            data: {_token: '{{ csrf_token() }}',Value:Value},
            success: function (response){  
            // alert(response);
                LoadRechtextBox();
                document.getElementById('result-body').innerHTML=response; 
            }
        }); 
    }

    function LoadRechtextBox(){
      $(document).ready(function() {
        $('#summernote').summernote({
          placeholder: 'Text.....',
          tabsize: 4,
          height: 375,
          focus: true   
        });
      });
      
    }

    function AddRechText(ButtonText){
      var MediumText=' <button  onclick="removeText(this.id)" data-value='+ButtonText+' id='+ButtonText+' class="btn btn-primary richTextBtn" type="button">'+ButtonText+' </button> <span class='+ButtonText+'>&nbsp;</span>';
      $('#summernote').summernote('pasteHTML', MediumText);
      $('#summernote').summernote('editor.setLastRange', 3);

    }

    function removeText(Value){
      $('#'+Value).remove();
      $('.'+Value).remove();
    }

</script>

@endsection