@extends('layouts.app')
@section('content')
    <div class="container">
        <div class="row">
            <h3> Free Sample Instructions/Process</h3>

            {{-- @if (!$provider_user_acct->isAvailable())
            <div class="col-md-12 text-center flex-vertical">
                <i class="fa fa-exclamation-triangle fa-5x text-primary"></i>
                <br>
                <br>
                <h3>This provider is not available</h3>
            </div>
            @else --}}
            {{-- <h3>{{ $provider_svc->service }} Instructions/Process</h3> --}}
            <p>
                Please browse to select your file, complete each field, provide instructions for your provider, and click on
                the “Upload” button to submit payment on the next page.
            </p>
            <br>

            <div style="text-align: center">
                <a class="btn knowmad_btn_blue knowmad_btn" style="width: unset;"
                    {{-- 1 is for Editors --}}
                    href="{{ route('admin.recenteditors.index', [1]) }}">Choose
                    Different Provider</a>
            </div>

            <div class="row">
                <div class="col-md-3 push-top">
                    <label>Free Sample Provider</label>
                </div>
                <div class="col-md-7 push-top">
                    @include('partials.single_editor', ['user' => $provider_user_acct, 'profile_base_url' => '/editors', 'provider_svc_id' => 1])
                        
                </div>
            </div>
            
            <p >
                Please select your file, complete each field, provide instructions for the editor, and click on the “Upload” button to submit your Free Sample Edit Request.
            </p>

            <div class="row">
                {!! Form::open(array('route' => 'public.uploadFreeSample', 'name' => 'submit', 'files' => true, 'enctype' => 'multipart/formdata', 'id' => 'checkoutForm')) !!}

                    {!! csrf_field() !!}

                    <input type="hidden" name="provider_userId" id="provider_userId" value="{{ $provider_user_acct->id }}">
                    

                    <div class="row push-top hide">
                        <div class="col-md-3">
                            <label for="category_select" class="required"> Service</label> <span class="required_input">*</span>
                        </div>
                        <div class="col-md-9">
                            <div class="btn-group">
                                <button 
                                class="dropdown-toggle" 
                                type="button" id="submitDropdown" 
                                data-bs-toggle="dropdown" 
                                data-bs-auto-close="true" 
                                aria-expanded="false" style="box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
                                border-radius: unset!important;
                                color: #000; background: white;font-family: var(--nib_font)!important;
    font-size: 16px; border: 1px solid #ced4da;">
                                    Editing
                                </button>
                                <ul class="dropdown-menu" id="submitMenu" aria-labelledby="submitDropdown">
                                    <li>Editing</li>
                                    
                                </ul>
                            </div>   
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-3 push-top">
                            <label class="required"> Upload File </label> <span class="required_input">*</span>
                        </div>
                        <div class="col-md-9 push-top-min">
                            <input value ="" type="file" for="attachment" name="file" id="attachment" class="required"><span id="file_ext"></span>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3 push-top">
                            <label class="required"> File Name/Title </label> <span class="required_input">*</span>
                        </div>
                        <div class="col-md-9 push-top-min">
                            <input type="text" id="doc_name" for="File Name" name="doc_name" class="form-control editor-profile" maxlength="50" data-msg-required="Please enter File Name." value="">
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3 push-top">
                            <label class="required">
                                Word Count for Free Sample Edit<span class="required_input" > *</span>
                                <br>
                                (300 words or less)
                            </label>
                        </div>
                        <div class="col-md-9 push-top-min" id ="free">
                            <input type="number" id="word_count_submitdocument" name="word_count" for="word_count" max="300" class="form-control editor-profile" maxlength="7" data-msg-required="Please enter Word Count." value="" style="width:208px;">
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3 push-top">
                            <label class="required">
                                Word Count of Full Document<span class="required_input" > *</span>
                               
                            </label>
                        </div>
                        <div class="col-md-9 push-top-min" id ="free">
                            <input type="number" id="word_count_document" name="word_count_document" for="word_count_document" class="form-control editor-profile" data-msg-required="Please enter Word Count." value="" style="width:208px;">
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3 push-top">
                            <label> Total Price </label>
                        </div>
                        <div class="col-md-9 push-top-min">
                            <input class="form-control editor-profile" type="text" name="total_price_submitdocument" value="0"  id ="total_price_submitdocument" readonly>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3 push-top">
                            <label> English Preference</label>
                        </div>
                        <div class="col-md-9 push-top-min">
                            <select name="english_preference" id="english_preference" class="form-control editor-profile" style="appearance: menulist-button;">
                                <option value="american">American English</option>
                                <option value="british">British English</option>
                            </select>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3 push-top">
                            <label>Provide Instructions</label>
                        </div>
                        <div class="col-md-9 push-top-min">
                            <textarea maxlength="5000" data-msg-required="Please enter your message." rows="10" class="form-control editor-profile" name="message" id="message"></textarea>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 text-center push-top">
                            <button id="submitForm" type="submit" class="btn knowmad_btn_blue knowmad_btn mb-2">Upload</button>
                        </div>
                    </div>
                {!! Form::close() !!}
            </div>
        </div>
    </div>
    <script>
    $('#checkoutForm').one('submit', function() {
    $(this).find('button[type="submit"]').attr('disabled','disabled');
});
    </script>
@stop