---
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:
 #  https://jekyll.one
 #
 #  Copyright (C) 2019 Juergen Adams
 #
 #  J1 Template is licensed under the MIT License.
 #  For details, see https://jekyll.one
 #
 # -----------------------------------------------------------------------------
 # Test data:
 #  {{ liquid_var | debug }}
 #
 # -----------------------------------------------------------------------------
{% 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_provider     = site.j1_auth.providers %}
{% 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:
 #  https://jekyll.one
 #
 #  Copyright (C) 2019 Juergen Adams
 #
 #  J1 Template is licensed under the MIT License.
 #  For details, see https://jekyll.one
 #
 # -----------------------------------------------------------------------------
 #  Adapter generated: {{site.time}}
 # -----------------------------------------------------------------------------
*/
'use strict';

j1.Navigator = (function (j1, window) {

  var environment                 = '{{environment}}'; // Set environment
  var state                       = 'unknown';
  // J1 data file objects
  var nav_menu_id                 = "navigator_nav_menu"
  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 authclient_modals_data_path = "/assets/data/authclient/index.html"
  var web_session_data            = j1.getWebSessionCookie();
  var j1_colors                   = {};
  var j1_font_sizes               = {};
  var logger;
  var logText;

  return {

    // -------------------------------------------------------------------------
    // Initialize Navigator
    // -------------------------------------------------------------------------
    init: function ( options ) {

      // 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  = {};
      var navAuthClientProvider = {};

      {% comment %} Set global variables
      -------------------------------------------------------------------------- {% endcomment %}
      logger = log4javascript.getLogger("j1.Navigator"); // 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: '=>', ':' }});
      navAuthClientProvider = $.extend({}, {{auth_config_provider | replace: '=>', ':' }});

      // 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() ).done (
        function( load_color_data_response, load_font_sizes_response ) {
          // Run initializer functions
          j1.Navigator.loadMenuBar( navMenuOptions );
          j1.Navigator.loadAuthClientModals( navAuthClientOptions, navAuthClientProvider );
          j1.Navigator.setCss( navBarOptions, navMenuOptions, navQuicklinksOptions, navTopsearchOptions, navSidebarOptions );
          // Set|Log status
          state = 'initialized';
          logger.info('state: ' + state);
          logger.info("J1 Navigator initialized successfully");
      });

      /*
      // jadams, 2017-10-18: Unclear if workaround is needed.
      // For oversized menu bar, overflow set to hidden is set
      // as a dynamic style - see setCss below
      //
      // jadams: WORKAROUND - Change width of the NavBar (to window size) if needed
      */
      /*
      $(window).on("resize", function(){
        var navID       = "#navigator_nav";
        var getWindow   = $(window).width();
        var getNavWidth = $( navID ).width();
        var diff        = getNavWidth - getWindow;

        if ( diff ) {
          // change width of the NavBar ( to window width)
          $( navID ).width(getWindow);
          var logText = "NavBar ID #j1_main_nav resized to: " +getNavWidth+ " (" +getWindow+ ")";
          //logger.debug(logText);
          logger.info(logText);
        }
      });
      */

      // Reset on resize
      $(window).on("resize", function(){

          j1nav.manageDropdownMenu();

          $(".top-search").slideUp();
          setTimeout(function(){
            j1nav.navbarSticky();
          }, 500);

          // Toggle Bars
          //$(".navbar-toggle").each(function(){
          $('button.navigator.navbar-toggler').each(function(){
            //$('button.navigator.navbar-toggler.animated').removeClass('rotateIn');
            //$('button.navigator.navbar-toggler.animated').addClass('fadeIn')
            $(".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");
      });
    }, // end init

    // -------------------------------------------------------------------------
    // load the Menu bar
    // -------------------------------------------------------------------------
    loadMenuBar: function ( navMenuOptions ) {
      //logger = log4javascript.getLogger("j1.Navigator.loadMenuBar");

      // 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);

            // 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);
            //j1.Navigator.delayMenushow();
          }
          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 + " > *";

        // Set the return URL (user by news pager) for the News Banner
        selector.load( menu_data_path, cb_load_closure( id, navMenuOptions ) );
      }

    }, // end loadMenuBar

    // -------------------------------------------------------------------------
    // load the Modals used by J1AuthClient
    // -------------------------------------------------------------------------
    loadAuthClientModals: function ( authClientOptions, authClientProvider ) {
      //logger = log4javascript.getLogger("j1.Navigator.loadAuthClientModals");

      // 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, authClientOptions) {
        return function ( responseTxt, statusTxt, xhr ) {
          if ( statusTxt == "success" ) {
            //j1nav.initialize( authClientOptions );
            var logText = "Modals on ID " +id+ " loaded successfully"

            j1.Navigator.initAuthClient( authClientProvider );

            logger.info(logText);
            // Set|Log status
            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 + " > *";

        // Set the return URL (user by news pager) for the News Banner
        selector.load( modals_data_path, cb_load_closure( id, authClientOptions ) );
      }

    }, // end loadAuthClientModals

    // -------------------------------------------------------------------------
    // Initialize JS portion for the dialogs (modals) used by J1AuthClient
    // -------------------------------------------------------------------------
    initAuthClient: function( authClientOptions ) {

      var logger;
      var logText;
      var route;
      var provider          = 'unknown';
      var allowed_users     = 'unknown';
      var web_session_data  = j1.getWebSessionCookie();

      var signIn = {
        provider:         authClientOptions["activated"][0],
        user:             authClientOptions[authClientOptions["activated"][0]]["users"],
        do:               false
      }

      var signOut = {
        provider:         authClientOptions["activated"][0],
        providerSignOut:  false,
        do:               false
      }

      // Set|Log status
      logger = log4javascript.getLogger('j1.AuthClient');
      state = 'initialize';
      logger.info('state: ' + state);

      $('ul.nav-pills > li').click(function (e) {
          e.preventDefault();
          signIn.provider       = $(this).text().trim();
          signIn.provider       = signIn.provider.toLowerCase();
          signIn.allowed_users  = signIn.user[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 );
        }
      });

      $("#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 modalOmniSignIn

      $("#modalOmniSignOut").on('show.bs.modal', function() {
          var modal = $(this);
          logger.info('Place current user data');
          var j1_user_state = j1.getUserStateCookie();
          modal.find('.user-info').text('You are signed in to provider: ' + j1_user_state.provider);
      }); // end SHOW modalOmniSignOut

      $("#modalOmniSignOut").on('hidden.bs.modal', function() {
        if (signOut.do == true) {
          logger.info('Load active provider from cookie: UserState');
          var j1_user_state = j1.getUserStateCookie();
          provider = j1_user_state.provider;
          // provider_url = providerUrls[provider];
          logText = 'Provider detected: ' + provider;
          logger.info(logText);
          logText = 'SignIn for ' +provider+ ' accepted';
          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;
          logText = 'Call middleware for route ' +route+ ' for signout';
          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 modalSignOut

      if ( web_session_data != null ) {
        // Toggle/Set SignIn/SignOut icon|link in QuickLinks
        // See: https://stackoverflow.com/questions/13524107/how-to-set-data-attributes-in-html-elements
        if ( web_session_data.authenticated == 'true') {
          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" );
          // Show User Info with SideBar
          $("#user-info").css({ display: "block" });
        } 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" );
          // Hide User Info from SideBar
          $("#user-info").css({ display: "none" });
        }
        var session_json_data = JSON.stringify( web_session_data );
        // jadams: confusion about last_page vs. requested_page
        web_session_data.requested_page = window.location.pathname;
        j1.setWebSessionCookie( web_session_data );
        web_session_data = j1.getWebSessionCookie();
        session_json_data = JSON.stringify( web_session_data );
        logger.info( 'Session data: ' + session_json_data );
        logger.info( 'Last page:    ' + web_session_data.last_page );
      } else {
        // Hide SignIn button from QuickLinks
        $("#quickLinksSignInOutButton").css({ display: "none" });
        // Hide SignIn menu from MenuBar
        $("#menuBarSignInOut").css({ display: "none" });
        // Hide User Info from SideBar
        $("#user-info").css({ display: "none" });
      }
      // Replace MACROs THEME Info
      var j1_user_state = j1.getUserStateCookie();
      var themeName     = j1_user_state.theme_name;
      $("#macro-theme-name").each(function() {
        var $this = $(this);
        var $html  = $this.html();
        $this.html($html.replace('??theme-name', themeName));
        // console.log(html)
      });
      // Replace MACROs USER Info
      j1.getUserState( '', function (state) {
        /*
          See: https://stackoverflow.com/questions/5376431/wildcards-in-jquery-selectors
          See: https://stackoverflow.com/questions/16400072/jquery-each-only-affects-last-element
          See: https://dzone.com/articles/why-does-javascript-loop-only-use-last-value
        */
        if ( state.status == 'signed in') {
          $("[id^=macro-]").each(function() {
            $("#macro-provider-name").each(function() {
              var $this = $(this);
              var $html = $this.html();
              $this.html($html.replace('??provider-name', state.provider));
              $this.attr("href", state.provider_site_url);
            });
            $("#macro-user-name").each(function() {
              var $this = $(this);
              var $html = $this.html();
              $this.html($html.replace('??user-name', state.user_name));
            });
            $("#macro-user-state").each(function() {
              var $this = $(this);
              var $html = $this.html();
              $this.html($html.replace('??user-state', state.status));
            });
            $("#macro-provider-permissions").each(function() {
              var $this = $(this);
              var $html = $this.html();
              $this.html($html.replace('??provider-permissions', state.provider_permissions));
            });
            $("#macro-provider-membership").each(function() {
              var $this = $(this);
              var $html = $this.html();
              $this.html($html.replace('??provider-membership', state.provider_membership));
              $this.attr("href", state.provider_member_url);
            });
          });
        }
      });
      state = 'initialized';
      logger.info('state: ' + state); // Set|Log status
    }, // end initAuthClient

    // -------------------------------------------------------------------------
    // Initialize JS portion for the dialogs (modals) used by J1AuthClient
    // -------------------------------------------------------------------------
    toggleAuthClient : function() {

      // code for toggle the AuthClient SignIn|SignOut

    }, // end toggleAuthClient

    // -------------------------------------------------------------------------
    // 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>");


    }, // end setCss

    // -------------------------------------------------------------------------
    //  returns the current (processing) state of the module
    // -------------------------------------------------------------------------
    state: function () {
      return 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;
          //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}});
        });
    } // end delayMenushow
  }; // end return

})(j1, window);

{% endcapture %}

{{ cache | strip_empty_lines }}
{% assign cache = nil %}