From 4939cc1b2539ee7135ba3e9ac06c3878941baad9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hrvoje=20Kne=C5=BEevi=C4=87?= Date: Fri, 16 Oct 2020 13:27:48 +0200 Subject: [PATCH 1/8] NGSTACK-448 define current_location_path in pagelayout_variables --- .../views/themes/app/pagelayout_variables.html.twig | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/AppBundle/Resources/views/themes/app/pagelayout_variables.html.twig b/src/AppBundle/Resources/views/themes/app/pagelayout_variables.html.twig index 19adc46b7..5c7021a49 100644 --- a/src/AppBundle/Resources/views/themes/app/pagelayout_variables.html.twig +++ b/src/AppBundle/Resources/views/themes/app/pagelayout_variables.html.twig @@ -24,6 +24,14 @@ {% endif %} {% endif %} +{# CURRENT LOCATION PATH ID ARRAY #} +{% set current_location_path = [] %} +{% if app.request.attributes.get('_route') == 'ez_urlalias' and app.request.attributes.has('view') %} + {% if location is defined and location|default(null) is not empty %} + {% set current_location_path = location.path|slice(1) %} + {% endif %} +{% endif %} + {# AVAILABLE TRANSLATIONS #} {% if available_translations is not defined %} From ee6c8c214e211e51b0b77806e04e44cc0cdb04c8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hrvoje=20Kne=C5=BEevi=C4=87?= Date: Fri, 16 Oct 2020 13:28:49 +0200 Subject: [PATCH 2/8] NGSTACK-448 create JSON array from current_location_path and place it into data-path variable on top page div --- src/AppBundle/Resources/views/themes/app/pagelayout.html.twig | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/AppBundle/Resources/views/themes/app/pagelayout.html.twig b/src/AppBundle/Resources/views/themes/app/pagelayout.html.twig index 1f9352535..03cda7f0d 100644 --- a/src/AppBundle/Resources/views/themes/app/pagelayout.html.twig +++ b/src/AppBundle/Resources/views/themes/app/pagelayout.html.twig @@ -32,7 +32,7 @@ {% include '@NetgenSite/parts/facebook_api.html.twig' %} -
+
{% block layout %} {% block header %} {% include '@ezdesign/page_header.html.twig' %} From 92cf7c11ea4a884c1780efa348e664c057d1c49a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hrvoje=20Kne=C5=BEevi=C4=87?= Date: Fri, 16 Oct 2020 13:29:25 +0200 Subject: [PATCH 3/8] NGSTACK-448 fix typo --- src/AppBundle/Resources/es6/ngsite.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/AppBundle/Resources/es6/ngsite.js b/src/AppBundle/Resources/es6/ngsite.js index 1d230fd48..6c3f0e93a 100644 --- a/src/AppBundle/Resources/es6/ngsite.js +++ b/src/AppBundle/Resources/es6/ngsite.js @@ -174,7 +174,7 @@ $(document).ready(() => { } }); - /* toggle mobile sumbmenu */ + /* toggle mobile submenu */ const mainNav = $('.main-navigation').find('ul.navbar-nav'); const submenuTrigContent = $(''); mainNav.find('.menu_level_1').before(submenuTrigContent).parent('li').attr('data-submenu', 'true'); From 68daf7f0df7976f86702be5857d90be4b55d0d09 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hrvoje=20Kne=C5=BEevi=C4=87?= Date: Fri, 16 Oct 2020 13:31:20 +0200 Subject: [PATCH 4/8] NGSTACK-448 override block 'item' from the default knp_menu.html.twig, add data-location-id parameter on the menu items --- .../Resources/views/themes/app/menu.html.twig | 48 +++++++++++++++++++ 1 file changed, 48 insertions(+) diff --git a/src/AppBundle/Resources/views/themes/app/menu.html.twig b/src/AppBundle/Resources/views/themes/app/menu.html.twig index 1e683f2de..fe91936bc 100644 --- a/src/AppBundle/Resources/views/themes/app/menu.html.twig +++ b/src/AppBundle/Resources/views/themes/app/menu.html.twig @@ -1,3 +1,51 @@ {% extends '@KnpMenu/menu.html.twig' %} {# To override this template, copy and paste relevant blocks from '@KnpMenu/menu.html.twig' and 'knp_menu.html.twig' #} + +{% block item %} + {% if item.displayed %} + {# building the class of the item #} + {%- set classes = item.attribute('class') is not empty ? [item.attribute('class')] : [] %} + {%- if matcher.isAncestor(item, options.matchingDepth) %} + {%- set classes = classes|merge([options.ancestorClass]) %} + {%- endif %} + {%- if item.actsLikeFirst %} + {%- set classes = classes|merge([options.firstClass]) %} + {%- endif %} + {%- if item.actsLikeLast %} + {%- set classes = classes|merge([options.lastClass]) %} + {%- endif %} + + {# Mark item as "leaf" (no children) or as "branch" (has children that are displayed) #} + {%- if item.hasChildren and options.depth is not same as(0) %} + {%- if options.branch_class is not empty and item.displayChildren %} + {%- set classes = classes|merge([options.branch_class]) %} + {%- endif %} + {%- elseif options.leaf_class is not empty %} + {%- set classes = classes|merge([options.leaf_class]) %} + {%- endif %} + + {%- set attributes = item.attributes %} + {%- if classes is not empty %} + {%- set attributes = attributes|merge({'class': classes|join(' ')}) %} + {%- endif %} + + {%- if item.extras.ezlocation is defined and item.extras.ezlocation is not empty %} + {%- set attributes = attributes|merge({'data-location-id': item.extras.ezlocation.id}) %} + {%- endif %} + {# displaying the item #} + {% import _self as knp_menu %} + + {%- if item.uri is not empty and (not matcher.isCurrent(item) or options.currentAsLink) %} + {{ block('linkElement') }} + {%- else %} + {{ block('spanElement') }} + {%- endif %} + {# render the list of children#} + {%- set childrenClasses = item.childrenAttribute('class') is not empty ? [item.childrenAttribute('class')] : [] %} + {%- set childrenClasses = childrenClasses|merge(['menu_level_' ~ item.level]) %} + {%- set listAttributes = item.childrenAttributes|merge({'class': childrenClasses|join(' ') }) %} + {{ block('list') }} + + {% endif %} +{% endblock %} From 29ef8d0d038a7fb30b13abb1f5a21c5bb8321caf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hrvoje=20Kne=C5=BEevi=C4=87?= Date: Fri, 16 Oct 2020 13:39:25 +0200 Subject: [PATCH 5/8] NGSTACK-448 remove activeItemId from controller parameters; when rendering menus, we will not vary the ESI fragment by active item ID anymore --- src/AppBundle/Resources/views/themes/app/page_footer.html.twig | 3 +-- .../Resources/views/themes/app/page_topmenu.html.twig | 3 +-- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/src/AppBundle/Resources/views/themes/app/page_footer.html.twig b/src/AppBundle/Resources/views/themes/app/page_footer.html.twig index b835cc706..d85960f33 100644 --- a/src/AppBundle/Resources/views/themes/app/page_footer.html.twig +++ b/src/AppBundle/Resources/views/themes/app/page_footer.html.twig @@ -9,8 +9,7 @@ {{ render_esi( controller( 'ngsite.controller.menu:renderMenu', { - menuName: 'ngsite_additional_menu', - activeItemId: main_category_location_id ?? 0 + menuName: 'ngsite_additional_menu' } ) ) }} diff --git a/src/AppBundle/Resources/views/themes/app/page_topmenu.html.twig b/src/AppBundle/Resources/views/themes/app/page_topmenu.html.twig index be02b68a7..24baa6304 100644 --- a/src/AppBundle/Resources/views/themes/app/page_topmenu.html.twig +++ b/src/AppBundle/Resources/views/themes/app/page_topmenu.html.twig @@ -3,8 +3,7 @@ {{ render_esi( controller( 'ngsite.controller.menu:renderMenu', { - menuName: 'ngsite_main_menu', - activeItemId: main_category_location_id ?? 0 + menuName: 'ngsite_main_menu' } ) ) }} From 8c5062498888807d03f9b5102917231da20d54a0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hrvoje=20Kne=C5=BEevi=C4=87?= Date: Fri, 16 Oct 2020 13:40:07 +0200 Subject: [PATCH 6/8] NGSTACK-448 set active classes on all matching menu items in all site navigations --- src/AppBundle/Resources/es6/ngsite.js | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/src/AppBundle/Resources/es6/ngsite.js b/src/AppBundle/Resources/es6/ngsite.js index 6c3f0e93a..3b8e2951c 100644 --- a/src/AppBundle/Resources/es6/ngsite.js +++ b/src/AppBundle/Resources/es6/ngsite.js @@ -185,6 +185,23 @@ $(document).ready(() => { /* /header actions */ + /* set active state on location menu items */ + if (page.dataset.path) { + const activeItemsList = JSON.parse(page.dataset.path); + const navigationList = document.querySelectorAll('ul.nav.navbar-nav'); + + navigationList.forEach((navigation) => { + activeItemsList.forEach((activeItemId) => { + const item = navigation.querySelector(`[data-location-id="${activeItemId}"]`); + if (item) { + item.classList.add('active', 'submenu-active'); + } + }); + }); + } + /* /set active state on location menu items */ + + /* lazy image loading */ const lazyImageLoad = (image) => { if (image.hasAttribute('data-src')) image.setAttribute('src', image.getAttribute('data-src')); From 18e4fdc1f4fe744dc81fe67f27c729b8c442a70e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hrvoje=20Kne=C5=BEevi=C4=87?= Date: Mon, 9 Nov 2020 13:49:22 +0100 Subject: [PATCH 7/8] NGSTACK-448 remove code and additional checks from pagelayout_variables; just check location not empty in pagelayout; remove raw --- .../Resources/views/themes/app/pagelayout.html.twig | 2 +- .../views/themes/app/pagelayout_variables.html.twig | 8 -------- 2 files changed, 1 insertion(+), 9 deletions(-) diff --git a/src/AppBundle/Resources/views/themes/app/pagelayout.html.twig b/src/AppBundle/Resources/views/themes/app/pagelayout.html.twig index 03cda7f0d..8e805bf6d 100644 --- a/src/AppBundle/Resources/views/themes/app/pagelayout.html.twig +++ b/src/AppBundle/Resources/views/themes/app/pagelayout.html.twig @@ -32,7 +32,7 @@ {% include '@NetgenSite/parts/facebook_api.html.twig' %} -
+
{% block layout %} {% block header %} {% include '@ezdesign/page_header.html.twig' %} diff --git a/src/AppBundle/Resources/views/themes/app/pagelayout_variables.html.twig b/src/AppBundle/Resources/views/themes/app/pagelayout_variables.html.twig index 5c7021a49..19adc46b7 100644 --- a/src/AppBundle/Resources/views/themes/app/pagelayout_variables.html.twig +++ b/src/AppBundle/Resources/views/themes/app/pagelayout_variables.html.twig @@ -24,14 +24,6 @@ {% endif %} {% endif %} -{# CURRENT LOCATION PATH ID ARRAY #} -{% set current_location_path = [] %} -{% if app.request.attributes.get('_route') == 'ez_urlalias' and app.request.attributes.has('view') %} - {% if location is defined and location|default(null) is not empty %} - {% set current_location_path = location.path|slice(1) %} - {% endif %} -{% endif %} - {# AVAILABLE TRANSLATIONS #} {% if available_translations is not defined %} From 3de84114fcaa163cc488cdf0c22475050daac4c2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hrvoje=20Kne=C5=BEevi=C4=87?= Date: Mon, 9 Nov 2020 13:50:25 +0100 Subject: [PATCH 8/8] NGSTACK-448 include comments and commented-out code from original block, to make clear what changes were applied compared to the original --- src/AppBundle/Resources/views/themes/app/menu.html.twig | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/AppBundle/Resources/views/themes/app/menu.html.twig b/src/AppBundle/Resources/views/themes/app/menu.html.twig index fe91936bc..d1589ff23 100644 --- a/src/AppBundle/Resources/views/themes/app/menu.html.twig +++ b/src/AppBundle/Resources/views/themes/app/menu.html.twig @@ -6,6 +6,11 @@ {% if item.displayed %} {# building the class of the item #} {%- set classes = item.attribute('class') is not empty ? [item.attribute('class')] : [] %} + {# NGSTACK-448 comment out default matcher so it doesn't add current/active class on any items #} + {#{%- if matcher.isCurrent(item) %}#} + {#{%- set classes = classes|merge([options.currentClass]) %}#} + {#{%- elseif matcher.isAncestor(item, options.matchingDepth) %}#} + {# END NGSTACK-448 #} {%- if matcher.isAncestor(item, options.matchingDepth) %} {%- set classes = classes|merge([options.ancestorClass]) %} {%- endif %} @@ -29,10 +34,11 @@ {%- if classes is not empty %} {%- set attributes = attributes|merge({'class': classes|join(' ')}) %} {%- endif %} - + {# NGSTACK-448 add data-location-id parameter to all menu items with eZ location #} {%- if item.extras.ezlocation is defined and item.extras.ezlocation is not empty %} {%- set attributes = attributes|merge({'data-location-id': item.extras.ezlocation.id}) %} {%- endif %} + {# END NGSTACK-448 #} {# displaying the item #} {% import _self as knp_menu %}