https://www.4.works/assets/js/misc.js

1(function($) {
2  'use strict';
3  $(function() {
4    var body = $('body');
5    var contentWrapper = $('.content-wrapper');
6    var scroller = $('.container-scroller');
7    var footer = $('.footer');
8    var sidebar = $('.sidebar');
9
10    //Add active class to nav-link based on url dynamically
11    //Active class can be hard coded directly in html file also as required
12    var current = location.pathname.split("/").slice(-1)[0].replace(/^\/|\/$/g, '');
13    $('.nav li a', sidebar).each(function(){
14        var $this = $(this);
15        if(current === "") {
16          //for root url
17          if($this.attr('href').indexOf("index.html") !== -1){
18              $(this).parents('.nav-item').last().addClass('active');
19              if ($(this).parents('.sub-menu').length) {
20                $(this).closest('.collapse').addClass('show');
21                $(this).addClass('active');
22              }
23          }
24        }
25        else {
26          //for other url
27          if($this.attr('href').indexOf(current) !== -1){
28              $(this).parents('.nav-item').last().addClass('active');
29              if ($(this).parents('.sub-menu').length) {
30                $(this).closest('.collapse').addClass('show');
31                $(this).addClass('active');
32              }
33          }
34        }
35    })
36
37    //Close other submenu in sidebar on opening any
38
39    sidebar.on('show.bs.collapse','.collapse', function() {
40      sidebar.find('.collapse.show').collapse('hide');
41    });
42
43
44    //Change sidebar and content-wrapper height
45    applyStyles();
46    function applyStyles() {
47
48      //setting content wrapper height
49      if(!(body.hasClass("horizontal-menu") && window.matchMedia('(min-width: 992px)').matches)) {
50        setTimeout(function(){
51          if(contentWrapper.outerHeight() < (sidebar.outerHeight() - footer.outerHeight())) {
52            contentWrapper.css({
53              'min-height':sidebar.outerHeight() - footer.outerHeight()
54            });
55          }
56
57          if(sidebar.outerHeight() < (contentWrapper.outerHeight() + footer.outerHeight())) {
58            sidebar.css({
59              'min-height':contentWrapper.outerHeight() + footer.outerHeight()
60            });
61          }
62
63        }, 1000);
64      }
65      else {
66        contentWrapper.css({
67          'min-height':'100vh'
68        });
69      }
70
71      //Applying perfect scrollbar
72      if(!body.hasClass("rtl")) {
73        $('.settings-panel .tab-content .tab-pane.scroll-wrapper, ul.chats, .product-chart-wrapper').perfectScrollbar();
74        if(body.hasClass("sidebar-fixed")) {
75          $('#sidebar .nav').perfectScrollbar();
76        }
77      }
78    }
79
80    $('.sidebar [data-toggle="collapse"]').on("click", function(event) {
81      if(!(body.hasClass('sidebar-icon-only')||body.hasClass('horizontal-menu'))) {
82        //Updating content wrapper height to sidebar height on expanding a menu in sidebar
83        var clickedItem = $(this);
84        console.log(clickedItem);
85        if(clickedItem.attr('aria-expanded') === 'false') {
86          var scrollTop = scroller.scrollTop() - 20;
87        }
88        else {
89          var scrollTop = scroller.scrollTop() - 100;
90        }
91        setTimeout(function(){
92            if(contentWrapper.outerHeight()+ footer.outerHeight()!== sidebar.outerHeight()) {
93              applyStyles();
94              scroller.animate({ scrollTop: scrollTop }, 350);
95            }
96        }, 400);
97      }
98      else {
99        //Disable click on sidebar menu item when sidebar icon only mode or horizontal menu mode is in use
100        //to avoid ambiguity of mixed hover and click on menu item
101        return false;
102      }
103    })
104    $('[data-toggle="minimize"]').on("click", function () {
105      if((body.hasClass('sidebar-toggle-display'))||(body.hasClass('sidebar-absolute'))) {
106        body.toggleClass('sidebar-hidden');
107        applyStyles();
108      }
109      else {
110        body.toggleClass('sidebar-icon-only');
111        applyStyles();
112      }
113    });
114
115    //checkbox and radios
116    $(".form-check label,.form-radio label").append('<i class="input-helper"></i>');
117
118    //fullscreen
119    $("#fullscreen-button").on("click",function toggleFullScreen() {
120      if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) {
121          if (document.documentElement.requestFullScreen) {
122              document.documentElement.requestFullScreen();
123          } else if (document.documentElement.mozRequestFullScreen) {
124              document.documentElement.mozRequestFullScreen();
125          } else if (document.documentElement.webkitRequestFullScreen) {
126              document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
127          } else if (document.documentElement.msRequestFullscreen) {
128              document.documentElement.msRequestFullscreen();
129          }
130      }
131      else {
132          if (document.cancelFullScreen) {
133              document.cancelFullScreen();
134          } else if (document.mozCancelFullScreen) {
135              document.mozCancelFullScreen();
136          } else if (document.webkitCancelFullScreen) {
137              document.webkitCancelFullScreen();
138          } else if (document.msExitFullscreen) {
139              document.msExitFullscreen();
140          }
141      }
142    })
143  });
144})(jQuery);