@extends('front.user.partials.layout' , ['active' => 'advertisements' , 'page' => __('request_add_advertisements')])

@section('profile_content')

    <div class="portlet">


        <div class="portlet__head">
            <div class="portlet__head-label">
                <div class="portlet__head-title">@lang('request_add_advertisements')</div>
            </div>
        </div>

        <div class="portlet__body px-5 pt-5">
            {!! Form::open(['POST', 'url'=> url()->current() ,'to'=>url()->current() ,  'class'=>'form-horizontal','id'=>'formAddAdv']) !!}
            <div class="row">

                <div class="col-md-12 d-none" id="errors">

                </div>


                <div class="col-lg-12">
                    <div class="form-group">
                        <label>@lang('subject'): </label>
                        <input class="form-control" type="text" name="subject" value="{{ isset($item) ? $item->subject :''  }}"/>
                    </div>
                </div>

                <div class="col-lg-12">
                    <div class="form-group">
                        <label>@lang('url'): </label>
                        <input class="form-control" type="text" name="url" value="{{ isset($item) ? $item->url :''  }}"/>
                    </div>
                </div>
                <div class="col-lg-12">
                    <div class="form-group">
                        <label>@lang('description'):</label>
                        <textarea class="form-control p-3" rows="9" name="description">{{ isset($item) ? $item->description :''  }}</textarea>
                    </div>
                </div>

                <div class="col-lg-12">
                    <div class="form-group">
                        <label>@lang('featured_image')</label>
                        <input type="hidden" name="image_id" id="image"
                               value="{{ isset($item) ? $item->image_id :''  }}">
                        <div class="dropzone" id="myDropzone"></div>
                    </div>
                </div>
                <div class="col-lg-12">
                    <div class="form-group">
                        <div class="d-flex align-items-center justify-content-between">
                            <label class="m-checkbox mb-0">
                                <input type="checkbox" name="featured" {{ isset($item) && $item->featured ? 'checked' :'' }}/><span class="checkmark"></span>@lang('featured_advertisement')
                            </label>
                        </div>
                    </div>
                </div>



                <div class="col-lg-4 ml-auto mt-2">
                    <button class="general_btn_sm w-100">@lang('save')</button>
                </div>
            </div>
            {!! Form::close() !!}
        </div>
    </div>


@endsection



@push('js')

    <script>
        let image;

        var myDropzone = new Dropzone("#myDropzone",
            {
                url: "/upload",
                dictDefaultMessage: "<span class='icon'><i class='fas fa-camera'></i></span><span class='text'>Browse Image/ Drag & Drop</span>",
                paramName: "file", // The name that will be used to transfer the file
                maxFiles: 1,
                maxFilesize: 10, // MB
                acceptedFiles: "image/*",
                addRemoveLinks: true,
                dictRemoveFile: '<i class="fa fa-trash-alt"></i>',
                removedfile: function (file) {
                    $.ajax({
                        url: "/delete",
                        method: "POST",
                        data: {
                            "id": file['sgName']
                        },
                        success: function (res) {
                            var _ref;
                            image = '';
                            $('#image').val(image);
                            return (_ref = file.previewElement) != null ? _ref.parentNode.removeChild(file.previewElement) : void 0;
                        }
                    })
                },
                accept: function (file, done) {
                    if (file.name == "justinbieber.jpg") {
                        done("Naha, you don't.");
                    } else {
                        done();
                    }
                },
                success: function (file, response) {
                    file['sgName'] = response.id;
                    image = response.id;
                    $('#image').val(image)
                },
                @if(@$item)
                init: function () {
                    var myDropzone = this;

                    var value = {!! json_encode(@$item->image) !!};
                    let file = {
                        name: 'image/' + value.path,
                        sgName: value.id,
                        height: '320',
                        width: '570',
                        size: value.size,
                    };
                    image = value.id;
                    myDropzone.options.addedfile.call(myDropzone, file);
                    myDropzone.options.thumbnail.call(myDropzone, file, "{{ url('image/')}}/" + value.path + "/100x100");
                    myDropzone.emit('complete', file);
                    $('#image').val(image);
                }
                @endif
            });


    </script>
@endpush