{{ View::make('layout.header') }}
<style>
    .fc-next-button,
    .fc-prev-button,
    .fc-right .fc-button {
        background: #fff !important
    }
    .flatpickr-input {
    background-color: unset !important;
}
    .fc-right .fc-state:hover {
        background-color: #fff !important
    }

    .fc-right .fc-button {
        padding: .438rem .5rem !important;
        border-color: #7367f0 !important;
        color: #7367f0;
        height: 100%
    }

    .fc-right .fc-state-active {
        background-color: rgba(115, 103, 240, .2) !important;
        border-color: #7367f0 !important;
        color: #7367f0;
        z-index: 1 !important
    }

    .fc-agendaWeek-button,
    .fc-month-button {
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important
    }

    .fc-agendaDay-button,
    .fc-agendaWeek-button {
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important
    }

    .fc-icon-left-single-arrow:after,
    .fc-icon-right-single-arrow:after {
        top: -10% !important
    }

    .fc-icon-left-single-arrow:after {
        font-size: 135% !important;
        font-weight: inherit !important;
        content: "\e900" !important
    }

    .fc-icon-right-single-arrow:after {
        font-size: 135% !important;
        font-weight: inherit !important;
        content: "\e901" !important
    }

    .fc-state-default {
        box-shadow: none !important
    }

    .fc-content .fc-title {
        color: #fff;
        font-size: 11px;
        white-space: break-spaces !important
    }

    .fc-right .fc-button-group {
        width: 60% !important;
        float: right !important
    }
    .table-responsive{
        white-space: nowrap;
    }
    .table-responsive input.form-control.timepicker.flatpickr-input {
    width: 130px !important;
}
    /* Style the OK button */
    .flatpickr-ok-btn {
        width: 100%;
        padding: 8px;
        margin-top: 5px;
        background: #007bff;
        color: white;
        text-align: center;
        cursor: pointer;
        border-radius: 5px;
        font-size: 14px;
    }
    @media only screen and (min-width:768px) {

        .fc-left,
        .fc-right {
            width: 50% !important
        }

        .app-calendar .fc-popover {
            left: 50% !important;
            top: 30% !important
        }
    }

    @media only screen and (max-width:768px) {

        .fc-left,
        .fc-right {
            width: 100% !important
        }

        .app-calendar .fc-popover {
            left: 20% !important;
            top: 40% !important
        }
    }

    .custom-popup-header {
        padding: 3px;
        background: #c3c3c3;
        margin-bottom: 5px
    }

    .modal-dialog {
        max-width: 72% !important
    }

    .custom-radio {
        padding-bottom: 4%
    }

    .custom-checkbox {
        padding-bottom: 1%
    }

    fieldset {
        padding: 5px;
        border: 1px solid;
    }

    .text-box {
        width: 91px;
    }
</style>
<!-- BEGIN: Content-->
<div class="app-content content ">
    <div class="content-overlay"></div>
    <div class="header-navbar-shadow"></div>
    <div class="content-wrapper">
        <div class="content-header row">
            <div class="content-header-left col-md-9 col-12 mb-2">
                <div class="row breadcrumbs-top">
                    <div class="col-12">
                        <div class="breadcrumb-wrapper">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item">HR
                                </li>
                                <li class="breadcrumb-item"><a href="{{ route('setupHr') }}">Setup</a>
                                </li>
                                <li class="breadcrumb-item active"><a href="{{ route('schedule') }}">Schedule</a>
                                </li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="content-body">
            {{-- {{dd($scheduledata)}} --}}
            <!-- Schedule Starts -->
            <section id="multiple-column-form">
                <form action="{{ route('editschedule') }}" method="POST">
                    @csrf
                    <input type="hidden" value="{{ $scheduledata[0]['id'] }}" name="id">
                    <div class="row" style="margin:0px;">
                        <div class="card col-md-12" style="">
                            <div class="card-body">
                                {{-- <fieldset> --}}
                                {{-- <legend>Basic Information</legend> --}}
                                <div class="form-group row">
                                    <label for="Schedule" class="col-sm-2 col-form-label">Schedule ID :</label>
                                    <div class="col-sm-4">
                                        <input type="text" class="form-control" name="schedule_id" id="Schedule"
                                            placeholder="Schedule ID" value="{{ $scheduledata[0]['schedule_id'] }}">
                                        @if ($errors->has('schedule_id'))
                                            <em class="required" style="color:#B22222">{!! $errors->first('schedule_id') !!}</em>
                                        @endif
                                    </div>
                                    <label for="Work" class="col-sm-2 col-form-label">Work Schedule :</label>
                                    <div class="col-sm-4">
                                        <input type="text" class="form-control" id="Work"
                                            placeholder="Work Schedule" name="work_schedule"
                                            value="{{ $scheduledata[0]['work_schedule'] }}">
                                        @if ($errors->has('work_schedule'))
                                            <em class="required" style="color:#B22222">{!! $errors->first('work_schedule') !!}</em>
                                        @endif
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="Name" class="col-sm-2 col-form-label">Name :</label>
                                    <div class="col-sm-4">
                                        <input type="text" class="form-control" id="Name" placeholder="Name"
                                            name="name"value="{{ $scheduledata[0]['name'] }}">
                                        @if ($errors->has('name'))
                                            <em class="required" style="color:#B22222">{!! $errors->first('name') !!}</em>
                                        @endif
                                    </div>
                                    <label for="Description" class="col-sm-2 col-form-label">Description :</label>
                                    <div class="col-sm-4">
                                        <input type="text" class="form-control" id="Description"
                                            placeholder="Description" name="description"
                                            value="{{ $scheduledata[0]['description'] }}">
                                        @if ($errors->has('description'))
                                            <em class="required" style="color:#B22222">{!! $errors->first('description') !!}</em>
                                        @endif
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="Name" class="col-sm-2 col-form-label">Color:</label>
                                    <div class="col-sm-4">
                                        <input type="color" class="form-control" id="Name" placeholder="Color"
                                            name="color"value="{{ $scheduledata[0]['color'] }}">
                                        @if ($errors->has('color'))
                                            <em class="required" style="color:#B22222">{!! $errors->first('color') !!}</em>
                                        @endif
                                    </div>
                                    <label for="scheduleType" class="col-sm-2 col-form-label">Schedule Type:</label>
                                    <div class="col-sm-4">
                                        <select class="form-control" id="scheduleType" name="schedule_type" onchange="RenderNightCutoff()">
                                            <option value="0" @if($scheduledata[0]['is_night_schedule'] == '0') selected @endif>Day Schedule</option>
                                            <option value="1" @if($scheduledata[0]['is_night_schedule'] == '1') selected @endif>Night Schedule</option>
                                        </select>
                                        @if ($errors->has('schedule_type'))
                                            <em class="required" style="color:#B22222">{!! $errors->first('schedule_type') !!}</em>
                                        @endif
                                    </div>
                                    

                                </div>
                                {{-- <input type="submit" name="submit"> --}}
                                {{-- </fieldset> --}}
                                <!-- Tab panes -->
                            </div>
                        </div>
                    </div>
                    <div class="row" style="margin:0px;">
                        <div class="card col-md-12" style="">
                            <div class="card-body">
                                <div class="card" style="border: 0px;">
                                    <div class="card-body" style="padding:0px; ">
                                        <div class="col-md-12" style="padding:0px;">
                                            <div class="table-responsive">


                                                <table class="table table-bordered  my-leave-summary-entitle"
                                                    id="example11" style="font-size:12px;">
                                                    <tbody>
                                                        <tr>
                                                            <th width="10%" style="text-align: left;text-transform: capitalize;">Weekday</th>
                                                            <th style="text-align:center;text-transform: capitalize;">Day Type</th>
                                                            <th style="text-align:center;text-transform: capitalize;">In</th>
                                                            <th style="text-align:center;text-transform: capitalize;">Break</th>
                                                            <th style="text-align:center;text-transform: capitalize;">Resume</th>
                                                            <th style="text-align:center;text-transform: capitalize;">Out</th>
                                                            <th width="8%" style="text-align:center;text-transform: capitalize;">Minimum OT</th>
                                                            <th width="8%" style="text-align:center;text-transform: capitalize;">In-Out Range</th>
                                                            <th width="8%" style="text-align:center;text-transform: capitalize;">Lunch Range</th>
                                                            <th width="8%" style="text-align:center;text-transform: capitalize;">Flexi Lunch</th>
                                                            <th width="7%" style="text-align:center;text-transform: capitalize;" class="d-none flexi_hour">Min Flexi Hour</th>
                                                            <th width="7%" id="night_in_cutoff" style="text-align:center;text-transform: capitalize;" class="d-none">In Cutoff Hours</th>
                                                            <th width="7%" id="night_out_cutoff" style="text-align:center;text-transform: capitalize;" class="d-none">Out Cutoff Hours</th>
                                                        </tr>
                                                         <br />
<b>Warning</b>:  Invalid argument supplied for foreach() in <b>/home/ecoleave/public_html/backup/v6/resources/views/E-Attendance/schedule/edit_schedule.blade.php</b> on line <b>273</b><br />
                                                    </tbody>
                                                    <tbody>
                                                        <tr style="height:50px;">
                                                            <td colspan="2">Round To Nearest Minutes</td>
                                                            <td>
                                                                <select name="in_round_min"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->in_round_min == 0) selected @endif
                                                                        value="0">
                                                                        0</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->in_round_min == 5) selected @endif
                                                                        value="5">
                                                                        5</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->in_round_min == 10) selected @endif
                                                                        value="10">
                                                                        10</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->in_round_min == 30) selected @endif
                                                                        value="30">
                                                                        30</option>
                                                                </select>
                                                            </td>
                                                            <td>
                                                                <select name="break_round_min"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->break_round_min == 0) selected @endif
                                                                        value="0">
                                                                        0</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->break_round_min == 5) selected @endif
                                                                        value="5">
                                                                        5</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->break_round_min == 10) selected @endif
                                                                        value="10">
                                                                        10</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->break_round_min == 30) selected @endif
                                                                        value="30">
                                                                        30</option>
                                                                </select>
                                                            </td>

                                                            <td>
                                                                <select name="resume_round_min"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->resume_round_min == 0) selected @endif
                                                                        value="0">
                                                                        0</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->resume_round_min == 5) selected @endif
                                                                        value="5">
                                                                        5</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->resume_round_min == 10) selected @endif
                                                                        value="10">
                                                                        10</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->resume_round_min == 30) selected @endif
                                                                        value="30">
                                                                        30</option>
                                                                </select>
                                                            </td>
                                                            <td>
                                                                <select name="out_round_min"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->out_round_min == 0) selected @endif
                                                                        value="0">
                                                                        0</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->out_round_min == 5) selected @endif
                                                                        value="5">
                                                                        5</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->out_round_min == 10) selected @endif
                                                                        value="10">
                                                                        10</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->out_round_min == 30) selected @endif
                                                                        value="30">
                                                                        30</option>
                                                                </select>
                                                            </td>
                                                            <td>
                                                                <select name="ot_round_min"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->ot_round_min == 0) selected @endif
                                                                        value="0">
                                                                        0</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->ot_round_min == 5) selected @endif
                                                                        value="5">
                                                                        5</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->ot_round_min == 10) selected @endif
                                                                        value="10">
                                                                        10</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->ot_round_min == 30) selected @endif
                                                                        value="30">
                                                                        30</option>
                                                                </select>
                                                            </td>
                                                        </tr>
                                                        <tr style="height:50px;">
                                                            <td colspan="2">Rounding</td>
                                                            <td>
                                                                <select name="in_round_type"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->in_round_type == 'up') selected @endif
                                                                        value="up">
                                                                        UP</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->in_round_type == 'down') selected @endif
                                                                        value="down">
                                                                        Down</option>
                                                                </select>
                                                            </td>
                                                            <td>
                                                                <select name="break_round_type"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->break_round_type == 'up') selected @endif
                                                                        value="up">
                                                                        UP</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->break_round_type == 'down') selected @endif
                                                                        value="down">
                                                                        Down</option>
                                                                </select>
                                                            </td>
                                                            <td>
                                                                <select name="resume_round_type"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->resume_round_type == 'up') selected @endif
                                                                        value="up">
                                                                        UP</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->resume_round_type == 'down') selected @endif
                                                                        value="down">
                                                                        Down</option>
                                                                </select>
                                                            </td>
                                                            <td>
                                                                <select name="out_round_type"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->out_round_type == 'up') selected @endif
                                                                        value="up">
                                                                        UP</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->out_round_type == 'down') selected @endif
                                                                        value="down">
                                                                        Down</option>
                                                                </select>
                                                            </td>
                                                            <td>
                                                                <select name="ot_round_type"
                                                                    class="form-control daytype">
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->ot_round_type == 'up') selected @endif
                                                                        value="up">
                                                                        UP</option>
                                                                    <option
                                                                        @if (isset($scheduleRound) && $scheduleRound->ot_round_type == 'down') selected @endif
                                                                        value="down">
                                                                        Down</option>
                                                                </select>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>

                                                
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="text-right">
                                    <button class="btn btn-primary waves-effect waves-float waves-light"
                                        tabindex="0" type="submit">
                                        <span>Submit</span>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </section>
        </div>
    </div>
</div>
<!-- END: Content-->
{{ View::make('layout.footer') }}
@include('inc.access_management-model')

<!-- Flatpickr CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<!-- Flatpickr JS -->
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>

<script>

document.addEventListener("DOMContentLoaded", function () {
    document.querySelectorAll(".timepicker").forEach(input => {
        let existingValue = input.getAttribute("value")?.trim(); // Read existing input value
        console.log("Existing Value for Flatpickr:", existingValue); // ✅ Debugging

        flatpickr(input, {
            enableTime: true,
            noCalendar: true,
            dateFormat: "h:i K",
            time_24hr: false,
            allowInput: false,
            minuteIncrement: 1,
            defaultDate: existingValue || null, // ✅ Ensure Flatpickr initializes with existing value
            onReady: function (selectedDates, dateStr, instance) {
                let okButton = document.createElement("div");
                okButton.classList.add("flatpickr-ok-btn");
                okButton.innerText = "OK";
                okButton.addEventListener("click", function () {
                    instance.close();
                });
                instance.calendarContainer.appendChild(okButton);
            }
        });
    });
});

    $(document).ready(function() {
        dayType();
        RenderNightCutoff();
    });

    function updateWidth(textbox) {
        $(textbox).parent().css("width", (textbox.value.length + 2) + "em");
    }


    var arr = [];
    
  // render night cutoff boxes if schedule type is night
function RenderNightCutoff() {
    let nightInElement = $('#night_in_cutoff');
    let nightOutElement = $('#night_out_cutoff');
    let nightCutoffElements = $('.night_cutoff_hour');

    let scheduleTypeSelect = $('#scheduleType');
    let selectedValue = scheduleTypeSelect.val();

    // if (selectedValue == 1) { // Assuming '1' represents 'night' schedule
    if(true){
        nightInElement.removeClass('d-none');
        nightOutElement.removeClass('d-none');

        // Remove 'd-none' class from all elements with 'night_cutoff_hour' class
        nightCutoffElements.removeClass('d-none');
    } else {
        nightInElement.addClass('d-none');
        nightOutElement.addClass('d-none');

        // Add 'd-none' class to all elements with 'night_cutoff_hour' class
        nightCutoffElements.addClass('d-none');
    }
}

function dayType() {
    var input = document.getElementsByName('daytype[]');
    var arr = [];

    for (var i = 0; i < input.length; i++) {
        arr.push(input[i].value);
        var row = $(input[i]).closest('tr');

        // --- Filo logic only ---
        if (input[i].value === 'Filo') {
            // Disable all inputs in that row except weekday[]
            row.find('input:not([name="weekday[]"])').each(function () {
                var name = $(this).attr('name');

                // Remove old hidden inputs
                row.find('input[type="hidden"][name="' + name + '"]').remove();

                // Add hidden input to preserve 0 value in submission
                $('<input>', {
                    type: 'hidden',
                    name: name,
                    value: 0
                }).appendTo(row);

                // Disable visually
                $(this)
                    .val('')
                    .prop('disabled', true)
                    .attr('style',
                        'background-color: #f0f0f0 !important; color: #6c757d !important; cursor: not-allowed !important;'
                    );
            });

            // Keep weekday[] enabled
            row.find('input[name="weekday[]"]').prop('disabled', false);
        } 
        else {
            // --- Re-enable fields for other types (Work, Flexi, Rest) ---
            row.find('input').each(function () {
                var name = $(this).attr('name');

                if ($(this).attr('type') !== 'hidden') {
                    // Remove hidden duplicates
                    row.find('input[type="hidden"][name="' + name + '"]').remove();

                    // Re-enable normal inputs
                    $(this)
                        .prop('disabled', false)
                        .removeAttr('style');
                }
            });
        }
    }

    // --- Flexi visibility ---
    var flexi = arr.indexOf('Flexi');
    if (flexi >= 0)
        $('.flexi_hour').removeClass('d-none');
    else
        $('.flexi_hour').addClass('d-none');
}
</script>