@if($isSharedClient)
@push('custom-scripts')
<script type="text/javascript">
    $(document).ready(function() {
        renderSharedClientHoursInput()
    });
    $(document).on('change', '.input-shift-start,.input-shift-end', function() {
        let parentRow = $(this).parents('.staff-shift-area:first');
        refreshTotalHours(parentRow.find('.total_hours_input:first'));
    });

    $(document).on('keyup change', '.shared_client_hours_input', function() {
        checkTotalHoursNotExceeding($(this));
    });

    function checkTotalHoursNotExceeding(ele) {
        let parentRow = ele.parents('.staff-shift-area:first');
        let lastEle = parentRow.find('.shared_client_hours_input[data-index="last"]');
        let total_hours = parentRow.find('.total_hours_input:first').val();
        let enteredVal = ele.val();
        // console.log(total_hours,'checkTotalHoursNotExceeding')
        if (total_hours > 0) {
            let clientTotal = 0;
            let clientHoursCount = 0;

            calcLastClientHours(lastEle, parentRow);

            parentRow.find('.shared_client_hours_input').each(function() {
                clientTotal = clientTotal + parseFloat($(this).val());
                if ($(this).val() > 0) {
                    clientHoursCount++;
                }
            });
            // console.log(total_hours,enteredVal,clientTotal)
            if (parseFloat(total_hours - clientTotal) < 0) {
                alert('The entered hours exceed the total hours value!');
                clientTotal = clientTotal - enteredVal;
                console.log('The entered hours exceed the total hours value!',ele)
                ele.val(0);

                calcLastClientHours(lastEle, parentRow);
            }
            // parentRow.find('.shared_client_roster_tbl thead span:first').html("(" + clientTotal + ")");
        } else {
            parentRow.find('.shared_client_time_text').html('');
            parentRow.find('.shared_client_hours_input').val(0).attr('readonly', true);
        }
    }


    function renderSharedClientHoursInput() {
        $('.total_hours_input').each(function() {
            let parentRow = $(this).parents('.staff-shift-area:first');
            let total_hours = $(this).val();
            if (total_hours > 0) {
                refreshTotalHours($(this));
            } else {
                parentRow.find('.shared_client_time_text').html('');
                parentRow.find('.shared_client_hours_input').val(0).attr('readonly', true);
                parentRow.find('.shared_client_roster_tbl thead span:first').html("(" + 0 + ")");
            }

        });
    }

    function refreshTotalHours(ele) {
        let mainParentRow = ele.parents('.shift-main-area:first').parents('.shift-main-area:first');
        let parentRow = ele.parents('.staff-shift-area:first');
        let lastEle = parentRow.find('.shared_client_hours_input[data-index="last"]');
        let total_hours_input = parentRow.find('.total_hours_input:first');
        let value_start = parentRow.find('.input-shift-start:first').val();
        let value_end = parentRow.find('.input-shift-end:first').val();

        if (value_start && value_end) {

            let splitStart = value_start.split(":");
            if (splitStart[0] <= 9) {
                // value_start = "0" + value_start;
            }
            let splitEnd = value_end.split(":");
            if (splitEnd[0] <= 9) {
                // value_end = "0" + value_end;
            }

            var a = moment('2021-01-01T' + value_end); //now
            var b = moment('2021-01-01T' + value_start);

            const format = 'HH:mm'; // Specify the time format
            const startMoment = moment(value_start, format);
            const endMoment = moment(value_end, format);

            // Check if the end time is before the start time (next day)
            if (endMoment.isBefore(startMoment)) {
                a.add(1, 'day'); // Add 1 day to the end time
            }

            // console.log(a.diff(b, 'minutes')) // 44700
            // console.log(a.diff(b, 'hours')) // 745
            // console.log(a.diff(b, 'days')) // 31
            // console.log(a.diff(b, 'weeks')) // 4
            let hours = a.diff(b, 'hours', true);
            let minutes = a.diff(b, 'minutes');
            // console.log(value_start, value_end, hours)
            if (hours >= 0) {
                total_hours_input.val(hours.toFixed(2)); //minutesToHHMM(minutes, true)
            } else {
                total_hours_input.val(0);
            }

            if (hours <= 0) {
                parentRow.find('.shared_client_time_text').html('');
                parentRow.find('.shared_client_hours_input').val(0).attr('readonly', true);
            } else {
                parentRow.find('.shared_client_hours_input').not(lastEle).removeAttr('readonly');

                calcLastClientHours(lastEle, parentRow);

                let clientTotal = 0;
                parentRow.find('.shared_client_hours_input').each(function() {
                    clientTotal = clientTotal + parseFloat($(this).val());
                });
                // parentRow.find('.shared_client_roster_tbl thead span:first').html("(" + clientTotal + ")");

                if (clientTotal > hours) {
                    //alert('The selected total hours are less than the added client hours values!');
                    console.warn('Client hours total exceeds total hours:', {
                        mainParentRowId: mainParentRow.attr('id'),
                        parentRowId: parentRow.attr('id'),
                        clientTotal: clientTotal,
                        totalHours: hours,
                        element: ele
                    });
                    parentRow.find('.shared_client_hours_input').val(0);
                    parentRow.find('.shared_client_time_text').html('');
                    // add border red to parentRow
                    parentRow.css('border', '1px solid red');
                    // Add alert danger message in top of the body with link to the parentRow
                    //$('#kt_content_container').prepend('<div class="alert alert-danger">Client hours total exceeds total hours! <a href="#' + mainParentRow.attr('id') + '">Go to row</a></div>');
                    parentRow.find('.alert.alert-danger').remove();
                    parentRow.append('<div class="alert alert-danger">Client hours total exceeds total hours!</div>');

                    calcLastClientHours(lastEle, parentRow);
                } else {
                    // Remove border red from parentRow
                    parentRow.css('border', 'none');
                    // Remove alert danger message in top of the body
                    parentRow.find('.alert.alert-danger').remove();
                }
            }
        } else {
            total_hours_input.val(0);
            parentRow.find('.shared_client_time_text').html('');
            parentRow.find('.shared_client_hours_input').val(0).attr('readonly', true);
            parentRow.find('.shared_client_roster_tbl thead span:first').html("(" + 0 + ")");
        }
    }

    function calcLastClientHours(lastEle, parentRow) {
        let total_hours = parentRow.find('.total_hours_input:first').val();
        let clientTotalNotLast = 0;
        parentRow.find('.shared_client_hours_input').not(lastEle).each(function() {
            clientTotalNotLast = clientTotalNotLast + parseFloat($(this).val());
        });
        let remainingHours = parseFloat(total_hours) - parseFloat(clientTotalNotLast);
        if(remainingHours >= 0){
            lastEle.val(remainingHours.toFixed(2));
            parentRow.find('.shared_client_roster_tbl thead span:first').html("(" + total_hours + ")");
        } else {
            lastEle.val(0);
        }

        let value_start = parentRow.find('.input-shift-start:first').val();
        let value_end = parentRow.find('.input-shift-end:first').val();

        if (value_start && value_end) {

            var a = moment('2021-01-01T' + value_end); //now
            var b = moment('2021-01-01T' + value_start);

            const format = 'HH:mm'; // Specify the time format
            let startMoment = moment(value_start, format);
            let endMoment = moment(value_end, format);

            // Check if the end time is before the start time (next day)
            if (endMoment.isBefore(startMoment)) {
                a.add(1, 'day'); // Add 1 day to the end time
            }
            // console.log(parentRow.find('.shared_client_hours_input'))
            parentRow.find('.shared_client_hours_input').each(function() {
                let clientAddedHours = $(this).val();
                let newFromHours = startMoment.format(format);
                startMoment.add(clientAddedHours, 'hours');
                if(clientAddedHours > 0){
                    $(this).parents('td:first').find('.shared_client_time_text:first').html(newFromHours+' to '+ startMoment.format(format));
                    $(this).parents('td:first').find('.shared_client_hours_time_input:first').val(newFromHours+' to '+ startMoment.format(format));
                } else {
                    $(this).parents('td:first').find('.shared_client_time_text:first').html('');
                    $(this).parents('td:first').find('.shared_client_hours_time_input:first').val();
                }
                
                // console.log(clientAddedHours, newFromHours, startMoment.format(format))
            });
        }
    }

    function minutesToHHMM(mins, twentyFour = false) {
        let h = Math.floor(mins / 60);
        let m = mins % 60;
        m = m < 10 ? '0' + m : m;

        if (twentyFour) {
            h = h < 10 ? '0' + h : h;
            return `${h}:${m}`;
        } else {
            let a = 'am';
            if (h >= 12) a = 'pm';
            if (h > 12) h = h - 12;
            return `${h}:${m} ${a}`;
        }
    }
</script>
@endpush
@endif