/** Core script to handle the entire theme and core functions **/ var Layout = function () { var layoutImgPath = 'img/'; //* BEGIN:CORE HANDLERS *// // this function handles responsive layout on screen size resize or mobile device rotate. // Set proper height for sidebar and content. The content and sidebar height must be synced always. var handleSidebarAndContentHeight = function () { var content = $('.page-content'); var sidebar = $('.page-sidebar'); var body = $('body'); var height; if (body.hasClass("page-footer-fixed") === true && body.hasClass("page-sidebar-fixed") === false) { var available_height = $(window).height() - $('.page-footer').outerHeight() - $('.page-header').outerHeight(); if (content.height() < available_height) { content.attr('style', 'min-height:' + available_height + 'px'); } } else { if (body.hasClass('page-sidebar-fixed')) { height = _calculateFixedSidebarViewportHeight(); if (body.hasClass('page-footer-fixed') === false) { height = height - $('.page-footer').outerHeight(); } } else { height = sidebar.height() + 20; var headerHeight = $('.page-header').outerHeight(); var footerHeight = $('.page-footer').outerHeight(); if ($(window).width() > 1024 && (height + headerHeight + footerHeight) < $(window).height()) { height = $(window).height() - headerHeight - footerHeight; } } content.attr('style', 'min-height:' + height + 'px'); } } // Handle sidebar menu var handleSidebarMenu = function () { jQuery('.page-sidebar').on('click', 'li > a', function (e) { if ($(this).next().hasClass('sub-menu') == false) { if ($('.btn-navbar').hasClass('collapsed') == false) { $('.btn-navbar').click(); } return; } if ($(this).next().hasClass('sub-menu always-open')) { return; } var parent = $(this).parent().parent(); var the = $(this); var menu = $('.page-sidebar-menu'); var sub = jQuery(this).next(); var autoScroll = menu.data("auto-scroll") ? menu.data("auto-scroll") : true; var slideSpeed = menu.data("slide-speed") ? parseInt(menu.data("slide-speed")) : 200; parent.children('li.open').children('a').children('.arrow').removeClass('open'); parent.children('li.open').children('.sub-menu:not(.always-open)').slideUp(200); parent.children('li.open').removeClass('open'); var slideOffeset = -200; if (sub.is(":visible")) { jQuery('.arrow', jQuery(this)).removeClass("open"); jQuery(this).parent().removeClass("open"); sub.slideUp(slideSpeed, function () { if (autoScroll == true && $('body').hasClass('page-sidebar-closed') == false) { if ($('body').hasClass('page-sidebar-fixed')) { menu.slimScroll({'scrollTo': (the.position()).top}); } else { Metronic.scrollTo(the, slideOffeset); } } handleSidebarAndContentHeight(); }); } else { jQuery('.arrow', jQuery(this)).addClass("open"); jQuery(this).parent().addClass("open"); sub.slideDown(slideSpeed, function () { if (autoScroll == true && $('body').hasClass('page-sidebar-closed') == false) { if ($('body').hasClass('page-sidebar-fixed')) { menu.slimScroll({'scrollTo': (the.position()).top}); } else { Metronic.scrollTo(the, slideOffeset); } } handleSidebarAndContentHeight(); }); } e.preventDefault(); }); // handle ajax links within sidebar menu jQuery('.page-sidebar').on('click', ' li > a.ajaxify', function (e) { e.preventDefault(); Metronic.scrollTop(); var url = $(this).attr("href"); var menuContainer = jQuery('.page-sidebar ul'); var pageContent = $('.page-content'); var pageContentBody = $('.page-content .page-content-body'); menuContainer.children('li.active').removeClass('active'); menuContainer.children('arrow.open').removeClass('open'); $(this).parents('li').each(function () { $(this).addClass('active'); $(this).children('a > span.arrow').addClass('open'); }); $(this).parents('li').addClass('active'); Metronic.startPageLoading(); if ($(window).width() <= 991 && $('.page-sidebar').hasClass("in")) { $('.navbar-toggle').click(); } var the = $(this); $.ajax({ type: "GET", cache: false, url: url, dataType: "html", success: function (res) { if (the.parents('li.open').size() === 0) { $('.page-sidebar-menu > li.open > a').click(); } Metronic.stopPageLoading(); pageContentBody.html(res); Layout.fixContentHeight(); // fix content height Metronic.initAjax(); // initialize core stuff }, error: function (xhr, ajaxOptions, thrownError) { Metronic.stopPageLoading(); pageContentBody.html('

Could not load the requested content.

'); } }); }); // handle ajax link within main content jQuery('.page-content').on('click', '.ajaxify', function (e) { e.preventDefault(); Metronic.scrollTop(); var url = $(this).attr("href"); var pageContent = $('.page-content'); var pageContentBody = $('.page-content .page-content-body'); Metronic.startPageLoading(); if ($(window).width() <= 991 && $('.page-sidebar').hasClass("in")) { $('.navbar-toggle').click(); } $.ajax({ type: "GET", cache: false, url: url, dataType: "html", success: function (res) { Metronic.stopPageLoading(); pageContentBody.html(res); Layout.fixContentHeight(); // fix content height Metronic.initAjax(); // initialize core stuff }, error: function (xhr, ajaxOptions, thrownError) { pageContentBody.html('

Could not load the requested content.

'); Metronic.stopPageLoading(); } }); }); } // Helper function to calculate sidebar height for fixed sidebar layout. var _calculateFixedSidebarViewportHeight = function () { var sidebarHeight = $(window).height() - $('.page-header').outerHeight(); if ($('body').hasClass("page-footer-fixed")) { sidebarHeight = sidebarHeight - $('.page-footer').outerHeight(); } return sidebarHeight; } // Handles fixed sidebar var handleFixedSidebar = function () { var menu = $('.page-sidebar-menu'); if (menu.parent('.slimScrollDiv').size() === 1) { // destroy existing instance before updating the height menu.slimScroll({ destroy: true }); menu.removeAttr('style'); $('.page-sidebar').removeAttr('style').removeAttr('data-initialized'); } if ($('.page-sidebar-fixed').size() === 0) { handleSidebarAndContentHeight(); return; } var viewport = Metronic.getViewPort(); if (viewport.width >= 992) { var sidebarHeight = _calculateFixedSidebarViewportHeight(); menu.slimScroll({ size: '7px', color: '#a1b2bd', opacity: .3, position: Metronic.isRTL() ? 'left' : 'right', height: sidebarHeight, allowPageScroll: false, disableFadeOut: false }); handleSidebarAndContentHeight(); } } // Handles sidebar toggler to close/hide the sidebar. var _initFixedSidebarHoverEffect = function() { var body = $('body'); if (body.hasClass('page-sidebar-fixed')) { $('.page-sidebar-menu').on('mouseenter', function(){ if (body.hasClass('page-sidebar-closed')) { $(this).removeClass('page-sidebar-menu-closed'); } }).on('mouseleave', function(){ if (body.hasClass('page-sidebar-closed')) { $(this).addClass('page-sidebar-menu-closed'); } }); } } // Hanles sidebar toggler var handleSidebarToggler = function () { var viewport = Metronic.getViewPort(); var body = $('body'); if ($.cookie && $.cookie('sidebar_closed') === '1' && viewport.width >= 992) { $('body').addClass('page-sidebar-closed'); $('.page-sidebar-menu').addClass('page-sidebar-menu-closed'); } // handle sidebar show/hide $('.page-sidebar, .page-header').on('click', '.sidebar-toggler', function (e) { var sidebar = $('.page-sidebar'); var sidebarMenu = $('.page-sidebar-menu'); $(".sidebar-search", sidebar).removeClass("open"); if (body.hasClass("page-sidebar-closed")) { body.removeClass("page-sidebar-closed"); sidebarMenu.removeClass("page-sidebar-menu-closed"); if ($.cookie) { $.cookie('sidebar_closed', '0'); } } else { body.addClass("page-sidebar-closed"); sidebarMenu.addClass("page-sidebar-menu-closed"); if (body.hasClass("page-sidebar-fixed")) { sidebarMenu.trigger("mouseleave"); } if ($.cookie) { $.cookie('sidebar_closed', '1'); } } $(window).trigger('resize'); }); _initFixedSidebarHoverEffect(); // handle the search bar close $('.page-sidebar').on('click', '.sidebar-search .remove', function (e) { e.preventDefault(); $('.sidebar-search').removeClass("open"); }); // handle the search query submit on enter press $('.page-sidebar .sidebar-search').on('keypress', 'input.form-control', function (e) { if (e.which == 13) { $('.sidebar-search').submit(); return false; //<---- Add this line } }); // handle the search submit(for sidebar search and responsive mode of the header search) $('.sidebar-search .submit').on('click', function (e) { e.preventDefault(); if ($('body').hasClass("page-sidebar-closed")) { if ($('.sidebar-search').hasClass('open') == false) { if ($('.page-sidebar-fixed').size() === 1) { $('.page-sidebar .sidebar-toggler').click(); //trigger sidebar toggle button } $('.sidebar-search').addClass("open"); } else { $('.sidebar-search').submit(); } } else { $('.sidebar-search').submit(); } }); } // Handles the horizontal menu var handleHorizontalMenu = function () { //handle tab click $('.page-header').on('click', '.hor-menu a[data-toggle="tab"]', function (e) { e.preventDefault(); var nav = $(".hor-menu .nav"); var active_link = nav.find('li.current'); $('li.active', active_link).removeClass("active"); $('.selected', active_link).remove(); var new_link = $(this).parents('li').last(); new_link.addClass("current"); new_link.find("a:first").append(''); }); // handle search box expand/collapse $('.page-header').on('click', '.search-form', function (e) { $(this).addClass("open"); $(this).find('.form-control').focus(); $('.page-header .search-form .form-control').on('blur', function(e){ $(this).closest('.search-form').removeClass("open"); $(this).unbind("blur"); }); }); // handle hor menu search form on enter press $('.page-header').on('keypress', '.hor-menu .search-form .form-control', function (e) { if (e.which == 13) { $(this).closest('.search-form').submit(); return false; } }); // handle header search button click $('.page-header').on('mousedown', '.search-form.open .submit', function (e) { e.preventDefault(); e.stopPropagation(); $(this).closest('.search-form').submit(); }); $(document).on('click', '.mega-menu-dropdown .dropdown-menu', function(e) { e.stopPropagation(); }); } // Handles Bootstrap Tabs. var handleTabs = function () { // fix content height on tab click $('body').on('shown.bs.tab', 'a[data-toggle="tab"]', function () { handleSidebarAndContentHeight(); }); } // Handles the go to top button at the footer var handleGoTop = function () { /* set variables locally for increased performance */ jQuery('.page-footer').on('click', '.go-top', function (e) { Metronic.scrollTo(); e.preventDefault(); }); } // Hanlde 100% height elements(block, portlet, etc) var handle100HeightContent = function() { // helper function to reinit slimscroll var reinitSlimscroll = function(target) { if (target.find(".slimScrollDiv").size() === 1) { // destroy existing instance before updating the height target.find(".full-height-content-body").slimScroll({ destroy: true }); target.find(".full-height-content-body").removeAttr('style').removeAttr('data-initialized'); } } var target = $('.full-height-content'); if (target.size() === 0 || $(window).width() < 992) { reinitSlimscroll(target); // reinit slimscroll return; } var height; var body = $('body'); if (body.hasClass('page-footer-fixed')) { height = $(window).height() - $('.page-header').outerHeight() - $('.page-footer').outerHeight(); } else { height = $(window).height() - $('.page-header').outerHeight() - $('.page-footer').outerHeight() - $('.page-title').outerHeight(true) - $('.page-breadcrumb').outerHeight(true); } reinitSlimscroll(target); // reinit slimscroll if (target.hasClass('portlet')) { var portletBody = target.find('.portlet-body'); height = height - target.find('.portlet-title').outerHeight(true) - parseInt(target.find('.portlet-body').css('padding-top')) - parseInt(target.find('.portlet-body').css('padding-bottom')) - 2; if (target.hasClass("full-height-content-scrollable")) { height = height - 20; portletBody.find('.full-height-content-body').css('height', height); Metronic.initSlimScroll(portletBody.find('.full-height-content-body')); } else { portletBody.css('min-height', height); } } else { if (target.hasClass("full-height-content-scrollable")) { height = height - 20; target.find('.full-height-content-body').css('height', height); Metronic.initSlimScroll(target.find('.full-height-content-body')); } else { target.css('min-height', height); } } } // Handle Theme Settings var handleTheme = function () { var panel = $('.theme-panel'); if ($('body').hasClass('page-boxed') == false) { $('.layout-option', panel).val("fluid"); } $('.sidebar-option', panel).val("default"); $('.page-header-option', panel).val("fixed"); $('.page-footer-option', panel).val("default"); if ( $('.sidebar-pos-option').attr("disabled") === false) { $('.sidebar-pos-option', panel).val(Metronic.isRTL() ? 'right' : 'left'); } //handle theme layout var resetLayout = function () { $("body"). removeClass("page-boxed"). removeClass("page-footer-fixed"). removeClass("page-sidebar-fixed"). removeClass("page-header-fixed"). removeClass("page-sidebar-reversed"); $('.page-header > .page-header-inner').removeClass("container"); if ($('.page-container').parent(".container").size() === 1) { $('.page-container').insertAfter('body > .clearfix'); } if ($('.page-footer > .container').size() === 1) { $('.page-footer').html($('.page-footer > .container').html()); } else if ($('.page-footer').parent(".container").size() === 1) { $('.page-footer').insertAfter('.page-container'); } $('body > .container').remove(); } var lastSelectedLayout = ''; var setLayout = function () { var layoutOption = $('.layout-option', panel).val(); var sidebarOption = $('.sidebar-option', panel).val(); var headerOption = $('.page-header-option', panel).val(); var footerOption = $('.page-footer-option', panel).val(); var sidebarPosOption = $('.sidebar-pos-option', panel).val(); if (sidebarOption == "fixed" && headerOption == "default") { alert('Default Header with Fixed Sidebar option is not supported. Proceed with Fixed Header with Fixed Sidebar.'); $('.page-header-option', panel).val("fixed"); $('.sidebar-option', panel).val("fixed"); sidebarOption = 'fixed'; headerOption = 'fixed'; } resetLayout(); // reset layout to default state if (layoutOption === "boxed") { $("body").addClass("page-boxed"); // set header $('.page-header > .page-header-inner').addClass("container"); var cont = $('body > .clearfix').after('
'); // set content $('.page-container').appendTo('body > .container'); // set footer if (footerOption === 'fixed') { $('.page-footer').html('
' + $('.page-footer').html() + '
'); } else { $('.page-footer').appendTo('body > .container'); } } if (lastSelectedLayout != layoutOption) { //layout changed, run responsive handler: Metronic.runResizeHandlers(); } lastSelectedLayout = layoutOption; //header if (headerOption === 'fixed') { $("body").addClass("page-header-fixed"); $(".page-header").removeClass("navbar-static-top").addClass("navbar-fixed-top"); } else { $("body").removeClass("page-header-fixed"); $(".page-header").removeClass("navbar-fixed-top").addClass("navbar-static-top"); } //sidebar if ($('body').hasClass('page-full-width') === false) { if (sidebarOption === 'fixed') { $("body").addClass("page-sidebar-fixed"); $("page-sidebar-menu").addClass("page-sidebar-menu-fixed"); $("page-sidebar-menu").removeClass("page-sidebar-menu-default"); _initFixedSidebarHoverEffect(); } else { $("body").removeClass("page-sidebar-fixed"); $("page-sidebar-menu").addClass("page-sidebar-menu-default"); $("page-sidebar-menu").removeClass("page-sidebar-menu-fixed"); $('.page-sidebar-menu').unbind('mouseenter').unbind('mouseleave'); } } //footer if (footerOption === 'fixed') { $("body").addClass("page-footer-fixed"); } else { $("body").removeClass("page-footer-fixed"); } //sidebar position if (Metronic.isRTL()) { if (sidebarPosOption === 'left') { $("body").addClass("page-sidebar-reversed"); $('#frontend-link').tooltip('destroy').tooltip({placement: 'right'}); } else { $("body").removeClass("page-sidebar-reversed"); $('#frontend-link').tooltip('destroy').tooltip({placement: 'left'}); } } else { if (sidebarPosOption === 'right') { $("body").addClass("page-sidebar-reversed"); $('#frontend-link').tooltip('destroy').tooltip({placement: 'left'}); } else { $("body").removeClass("page-sidebar-reversed"); $('#frontend-link').tooltip('destroy').tooltip({placement: 'right'}); } } handleSidebarAndContentHeight(); // fix content height handleFixedSidebar(); // reinitialize fixed sidebar } // handle theme colors var setColor = function (color) { var color_ = (Metronic.isRTL() ? color + '-rtl' : color); $('#style_color').attr("href", "css/themes/" + color_ + ".css"); if (color == 'light2') { $('.page-logo img').attr('src', '../../assets/admin/layout/img/logo-invert.png'); } else { $('.page-logo img').attr('src', '../../assets/admin/layout/img/logo.png'); } if ($.cookie) { $.cookie('style_color', color); } } $('.toggler', panel).click(function () { $('.toggler').hide(); $('.toggler-close').show(); $('.theme-panel > .theme-options').show(); }); $('.toggler-close', panel).click(function () { $('.toggler').show(); $('.toggler-close').hide(); $('.theme-panel > .theme-options').hide(); }); $('.theme-colors > ul > li', panel).click(function () { var color = $(this).attr("data-style"); setColor(color); $('ul > li', panel).removeClass("current"); $(this).addClass("current"); }); $('.layout-option, .page-header-option, .sidebar-option, .page-footer-option, .sidebar-pos-option', panel).change(setLayout); if ($.cookie && $.cookie('style_color')) { setColor($.cookie('style_color')); } } //* END:CORE HANDLERS *// return { //main function to initiate the theme init: function () { //IMPORTANT!!!: Do not modify the core handlers call order. // reinitialize the layout on window resize Metronic.addResizeHandler(handleSidebarAndContentHeight); // recalculate sidebar & content height on window resize Metronic.addResizeHandler(handleFixedSidebar); // reinitialize fixed sidebar on window resize Metronic.addResizeHandler(handle100HeightContent); // reinitialize content height on window resize //layout handlers handleFixedSidebar(); // handles fixed sidebar menu handleSidebarMenu(); // handles main menu handleHorizontalMenu(); // handles horizontal menu handleSidebarToggler(); // handles sidebar hide/show handle100HeightContent(); // handles 100% height elements(block, portlet, etc) handleGoTop(); //handles scroll to top functionality in the footer handleTabs(); // handle bootstrah tabs handleTheme(); // handles style customer tool }, //public function to fix the sidebar and content height accordingly fixContentHeight: function () { handleSidebarAndContentHeight(); }, getLayoutImgPath: function () { return layoutImgPath; } }; }();