<script>
    $(document).ready(function () {
        $('#what-to-upload-list').select2();
        $('#local-file').on('click', function (){
            $('#uploading-local-files-div').show();
            $('#uploading-url-files-div').hide();
        });
        $('#url-file').on('click', function (){
            $('#uploading-url-files-div').show();
            $('#uploading-local-files-div').hide();
        });

        {{--When Changing the What to Upload option, display the upload types--}}
        $('#what-to-upload-list').change(function (){
            let itemSelected = $(this).val();

            $('#uploading-options').hide();
            if(itemSelected != ""){
                $('#uploading-options').show();
                if(itemSelected == 'profile-photo'){
                    $('#doc-two-div').hide();
                    $('#doc-three-div').hide();
                    $('#doc-four-div').hide();
                    $('#doc-five-div').hide();
                }else{
                    $('#doc-two-div').show();
                    $('#doc-three-div').show();
                    $('#doc-four-div').show();
                    $('#doc-five-div').show();
                }
            }
        });
    });
</script>
{!! Form::open(['route'=>['storeUploadEmployeeFiles.store', 'id'=>$employee->id],'files'=>true, 'method'=>'POST', 'id'=>'upload-employee-files']) !!}
<div class="error" style="text-align: center;">On this Window, You can Upload Documents affiliated to this Employee</div>
<div class="guestDetails_inputDivider"></div>
<button type="submit" disabled style="display: none" aria-hidden="true"></button>
{{--We provide a Select section to specify if you are uploading profile picture or general files for the Employee--}}
<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        {!! Form::label('what-to-upload', 'Select the Item(s) to be Uploaded') !!} <span class="error">*</span>
    </div>
    <div class="guestDetails_input">
        <select name="what-to-upload" id="what-to-upload-list" style="width: 450px">
            <option value="">--Select the Item(s) to be Uploaded--</option>
            <option value="profile-photo">Profile Photo for the Employee</option>
            <option value="employee-documents">Employee Documents for Employment</option>
        </select>
    </div>
</div>
<div id="uploading-options" style="display: none">
    <div class="guestDetails_inputDivider1"></div>
    @include('libs.upload-document-method')
</div>

<div id="uploading-local-files-div" style="display: none">
    <p class="error">Upload Files from Local Machine (Max of 5 Files are supported)</p>
    <div id="doc-one-div">
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('file-name-local', 'Enter File Name 1:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::text('file-name-one', '', ['size'=>'30','class'=>'input-text-height']) !!}
            </div>
        </div>
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('upload-section-local', 'Choose your File to Upload 1:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::file('upload-doc-one',['class'=>'input-text-height']) !!}
            </div>
        </div>
    </div>
    <div id="doc-two-div" >
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('file-name-local', 'Enter File Name 2:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::text('file-name-two', '', ['size'=>'30','class'=>'input-text-height']) !!}
            </div>
        </div>
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('upload-section-local', 'Choose your File to Upload 2:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::file('upload-doc-two',['class'=>'input-text-height']) !!}
            </div>
        </div>
    </div>
    <div id="doc-three-div">
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('file-name-local', 'Enter File Name 3:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::text('file-name-three', '', ['size'=>'30','class'=>'input-text-height']) !!}
            </div>
        </div>
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('upload-section-local', 'Choose your File to Upload 3:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::file('upload-doc-three',['class'=>'input-text-height']) !!}
            </div>
        </div>
    </div>
    <div id="doc-four-div" >
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('file-name-local', 'Enter File Name 4:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::text('file-name-four', '', ['size'=>'30','class'=>'input-text-height']) !!}
            </div>
        </div>
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('upload-section-local', 'Choose your File to Upload 4:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::file('upload-doc-four',['class'=>'input-text-height']) !!}
            </div>
        </div>
    </div>
    <div id="doc-five-div" >
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('file-name-local', 'Enter File Name 5:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::text('file-name-five', '', ['size'=>'30','class'=>'input-text-height']) !!}
            </div>
        </div>
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                {!! Form::label('upload-section-local', 'Choose your File to Upload 5:') !!} <span class="error">*</span>
            </div>
            <div class="guestDetails_input">
                {!! Form::file('upload-doc-five',['class'=>'input-text-height']) !!}
            </div>
        </div>
    </div>
</div>

<div id="uploading-url-files-div" style="display: none">
    <p class="error">Upload Files from URL</p>
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            {!! Form::label('file-name-url', 'Enter File Name:') !!} <span class="error">*</span>
        </div>
        <div class="guestDetails_input">
            {!! Form::text('file-name-url', '', ['size'=>'20','class'=>'input-text-height']) !!}
        </div>
    </div>
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            {!! Form::label('upload-section-url', 'Enter File URL here to Upload:') !!} <span class="error">*</span>
        </div>
        <div class="guestDetails_input">
            {!! Form::text('url-name','',['size'=>'40','class'=>'input-text-height']) !!}
        </div>
    </div>
    <div class="guestDetails_inputDivider"></div>
    <div class="added-fields-url"></div>
    <button id="add-url-policy-document" type="button" class="section-button" style="margin-left: 0">+Add Another Document Field</button>
</div>

{!! Form::close() !!}

<script type="text/javascript" src="{{asset('js/documents/policy/add-upload-file-fields.js')}}"></script>
<script type="text/javascript" src="{{asset('js/documents/policy/add-url-file-fields.js')}}"></script>
