{{-- Global Modal Window - ADD Record --}}

@php
    $header_icon = $header_icon ?? 'fa fa-plus-circle';
    $route_address_add = $route_address_add ?? $route_address ?? null;
    $click_event_name = $click_event_name ?? '.open_modal_add';
    $modal_title_add = $modal_title_add ?? 'Dodaj Nowy Rekord';
    $add_submit_class = $add_submit_class ?? 'btn-success';
    $add_submit_text = $add_submit_text ?? 'Dodaj Nowy';
    $add_show_record_id = $add_show_record_id ?? true;
    $form_id = $form_id ?? 'form_add';
@endphp

<style>
    #{{ $modal_id }} .col-form-label {
        font-size: 1rem !important;
        display: flex;
        align-items: flex-start;
        justify-content: flex-end;
    }

    #{{ $modal_id }} input.form-control,
    #{{ $modal_id }} textarea.form-control,
    #{{ $modal_id }} select.form-control,
    #{{ $modal_id }} .my_p_info {
        font-size: 1.1rem !important;
        line-height: 1 !important;
        border-radius: .4rem !important;
    }

    @media (min-width: 768px) {
        #{{ $modal_id }} .form-group > .col-md-6 {
            -ms-flex: 0 0 60%;
            flex: 0 0 60%;
            max-width: 60%;
        }
    }

    #{{ $modal_id }} .add-modal-record-id {
        font-style: italic;
        font-weight: 700;
    }
</style>

<div class="modal fade show" id="{{ $modal_id }}" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
    <div class="modal-dialog my_modal_alert" role="document" style="max-width: 800px;">
        <div class="alert-success" style="border-radius: 15px; pointer-events: auto; width: 800px;">
            <form id="{{ $form_id }}" method="post" action="{{ $route_address_add ? route($route_address_add) : '#' }}" enctype="multipart/form-data">
                @csrf
                <div class="modal-header card-header" style="border-radius: 15px 15px 0 0;">
                    <div style="margin-right: 1vw;">
                        <i class="{{ $header_icon }} fa-2x"></i>
                    </div>
                    <div class="my-auto ml-1 row">
                        {{ $modal_title_add }}
                        @if($add_show_record_id)
                            <span style="font-style: italic;">&nbsp;( id: </span>
                            <span class="add-modal-record-id"><strong><i data-role="add-record-id-display">{{ $rekord_id ?? '' }}</i></strong></span>
                            <span style="font-style: italic;">&nbsp;)</span>
                        @endif
                    </div>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                <div class="modal-body text-lg-center" style="max-height: 70vh; overflow: overlay;">
                    <input name="return_to" type="hidden" value="{{ $return_to ?? null }}">
                    <input name="return_to_after_delete" type="hidden" value="{{ $return_to_after_delete ?? null }}">
                    <input name="modal_return_to" type="hidden" value="{{ $modal_return_to ?? null }}">
                    <input name="site_back" type="hidden" value="{{ $site_back ?? null }}">
                    <input id="add_rekord_id" name="rekord_id" type="hidden" value="{{ $rekord_id ?? null }}">

                    <div class="table_modal_add">
                        @if(trim($__env->yieldContent('form_body_add')) !== '')
                            @yield('form_body_add')
                        @else
                            @yield('form_body')
                        @endif
                    </div>
                </div>

                <div class="modal-footer" style="justify-content: center !important;">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Anuluj</button>
                    <button type="submit" class="btn {{ $add_submit_class }}">{{ $add_submit_text }}</button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
    (function () {
        var local_click_event_name = null;
        var local_modal_id = null;

        function syncAddFieldsHeight() {
            var $modal = $('#' + local_modal_id);
            if (!$modal.length) {
                return;
            }

            $modal.find('.form-group.row').each(function () {
                var $row = $(this);
                var $label = $row.find('label.col-form-label').first();
                if (!$label.length) {
                    return;
                }

                var labelHeight = $label.outerHeight();
                if (!labelHeight || labelHeight < 1) {
                    return;
                }

                $row.find('input.form-control, textarea.form-control, select.form-control, .my_p_info')
                    .css('min-height', labelHeight + 'px');
            });
        }

        function syncAddRecordId(id) {
            var $modal = $('#' + local_modal_id);
            if (!$modal.length) {
                return;
            }

            var nextId = id;
            if (nextId === undefined || nextId === null || String(nextId).trim() === '') {
                nextId = $modal.find('#add_rekord_id').val();
            }

            if (nextId === undefined || nextId === null) {
                nextId = '';
            }

            nextId = String(nextId).trim();
            $modal.find('#add_rekord_id').val(nextId);
            $modal.find('[data-role="add-record-id-display"]').text(nextId);
        }

        $(document).on('click', local_click_event_name, function () {
            $('#' + local_modal_id).modal('show');
            var id = $(this).val();
            syncAddRecordId(id);

            setTimeout(syncAddFieldsHeight, 0);
            setTimeout(syncAddFieldsHeight, 150);
        });

        $(document).on('shown.bs.modal', '#' + local_modal_id, function () {
            syncAddRecordId();
            syncAddFieldsHeight();
        });

        $(window).on('resize', function () {
            syncAddFieldsHeight();
        });
    })();
</script>

@if(trim($__env->yieldContent('java_script_add')) !== '')
    @yield('java_script_add')
@else
    @yield('java_script')
@endif