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 %}