regenerate: true
{% capture cache %}
{% comment %}
# ----------------------------------------------------------------------------- # ~/assets/themes/j1/core/js/adapter/navigator.js # Liquid template to create the Template Adapter for J1 Navigator # # Product/Info: # {{site.data.j1_config.theme_author_url}} # # Copyright (C) 2019 Juergen Adams # # J1 Template is licensed under the MIT License. # For details, see {{site.data.j1_config.theme_author_url}} # # ----------------------------------------------------------------------------- # Test data: # {{ liquid_var | debug }} # # ----------------------------------------------------------------------------- # NOTE: # # JSON pretty print # Example: var str = JSON.stringify(obj, null, 2); // spacing level = 2 # See: https://stackoverflow.com/questions/4810841/how-can-i-pretty-print-json-using-javascript # # -----------------------------------------------------------------------------
{% endcomment %}
{% comment %} Load YML config data ——————————————————————————– {% endcomment %} {% assign environment = site.environment %} {% assign debug = navigator_config.debug %} {% assign brand_image_height = site.brand.image_height %}
{% assign auth_config = site.j1_auth %} {% assign navigator_config = site.data.modules.j1_navigator %} {% assign nav_defaults = navigator_config.defaults %} {% assign nav_bar_config = navigator_config.nav_bar %} {% assign nav_menu_config = navigator_config.nav_menu %} {% assign nav_quicklinks_config = navigator_config.nav_quicklinks %} {% assign nav_topsearch_config = navigator_config.nav_topsearch %} {% assign nav_sidebar_config = navigator_config.nav_sidebar %} {% assign nav_authclient_config = navigator_config.nav_authclient %}
{% if nav_bar_config.dropdown_animate_duration != null %}
{% assign animate_duration = nav_bar_config.dropdown_animate_duration %}
{% else %}
{% assign animate_duration = 1 %}
{% endif %}
{% comment %} Set|Overload Liquid vars hardwired to NOT break the (MD) style ToDo: Remove configuration from j1_navigator.yml ——————————————————————————– {% endcomment %} {% assign dropdown_border_height = “3” %}
/*
# ----------------------------------------------------------------------------- # ~/assets/themes/j1/core/js/adapter/navigator.js # JS Adapter for J1 Navigator # # Product/Info: # {{site.data.j1_config.theme_author_url}} # # Copyright (C) 2019 Juergen Adams # # J1 Template is licensed under the MIT License. # For details, see {{site.data.j1_config.theme_author_url}} # # ----------------------------------------------------------------------------- # Adapter generated: {{site.time}} # -----------------------------------------------------------------------------
*/ 'use strict';
j1.Navigator = (function (j1, window) {
var environment = '{{environment}}'; // Set environment var state = 'not_started'; // J1 data file objects var nav_menu_id = 'navigator_nav_menu'; var nav_quicklinks_id = 'mod_quicklinks'; var nav_sidebar_id = 'mod_sidebar'; var authclient_modals_id = 'authclient_modals'; var colors_data_path = '/assets/data/colors.json'; var font_size_data_path = '/assets/data/font_sizes.json'; var nav_menu_data_path = '/assets/data/menu/index.html'; var nav_quicklinks_data_path = '/assets/data/quicklinks/index.html'; var nav_sidebar_data_path = '/assets/data/sidebar/index.html'; var authclient_modals_data_path = '/assets/data/authclient/index.html'; var user_state = {}; var user_state_merged = {}; var web_session_state = {}; var j1_colors = {}; var j1_font_sizes = {}; var appDetected; var authClientEnabled; var json_data; var logger; var logText; return { // ------------------------------------------------------------------------- // Initialize Navigator // ------------------------------------------------------------------------- init: function ( options ) { // Configuration setting objects var authConfig = {}; // Module setting objects var navDefaults = {}; var navBarConfig = {}; var navMenuConfig = {}; var navQuicklinksConfig = {}; var navTopsearchConfig = {}; var navSidebarConfig = {}; var navAuthClientConfig = {}; var navBarOptions = {}; var navMenuOptions = {}; var navQuicklinksOptions = {}; var navTopsearchOptions = {}; var navSidebarOptions = {}; var navAuthClientOptions = {}; {% comment %} Set global variables -------------------------------------------------------------------------- {% endcomment %} logger = log4javascript.getLogger("j1.Navigator.adapter"); // Setup logger // Set|Log status state = 'started'; logger.info('state: ' + state); {% comment %} Load module config from yml data file -------------------------------------------------------------------------- {% endcomment %} // Load module DEFAULTS|CONFIG navDefaults = $.extend({}, {{nav_defaults | replace: '=>', ':' }}); navBarConfig = $.extend({}, {{nav_bar_config | replace: '=>', ':' }}); navMenuConfig = $.extend({}, {{nav_menu_config | replace: '=>', ':' }}); navQuicklinksConfig = $.extend({}, {{nav_quicklinks_config | replace: '=>', ':' }}); navTopsearchConfig = $.extend({}, {{nav_topsearch_config | replace: '=>', ':' }}); navSidebarConfig = $.extend({}, {{nav_sidebar_config | replace: '=>', ':' }}); navAuthClientConfig = $.extend({}, {{nav_authclient_config | replace: '=>', ':' }}); authConfig = $.extend({}, {{auth_config | replace: '=>', ':' }}); authClientEnabled = authConfig.enabled; // Merge|Overload module CONFIG by DEFAULTS navBarOptions = j1.mergeData( navDefaults.nav_bar, navBarConfig ); navMenuOptions = j1.mergeData( navDefaults.nav_menu, navMenuConfig ); navQuicklinksOptions = j1.mergeData( navDefaults.nav_quicklinks, navQuicklinksConfig ); navTopsearchOptions = j1.mergeData( navDefaults.nav_topsearch, navTopsearchConfig ); navSidebarOptions = j1.mergeData( navDefaults.nav_sidebar, navSidebarConfig ); navAuthClientConfig = j1.mergeData( navDefaults.nav_authclient, navAuthClientConfig ); // Load (individual) frontmatter options (currently NOT used) if ( options != null ) { var frontmatterOptions = $.extend({}, options) } {% comment %} Helper functions for (AJAX) data load -------------------------------------------------------------------------- {% endcomment %} function load_color_data() { // Returns the j1_colors object return $.ajax({ url: colors_data_path, success: function (data) { if (typeof data == 'string') { j1_colors = JSON.parse(data); } if (typeof data == 'object') { j1_colors = data; } } }); }; function load_font_sizes() { // Returns the j1_font_sizes object return $.ajax({ url: font_size_data_path, success: function (data) { if (typeof data == 'string') { j1_font_sizes = JSON.parse(data); } if (typeof data == 'object') { j1_font_sizes = data; } } }); }; {% comment %} Deferred (AJAX) data load -------------------------------------------------------------------------- {% endcomment %} // Load color and font (json) data asychronously // See: https://stackoverflow.com/questions/3709597/wait-until-all-jquery-ajax-requests-are-done $.when( load_color_data(), load_font_sizes(), j1.Navigator.loadSideBar(), j1.Navigator.loadQuickLinks() ).done ( function( load_color_data_response, load_font_sizes_response, load_sidebar_response, load_quicklinks_response ) { // Detect|Set J1 App status appDetected = j1.appDetected(); authClientEnabled = j1.authClientEnabled(); logger.info('Application status detected: ' + appDetected); // Run initializer functions logger.info('Load MenuBar and CSS styles'); j1.Navigator.loadMenuBar( navMenuOptions ); j1.Navigator.setCss( navBarOptions, navMenuOptions, navQuicklinksOptions, navTopsearchOptions, navSidebarOptions ); // Detect|Enable AuthClient if ( appDetected ) { logger.info('Load AuthClient modals'); j1.Navigator.loadAuthClientModals( authConfig ); if ( authClientEnabled ) { $('#quickLinksSignInOutButton').css('display', 'block'); } else { $('#quickLinksSignInOutButton').css('display', 'none'); } } // Set|Log status state = 'initialized'; logger.info('state: ' + state); logger.info("J1 Navigator initialized successfully"); }); // Reset on resize $(window).on("resize", function() { j1nav.manageDropdownMenu(); $(".top-search").slideUp(); setTimeout(function(){ j1nav.navbarSticky(); }, 500); // Toggle Bars $('button.navigator.navbar-toggler').each( function() { $(".mdi", this).removeClass("mdi-close"); $(".mdi", this).addClass("mdi-menu"); $(this).removeClass("fixed"); }); $(".navbar-collapse").removeClass("in"); $(".navbar-collapse").removeClass("on"); $(".navbar-collapse").removeClass("bounceIn"); }); return true; }, // END init // ------------------------------------------------------------------------- // load the Menu bar // ------------------------------------------------------------------------- loadMenuBar: function ( options ) { var navMenuOptions = options; // closure to pass additional data (e.g. div #id) // to AJAX load callback (id) // See: http://stackoverflow.com/questions/939032/jquery-pass-more-parameters-into-callback var cb_load_closure = function(id, navMenuOptions) { return function ( responseTxt, statusTxt, xhr ) { if ( statusTxt == "success" ) { j1nav.initialize( navMenuOptions ); var logText = "MenuBar on ID " +id+ " loaded successfully" logger.info(logText); // Set processing to 'finished' to display page state = 'finished'; logger.info('state: ' + state); // Set|Log status // Initialize theme selectors for J1Theme Switcher $('#ThemeList').bootstrapThemeSwitcher({localFeed: ''}); // Load from Bootswatch API $('#ThemeSelect').bootstrapThemeSwitcher(); // Load from localFeed var logText = "ThemeSwitcher Feeds on ID " +id+ " loaded successfully" logger.info(logText); } if ( statusTxt == "error" ) { state = 'failed'; logger.error('state: ' + state); var logText = "MenuBar on ID " +id+ " loading failed. Error: " + xhr.status + ": " + xhr.statusText; logger.error(logText); } }; }; var id = "#" + nav_menu_id; var selector = $(id); if ( selector.length ) { var menu_data_path = nav_menu_data_path + " " + id + " > *"; selector.load( menu_data_path, cb_load_closure( id, navMenuOptions ) ); } return true; }, // END loadMenuBar // ------------------------------------------------------------------------- // load the Sidebar // ------------------------------------------------------------------------- loadSideBar: function ( options ) { var loadSideBarOptions = options; var logger = log4javascript.getLogger('j1.Navigator.loadSidebar'); var logText = 'Start initialization'; logger.info(logText); // closure to pass additional data (e.g. div #id) var cb_load_closure = function( id ) { return function ( responseTxt, statusTxt, xhr ) { if ( statusTxt == "success" ) { var logText = "Sidebar on ID " +id+ " loaded successfully" logger.info(logText); // Set processing to 'finished' to display page state = 'sidebar_loaded'; logger.info('state: ' + state); // Set|Log status } if ( statusTxt == "error" ) { state = 'failed'; logger.error('state: ' + state); var logText = "Loading Sidebar on ID " +id+ " failed. Error: " + xhr.status + ": " + xhr.statusText; logger.error(logText); } }; }; var id = "#" + nav_sidebar_id; var selector = $(id); if ( selector.length ) { var sidebar_data_path = nav_sidebar_data_path; selector.load( sidebar_data_path, cb_load_closure( id ) ); } return true; }, // END loadSideBar // ------------------------------------------------------------------------- // load the QuickLinks bar // ------------------------------------------------------------------------- loadQuickLinks: function ( options ) { var quickLinkOptions = options; var logger = log4javascript.getLogger('j1.Navigator.loadQuickLinks'); var logText = 'Start initialization'; logger.info(logText); // closure to pass additional data (e.g. div #id) var cb_load_closure = function( id ) { return function ( responseTxt, statusTxt, xhr ) { if ( statusTxt == "success" ) { var logText = "QuickLinks on ID " +id+ " loaded successfully" logger.info(logText); // Set processing to 'finished' to display page state = 'quicklinks_loaded'; logger.info('state: ' + state); // Set|Log status } if ( statusTxt == "error" ) { state = 'failed'; logger.error('state: ' + state); var logText = "Loading QuickLinks on ID " +id+ " failed. Error: " + xhr.status + ": " + xhr.statusText; logger.error(logText); } }; }; var id = "#" + nav_quicklinks_id; var selector = $(id); if ( selector.length ) { var quicklinks_data_path = nav_quicklinks_data_path; selector.load( quicklinks_data_path, cb_load_closure( id ) ); } return true; }, // END loadQuickLinks // ------------------------------------------------------------------------- // load the modals used by J1AuthClient // ------------------------------------------------------------------------- loadAuthClientModals: function ( authConfig ) { // closure to pass additional data (#id) var cb_load_closure = function( id ) { return function ( responseTxt, statusTxt, xhr ) { if ( statusTxt == "success" ) { var logText = "Modals on ID " +id+ " loaded successfully" j1.Navigator.initAuthClient( authConfig ); logger.info(logText); state = 'finished'; logger.info('state: ' + state); } if ( statusTxt == "error" ) { state = 'failed'; logger.error('state: ' + state); var logText = "Modals on ID " +id+ " loading failed. Error: " + xhr.status + ": " + xhr.statusText; logger.error(logText); } }; }; var id = "#" + authclient_modals_id; var selector = $(id); if ( selector.length ) { var modals_data_path = authclient_modals_data_path + " > *"; selector.load( modals_data_path, cb_load_closure( id ) ); } else { var logText = "AuthClient Modals not loaded" logger.info(logText); // Set processing to 'finished' to display page state = 'finished'; logger.info('state: ' + state); } return true; }, // END loadAuthClientModals // ------------------------------------------------------------------------- // Initialize JS portion for the dialogs (modals) used by J1AuthClient // NOTE: Currently cookie|sidebar updates NOT processed at the NAV module // All updates on Cookies are managed by Cookie Consent. // To be considered to re-add cookie updates for the auth state // ------------------------------------------------------------------------- initAuthClient: function( options ) { var authConfig = options; var web_session_state = j1.getWebSessionCookie(); var userAuthenticated = web_session_state.authenticated === 'true' ? true : false; // Setup logger logger = log4javascript.getLogger('j1.initAuthClient'); state = 'initialize'; logText = 'state: ' + state; logger.info(logText); j1.Navigator.modalEventHandler( authConfig ); if ( j1.appDetected() && j1.authClientEnabled() ) { // user_state = j1.getUserStateCookie(); // web_session_state = j1.getWebSessionCookie(); // userAuthenticated = web_session_state.authenticated === 'true' ? true : false; // Toggle/Set SignIn/SignOut icon|link in QuickLinks // See: https://stackoverflow.com/questions/13524107/how-to-set-data-attributes-in-html-elements if ( userAuthenticated ) { var modal_target = $('#navLinkSignInOut').data('target'); var iconSignInOutClasses = $('#iconSignInOut').attr('class').split(/\s+/); // Set SignOut $('#navLinkSignInOut').attr("data-target","#modalOmniSignOut"); $('#iconSignInOut').removeClass( "mdi-login" ).addClass( "mdi-logout" ); } else { var modal_target = $('#navLinkSignInOut').data('target'); var iconSignInOutClasses = $('#iconSignInOut').attr('class').split(/\s+/); // Set SignIn $('#navLinkSignInOut').attr("data-target","#modalOmniSignIn"); $('#iconSignInOut').removeClass( "mdi-logout" ).addClass( "mdi-login" ); } // logger.info('Update cookies|sidebar'); // j1.updateCookies( user_state ); // j1.updateSidebar( user_state ); } // Set|Log status state = 'initialized'; logText = 'state: ' + state; logger.info(logText); return true; }, // END initAuthClient // ------------------------------------------------------------------------- // EventHandler for J1 AuthClient // Manage button click events for all BS Modals // See: https://www.nickang.com/add-event-listener-for-loop-problem-in-javascript/ // ------------------------------------------------------------------------- modalEventHandler: function ( options ) { var authConfig = options; var route; var provider; var provider_url; var allowed_users; var logText; var signIn = { provider: authConfig.providers.activated[0], users: authConfig.providers[authConfig.providers["activated"][0]]["users"], do: false } var signOut = { provider: authConfig.providers.activated[0], providerSignOut: false, do: false } var logger = log4javascript.getLogger("j1.Navigator.modalEventHandler"); // Setup logger logText = "Initialize button click events"; logger.info(logText); var modalsLoaded = setInterval(function() { if ( j1.Navigator.state() === 'finished' ) { // Manage button click events for modal "signInOutButton" // ------------------------------------------------------------------- $('ul.nav-pills > li').click(function (e) { e.preventDefault(); signIn.provider = $(this).text().trim(); signIn.provider = signIn.provider.toLowerCase(); signIn.allowed_users = signIn.users[signIn.provider]; }); $("a.btn").click(function() { if (this.id === "signInButton") { signIn.do = true; } else { signIn.do = false; } if (this.id === "signOutButton") { signOut.do = true; } else { signOut.do = false; } }); $('input:checkbox[name="providerSignOut"]').on('click', function (e) { e.stopPropagation(); signOut.providerSignOut = $('input:checkbox[name="providerSignOut"]').is(":checked"); if( environment == "development" ) { logText = "Provider signout set to: " +signOut.providerSignOut; logger.info( logText ); } }); // Manage pre events on modal "modalOmniSignIn" // ------------------------------------------------------------------- $("#modalOmniSignOut").on('show.bs.modal', function() { var modal = $(this); logger.info('Place current user data'); user_state = j1.getUserStateCookie(); modal.find('.user-info').text('You are signed in to provider: ' + user_state.provider); }); // END SHOW modalOmniSignOut // Manage post events on modal "modalOmniSignIn" // ------------------------------------------------------------------- $("#modalOmniSignIn").on('hidden.bs.modal', function() { if (signIn.do == true) { provider = signIn.provider.toLowerCase(); allowed_users = signIn.allowed_users; logText = 'Provider detected: ' + provider; logger.info(logText); var route = '/authentication?request=signin&provider=' +provider+ '&allowed_users=' +allowed_users; logText = 'Call middleware for route ' +route+ ' for signin'; logger.info(logText); window.location.href = route; } else { provider = signIn.provider.toLowerCase(); logText = 'Provider detected: ' + provider; logger.info(logText); logText = 'Login for ' +provider+ " declined"; logger.info(logText); } }); // END post events "modalOmniSignIn" // Manage post events on modal "modalOmniSignOut" // ------------------------------------------------------------------- $("#modalOmniSignOut").on('hidden.bs.modal', function() { if (signOut.do == true) { // logger.info('Load active provider from cookie: UserState'); // user_state = j1.getUserStateCookie(); provider = web_session_state.provider; provider_url = web_session_state.provider_url; logText = 'Provider detected: ' + provider; logger.info(logText); logText = 'Initiate signout for ' +provider; logger.info(logText); // var route = '/authentication?request=signout&provider=' + provider + '&provider_signout=' + signOut.providerSignOut + '&provider_url=' + provider_url; var route = '/authentication?request=signout&provider=' + provider + '&provider_signout=' + signOut.providerSignOut; // + '/logout/'; logText = 'Call middleware: ' +route; logger.info(logText); window.location.href = route; } else { provider = signOut.provider.toLowerCase(); logText = 'Provider detected: ' + provider; logger.info(logText); logText = 'SignOut for ' +provider+ " declined"; logger.info(logText); } }); // END post events "modalSignOut" logText = "Initialize events finished"; logger.info(logText); // clear interval checking clearInterval(modalsLoaded); } // END Manage cookie consent dialog }, 50); // END setInterval return true; }, // END modalEventHandler // ------------------------------------------------------------------------- // Set dynamic CSS styles // ------------------------------------------------------------------------- setCss: function ( navBarOptions, navMenuOptions, navQuicklinksOptions, navTopsearchOptions, navSidebarOptions ) { // BS4 media breakpoints var gridBreakpoint_lg = '992px'; var gridBreakpoint_md = '768px'; var gridBreakpoint_sm = '576px'; {% comment %} Resolve symbolic font sizes -------------------------------------------------------------------------- {% endcomment %} {% comment %} Set|Resolve navMenuOptions -------------------------------------------------------------------------- {% endcomment %} if ( typeof j1_font_sizes[navMenuOptions.dropdown_font_size] != "undefined" ) { navMenuOptions.dropdown_font_size = j1_font_sizes[navMenuOptions.dropdown_font_size] } if ( typeof j1_font_sizes[navMenuOptions.megamenu_font_size] != "undefined" ) { navMenuOptions.megamenu_font_size = j1_font_sizes[navMenuOptions.megamenu_font_size] } {% comment %} Resolve symbolic color names -------------------------------------------------------------------------- {% endcomment %} {% comment %} Set|Resolve navBarOptions -------------------------------------------------------------------------- {% endcomment %} if ( typeof j1_colors[navBarOptions.background_color_full] != "undefined" ) { navBarOptions.background_color_full = j1_colors[navBarOptions.background_color_full] } if ( typeof j1_colors[navBarOptions.background_color_collapsed] != "undefined" ) { navBarOptions.background_color_collapsed = j1_colors[navBarOptions.background_color_collapsed] } if ( typeof j1_colors[navBarOptions.background_color_scrolled] != "undefined" ) { navBarOptions.background_color_scrolled = j1_colors[navBarOptions.background_color_scrolled] } {% comment %} Set|Resolve navMenuOptions -------------------------------------------------------------------------- {% endcomment %} if ( typeof j1_colors[navMenuOptions.menu_item_color] != "undefined" ) { navMenuOptions.menu_item_color = j1_colors[navMenuOptions.menu_item_color] } if ( typeof j1_colors[navMenuOptions.menu_item_color_hover] != "undefined" ) { navMenuOptions.menu_item_color_hover = j1_colors[navMenuOptions.menu_item_color_hover] } if ( typeof j1_colors[navMenuOptions.menu_item_dropdown_color] != "undefined" ) { navMenuOptions.menu_item_dropdown_color = j1_colors[navMenuOptions.menu_item_dropdown_color] } if ( typeof j1_colors[navMenuOptions.dropdown_item_color] != "undefined" ) { navMenuOptions.dropdown_item_color = j1_colors[navMenuOptions.dropdown_item_color] } if ( typeof j1_colors[navMenuOptions.dropdown_background_color_hover] != "undefined" ) { navMenuOptions.dropdown_background_color_hover = j1_colors[navMenuOptions.dropdown_background_color_hover] } if ( typeof j1_colors[navMenuOptions.dropdown_background_color_active] != "undefined" ) { navMenuOptions.dropdown_background_color_active = j1_colors[navMenuOptions.dropdown_background_color_active] } if ( typeof j1_colors[navMenuOptions.dropdown_border_color] != "undefined" ) { navMenuOptions.dropdown_border_color = j1_colors[navMenuOptions.dropdown_border_color] } {% comment %} Set|Resolve navQuicklinksOptions -------------------------------------------------------------------------- {% endcomment %} if ( typeof j1_colors[navQuicklinksOptions.icon_color] != "undefined" ) { navQuicklinksOptions.icon_color = j1_colors[navQuicklinksOptions.icon_color] } if ( typeof j1_colors[navQuicklinksOptions.icon_color_hover] != "undefined" ) { navQuicklinksOptions.icon_color_hover = j1_colors[navQuicklinksOptions.icon_color_hover] } if ( typeof j1_colors[navQuicklinksOptions.background_color] != "undefined" ) { navQuicklinksOptions.background_color = j1_colors[navQuicklinksOptions.background_color] } {% comment %} Set|Resolve navTopsearchOptions -------------------------------------------------------------------------- {% endcomment %} if ( typeof j1_colors[navTopsearchOptions.input_color] != "undefined" ) { navTopsearchOptions.input_color = j1_colors[navTopsearchOptions.input_color] } if ( typeof j1_colors[navTopsearchOptions.background_color] != "undefined" ) { navTopsearchOptions.background_color = j1_colors[navTopsearchOptions.background_color] } {% comment %} Set|Resolve navSidebarOptions -------------------------------------------------------------------------- {% endcomment %} if ( typeof j1_colors[navSidebarOptions.background_color] != "undefined" ) { navSidebarOptions.background_color = j1_colors[navSidebarOptions.background_color] } {% comment %} Set dymanic styles -------------------------------------------------------------------------- {% endcomment %} {% comment %} navBar styles -------------------------------------------------------------------------- {% endcomment %} // Size of brand image $('head').append("<style>.navbar-brand > img { height: {{brand_image_height}}px !important; }</style>"); // Navbar transparent-light (light) $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator.navbar-transparent.light { background-color: " +navBarOptions.background_color_full+ "; border-bottom: solid 0px !important; } }</style>"); $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator.navbar-scrolled.light { background-color: " +navBarOptions.background_color_scrolled+ "; } }</style>"); /* Navbar media-queries, LARGE Window|Desktop (>= 1024) */ /* jadams: Oversized menu bar fixed by: overflow: hidden */ $('head').append("<style>@media (max-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator { background-color: " +navBarOptions.background_color_collapsed+ "; overflow: hidden; } }</style>"); //$('head').append("<style>@media (max-width: 1023px) { row { margin-left: 0 !important; margin-right: 0 !important; } }</style>"); {% comment %} navQuicklinks styles -------------------------------------------------------------------------- {% endcomment %} $('head').append("<style>.attr-nav> ul > li > a { color: " +navQuicklinksOptions.icon_color+ " !important; }</style>"); $('head').append("<style>.attr-nav> ul > li > a:hover { color: " +navQuicklinksOptions.icon_color_hover+ " !important; }</style>"); {% comment %} navMenu styles -------------------------------------------------------------------------- {% endcomment %} // TODO: Check if this style is needed for MENU item (hover) //$('head').append("<style>nav.navbar.navbar-transparent ul.nav > li > a:hover,nav.navbar.no-background ul.nav > li > a:hover,nav.navbar ul.nav li.scroll.active > a,nav.navbar.navbar-dark ul.nav li.dropdown ul.dropdown-menu > li > a:hover,nav.navbar ul.nav li.dropdown.on > a,nav.navbar-dark ul.nav li.dropdown.on > a { color: " +navMenuOptions.menu_item_color_hover+ " !important; }</style>"); // //$('head').append("<style>.dropdown-menu > .active > a { background-color: " +navMenuOptions.dropdown_background_color_active+ " !important; }</style>"); // Remove background for anchor $('head').append("<style>.dropdown-menu > .active > a { background-color: transparent !important; }</style>"); // hover menu-item|menu-sub-item $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator .dropdown-item:focus, nav.navbar.navigator .dropdown-item:hover, nav.navbar.navigator .nav-sub-item:focus, nav.navbar.navigator .nav-sub-item:hover { background: " +navMenuOptions.dropdown_background_color_hover+ " !important; } }</style>"); // $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu > li a:hover { color: " +navMenuOptions.menu_item_color_hover+ " !important; background: " +navMenuOptions.dropdown_background_color_hover+ " !important; } }</style>"); // 1st dropdown, limit height // TODO: overflow needs to be managed correctly (not static) //$('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu { max-height: " +navMenuOptions.dropdown_menu_height_max+ "em; overflow: hidden } }</style>"); // Limit dropdown item width $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator ul.nav.navbar-right .dropdown-menu .dropdown-menu { left: -" +navMenuOptions.dropdown_item_width+ "em; } }</style>"); // Limit last (2nd) dropdown in height (nav.navbar.navigator li.dropdown ul.dropdown-menu ul.dropdown-menu) $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu ul.dropdown-menu { top: -" +navMenuOptions.dropdown_border_top+ "px !important; max-height: " +navMenuOptions.dropdown_menu_height_max+ "em !important; } }</style>"); // Set dropdown item colors $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator ul.nav > li > a { color: " +navMenuOptions.menu_item_color+ " !important; } }</style>"); $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator ul.nav > li > a:hover { color: " +navMenuOptions.menu_item_color_hover+ " !important; } }</style>"); // Dropdown menu styles //$('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu { animation-duration: " +navMenuOptions.dropdown_animate_duration+ "s !important; color: " +navMenuOptions.dropdown_border_color+ "; width: " +navMenuOptions.dropdown_item_width+ "px; border-top: solid " +navMenuOptions.dropdown_border_height+ "px; left: 1rem; top: calc( 90px + " +navMenuOptions.dropdown_border_height+ "px ); } }</style>"); //$('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu { animation-duration: " +navMenuOptions.dropdown_animate_duration+ "s !important; color: " +navMenuOptions.dropdown_border_color+ "; width: " +navMenuOptions.dropdown_item_width+ "em; border-top: solid " +navMenuOptions.dropdown_border_height+ "px; left: 1em; } }</style>"); // jadams, 2017-11-30: removed left padding from dropdown mwenu (for new j1nav style based on Navigator|Slate) $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu { animation-duration: " +navMenuOptions.dropdown_animate_duration+ "s !important; color: " +navMenuOptions.dropdown_border_color+ "; width: " +navMenuOptions.dropdown_item_width+ "em; border-top: solid " +navMenuOptions.dropdown_border_top+ "px; border-radius: " +navMenuOptions.dropdown_border_radius+ "px; left: 0; } }</style>"); {% if dropdown_style == 'raised' %} $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu { box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); } }</style>"); {% endif %} // jadams,2017-11-22: stop configure dropdown_font_size //$('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown li.dropdown.nav-item.nav-sub-item { color: " +navMenuOptions.dropdown_item_color+ "; font-size: " +navMenuOptions.dropdown_font_size+ "; font-weight: 400; } }</style>"); // $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu > li > a { color: " +navMenuOptions.dropdown_item_color+ "; font-size: " +navMenuOptions.dropdown_font_size+ "; font-weight: 400; display: inline-flex; align-items: center;} }</style>"); $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu > li > a { color: " +navMenuOptions.dropdown_item_color+ "; font-size: " +navMenuOptions.dropdown_font_size+ "; font-weight: 400; } }</style>"); $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator ul.dropdown-menu.megamenu-content .content ul.menu-col li a { color: " +navMenuOptions.dropdown_item_color+ "; font-size: " +navMenuOptions.megamenu_font_size+ "; font-weight: 400; } }</style>"); // dropdown-menu item padding // jadams, 2017-11-22: moved item padding to nav|dropdown-item based on font-site (rel|em) {% if dropdown_item_style == 'raised' %} //$('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu > li > a { padding: " +navMenuOptions.dropdown_padding_y+ "px " +navMenuOptions.dropdown_padding_x+ "px; box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); } }</style>"); {% else %} //$('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator li.dropdown ul.dropdown-menu > li > a { padding: " +navMenuOptions.dropdown_padding_y+ "px " +navMenuOptions.dropdown_padding_x+ "px; } }</style>"); // blödsinn $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ " ) { nav.navbar.navigator .dropdown .nav-item { padding-top: " +navMenuOptions.dropdown_item_padding+ "px; padding-bottom: " +navMenuOptions.dropdown_item_padding+ "px; } }</style>"); {% endif %} {% comment %} navQuicklinks styles -------------------------------------------------------------------------- {% endcomment %} {% comment %} navTopSearch Styles -------------------------------------------------------------------------- {% endcomment %} $('head').append("<style>.top-search { background-color: " +navTopsearchOptions.background_color+ "; }</style>"); $('head').append("<style>.top-search .input-group-addon { color: " +navTopsearchOptions.input_color+ "; }</style>"); $('head').append("<style>.top-search .input.form-control { color: " +navTopsearchOptions.input_color+ "; }</style>"); {% comment %} navSidebar styles -------------------------------------------------------------------------- {% endcomment %} $('head').append("<style>.side { background-color: " +navSidebarOptions.background_color+ "; }</style>"); return true; }, // END setCss // ------------------------------------------------------------------------- // returns the current (processing) state of the module // ------------------------------------------------------------------------- state: function () { return state; }, // END state // ------------------------------------------------------------------------- // delay all dropdown menu to open for "delay" time // http://jsfiddle.net/AndreasPizsa/NzvKC/ // ------------------------------------------------------------------------- delayMenushow: function () { var theTimer = 0; var theElement = null; var logger = log4javascript.getLogger("j1.Navigator"); logText = "entered delayMenushow" logger.info(logText); $('#navigator_nav_menu') .find('li.dropdown.nav-item') .on('mouseenter', function (inEvent) { theElement = $(this); if (theElement) theElement.removeClass('open'); //if (theElement) theElement.css("display", "none"); //window.clearTimeout(theTimer); //theTimer = window.setTimeout(function () { setTimeout(function () { theElement.addClass('open'); //theElement.css("display", "block"); //window.clearTimeout(theTimer); }, {{menuOpenDelay}}); }) .on('mousemove', function (inEvent) { if (theElement.hasClass('open')) return true; //window.clearTimeout(theTimer); //theTimer = window.setTimeout(function () { setTimeout(function () { theElement.addClass('open'); //window.clearTimeout(theTimer); }, {{menuOpenDelay}}); }) .on('mouseleave', function (inEvent) { //window.clearTimeout(theTimer); theElement = $(this); //theTimer = window.setTimeout(function () { setTimeout(function () { theElement.removeClass('open'); //window.clearTimeout(theTimer); }, {{menuOpenDelay}}); }); return true; } // END delayMenushow }; // END return
})(j1, window);
{% endcapture %}
{{ cache | strip_empty_lines }} {% assign cache = nil %}