@extends('layouts/contentNavbarLayout')

@if (!isset($coupon))
  @section('title', 'Create Coupon')
@else
  @section('title', 'Update Coupon')
@endif

@section('page-script')
<script src="{{asset('assets/js/pages-account-settings-account.js')}}"></script>
<script src="{{asset('assets/js/ui-toasts.js')}}"></script>
@endsection

@section('content')
<h4 class="py-3 mb-4">
  <span class="text-muted fw-light">Coupon</span>
</h4>

<div class="row">
  <div class="col-md-12">
    <ul class="nav nav-pills flex-column flex-md-row mb-3">
      @php
        $rol = @Session::has('admin')?'admin':'business';
      @endphp
      <li class="nav-item"><a class="nav-link" href="{{url('/'.$rol.'/coupons')}}"><i class="bx bx-user me-1"></i> List</a></li>
      <li class="nav-item">
        <a class="nav-link active" href="#">
          @if (!isset($coupon))
            <i class="bx bx-message-square-add me-1"></i> Add
          @else
            <i class="bx bx-message-square-edit me-1"></i> Update
          @endif
        </a>
      </li>
      <!--<li class="nav-item"><a class="nav-link" href="{{url('pages/account-settings-connections')}}"><i class="bx bx-link-alt me-1"></i> Connections</a></li>-->
    </ul>
    <div class="card mb-4">
      <h5 class="card-header">Coupon Details</h5>
      <!-- Account -->
      @if (!isset($coupon))
        <form id="" method="POST" action="{{ route('save-coupon') }}" enctype="multipart/form-data">
          @csrf
          <div class="card-body">
            @if (\Session::has('error'))
              @include('content.notification.notification', ['msg' => \Session::get('error')])
            @endif
            <div class="d-flex align-items-start align-items-sm-center gap-4">
              <img src="{{asset('assets/img/backgrounds/18.jpg')}}" alt="user-avatar" class="d-block rounded" height="100" width="100" id="uploadedAvatar" />
              <div class="button-wrapper">
                <label style="position: relative;" for="upload" class="btn btn-primary me-2 mb-4" tabindex="0">
                  <span class="d-none d-sm-block">Upload new photo</span>
                  <i class="bx bx-upload d-block d-sm-none"></i>

                  @include('content.special-field.field',
                  [
                    'id' => 'upload',
                    'type' => 'file',
                    'field' => 'imageCoupon',
                    'message' => isset($message)?$message:\Session::get('error')
                  ])
                </label>
                <button type="button" class="btn btn-outline-secondary account-image-reset mb-4">
                  <i class="bx bx-reset d-block d-sm-none"></i>
                  <span class="d-none d-sm-block">Reset</span>
                </button>

                <p class="text-muted mb-0">Allowed JPG, GIF or PNG. Max size of 800K</p>
              </div>
            </div>
          </div>
          <hr class="my-0">
          <div class="card-body">
            <div class="row">
              <div class="mb-3 col-md-6">
                <label for="couponTitle" class="form-label">Title</label>
                @include('content.special-field.field',
                [
                  'id'=> 'couponTitle',
                  'type' => 'text',
                  'placeholder' => 'Coupon Title',
                  'field' => 'title',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <div class="mb-3 col-md-6">
                <label for="couponStartDate" class="form-label">Start Date</label>
                @include('content.special-field.field',
                [
                  'id'=> 'couponStartDate',
                  'type' => 'date',
                  'placeholder' => '',
                  'field' => 'couponStartDate',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <div class="mb-3 col-md-6">
                  <small class="text-light fw-medium">Type of promo</small>
                  <div class="mt-2" style="display: flex;">
                      <div class="form-check col-md-4">
                          <input name="couponType" class="form-check-input" type="radio"
                          value="price" id="defaultRadio2" @if( old('couponType') == 'price') checked @endif />
                          <label class="form-check-label" for="defaultRadio2">
                              Price
                          </label>
                      </div>
                      <div class="form-check col-md-4">
                          <input name="couponType" class="form-check-input" type="radio"
                          value="percent" id="defaultRadio1" @if( old('couponType') == 'percent') checked @endif />
                          <label class="form-check-label" for="defaultRadio1">
                              Percent
                          </label>
                      </div>
                      <div class="form-check col-md-4">
                          <input name="couponType" class="form-check-input" type="radio"
                          value="promo" id="defaultRadio3" @if( old('couponType') == 'promo') checked @endif />
                          <label class="form-check-label" for="defaultRadio3">
                              Promo
                          </label>
                      </div>
                  </div>
              </div>
              <div class="mb-3 col-md-6">
                <label for="couponEndDate" class="form-label">End Date</label>
                @include('content.special-field.field',
                [
                  'id'=> 'couponEndDate',
                  'type' => 'date',
                  'placeholder' => '',
                  'field' => 'couponEndDate',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <div class="mb-3 col-md-6 value-cyc price">
                <label for="couponPriceBefore" class="form-label">Price Before</label>
                @include('content.special-field.field',
                [
                  'id'=> 'couponPriceBefore',
                  'type' => 'text',
                  'placeholder' => '99.99',
                  'field' => 'couponPriceBefore',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <div class="mb-3 col-md-6 value-cyc percent" style="display: none">
                <label for="couponDiscount" class="form-label">Discount</label>
                @include('content.special-field.field',
                [
                  'id'=> 'couponDiscount',
                  'type' => 'text',
                  'placeholder' => '40',
                  'field' => 'couponDiscount',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <!--<div class="mb-3 col-md-6">
                  <label for="couponPhone" class="form-label">Phone</label>
                  <select id="couponPhone" name="couponPhone" class="form-select">
                      <option>--Select--</option>
                      <option value="9545932741">954 593 2741</option>
                      <option value="9546054785">954 605 4785</option>
                      <option value="9812545740">981 254 5740</option>
                  </select>
              </div>-->
              <div class="mb-3 col-md-6 value-cyc price">
                <label for="couponPriceAfter" class="form-label">Price After</label>
                @include('content.special-field.field',
                [
                  'id'=> 'couponPriceAfter',
                  'type' => 'text',
                  'placeholder' => '49.99',
                  'field' => 'couponPriceAfter',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <div class="mb-3 col-md-6 value-cyc promo" style="display: none">
                <label for="couponCondition" class="form-label">Condition</label>
                @include('content.special-field.field',
                [
                  'id'=> 'couponCondition',
                  'type' => 'text',
                  'placeholder' => 'Only fridays',
                  'field' => 'couponCondition',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <div class="mb-3 col-md-6">
                <label for="couponTotal" class="form-label">Total Coupons</label>
                @include('content.special-field.field',
                [
                  'id'=> 'couponTotal',
                  'type' => 'text',
                  'placeholder' => '50',
                  'field' => 'couponTotal',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <div class="mb-3 col-md-12">
                  <label for="couponDescription" class="form-label">Subtitle</label>
                  <textarea class="form-control" name="couponDescription" id="couponDescription" rows="3">

                  </textarea>
              </div>
            </div>
            <div class="row">
              @if ( Session::get('domains')<=1 && Session::get('rol') == 'business')
                @include('content.special-field.field',
                [
                  'id'=> 'domain_id',
                  'type' => 'hidden',
                  'placeholder' => '',
                  'value' => isset($domain->id) ? $domain->id : '',
                  'field' => 'domain_id',
                  'message' => isset($message)?$message:''
                ])
              @else
                <div class="mb-3 col-md-4">
                  <label for="idDomain" class="form-label">Website</label>
                  <input class="form-control" data-entity="domain" data-finder="true" type="text" id="idDomain" name="idDomain" />
                  @include('content.special-field.field',
                  [
                    'id'=> 'domain_id',
                    'type' => 'hidden',
                    'placeholder' => '',
                    'field' => 'domain_id',
                    'message' => isset($message)?$message:''
                  ])
                </div>
              @endif
              <div class="mb-3 col-md-4">
                <label for="idCategory" class="form-label">Category</label>
                <input class="form-control" data-entity="category" data-finder="true" type="text" id="idCategory" name="idCategory" />
                @include('content.special-field.field',
                [
                  'id'=> 'category_id',
                  'type' => 'hidden',
                  'placeholder' => '',
                  'field' => 'category_id',
                  'message' => isset($message)?$message:''
                ])
              </div>
              <div class="mb-3 col-md-4">
                <label for="idLocation" class="form-label">Location</label>
                <div id="listaLocation" class="list-group">

                </div>
                <input class="form-control" placeholder="Select a website" data-entity="location" data-selectable="true" type="text" id="idLocation" name="idLocation" />
                <input type="hidden" id="location_id" name="location_id"/>
                <input type="hidden" id="location_list"/>
              </div>
            </div>
            <div class="row">
              <div class="nav-align-top mb-4">
                <ul class="nav nav-tabs" role="tablist">
                  <li class="nav-item" role="presentation">
                    <button type="button" class="nav-link active" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-home" aria-controls="navs-top-home" aria-selected="true">Details</button>
                  </li>
                  <li class="nav-item" role="presentation">
                    <button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-profile" aria-controls="navs-top-profile" aria-selected="false" tabindex="-1">Privacy & Policy</button>
                  </li>
                  <li class="nav-item" role="presentation">
                    <button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-messages" aria-controls="navs-top-messages" aria-selected="false" tabindex="-1">Terms & Conditions</button>
                  </li>
                </ul>
                <div class="tab-content">
                  <div class="tab-pane fade active show" id="navs-top-home" role="tabpanel">
                    <textarea name="details" id="details" class="form-control">

                    </textarea>
                  </div>
                  <div class="tab-pane fade" id="navs-top-profile" role="tabpanel">
                    <textarea name="privandpol" id="privandpol" class="form-control"></textarea>
                  </div>
                  <div class="tab-pane fade" id="navs-top-messages" role="tabpanel">
                    <textarea name="termandcond" id="termandcond" class="form-control"></textarea>
                  </div>
                </div>
              </div>
            </div>
            <div class="mt-2">
              <button type="submit" class="btn btn-primary me-2">Save changes</button>
              <a href="{{ url()->previous() }}" type="reset" class="btn btn-outline-secondary">Cancel</a>
            </div>
          </div>
        </form>
      @else
        @if( Session::get('rol') == 'business' && $coupon->state != 'approved' )
          <form id="" method="POST" action="{{ route('edit-coupon') }}" enctype="multipart/form-data">
            @csrf
            <div class="card-body">
              @if(Session::has('error'))
                @include('content.notification.notification', ['msg' => \Session::get('error')])
                <script>
                  $(document).ready(function(){
                    let toastPlacementExample = document.querySelector('.toast-clickyourcity-notify'),
                    selectedType = 'bg-danger';
                    toastPlacementExample.classList.add(selectedType);
                    //console.log(toastPlacementExample);
                    DOMTokenList.prototype.add.apply(toastPlacementExample.classList, ['bottom', 'end', 'right']);
                    toastPlacement = new bootstrap.Toast(toastPlacementExample);
                    toastPlacement.show();
                  });
                </script>
              @endif
              <input type="hidden" name="hash" value="{{$coupon->hash}}"/>
              <div class="d-flex align-items-start align-items-sm-center gap-4">

                <img src="{{ empty($coupon->image) ? asset('assets/img/backgrounds/18.jpg') : asset($coupon->image)}}" alt="user-avatar" class="d-block rounded" height="100" width="100" id="uploadedAvatar" />
                <div class="button-wrapper">
                  <label for="upload" class="btn btn-primary me-2 mb-4" tabindex="0">
                    <span class="d-none d-sm-block">Upload new photo</span>
                    <i class="bx bx-upload d-block d-sm-none"></i>
                    @include('content.special-field.field',
                    [
                      'id' => 'upload',
                      'type' => 'file',
                      'field' => 'imageCoupon',
                      'message' => isset($message)?$message:\Session::get('error')
                    ])
                  </label>
                  <button type="button" class="btn btn-outline-secondary account-image-reset mb-4">
                    <i class="bx bx-reset d-block d-sm-none"></i>
                    <span class="d-none d-sm-block">Reset</span>
                  </button>

                  <p class="text-muted mb-0">Allowed JPG, GIF or PNG. Max size of 800K</p>
                </div>
              </div>
            </div>
            <hr class="my-0">
            <div class="card-body">
              <div class="row">
                <input type="hidden" name="hash" value="{{$coupon->hash}}"/>
                <div class="mb-3 col-md-6">
                  <label for="couponTitle" class="form-label">Title</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponTitle',
                    'type' => 'text',
                    'placeholder' => 'Coupon Title',
                    'value' => $coupon->title,
                    'field' => 'title',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6">
                  <label for="couponStartDate" class="form-label">Start Date</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponStartDate',
                    'type' => 'date',
                    'placeholder' => '',
                    'value' => $coupon->startDate,
                    'field' => 'couponStartDate',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6">
                    <small class="text-light fw-medium">Type of promo</small>
                    <div class="mt-2" style="display: flex;">
                        <div class="form-check col-md-4">
                            <input name="couponType" class="form-check-input" type="radio"
                            value="price" id="defaultRadio2"
                            @if($coupon->typeValue=='price')
                              checked
                            @endif/>
                            <label class="form-check-label" for="defaultRadio2">
                                Price
                            </label>
                        </div>
                        <div class="form-check col-md-4">
                            <input name="couponType" class="form-check-input" type="radio"
                            value="percent" id="defaultRadio1"
                            @if($coupon->typeValue=='percent')
                              checked
                            @endif/>
                            <label class="form-check-label" for="defaultRadio1">
                                Percent
                            </label>
                        </div>
                        <div class="form-check col-md-4">
                            <input name="couponType" class="form-check-input" type="radio"
                            value="promo" id="defaultRadio3"
                            @if($coupon->typeValue=='promo')
                              checked
                            @endif/>
                            <label class="form-check-label" for="defaultRadio3">
                                Promo
                            </label>
                        </div>
                    </div>
                </div>
                <div class="mb-3 col-md-6">
                  <label for="couponEndDate" class="form-label">End Date</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponEndDate',
                    'type' => 'date',
                    'placeholder' => '',
                    'value' => $coupon->endDate,
                    'field' => 'couponEndDate',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6 value-cyc price" @if($coupon->typeValue!='price') style="display:none" @endif>
                  <label for="couponPriceBefore" class="form-label">Price Before</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponPriceBefore',
                    'type' => 'text',
                    'placeholder' => '99.99',
                    'value' => $coupon->priceBefore,
                    'field' => 'couponPriceBefore',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6 value-cyc percent" @if($coupon->typeValue!='percent') style="display:none" @endif>
                  <label for="couponDiscount" class="form-label">Discount</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponDiscount',
                    'type' => 'text',
                    'placeholder' => '40',
                    'value' => $coupon->percent,
                    'field' => 'couponDiscount',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <!--<div class="mb-3 col-md-6">
                    <label for="couponPhone" class="form-label">Phone</label>
                    <select id="couponPhone" name="couponPhone" class="form-select">
                        <option>--Select--</option>
                        <option value="9545932741">954 593 2741</option>
                        <option value="9546054785">954 605 4785</option>
                        <option value="9812545740">981 254 5740</option>
                    </select>
                </div>-->
                <div class="mb-3 col-md-6 value-cyc price" @if($coupon->typeValue!='price') style="display:none" @endif>
                  <label for="couponPriceAfter" class="form-label">Price After</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponPriceAfter',
                    'type' => 'text',
                    'placeholder' => '49.99',
                    'value' => $coupon->priceAfter,
                    'field' => 'couponPriceAfter',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <!--<div class="mb-3 col-md-6">
                  <label for="couponEmail" class="form-label">E-mail</label>
                  <input class="form-control" type="text" id="couponEmail" name="couponEmail" value="{{$coupon->email}}" placeholder="john.doe@example.com" />
                </div>-->
                <div class="mb-3 col-md-6 value-cyc promo" @if($coupon->typeValue!='promo') style="display:none" @endif>
                  <label for="couponCondition" class="form-label">Condition</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponCondition',
                    'type' => 'text',
                    'placeholder' => 'Only fridays',
                    'value' => $coupon->condition,
                    'field' => 'couponCondition',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6">
                  <label for="couponTotal" class="form-label">Total Coupons</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponTotal',
                    'type' => 'text',
                    'placeholder' => '50',
                    'value' => $coupon->quantity,
                    'field' => 'couponTotal',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-12">
                    <label for="couponDescription" class="form-label">Subtitle</label>
                    <textarea class="form-control" name="couponDescription" id="couponDescription" rows="3">
                      {{$coupon->shortDescription}}
                    </textarea>
                </div>
              </div>
              <div class="row">
              @if ( Session::get('domains')<=1 && Session::get('rol') == 'business')

                @include('content.special-field.field',
                [
                  'id'=> 'domain_id',
                  'type' => 'hidden',
                  'placeholder' => '',
                  'value' => isset($domain->id) ? $domain->id : '',
                  'field' => 'domain_id',
                  'message' => isset($message)?$message:''
                ])
              @else
                <div class="mb-3 col-md-4">
                  <label for="idDomain" class="form-label">Website</label>
                  <input value="{{ $domain[0]->friendlyName }} - {{ $domain[0]->name }}" class="form-control" data-entity="domain" data-finder="true" type="text" id="idDomain" name="idDomain" />
                  @include('content.special-field.field',
                  [
                    'id'=> 'domain_id',
                    'type' => 'hidden',
                    'placeholder' => '',
                    'value' => $coupon->domain_id,
                    'field' => 'domain_id',
                    'message' => isset($message)?$message:''
                  ])
                </div>
              @endif
                <div class="mb-3 col-md-4">
                  <label for="idCategory" class="form-label">Category</label>
                  <input value="{{ $category->name }}" class="form-control" data-entity="category" data-finder="true" type="text" id="idCategory" name="idCategory" />
                  @include('content.special-field.field',
                  [
                    'id'=> 'category_id',
                    'type' => 'hidden',
                    'placeholder' => '',
                    'value' => $coupon->category_id,
                    'field' => 'category_id',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-4">
                  <label for="idLocation" class="form-label">Location</label>
                  <div id="listaLocation" class="list-group">

                  </div>
                  <input class="form-control" data-entity="location" data-selectable="true" type="text" id="idLocation" name="idLocation" />

                  @include('content.special-field.field',
                  [
                    'id'=> 'location_id',
                    'type' => 'hidden',
                    'placeholder' => '',
                    'value' => $coupon_location[0]->hashes,
                    'field' => 'location_id',
                    'message' => isset($message)?$message:''
                  ])
                  <input type="hidden" id="location_list" value="{{ $locations[0]->locations }}"/>
                  <!--<label for="multiple-select-content" class="form-label">Locations</label>
                  <div class="s2bs5-example" id="multiple-select-content" data-select2-id="select2-data-multiple-select-content">
                    <div class="tab-pane fade active show" id="multiple-select-ltr-content" role="tabpanel" aria-labelledby="multiple-select-ltr-tab" data-select2-id="select2-data-multiple-select-ltr-content">
                      <div dir="ltr" data-select2-id="select2-data-12-kyy7">

                        <select class="form-select select2-hidden-accessible" id="multiple-select-location" data-placeholder="Choose a domain" multiple="" data-select2-id="select2-data-multiple-select-location" tabindex="-1" aria-hidden="true">

                        </select>

                      </div>
                      <script>
                        $( '#multiple-select-location' ).select2( {
                            theme: "bootstrap-5",
                            width: $( this ).data( 'width' ) ? $( this ).data( 'width' ) : $( this ).hasClass( 'w-100' ) ? '100%' : 'style',
                            placeholder: $( this ).data( 'placeholder' ),
                            closeOnSelect: false,
                        } );
                      </script>
                    </div>
                  </div>-->
                </div>
              </div>
              <div class="row">
                <div class="nav-align-top mb-4">
                  <ul class="nav nav-tabs" role="tablist">
                    <li class="nav-item" role="presentation">
                      <button type="button" class="nav-link active" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-home" aria-controls="navs-top-home" aria-selected="true">Details</button>
                    </li>
                    <li class="nav-item" role="presentation">
                      <button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-profile" aria-controls="navs-top-profile" aria-selected="false" tabindex="-1">Privacy & Policy</button>
                    </li>
                    <li class="nav-item" role="presentation">
                      <button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-messages" aria-controls="navs-top-messages" aria-selected="false" tabindex="-1">Terms & Conditions</button>
                    </li>
                  </ul>
                  <div class="tab-content">
                    <div class="tab-pane fade active show" id="navs-top-home" role="tabpanel">
                      <textarea name="details" id="details" class="form-control">
                        {{ $coupon->details }}
                      </textarea>
                    </div>
                    <div class="tab-pane fade" id="navs-top-profile" role="tabpanel">
                      <textarea name="privandpol" id="privandpol" class="form-control">
                        {{ $coupon->privandpol }}
                      </textarea>
                    </div>
                    <div class="tab-pane fade" id="navs-top-messages" role="tabpanel">
                      <textarea name="termandcond" id="termandcond" class="form-control">
                        {{ $coupon->termandcond }}
                      </textarea>
                    </div>
                  </div>
                </div>
              </div>
              <div class="mt-2">
                <button type="submit" class="btn btn-primary me-2">Save changes</button>
                <a href="{{ url()->previous() }}" type="reset" class="btn btn-outline-secondary">Cancel</a>
              </div>
            </div>
          </form>
        @endif
        @if( Session::get('rol') == 'business' && $coupon->state == 'approved' )
          <div class="card-body"><h1>This coupon was approved and can't be edited.</h1></div>
        @endif
        @if( Session::get('rol') == 'admin')
          <form id="" method="POST" action="{{ route('edit-coupon') }}" enctype="multipart/form-data">
            @csrf
            <div class="card-body">
              @if(Session::has('error'))
                @include('content.notification.notification', ['msg' => \Session::get('error')])
                <script>
                  $(document).ready(function(){
                    let toastPlacementExample = document.querySelector('.toast-clickyourcity-notify'),
                    selectedType = 'bg-danger';
                    toastPlacementExample.classList.add(selectedType);
                    //console.log(toastPlacementExample);
                    DOMTokenList.prototype.add.apply(toastPlacementExample.classList, ['bottom', 'end', 'right']);
                    toastPlacement = new bootstrap.Toast(toastPlacementExample);
                    toastPlacement.show();
                  });
                </script>
              @endif
              <input type="hidden" name="hash" value="{{$coupon->hash}}"/>
              <div class="d-flex align-items-start align-items-sm-center gap-4">

                <img src="{{ empty($coupon->image) ? asset('assets/img/backgrounds/18.jpg') : asset($coupon->image)}}" alt="user-avatar" class="d-block rounded" height="100" width="100" id="uploadedAvatar" />
                <div class="button-wrapper">
                  <label for="upload" class="btn btn-primary me-2 mb-4" tabindex="0">
                    <span class="d-none d-sm-block">Upload new photo</span>
                    <i class="bx bx-upload d-block d-sm-none"></i>
                    @include('content.special-field.field',
                    [
                      'id' => 'upload',
                      'type' => 'file',
                      'field' => 'imageCoupon',
                      'message' => isset($message)?$message:\Session::get('error')
                    ])
                  </label>
                  <button type="button" class="btn btn-outline-secondary account-image-reset mb-4">
                    <i class="bx bx-reset d-block d-sm-none"></i>
                    <span class="d-none d-sm-block">Reset</span>
                  </button>

                  <p class="text-muted mb-0">Allowed JPG, GIF or PNG. Max size of 800K</p>
                </div>
              </div>
            </div>
            <hr class="my-0">
            <div class="card-body">
              <div class="row">
                <input type="hidden" name="hash" value="{{$coupon->hash}}"/>
                <div class="mb-3 col-md-6">
                  <label for="couponTitle" class="form-label">Title</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponTitle',
                    'type' => 'text',
                    'placeholder' => 'Coupon Title',
                    'value' => $coupon->title,
                    'field' => 'title',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6">
                  <label for="couponStartDate" class="form-label">Start Date</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponStartDate',
                    'type' => 'date',
                    'placeholder' => '',
                    'value' => $coupon->startDate,
                    'field' => 'couponStartDate',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6">
                    <small class="text-light fw-medium">Type of promo</small>
                    <div class="mt-2" style="display: flex;">
                        <div class="form-check col-md-4">
                            <input name="couponType" class="form-check-input" type="radio"
                            value="price" id="defaultRadio2"
                            @if($coupon->typeValue=='price')
                              checked
                            @endif/>
                            <label class="form-check-label" for="defaultRadio2">
                                Price
                            </label>
                        </div>
                        <div class="form-check col-md-4">
                            <input name="couponType" class="form-check-input" type="radio"
                            value="percent" id="defaultRadio1"
                            @if($coupon->typeValue=='percent')
                              checked
                            @endif/>
                            <label class="form-check-label" for="defaultRadio1">
                                Percent
                            </label>
                        </div>
                        <div class="form-check col-md-4">
                            <input name="couponType" class="form-check-input" type="radio"
                            value="promo" id="defaultRadio3"
                            @if($coupon->typeValue=='promo')
                              checked
                            @endif/>
                            <label class="form-check-label" for="defaultRadio3">
                                Promo
                            </label>
                        </div>
                    </div>
                </div>
                <div class="mb-3 col-md-6">
                  <label for="couponEndDate" class="form-label">End Date</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponEndDate',
                    'type' => 'date',
                    'placeholder' => '',
                    'value' => $coupon->endDate,
                    'field' => 'couponEndDate',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6 value-cyc price" @if($coupon->typeValue!='price') style="display:none" @endif>
                  <label for="couponPriceBefore" class="form-label">Price Before</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponPriceBefore',
                    'type' => 'text',
                    'placeholder' => '99.99',
                    'value' => $coupon->priceBefore,
                    'field' => 'couponPriceBefore',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6 value-cyc percent" @if($coupon->typeValue!='percent') style="display:none" @endif>
                  <label for="couponDiscount" class="form-label">Discount</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponDiscount',
                    'type' => 'text',
                    'placeholder' => '40',
                    'value' => $coupon->percent,
                    'field' => 'couponDiscount',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <!--<div class="mb-3 col-md-6">
                    <label for="couponPhone" class="form-label">Phone</label>
                    <select id="couponPhone" name="couponPhone" class="form-select">
                        <option>--Select--</option>
                        <option value="9545932741">954 593 2741</option>
                        <option value="9546054785">954 605 4785</option>
                        <option value="9812545740">981 254 5740</option>
                    </select>
                </div>-->
                <div class="mb-3 col-md-6 value-cyc price" @if($coupon->typeValue!='price') style="display:none" @endif>
                  <label for="couponPriceAfter" class="form-label">Price After</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponPriceAfter',
                    'type' => 'text',
                    'placeholder' => '49.99',
                    'value' => $coupon->priceAfter,
                    'field' => 'couponPriceAfter',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <!--<div class="mb-3 col-md-6">
                  <label for="couponEmail" class="form-label">E-mail</label>
                  <input class="form-control" type="text" id="couponEmail" name="couponEmail" value="{{$coupon->email}}" placeholder="john.doe@example.com" />
                </div>-->
                <div class="mb-3 col-md-6 value-cyc promo" @if($coupon->typeValue!='promo') style="display:none" @endif>
                  <label for="couponCondition" class="form-label">Condition</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponCondition',
                    'type' => 'text',
                    'placeholder' => 'Only fridays',
                    'value' => $coupon->condition,
                    'field' => 'couponCondition',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-6">
                  <label for="couponTotal" class="form-label">Total Coupons</label>
                  @include('content.special-field.field',
                  [
                    'id'=> 'couponTotal',
                    'type' => 'text',
                    'placeholder' => '50',
                    'value' => $coupon->quantity,
                    'field' => 'couponTotal',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-12">
                    <label for="couponDescription" class="form-label">Subtitle</label>
                    <textarea class="form-control" name="couponDescription" id="couponDescription" rows="3">
                      {{$coupon->shortDescription}}
                    </textarea>
                </div>
              </div>
              <div class="row">
                <div class="mb-3 col-md-4">
                  <label for="idDomain" class="form-label">Website</label>
                  <input value="{{ $domain[0]->friendlyName }} - {{ $domain[0]->name }}" class="form-control" data-entity="domain" data-finder="true" type="text" id="idDomain" name="idDomain" />
                  @include('content.special-field.field',
                  [
                    'id'=> 'domain_id',
                    'type' => 'hidden',
                    'placeholder' => '',
                    'value' => $coupon->domain_id,
                    'field' => 'domain_id',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-4">
                  <label for="idCategory" class="form-label">Category</label>
                  <input value="{{ $category->name }}" class="form-control" data-entity="category" data-finder="true" type="text" id="idCategory" name="idCategory" />
                  @include('content.special-field.field',
                  [
                    'id'=> 'category_id',
                    'type' => 'hidden',
                    'placeholder' => '',
                    'value' => $coupon->category_id,
                    'field' => 'category_id',
                    'message' => isset($message)?$message:''
                  ])
                </div>
                <div class="mb-3 col-md-4">
                  <label for="idLocation" class="form-label">Location</label>
                  <div id="listaLocation" class="list-group">

                  </div>
                  <input class="form-control" data-entity="location" data-selectable="true" type="text" id="idLocation" name="idLocation" />

                  @include('content.special-field.field',
                  [
                    'id'=> 'location_id',
                    'type' => 'hidden',
                    'placeholder' => '',
                    'value' => $coupon_location[0]->hashes,
                    'field' => 'location_id',
                    'message' => isset($message)?$message:''
                  ])
                  <input type="hidden" id="location_list" value="{{ $locations[0]->locations }}"/>
                  <!--<label for="multiple-select-content" class="form-label">Locations</label>
                  <div class="s2bs5-example" id="multiple-select-content" data-select2-id="select2-data-multiple-select-content">
                    <div class="tab-pane fade active show" id="multiple-select-ltr-content" role="tabpanel" aria-labelledby="multiple-select-ltr-tab" data-select2-id="select2-data-multiple-select-ltr-content">
                      <div dir="ltr" data-select2-id="select2-data-12-kyy7">

                        <select class="form-select select2-hidden-accessible" id="multiple-select-location" data-placeholder="Choose a domain" multiple="" data-select2-id="select2-data-multiple-select-location" tabindex="-1" aria-hidden="true">

                        </select>

                      </div>
                      <script>
                        $( '#multiple-select-location' ).select2( {
                            theme: "bootstrap-5",
                            width: $( this ).data( 'width' ) ? $( this ).data( 'width' ) : $( this ).hasClass( 'w-100' ) ? '100%' : 'style',
                            placeholder: $( this ).data( 'placeholder' ),
                            closeOnSelect: false,
                        } );
                      </script>
                    </div>
                  </div>-->
                </div>
              </div>
              <div class="row">
                <div class="nav-align-top mb-4">
                  <ul class="nav nav-tabs" role="tablist">
                    <li class="nav-item" role="presentation">
                      <button type="button" class="nav-link active" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-home" aria-controls="navs-top-home" aria-selected="true">Details</button>
                    </li>
                    <li class="nav-item" role="presentation">
                      <button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-profile" aria-controls="navs-top-profile" aria-selected="false" tabindex="-1">Privacy & Policy</button>
                    </li>
                    <li class="nav-item" role="presentation">
                      <button type="button" class="nav-link" role="tab" data-bs-toggle="tab" data-bs-target="#navs-top-messages" aria-controls="navs-top-messages" aria-selected="false" tabindex="-1">Terms & Conditions</button>
                    </li>
                  </ul>
                  <div class="tab-content">
                    <div class="tab-pane fade active show" id="navs-top-home" role="tabpanel">
                      <textarea name="details" id="details" class="form-control">
                        {{ $coupon->details }}
                      </textarea>
                    </div>
                    <div class="tab-pane fade" id="navs-top-profile" role="tabpanel">
                      <textarea name="privandpol" id="privandpol" class="form-control">
                        {{ $coupon->privandpol }}
                      </textarea>
                    </div>
                    <div class="tab-pane fade" id="navs-top-messages" role="tabpanel">
                      <textarea name="termandcond" id="termandcond" class="form-control">
                        {{ $coupon->termandcond }}
                      </textarea>
                    </div>
                  </div>
                </div>
              </div>
              <div class="mt-2">
                <button type="submit" class="btn btn-primary me-2">Save changes</button>
                <a href="{{ url()->previous() }}" type="reset" class="btn btn-outline-secondary">Cancel</a>
              </div>
            </div>
          </form>
        @endif
      @endif
      <!-- /Account -->
    </div>

  </div>
</div>
<script>
    $(document).ready(function(){

      $("input[name='couponType']").change(function(e){
          let clase = $(e.currentTarget).val();
          $(".value-cyc").css("display", "none");
          $("."+clase).css("display", "block");
      });

      if($("input[name='couponType']:checked").length > 0){
        $(".value-cyc").css("display", "none");
        if($("input[name='couponType']:checked").val() == 'price'){
          $(".price").css("display", "block");
        }
        else if($("input[name='couponType']:checked").val() == 'percent'){
          $(".percent").css("display", "block");
        }
        else if($("input[name='couponType']:checked").val() == 'promo'){
          $(".promo").css("display", "block");
        }
      }


      ClassicEditor
      .create(document.querySelector("#details"), {
        // https://ckeditor.com/docs/ckeditor5/latest/features/toolbar/toolbar.html#extended-toolbar-configuration-format
        toolbar: {
            items: [
                'exportPDF','exportWord', '|',
                'findAndReplace', 'selectAll', '|',
                'heading', '|',
                'bold', 'italic', 'strikethrough', 'underline', 'code', 'subscript', 'superscript', 'removeFormat', '|',
                'bulletedList', 'numberedList', 'todoList', '|',
                'outdent', 'indent', '|',
                'undo', 'redo',
                '-',
                'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor', 'highlight', '|',
                'alignment', '|',
                'link', 'uploadImage', 'blockQuote', 'insertTable', 'mediaEmbed', 'codeBlock', 'htmlEmbed', '|',
                'specialCharacters', 'horizontalLine', 'pageBreak', '|',
                'textPartLanguage', '|',
                'sourceEditing'
            ],
            shouldNotGroupWhenFull: true
        },
        // Changing the language of the interface requires loading the language file using the <script> tag.
        // language: 'es',
        list: {
            properties: {
                styles: true,
                startIndex: true,
                reversed: true
            }
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/headings.html#configuration
        heading: {
            options: [
                { model: 'paragraph', title: 'Paragraph', class: 'ck-heading_paragraph' },
                { model: 'heading1', view: 'h1', title: 'Heading 1', class: 'ck-heading_heading1' },
                { model: 'heading2', view: 'h2', title: 'Heading 2', class: 'ck-heading_heading2' },
                { model: 'heading3', view: 'h3', title: 'Heading 3', class: 'ck-heading_heading3' },
                { model: 'heading4', view: 'h4', title: 'Heading 4', class: 'ck-heading_heading4' },
                { model: 'heading5', view: 'h5', title: 'Heading 5', class: 'ck-heading_heading5' },
                { model: 'heading6', view: 'h6', title: 'Heading 6', class: 'ck-heading_heading6' }
            ]
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/editor-placeholder.html#using-the-editor-configuration
        placeholder: 'Details of your coupon!',
        // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-family-feature
        fontFamily: {
            options: [
                'default',
                'Arial, Helvetica, sans-serif',
                'Courier New, Courier, monospace',
                'Georgia, serif',
                'Lucida Sans Unicode, Lucida Grande, sans-serif',
                'Tahoma, Geneva, sans-serif',
                'Times New Roman, Times, serif',
                'Trebuchet MS, Helvetica, sans-serif',
                'Verdana, Geneva, sans-serif'
            ],
            supportAllValues: true
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-size-feature
        fontSize: {
            options: [ 10, 12, 14, 'default', 18, 20, 22 ],
            supportAllValues: true
        },
        // Be careful with the setting below. It instructs CKEditor to accept ALL HTML markup.
        // https://ckeditor.com/docs/ckeditor5/latest/features/general-html-support.html#enabling-all-html-features
        htmlSupport: {
            allow: [
                {
                    name: /.*/,
                    attributes: true,
                    classes: true,
                    styles: true
                }
            ]
        },
        // Be careful with enabling previews
        // https://ckeditor.com/docs/ckeditor5/latest/features/html-embed.html#content-previews
        htmlEmbed: {
            showPreviews: true
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/link.html#custom-link-attributes-decorators
        link: {
            decorators: {
                addTargetToExternalLinks: true,
                defaultProtocol: 'https://',
                toggleDownloadable: {
                    mode: 'manual',
                    label: 'Downloadable',
                    attributes: {
                        download: 'file'
                    }
                }
            }
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/mentions.html#configuration
        mention: {
            feeds: [
                {
                    marker: '@',
                    feed: [
                        '@apple', '@bears', '@brownie', '@cake', '@cake', '@candy', '@canes', '@chocolate', '@cookie', '@cotton', '@cream',
                        '@cupcake', '@danish', '@donut', '@dragée', '@fruitcake', '@gingerbread', '@gummi', '@ice', '@jelly-o',
                        '@liquorice', '@macaroon', '@marzipan', '@oat', '@pie', '@plum', '@pudding', '@sesame', '@snaps', '@soufflé',
                        '@sugar', '@sweet', '@topping', '@wafer'
                    ],
                    minimumCharacters: 1
                }
            ]
        },
        // The "superbuild" contains more premium features that require additional configuration, disable them below.
        // Do not turn them on unless you read the documentation and know how to configure them and setup the editor.
        removePlugins: [
            // These two are commercial, but you can try them out without registering to a trial.
            // 'ExportPdf',
            // 'ExportWord',
            'AIAssistant',
            'CKBox',
            'CKFinder',
            'EasyImage',
            // This sample uses the Base64UploadAdapter to handle image uploads as it requires no configuration.
            // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/base64-upload-adapter.html
            // Storing images as Base64 is usually a very bad idea.
            // Replace it on production website with other solutions:
            // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/image-upload.html
            // 'Base64UploadAdapter',
            'RealTimeCollaborativeComments',
            'RealTimeCollaborativeTrackChanges',
            'RealTimeCollaborativeRevisionHistory',
            'PresenceList',
            'Comments',
            'TrackChanges',
            'TrackChangesData',
            'RevisionHistory',
            'Pagination',
            'WProofreader',
            // Careful, with the Mathtype plugin CKEditor will not load when loading this sample
            // from a local file system (file://) - load this site via HTTP server if you enable MathType.
            'MathType',
            // The following features are part of the Productivity Pack and require additional license.
            'SlashCommand',
            'Template',
            'DocumentOutline',
            'FormatPainter',
            'TableOfContents',
            'PasteFromOfficeEnhanced',
            'CaseChange'
        ],
        image: {
            toolbar: [ 'toggleImageCaption', 'imageTextAlternative', 'ckboxImageEdit' ]
        }
      })
      .then( editorDetails => {
        console.log( editorDetails );
        window.editorDetails = editorDetails;
      })
      .catch( error => {
            console.error( error );
      });
      //console.log(window.editorDetails.getData());
      //const editorDetails = await ClassicEditor();

      ClassicEditor.create(document.getElementById("privandpol"), {
        // https://ckeditor.com/docs/ckeditor5/latest/features/toolbar/toolbar.html#extended-toolbar-configuration-format
        toolbar: {
            items: [
                'exportPDF','exportWord', '|',
                'findAndReplace', 'selectAll', '|',
                'heading', '|',
                'bold', 'italic', 'strikethrough', 'underline', 'code', 'subscript', 'superscript', 'removeFormat', '|',
                'bulletedList', 'numberedList', 'todoList', '|',
                'outdent', 'indent', '|',
                'undo', 'redo',
                '-',
                'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor', 'highlight', '|',
                'alignment', '|',
                'link', 'uploadImage', 'blockQuote', 'insertTable', 'mediaEmbed', 'codeBlock', 'htmlEmbed', '|',
                'specialCharacters', 'horizontalLine', 'pageBreak', '|',
                'textPartLanguage', '|',
                'sourceEditing'
            ],
            shouldNotGroupWhenFull: true
        },
        // Changing the language of the interface requires loading the language file using the <script> tag.
        // language: 'es',
        list: {
            properties: {
                styles: true,
                startIndex: true,
                reversed: true
            }
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/headings.html#configuration
        heading: {
            options: [
                { model: 'paragraph', title: 'Paragraph', class: 'ck-heading_paragraph' },
                { model: 'heading1', view: 'h1', title: 'Heading 1', class: 'ck-heading_heading1' },
                { model: 'heading2', view: 'h2', title: 'Heading 2', class: 'ck-heading_heading2' },
                { model: 'heading3', view: 'h3', title: 'Heading 3', class: 'ck-heading_heading3' },
                { model: 'heading4', view: 'h4', title: 'Heading 4', class: 'ck-heading_heading4' },
                { model: 'heading5', view: 'h5', title: 'Heading 5', class: 'ck-heading_heading5' },
                { model: 'heading6', view: 'h6', title: 'Heading 6', class: 'ck-heading_heading6' }
            ]
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/editor-placeholder.html#using-the-editor-configuration
        placeholder: 'Put privacy & policy of your coupon!',
        // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-family-feature
        fontFamily: {
            options: [
                'default',
                'Arial, Helvetica, sans-serif',
                'Courier New, Courier, monospace',
                'Georgia, serif',
                'Lucida Sans Unicode, Lucida Grande, sans-serif',
                'Tahoma, Geneva, sans-serif',
                'Times New Roman, Times, serif',
                'Trebuchet MS, Helvetica, sans-serif',
                'Verdana, Geneva, sans-serif'
            ],
            supportAllValues: true
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-size-feature
        fontSize: {
            options: [ 10, 12, 14, 'default', 18, 20, 22 ],
            supportAllValues: true
        },
        // Be careful with the setting below. It instructs CKEditor to accept ALL HTML markup.
        // https://ckeditor.com/docs/ckeditor5/latest/features/general-html-support.html#enabling-all-html-features
        htmlSupport: {
            allow: [
                {
                    name: /.*/,
                    attributes: true,
                    classes: true,
                    styles: true
                }
            ]
        },
        // Be careful with enabling previews
        // https://ckeditor.com/docs/ckeditor5/latest/features/html-embed.html#content-previews
        htmlEmbed: {
            showPreviews: true
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/link.html#custom-link-attributes-decorators
        link: {
            decorators: {
                addTargetToExternalLinks: true,
                defaultProtocol: 'https://',
                toggleDownloadable: {
                    mode: 'manual',
                    label: 'Downloadable',
                    attributes: {
                        download: 'file'
                    }
                }
            }
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/mentions.html#configuration
        mention: {
            feeds: [
                {
                    marker: '@',
                    feed: [
                        '@apple', '@bears', '@brownie', '@cake', '@cake', '@candy', '@canes', '@chocolate', '@cookie', '@cotton', '@cream',
                        '@cupcake', '@danish', '@donut', '@dragée', '@fruitcake', '@gingerbread', '@gummi', '@ice', '@jelly-o',
                        '@liquorice', '@macaroon', '@marzipan', '@oat', '@pie', '@plum', '@pudding', '@sesame', '@snaps', '@soufflé',
                        '@sugar', '@sweet', '@topping', '@wafer'
                    ],
                    minimumCharacters: 1
                }
            ]
        },
        // The "superbuild" contains more premium features that require additional configuration, disable them below.
        // Do not turn them on unless you read the documentation and know how to configure them and setup the editor.
        removePlugins: [
            // These two are commercial, but you can try them out without registering to a trial.
            // 'ExportPdf',
            // 'ExportWord',
            'AIAssistant',
            'CKBox',
            'CKFinder',
            'EasyImage',
            // This sample uses the Base64UploadAdapter to handle image uploads as it requires no configuration.
            // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/base64-upload-adapter.html
            // Storing images as Base64 is usually a very bad idea.
            // Replace it on production website with other solutions:
            // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/image-upload.html
            // 'Base64UploadAdapter',
            'RealTimeCollaborativeComments',
            'RealTimeCollaborativeTrackChanges',
            'RealTimeCollaborativeRevisionHistory',
            'PresenceList',
            'Comments',
            'TrackChanges',
            'TrackChangesData',
            'RevisionHistory',
            'Pagination',
            'WProofreader',
            // Careful, with the Mathtype plugin CKEditor will not load when loading this sample
            // from a local file system (file://) - load this site via HTTP server if you enable MathType.
            'MathType',
            // The following features are part of the Productivity Pack and require additional license.
            'SlashCommand',
            'Template',
            'DocumentOutline',
            'FormatPainter',
            'TableOfContents',
            'PasteFromOfficeEnhanced',
            'CaseChange'
        ]
      })
      .then( editorPrivAndPol => {
        console.log( editorPrivAndPol );
        window.editorPrivAndPol = editorPrivAndPol;
      })
      .catch( error => {
            console.error( error );
      });

      ClassicEditor.create(document.getElementById("termandcond"), {
        // https://ckeditor.com/docs/ckeditor5/latest/features/toolbar/toolbar.html#extended-toolbar-configuration-format
        toolbar: {
            items: [
                'exportPDF','exportWord', '|',
                'findAndReplace', 'selectAll', '|',
                'heading', '|',
                'bold', 'italic', 'strikethrough', 'underline', 'code', 'subscript', 'superscript', 'removeFormat', '|',
                'bulletedList', 'numberedList', 'todoList', '|',
                'outdent', 'indent', '|',
                'undo', 'redo',
                '-',
                'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor', 'highlight', '|',
                'alignment', '|',
                'link', 'uploadImage', 'blockQuote', 'insertTable', 'mediaEmbed', 'codeBlock', 'htmlEmbed', '|',
                'specialCharacters', 'horizontalLine', 'pageBreak', '|',
                'textPartLanguage', '|',
                'sourceEditing'
            ],
            shouldNotGroupWhenFull: true
        },
        // Changing the language of the interface requires loading the language file using the <script> tag.
        // language: 'es',
        list: {
            properties: {
                styles: true,
                startIndex: true,
                reversed: true
            }
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/headings.html#configuration
        heading: {
            options: [
                { model: 'paragraph', title: 'Paragraph', class: 'ck-heading_paragraph' },
                { model: 'heading1', view: 'h1', title: 'Heading 1', class: 'ck-heading_heading1' },
                { model: 'heading2', view: 'h2', title: 'Heading 2', class: 'ck-heading_heading2' },
                { model: 'heading3', view: 'h3', title: 'Heading 3', class: 'ck-heading_heading3' },
                { model: 'heading4', view: 'h4', title: 'Heading 4', class: 'ck-heading_heading4' },
                { model: 'heading5', view: 'h5', title: 'Heading 5', class: 'ck-heading_heading5' },
                { model: 'heading6', view: 'h6', title: 'Heading 6', class: 'ck-heading_heading6' }
            ]
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/editor-placeholder.html#using-the-editor-configuration
        placeholder: 'Put terms & conditions of your coupon!',
        // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-family-feature
        fontFamily: {
            options: [
                'default',
                'Arial, Helvetica, sans-serif',
                'Courier New, Courier, monospace',
                'Georgia, serif',
                'Lucida Sans Unicode, Lucida Grande, sans-serif',
                'Tahoma, Geneva, sans-serif',
                'Times New Roman, Times, serif',
                'Trebuchet MS, Helvetica, sans-serif',
                'Verdana, Geneva, sans-serif'
            ],
            supportAllValues: true
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-size-feature
        fontSize: {
            options: [ 10, 12, 14, 'default', 18, 20, 22 ],
            supportAllValues: true
        },
        // Be careful with the setting below. It instructs CKEditor to accept ALL HTML markup.
        // https://ckeditor.com/docs/ckeditor5/latest/features/general-html-support.html#enabling-all-html-features
        htmlSupport: {
            allow: [
                {
                    name: /.*/,
                    attributes: true,
                    classes: true,
                    styles: true
                }
            ]
        },
        // Be careful with enabling previews
        // https://ckeditor.com/docs/ckeditor5/latest/features/html-embed.html#content-previews
        htmlEmbed: {
            showPreviews: true
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/link.html#custom-link-attributes-decorators
        link: {
            decorators: {
                addTargetToExternalLinks: true,
                defaultProtocol: 'https://',
                toggleDownloadable: {
                    mode: 'manual',
                    label: 'Downloadable',
                    attributes: {
                        download: 'file'
                    }
                }
            }
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/mentions.html#configuration
        mention: {
            feeds: [
                {
                    marker: '@',
                    feed: [
                        '@apple', '@bears', '@brownie', '@cake', '@cake', '@candy', '@canes', '@chocolate', '@cookie', '@cotton', '@cream',
                        '@cupcake', '@danish', '@donut', '@dragée', '@fruitcake', '@gingerbread', '@gummi', '@ice', '@jelly-o',
                        '@liquorice', '@macaroon', '@marzipan', '@oat', '@pie', '@plum', '@pudding', '@sesame', '@snaps', '@soufflé',
                        '@sugar', '@sweet', '@topping', '@wafer'
                    ],
                    minimumCharacters: 1
                }
            ]
        },
        // The "superbuild" contains more premium features that require additional configuration, disable them below.
        // Do not turn them on unless you read the documentation and know how to configure them and setup the editor.
        removePlugins: [
            // These two are commercial, but you can try them out without registering to a trial.
            // 'ExportPdf',
            // 'ExportWord',
            'AIAssistant',
            'CKBox',
            'CKFinder',
            'EasyImage',
            // This sample uses the Base64UploadAdapter to handle image uploads as it requires no configuration.
            // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/base64-upload-adapter.html
            // Storing images as Base64 is usually a very bad idea.
            // Replace it on production website with other solutions:
            // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/image-upload.html
            // 'Base64UploadAdapter',
            'RealTimeCollaborativeComments',
            'RealTimeCollaborativeTrackChanges',
            'RealTimeCollaborativeRevisionHistory',
            'PresenceList',
            'Comments',
            'TrackChanges',
            'TrackChangesData',
            'RevisionHistory',
            'Pagination',
            'WProofreader',
            // Careful, with the Mathtype plugin CKEditor will not load when loading this sample
            // from a local file system (file://) - load this site via HTTP server if you enable MathType.
            'MathType',
            // The following features are part of the Productivity Pack and require additional license.
            'SlashCommand',
            'Template',
            'DocumentOutline',
            'FormatPainter',
            'TableOfContents',
            'PasteFromOfficeEnhanced',
            'CaseChange'
        ]
      })
      .then( editorTermsAndConds => {
        console.log( editorTermsAndConds );
        window.editorTermsAndConds = editorTermsAndConds;
      })
      .catch( error => {
            console.error( error );
      });
    });
</script>
@endsection