@extends('layouts.app')
@section('titlePage', 'Update Testimonial')
@section('content')
@push('script')
<script>  
    document.getElementById("dra-25").classList.add("active");
</script>
@endpush
<div class="page-wrapper">
   <!-- [ breadcrumb ] start -->
   <div class="breadcrumb-header justify-content-between">
        <div class="left-content"> 
      <h4 class="text-primary font-weight-bold py-3 mb-0">
      EDIT
        </h4>
        </div>
        <div class="justify-content-center mt-2">
               <ul class="breadcrumb breadcrumb-style3">
                  <li class="breadcrumb-item"><a href="{{ _route('master.testimonial.index') }}"><i class="feather icon-home"></i></a></li>
                  <li class="breadcrumb-item active">Edit Testimonial</li>
               </ul>
            </div>
         </div>
   
   <!-- [ breadcrumb ] end -->
   <!-- [ Main Content ] start -->
   <div class="row">
      <div class="col-sm-12">
         <div class="card">
            <div class="card-header">
               <a href="{{ route('master.testimonial.index') }}" class="btn btn-primary float-right">List</a>
            </div>
            <div class="card-body">
               @include('common.alert')
               <form method="POST" action="{{ route('master.testimonial.update', $data->id) }}" enctype="multipart/form-data" id="test-form">
                  @csrf
				      @method('PUT')
                  @include('master.testimonial.form')
                  <div class="col-md-12 mt-2">
                    <button type="submit" class="btn btn-primary">Update</button>
                  </div>
               </form>
            </div>
         </div>
      </div>
   </div>
   <!-- [ Main Content ] end -->
</div>
@endsection
@push('script')
<script src="{{ asset('assets/vidiyal/js/jquery.copy-to-clipboard.js') }}"></script>
<script src="{{ asset('assets/vidiyal/vendor.js') }}"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $(function() {
            $.validator.addMethod("image_format", function(value, element) {
            return this.optional(element) || /\.(jpg|jpeg|png)$/i.test(value);
        }, "Please select a valid image file format.");
        $.validator.addMethod('image_size', function(value, element) {
            if (element.files && element.files[0]) {
                return element.files[0].size <= 2 * 1024 * 1024; // 2MB
            }
            return true;
        }, "Please select an image smaller than 2MB.");
        $.validator.addMethod("validation_description", function(value, element) {
                var minLength = 10
                var maxLength = 500;
                var descriptionLength = value.trim().length;

                return this.optional(element) || (descriptionLength >= minLength && descriptionLength <= maxLength);
            },"Please enter a description between 10 and 500 characters.");

            // [ Initialize validation ] start
                $('#test-form').validate({
                ignore: '.ignore, .select2-input',
                focusInvalid: false,
                rules: {
                    'image': {
                        image_format: true,
                        image_size: true
                    },
                    'description': {
                        required: true,
                        validation_description : true
                    }
                },
                errorPlacement: function errorPlacement(error, element) {
                    var $parent = $(element).parents('.form-group');    
                    // Do not duplicate errors
                    if ($parent.find('.jquery-validation-error').length) {
                        return;
                    }
                    $parent.append(
                        error.addClass('jquery-validation-error small form-text invalid-feedback')
                    );
                },
            });
        });
    });
</script>
@endpush