| $(document).ready(function () {
    $colors = JSON.parse(localStorage.getItem('colors'));
    $defaultColors = {
        filters: 'danger',
        bg: 'black'
    };
    console.log($colors);
    if (!$colors) {
        localStorage.setItem('colors', JSON.stringify($defaultColors));
    }
    function storeColors() {
        localStorage.setItem('colors', JSON.stringify($colors));
    }
    function setColors(type, color) {
        $(`a.switch-trigger.${type} > div > span`).removeClass('active')
        $(`a.switch-trigger.${type} > div > span.badge-${color}`).addClass('active')
    }
    $().ready(function () {
        $sidebar = $('.sidebar');
        $sidebar_img_container = $sidebar.find('.sidebar-background');
        $full_page = $('.full-page');
        $sidebar_responsive = $('body > .navbar-collapse');
        window_width = $(window).width();
        fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
        if ($sidebar.length !== 0) {
            $sidebar.attr('data-color', $colors.filters);
        }
        if ($full_page.length !== 0) {
            $full_page.attr('filter-color', $colors.filters);
        }
        if ($sidebar_responsive.length !== 0) {
            $sidebar_responsive.attr('data-color', $colors.filters);
        }
        if ($sidebar.length !== 0) {
            $sidebar.attr('data-background-color', $colors.bg);
        }
        setColors('active-color', $colors.filters);
        setColors('background-color', $colors.bg);
        if (window_width > 767 && fixed_plugin_open === 'Dashboard') {
            if ($('.fixed-plugin .dropdown').hasClass('show-dropdown')) {
                $('.fixed-plugin .dropdown').addClass('open');
            }
        }
        $('.fixed-plugin a').click(function (event) {
            // Alex if we click on switch, stop propagation of the event, so the dropdown will not be hide, otherwise we set the  section active
            if ($(this).hasClass('switch-trigger')) {
                if (event.stopPropagation) {
                    event.stopPropagation();
                } else if (window.event) {
                    window.event.cancelBubble = true;
                }
            }
        });
        $('.fixed-plugin .active-color span').click(function () {
            $full_page_background = $('.full-page-background');
            $(this).siblings().removeClass('active');
            $(this).addClass('active');
            var new_color = $(this).data('color');
            if ($sidebar.length !== 0) {
                $sidebar.attr('data-color', new_color);
                $colors.filters = $sidebar.attr('data-color');
                storeColors();
            }
            if ($full_page.length !== 0) {
                $full_page.attr('filter-color', new_color);
                $colors.filters = $full_page.attr('data-color');
                storeColors();
            }
            if ($sidebar_responsive.length !== 0) {
                $sidebar_responsive.attr('data-color', new_color);
                $colors.filters = $sidebar_responsive.attr('data-color');
                storeColors();
            }
        });
        $('.fixed-plugin .background-color .badge').click(function () {
            $(this).siblings().removeClass('active');
            $(this).addClass('active');
            var new_color = $(this).data('background-color');
            if ($sidebar.length !== 0) {
                $sidebar.attr('data-background-color', new_color);
                $colors.bg = $sidebar.attr('data-background-color');
                storeColors();
            }
        });
        $('.fixed-plugin .img-holder').click(function () {
            $full_page_background = $('.full-page-background');
            $(this).parent('li').siblings().removeClass('active');
            $(this).parent('li').addClass('active');
            var new_image = $(this).find("img").attr('src');
            if ($sidebar_img_container.length !== 0 && $('.switch-sidebar-image input:checked').length !== 0) {
                $sidebar_img_container.fadeOut('fast', function () {
                    $sidebar_img_container.css('background-image', 'url("' + new_image + '")');
                    $sidebar_img_container.fadeIn('fast');
                });
            }
            if ($full_page_background.length !== 0 && $('.switch-sidebar-image input:checked').length !== 0) {
                var new_image_full_page = $('.fixed-plugin li.active .img-holder').find('img').data('src');
                $full_page_background.fadeOut('fast', function () {
                    $full_page_background.css('background-image', 'url("' + new_image_full_page + '")');
                    $full_page_background.fadeIn('fast');
                });
            }
            if ($('.switch-sidebar-image input:checked').length === 0) {
                var new_image = $('.fixed-plugin li.active .img-holder').find("img").attr('src');
                var new_image_full_page = $('.fixed-plugin li.active .img-holder').find('img').data('src');
                $sidebar_img_container.css('background-image', 'url("' + new_image + '")');
                $full_page_background.css('background-image', 'url("' + new_image_full_page + '")');
            }
            if ($sidebar_responsive.length !== 0) {
                $sidebar_responsive.css('background-image', 'url("' + new_image + '")');
            }
        });
        $('.switch-sidebar-image input').change(function () {
            $full_page_background = $('.full-page-background');
            $input = $(this);
            if ($input.is(':checked')) {
                if ($sidebar_img_container.length !== 0) {
                    $sidebar_img_container.fadeIn('fast');
                    $sidebar.attr('data-image', '#');
                }
                if ($full_page_background.length !== 0) {
                    $full_page_background.fadeIn('fast');
                    $full_page.attr('data-image', '#');
                }
                background_image = true;
            } else {
                if ($sidebar_img_container.length !== 0) {
                    $sidebar.removeAttr('data-image');
                    $sidebar_img_container.fadeOut('fast');
                }
                if ($full_page_background.length !== 0) {
                    $full_page.removeAttr('data-image', '#');
                    $full_page_background.fadeOut('fast');
                }
                background_image = false;
            }
        });
        $('.switch-sidebar-mini input').change(function () {
            $body = $('body');
            $input = $(this);
            if (md.misc.sidebar_mini_active === true) {
                $('body').removeClass('sidebar-mini');
                md.misc.sidebar_mini_active = false;
                if ($(".sidebar").length !== 0) {
                    var ps = new PerfectScrollbar('.sidebar');
                }
                if ($(".sidebar-wrapper").length !== 0) {
                    var ps1 = new PerfectScrollbar('.sidebar-wrapper');
                }
                if ($(".main-panel").length !== 0) {
                    var ps2 = new PerfectScrollbar('.main-panel');
                }
                if ($(".main").length !== 0) {
                    var ps3 = new PerfectScrollbar('main');
                }
            } else {
                if ($(".sidebar").length !== 0) {
                    var ps = new PerfectScrollbar('.sidebar');
                    ps.destroy();
                }
                if ($(".sidebar-wrapper").length !== 0) {
                    var ps1 = new PerfectScrollbar('.sidebar-wrapper');
                    ps1.destroy();
                }
                if ($(".main-panel").length !== 0) {
                    var ps2 = new PerfectScrollbar('.main-panel');
                    ps2.destroy();
                }
                if ($(".main").length !== 0) {
                    var ps3 = new PerfectScrollbar('main');
                    ps3.destroy();
                }
                setTimeout(function () {
                    $('body').addClass('sidebar-mini');
                    md.misc.sidebar_mini_active = true;
                }, 300);
            }
            // we simulate the window Resize so the charts will get updated in realtime.
            var simulateWindowResize = setInterval(function () {
                window.dispatchEvent(new Event('resize'));
            }, 180);
            // we stop the simulation of Window Resize after the animations are completed
            setTimeout(function () {
                clearInterval(simulateWindowResize);
            }, 1000);
        });
    });
});
 |