@extends('admin.layouts.contentLayoutMaster')
@section('title','Covid Edit')
@section('pagelevelcss')
@stop
@section('content')
<div class="section">
    <div class="card">
        <div class="card-content">
            <div class="row">
              <!-- Form Advance -->
              <div class="col s12 m12 l12">
                  <div class="card-content">
                    <form action="{{route('covid.update', ['id' => \App\Helpers\Helper::encrypt($editdata->id)])}}" method="post" id="edit_covid_form" name="edit_covid_form"  enctype="multipart/form-data">
                      {{ csrf_field() }}
                      <div class="row">
                        <div class="input-field col s12">
                            <input id="title" type="text" name="title" value="{{$editdata->title}}">
                            <label for="title">Title<span class="red-text">*</span></label>
                        </div>
                      </div>
                      <div class="row">
                        <div class="input-field col s12">
                          <textarea class="materialize-textarea" name="short_description">{{$editdata->short_description}}</textarea>
                          <label for="short_description">Short Description<span class="red-text">*</span></label>
                        </div>
                      </div>
                      <div class="row">
                        <div class="input-field col s12">
                            <input id="price" type="text" name="price" value="{{$editdata->price}}">
                            <label for="price">Price<span class="red-text">*</span></label>
                        </div>
                      </div>
                      <div class="file-field input-field">
                        <div class="btn">
                          <span>Image</span>
                          <input type="file" name="image" id="image">
                        </div>
                        <div class="file-path-wrapper">
                          <input class="file-path validate" type="text">
                        </div>
                        <span class="image-error" style="color: #FF4081;"></span>
                        <img src="{{ asset('uploads/'.$editdata->image) }}" title="{{$editdata->name}}" width="400" height="300">
                      </div>
                      <div class="row">
                        <div class="input-field col s12">
                            <input id="url" type="text" name="url" value="{{$editdata->url}}">
                            <label for="url">Embed URL</label>
                        </div>
                      </div>
                      <div class="row">
                        <div class="row">
                          <div class="input-field col s12">
                            <button class="btn waves-effect waves-light left" type="submit">Submit
                            </button>
                          </div>
                        </div>
                      </div>
                    </form>
                  </div>
              </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('pageleveljs')
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>
<script type="text/javascript">
$(function(){
  $.validator.addMethod('filesize', function (value, element, param) {
      return this.optional(element) || (element.files[0].size <= param)
  }, 'Maximum file size to upload is 2MB.');
  $("#edit_covid_form").validate({
      ignore: [],
      rules: {   
          title:"required",
          short_description:"required",
          price: {
            required: true,
            number: true
          },
          image: {
            required: false,
            extension: "jpg,jpeg,png",
            filesize: 2097152,
          }
          url: {
            required: false,
            url: true,
          }
      },
      messages:{
          title: {
              required: "Please enter title.",
          },
          short_description: {
              required: "Please enter short description.",
          },
          price: {
              required: "Please enter price.",
          },
          image: {
              required: "Please upload image.",
              extension: "Only image type jpg/png/jpeg is allowed.",
              filesize: "Maximum file size to upload is 2MB.",
          }
          url: {
              required: "Please enter url."
          }
      },
      errorPlacement: function(error, element) {
        if (element.attr("name") == "image" ) {
            $(".image-error").text(error[0].innerText);
        } else {
            error.insertAfter(element);
        }
      },
      errorElement: 'span',
  });
});
</script>
@stop