{{-- localize_string --}}
<script type="text/javascript">
    var localize_string = {
        lbl_yes             : '{!! __('forms.lbl_yes')!!}',
        lbl_read_more       : '{!! __('title.read_more')!!}',
        lbl_read_less       : '{!! __('title.read_less')!!}',
        uploadText          : '{!! __('forms.lbl_upload')!!}',
        dragText            : '{!! __('label.Drag_Drop_Files') !!}',
        lbl_remove          : '{!! __('label.remove')!!}',
        dragHereText        : '{!! __('label.drag_drop_file_here_click')!!}',
        dragreplaceText     : '{!! __('label.drag_drop_file_here_replace')!!}',
        somethingWrongText  : '{!! __('label.something_wrong_happended')!!}',
        lbl_ok              : '{!! __('forms.lbl_ok')!!}',
        lbl_cancel          : '{!! __('forms.lbl_cancel')!!}',
        lbl_create          : '{!! __('forms.lbl_create')!!}',
        lbl_no              : '{!! __('forms.lbl_no')!!}',
        lbl_irrelevant      : '{!! __('forms.lbl_irrelevant')!!}',
        lbl_are_you_sure    : '{!! __('label.lbl_are_you_sure')!!}',
        lbl_next            : '{!! __('forms.lbl_next')!!}',
        lbl_nvt             : '{!! __('forms.lbl_nvt')!!}',
        lbl_previous        : '{!! __('forms.lbl_previous')!!}',
        lbl_proceed         : '{!! __('forms.lbl_proceed')!!}',
        lbl_confirm_text    : "{!! __('label.lbl_confirm_text') !!}",
        lbl_yes_delete_it   : "{!! __('label.lbl_yes_delete_it') !!}",
        lbl_recurring_schedule_remove_confirm_text   : "{!! __('label.lbl_recurring_schedule_remove_confirm_text') !!}",
        lbl_recurring_checklist_item_remove_confirm_text   : "{!! __('label.lbl_recurring_checklist_item_remove_confirm_text') !!}",
        lbl_nothing_found    : "{!! __('label.lbl_nothing_found') !!}",
        lbl_please_wait   : "{!! __('label.lbl_please_wait') !!}",
        lbl_search   : "{!! __('label.lbl_search') !!}",
        lbl_no_row_selected_text   : "{!! __('label.lbl_no_row_selected_text') !!}",
        lbl_deactivate_account_confirm_text : "{!! __('label.lbl_deactivate_account_confirm_text') !!}",
        lbl_activate_account_confirm_text   : "{!! __('label.lbl_activate_account_confirm_text') !!}",
        lbl_are_you_sure_restore_this_user   : "{!! __('label.are_you_sure_restore_this_user') !!}",
        lbl_are_you_sure_restore_these_users   : "{!! __('label.are_you_sure_restore_these_users') !!}",
        lbl_start_date   : "{!! __('forms.lbl_start_date') !!}",
        lbl_are_you_sure_delete_element   : "{!! __('label.lbl_are_you_sure_delete_element') !!}",
        lbl_are_you_sure_vacation_type_text   : "{!! __('label.lbl_are_you_sure_vacation_type_text') !!}",
        lbl_checklist_approve   : "{!! __('label.lbl_checklist_approve') !!}",
        lbl_confirmation_approver : "{!! __('vacationhours.confirmation') !!}",
        lbl_reject : "{!! __('label.reject') !!}",
        lbl_approve : "{!! __('forms.lbl_approve') !!}",
        lbl_overtimes : "{!! __('menu.extra_hour_title') !!}",
        lbl_compensation : "{!! __('forms.lbl_compensation') !!}",
        lbl_leaves : "{!! __('menu.absence_title') !!}",
        lbl_vacationhours : "{!! __('menu.vacationhour_title') !!}",
        lbl_no_result_found : "{!! __('forms.lbl_no_result_found') !!}",
        lbl_please_enter_more_characters : "{!! __('forms.please_enter_more_characters') !!}",
        lbl_begin : "{!! __('forms.lbl_begin') !!}",
        lbl_back : "{!! __('forms.lbl_back') !!}",
        lbl_save : "{!! __('forms.lbl_save') !!}",
        lbl_compensation: "{!! __('forms.overtime_compensation_history') !!}",
        lbl_full : "{!! __('forms.lbl_is_full') !!}",
        lbl_partial: "{!! __('forms.lbl_is_partial') !!}",
        lbl_days   : "{!! __('forms.lbl_days') !!}",
        lbl_weeks   : "{!! __('forms.lbl_weeks') !!}",
        lbl_months  : "{!! __('forms.lbl_months') !!}",
        lbl_show  : "{!! __('forms.lbl_show') !!}",
        lbl_entries  : "{!! __('forms.lbl_entries') !!}",
        lbl_all  : "{!! __('forms.lbl_all') !!}",
        lbl_adjust_with_compensation  : "{!! __('forms.lbl_adjust_with_compensation') !!}",
        lbl_are_your_hours_adjust_with_compensation  : "{!! __('forms.lbl_are_your_hours_adjust_with_compensation') !!}",
        lbl_view  : "{!! __('forms.lbl_view') !!}",
        lbl_edit  : "{!! __('forms.lbl_edit') !!}",
        lbl_all_notifications  : "{!! __('forms.lbl_all_notifications') !!}",
        lbl_unread_notifications  : "{!! __('forms.lbl_unread_notifications') !!}",
        lbl_mark_all_as_read  : "{!! __('forms.lbl_mark_all_as_read') !!}",
        lbl_see_all_notifications  : "{!! __('forms.lbl_see_all_notifications') !!}",
        lbl_confirm_text_with_delete_schedule    : "{!! __('label.lbl_confirm_text_with_delete_schedule') !!}",
        password_required    : "{!! __('label.lbl_password_required') !!}",
        lbl_password    : "{!! __('label.lbl_password') !!}",
        password_confirmation    : "{!! __('auth.secure_information') !!}",
        lbl_error    : "{!! __('menu.error') !!}",
        not_in_the_list_unknown  : "{!! __('forms.not_in_the_list_unknown') !!}",
        lbl_warranty_expiry_date  : "{!! __('forms.lbl_warranty_expiry_date') !!}",
        maxFileCount_warning_100_files  : "{!! __('messages.maxFileCount_warning_100_files') !!}",
        lbl_warranty_expiry_date  : "{!! __('forms.lbl_warranty_expiry_date') !!}"

    }, daysOfWeek = [
        "{{trans('forms.sun_zo')}}",
        "{{trans('forms.mon_ma')}}",
        "{{trans('forms.tue_di')}}",
        "{{trans('forms.wed_wo')}}",
        "{{trans('forms.thu_do')}}",
        "{{trans('forms.fri_vr')}}",
        "{{trans('forms.sat_za')}}",
    ], monthNames =  [
        "{{trans('forms.lbl_jan')}}",
        "{{trans('forms.lbl_feb')}}",
        "{{trans('forms.lbl_mar')}}",
        "{{trans('forms.lbl_apr')}}",
        "{{trans('forms.lbl_may')}}",
        "{{trans('forms.lbl_jun')}}",
        "{{trans('forms.lbl_jul')}}",
        "{{trans('forms.lbl_aug')}}",
        "{{trans('forms.lbl_sep')}}",
        "{{trans('forms.lbl_oct')}}",
        "{{trans('forms.lbl_nov')}}",
        "{{trans('forms.lbl_dec')}}"
    ],
    icons = {
        close : `<x-svg-icon icon='icon-close' width='16' height='16' />`,
        edit : `<x-svg-icon icon='icon-edit' />`,
        delete : `<x-svg-icon icon='icon-delete' />`,
        eye : `<x-svg-icon icon='icon-eye' />`,
        plus : `<x-svg-icon icon='icon-plus' />`,
    };

    var date_formats = {
        'd-m-Y' : 'DD-MM-YYYY',
        'm-d-Y' : 'MM-DD-YYYY',
        'd/m/Y' : 'DD/MM/YYYY',
        'm/d/Y' : 'MM/DD/YYYY',
        'Y-m-d' : 'YYYY-MM-DD',
        'Y/m/d' : 'YYYY/MM/DD',
        'd.m.Y' : 'DD.MM.YYYY'
    };
    var lang_local = "{{ app()->getLocale() }}";
    var current_date_format = date_formats["{{ config('settings.date_format') }}"];

    var time_format = "{{ getTimeFormat() }}";
    window.maxFileSize = "{{config('media-library.max_file_size')}}";

    window.assetPaths = {
        storage: "{{ asset('storage') }}",
        wordIcon: "{{ asset('images/icons/word.png') }}",
        pdfIcon: "{{ asset('images/icons/pdf.png') }}",
        videoIcon: "{{ asset('images/icons/video.png') }}"
    };

    var repeat_for = [];

    repeat_for['week'] = [];
    repeat_for['day'] = [];
    repeat_for['month'] = [];

    @for ($i = 1; $i < 13; $i++)
        repeat_for['week'][{{ $i }}] = "<option value='{{ $i }}'>{{ trans_choice('forms.lbl_every_week', $i, ['week' => $i]) }} </option>";
        repeat_for['month'][{{ $i }}] = "<option value='{{ $i }}'>{{ trans_choice('forms.lbl_every_month', $i, ['month' => $i]) }}</option>";
        repeat_for['day'][{{ $i }}] = "<option value='{{ $i }}'>{{ trans_choice('forms.lbl_every_day', $i, ['day' => $i]) }}</option>";
    @endfor

    @if($user = auth()->user())
        var user = {!! collect([
            'id'  => $user->id,
            'name'=> $user->name
        ])->toJson() !!};
    @endif
</script>
<!-- base:js -->
<script src="{{mix('js/vendor.bundle.base.js')}}"></script>
<script type="text/javascript">
    var rangeFilters = {
        "{{trans('label.last_30_days')}}"  : [moment().subtract(29, 'days'), moment()],
        "{{trans('label.last_week')}}"     : [moment().subtract(6, 'days'), moment()],
        "{{trans('menu.today_title')}}"    : [moment(), moment()],
        "{{trans('label.next_week')}}"     : [moment(), moment().add(6, 'days')],
        "{{trans('label.this_month')}}"    : [moment().startOf('month'), moment().endOf('month')],
        "{{trans('label.this_year')}}"     : [moment().startOf('year'), moment().endOf('year')],
        "{{trans('label.last_year')}}"     : [moment().subtract(1, 'year').startOf('year'), moment().subtract(1, 'year').endOf('year')],
    };
</script>

{{-- <script src="{{asset('vendors/jquery-tags-input/jquery.tagsinput.min.js')}}"></script> --}}
<script src="{{asset('vendors/jquery-print/JQuery.print.min.js')}}"></script>
<script src="{{asset('vendors/jquery.repeater/jquery.repeater.min.js')}}"></script>
<script src="{{asset('js/form-repeater.js')}}"></script>
<script src="{{asset('js/dropify.js')}}"></script>
<script src="{{asset('js/cropper.js')}}"></script>
<script src="{{asset('vendors/handlebars/handlebars.min-latest.js')}}"></script>
<script src="https://cdn.datatables.net/colreorder/1.6.0/js/dataTables.colReorder.js"></script>
<script src="https://cdn.datatables.net/colreorder/1.6.0/js/colReorder.dataTables.js"></script>

@include('layouts.partials.search')

<script type="text/javascript">

    moment.tz.setDefault("{{config('settings.timezone')}}");
    //initialize date picker
    function initDatePicker( el = $(".datepicker") ) {
        if (el.length) {
            el.attr('autocomplete', 'off');
            el.find("input").attr('autocomplete', 'off');
            el.datetimepicker({
                format: current_date_format,
                useCurrent : false,
                allowInputToggle: true,
                keepOpen : false,
                icons: datePickerIcons,
                locale: lang_local == 'en' ? 'en-GB' : lang_local
            }).on("blur", function() {
                const livewireEl = $(this).closest('[wire\\:id]');
                if (!livewireEl) return;

                const component = window.Livewire.find(livewireEl.attr('wire:id'));

                if (!component) return;

                component.set($(this).attr('wire:model'), $(this).val());
            });
        }
    }

    function initDateTimePicker( el = $('.datetimepicker-1'), hour = 8, minutes = 0, defaultDate = true) {
        //initialize date time picker
        if (el.length) {

            console.log(defaultDate);

            let config = {
                format:'{{getTimeFormat()}}',
                useCurrent: defaultDate ? true : false,
                defaultDate: defaultDate ? moment({
                    hour: hour,
                    minutes: minutes
                }) : false,
                allowInputToggle: true,
                keepOpen : false,
                icons: datePickerIcons,
            };

            if (hour == 0) {
                delete config.defaultDate;
            }

            el.datetimepicker(config).on("dp.change", function (e) {
                }).on("dp.change", function (e) {
                    // Get Livewire component
                    const livewireEl = $(this).closest('[wire\\:id]');
                    if (!livewireEl) return;

                    const component = window.Livewire.find(livewireEl.attr('wire:id'));

                    if (!component) return;

                    component.set($(this).attr('wire:model'), e.date.format("{{getTimeFormat()}}"), false);
                });
        }
    }

    initDatePicker();

    initDateTimePicker();
    initDateTimePicker( $('.datetimepicker-2'), 17);
    initDateTimePicker( $('.datetimepicker-3'), 3);
    initDateTimePicker( $('.datetimepicker-break-1'), 12);
    initDateTimePicker( $('.datetimepicker-break-2'), 12, 30);

    //initialize popover
    if ($('[data-toggle="popover"]').length) {
        $('[data-toggle="popover"]').popover();
    }

    $(document).tooltip({
        container: 'body',
        selector: '[data-toggle="tooltip"]'
    });
    $(document).on('click', '[data-toggle="tooltip"]', function () {
        $(this).tooltip('dispose');
    });

    $('table').popover({
        container: 'body',
        selector : '[data-toggle="popover"]',
        trigger: 'focus',
        delay: { "show": 100, "hide": 100 },
        html: true,
        content: function () {
            var clone = $($(this).data('popover-content')).clone(true).removeClass('hide');
            return clone;
        }
    });


    //jquery print for print page data easily.
    if ($('.print').length) {
        $('body').on('click', '.print', function(e) {
            $("#outprint").print({
                globalStyles: true,
                mediaPrint: false,
                stylesheet: null,
                noPrintSelector: ".no-print",
                iframe: true,
                append: null,
                prepend: null,
                manuallyCopyFormValues: true,
                deferred: $.Deferred(),
                timeout: 250,
                title: null,
                doctype: '<!doctype html>'
            });
        });
    }

    //disable right click on pdf preview so that user can't copy pdf directly.
    $('body').on('contextmenu', 'canvas', function(e){ return false; });

    //preview image and videos
    function initializeGallery() {

        if($("body").find(".light-gallery").data('lightGallery')) {
            $("body").find(".light-gallery").data('lightGallery').destroy(true);
        }

        $("body").find(".light-gallery").lightGallery( lightGallerySettings );
    }

    if ($("body").find(".light-gallery").length) {
        initializeGallery();
    }

    //re-render datatable based on user input
    if ($('#dt-search-form').length) {

        dtSearch = _.debounce( function(data) {

            var loader = '<div class="custom-loader"><div class="dot-opacity-loader"><span></span><span></span><span></span></div></div>';

            if( $("#dt-search-form").find("button").data("loader") == 1) {
                $(".loader-section").append(loader);
            }

            PDTable.draw();
        }, 500);

        $('#dt-search-form').on('keydown', function(event) {

            if($(event.target).data("multisearch") == 1) {
                return;
            }

            dtSearch();
        });

        $('#dt-search-form').find(".btn-search").on('click', function(event) {
            dtSearch();
        });
    }

    function initConditionalEl() {
        $('body').on('change', "input[type='checkbox'], input[type='radio'], select", function (e) {

            e.preventDefault();

            $el = $("[data-"+$(this).attr('id')+"]");

            let _this = $(this);

            if(e.target.type == "select" || e.target.type == "select-one") {

                $el.each(function() {
                    if(_this.val() === $(this).data(_this.attr('id'))) {


                        if( !$(this).parents(".form_group").hasClass("read-only") ) {
                            $(this).parents(".form_group").removeClass("hidden");

                            if( $("#hr-"+$(this).attr('id')).length > 0 && !$("#hr-"+$(this).attr('id')).hasClass("read-only") ) {
                                $("#hr-"+$(this).attr('id')).removeClass("hidden");
                            }

                            if($(this).data('required') == 1) {
                                $(this).prop('required', 'required');
                            }

                        }

                    } else {

                        if(!$(this).parents(".form_group").hasClass("hidden") && !$(this).parents(".form_group").hasClass("read-only")) {

                            $(this).parents(".form_group").addClass("hidden");

                            if($("#hr-"+$(this).attr('id')).length > 0)
                                $("#hr-"+$(this).attr('id')).addClass("hidden");

                            $(this).removeAttr('required');
                            $(this).val("");
                        }
                    }
                })

            } else {
                $el.each(function() {
                    if(_this.is(':checked')) {
                        $el.parents(".form_group").removeClass("hidden");

                        if($(this).data('required') == 1) {
                            $(this).prop('required', 'required');
                        }

                        //$el.removeAttr( "disabled" );

                        if($("#hr-"+$(this).attr('id')).length > 0)
                            $("#hr-"+$(this).attr('id')).removeClass("hidden");
                    } else {
                        if(!$el.parents(".form_group").hasClass("hidden")) {

                            $el.parents(".form_group").addClass("hidden");

                            //$el.prop("disabled", "true");

                            if($("#hr-"+$(this).attr('id')).length > 0)
                                $("#hr-"+$(this).attr('id')).addClass("hidden");

                            $(this).removeAttr( "required" );
                        }
                    }
                });
            }

        });
    }

    if ($('.conditional').length) {
        initConditionalEl();
    }

    //render pdf as image when employee click on prview button.
    $("body").on("click", ".btn-prevew", function(event) {
        event.preventDefault();
        var url = '{{url('assets')}}', _identifier = $(this).data('id'), media = $(this).data('media'),
            pdfLoader = '<div class="custom-loader"><div class="dot-opacity-loader"><span></span><span></span><span></span></div></div>';

        if(media && !_identifier) {
            $('#modal-preview').modal('show');
            $('#modal-preview').find(".loader-section").append(pdfLoader);
            PDPDFViewer(media);

            return;
        }

        PDRequest({
            type    : "POST",
            url     : url + "/" + _identifier,
            data    : {'media' : media},
            isFlash : false
        }).then((response) => {

            if(response.status == "success") {
                $('#modal-preview').modal('show');
                $('#modal-preview').find(".loader-section").append(pdfLoader);
                PDPDFViewer(response.path);

            }

        }).catch((response) => {
            $('#modal-pincode').find("input[name='id']").val(_identifier);
            $('#modal-pincode').modal('show');
        });
    });

    //open search modal if user click on search btn or input.
    $('.nav-search input, .nav-search .search-btn').on('click', function(event) {
        event.preventDefault();
        $('.search-ui').addClass('open');
        $('.search-ui > form > input').focus();
    });

    // hide search modal
    $('.search-ui .search-close').on('click', function(event) {
        $(this).parents('.search-ui').removeClass('open');
    });

    // submit search form and show server output
    var search_results = [];
    var searchSource = document.getElementById("search-template").textContent;
    var searchTemplate = Handlebars.compile(searchSource);

    searchFunc = _.debounce( function(data) {
        PDRequest({
            type    : "POST",
            url     : '{{route('search.index')}}',
            isFlash : false,
            data : data
        }).then(function(response) {
            searchHtml = searchTemplate({
                results     : response.rows.data,
                hasPages    : response.hasPages,
                hasMorePages: response.hasMorePages,
                next        : response.rows.next_page_url,
                prev        : response.rows.prev_page_url,
                isFirstPage : response.isFirstPage,
            });
            $(".search-results").html(searchHtml);
        });
    }, 500);

    $('#search-form input').on("keydown", function(event) {
        data = $(this).serialize();
        searchFunc(data);
    })

    // Search pagination  process
    $("body").on("click", ".search-results .pagination a", function(event) {
        event.preventDefault();
        let url = $(this).attr('href');
        data = $("#search-form").serialize();
        PDRequest({
            type    : "POST",
            url     : url,
            event   : event,
            isFlash : false,
            data : data
        }).then(function(response) {
            searchHtml = searchTemplate({
                results     : response.rows.data,
                hasPages    : response.hasPages,
                hasMorePages: response.hasMorePages,
                next        : response.rows.next_page_url,
                prev        : response.rows.prev_page_url,
                isFirstPage : response.isFirstPage,
            });
            $(".search-results").html(searchHtml);
        });
    });

    //re-render datatable based on user input
    if ($('#repeat').length) {
        $('body').on("change", "#repeat", function(event) {
            event.preventDefault();
            if($(this).is(":checked")){
                $(".repeat-elements").removeClass('hidden');
            } else {
                if(!$(".repeat-elements").hasClass("hidden")) {
                    $(".repeat-elements").addClass("hidden");
                }
            }
        });
    }

    //initialize jquery repeater
    var repeaterObject = null;

    (function($) {
        'use strict';
        $(function() {
            repeaterObject = initilizeRepeater();
        });
    })(jQuery);

    if($('form[name="modal-form"]').length){
        var modalValidateForm = $('form[name="modal-form"]').validate(validateFormObj);
    }

    if($("#form").length){
        var validateForm = $("#form").validate(validateFormObj);
    } else if($("form[name='form']").length){
        var validateForm = $("form[name='form']").validate(validateFormObj);
    } else if($("form[name='question-form']").length){
        var validateForm = $("form[name='question-form']").validate(validateFormObj);
    } else if($("form[name='feedback-form']").length){
        var validateForm = $("form[name='feedback-form']").validate(validateFormObj);
    } else if($("form[name='review-form']").length){
        var validateForm = $("form[name='review-form']").validate(validateFormObj);
    } else if($(".editable-form").length) {
        var validateForm = $(".editable-form").validate(validateFormObj);
    }

    $(document).on('click', function (e){
        let collapasibles = ['specialdays', 'compensations', 'vacationhours', 'leaves', 'filter-content', 'schedule-information'];

        for (var i = 0; i < collapasibles.length; i++) {
            /* bootstrap collapse js adds "in" class to your collapsible element*/
            var menu_opened = $('#'+collapasibles[i]).hasClass('show');

            if(!$(e.target).closest('#'+collapasibles[i]).length &&
                !$(e.target).is('#'+collapasibles[i]) &&
                menu_opened === true){
                    $('#'+collapasibles[i]).collapse('toggle');
            }
        }

        if (window.innerWidth*window.devicePixelRatio <= 991) {
            var menu_opened = $('#sidebar').hasClass('active');

            if(!$(e.target).closest('#sidebar').length && !$(e.target).is('#sidebar') &&
                !$(e.target).closest('.navbar-brand-wrapper').length &&
                menu_opened === true){
                    $('#sidebar').removeClass('active');
            }
        }

    });

    /*Tinymce editor*/
    function initializeEditor( selector = "", id = null) {

        if(selector == "") {
            selector = ".tinyMceEditor";
        }

        let newEditorSettings = editorSettings;
        let height = $(selector).data('height');
        let menubar = $(selector).data('menu');

        newEditorSettings.selector = selector;
        newEditorSettings.height = height > 0 ? height : 500;

        if(typeof menubar != "undefined") {
            newEditorSettings.menubar = menubar;
        }


        let font_size_formats = "8px";
        for (let i = 9; i <= 80; i++) {
            font_size_formats += " " + i + "px";
        }

        //tinymce.init(newEditorSettings);

        newEditorSettings.font_size_formats = font_size_formats;

        tinymce.init(newEditorSettings);

    }

    if ($(".tinyMceEditor").length) {
        initializeEditor();
    }

    $(document).ready( function() {
        $('input').attr('autocomplete', 'off');
        $('input[type="password"]').attr('autocomplete', 'new-password');
    });

    Handlebars.registerHelper("incitement", function (inindex) {
        return inindex + 1
    });

    // let csrfToken = $('[name="csrf_token"]').attr('content');
    // function refreshToken() {
    //     $.get('refresh-csrf').done(function(data) {
    //         csrfToken = data; // the new token
    //     });
    // }

    // setInterval(refreshToken, 3600000); // 1 hour

    //reload page for history navigation
    var navig_history = performance.getEntriesByType("navigation");
    if (navig_history[0].type === "back_forward") {
        location.reload();
    }

</script>
<script>

    $('.imageContainer').hover(
        function() {
            var blackImage = $(this).find('.blackImage');
            var orangeImage = $(this).find('.orangeImage');
            var menu_arrow = $(this).find('.menu-arrow');
            blackImage.addClass('hide');
            orangeImage.removeClass('hide');
            menu_arrow.css('color', '#FF914D');
        },
        function() {
            var blackImage = $(this).find('.blackImage');
            var orangeImage = $(this).find('.orangeImage');
            var menu_arrow = $(this).find('.menu-arrow');
            blackImage.removeClass('hide');
            orangeImage.addClass('hide');
            menu_arrow.css('color', '#686868');

        }
    );
      $('.imageContainer').click(function() {
        $(this).toggleClass('active');

        var blackImage = $(this).find('.blackImage');
        var orangeImage = $(this).find('.orangeImage');
        if ($(this).hasClass('active')) {
            blackImage.addClass('hide');
            orangeImage.removeClass('hide');
        } else {
            blackImage.removeClass('hide');
            orangeImage.addClass('hide');
        }
      });
      $('.imageContainer.active .blackImage').hide();
      $('.imageContainer.active .orangeImage').show();

    @if(isset($_GET['page']) && $_GET['page'] != "" && isset($_GET['component']) && $_GET['component'] != "")
        document.addEventListener('DOMContentLoaded', function() {
            @php
                $urlParams =  $_GET;
                $namespace = $urlParams['page'];
                unset($urlParams['page']);
                $component = $urlParams['component'];
                unset($urlParams['component']);
                $args = $urlParams;
            @endphp

            Livewire.dispatch('openModal', {
                component: '{{ $namespace }}::{{ $component }}',
                arguments: {!! json_encode($args) !!}
            });
        });
    @endif
  </script>
<!-- endinject -->