diff --git a/extensions/odoo_theme/static/js/menu.js b/extensions/odoo_theme/static/js/menu.js
index ca6253a15..0a0a5cf11 100644
--- a/extensions/odoo_theme/static/js/menu.js
+++ b/extensions/odoo_theme/static/js/menu.js
@@ -6,10 +6,32 @@
// Allow to automatically collapse and expand TOC entries
_prepareAccordion(this.navigationMenu);
+ // Allow to respectively highlight and expand the TOC entries and their related TOC
+ // entry list whose page is displayed.
+ _flagActiveTocEntriesAndLists();
+
// Add a class with the name of the file to each corresponding menu item
_flagMenuItemsWithFileName();
});
+ /**
+ * Add the relevant classes on the TOC entries (and lists) whose page is displayed.
+ *
+ * TOC entries whose page is displayed (
elements) receive the `o_active_toc_entry` class
+ * and their related TOC entry list ( elements) receive the `show` (Bootstrap) class.
+ */
+ const _flagActiveTocEntriesAndLists = () => {
+ this.navigationMenu.querySelectorAll('.current').forEach(element => {
+ if (element.tagName === 'LI') {
+ // Highlight all - in the active hierarchy
+ element.classList.add('o_active_toc_entry');
+ } else if (element.tagName === 'UL') {
+ // Expand all related
+ element.classList.add('show');
+ }
+ })
+ };
+
/**
* Add the name of the file as class of the corresponding menu item.
*/
diff --git a/extensions/odoo_theme/static/js/page_toc.js b/extensions/odoo_theme/static/js/page_toc.js
index 49e2e8d81..2d30ecf61 100644
--- a/extensions/odoo_theme/static/js/page_toc.js
+++ b/extensions/odoo_theme/static/js/page_toc.js
@@ -12,23 +12,28 @@
return;
}
- // Allow to hide the TOC entry referring the title ( heading)
- _flagFirstHeadingRef();
-
// Allow to automatically collapse and expand TOC entries
_prepareAccordion(this.pageToc);
// Allow to respectively highlight and expand the TOC entries and their related TOC
// entry list whose section is focused.
_flagActiveTocEntriesAndLists();
+
+ // Allow to hide the TOC entry referring the title ( heading)
+ _flagFirstHeadingRef();
}
});
+ /**
+ * Entirely hide the local tree of contents.
+ */
+ const _hidePageToc = () => this.pageToc.style.visibility = 'hidden';
+
/**
* Add the relevant classes on the TOC entries (and lists) whose section is focused.
*
- * TOC entries whose section is focused (
- elements) receive the `active` class and their
- * related TOC entry list (
elements) receive the `show` class.
+ * TOC entries whose section is focused (- elements) receive the `o_active_toc_entry` class
+ * and their related TOC entry list (
elements) receive the `show` (Bootstrap) class.
*/
const _flagActiveTocEntriesAndLists = () => {
@@ -78,10 +83,13 @@
let tocEntry = headingRef.parentElement;
while (tocEntry !== this.pageToc) {
if (tocEntry.tagName === 'LI') {
- tocEntry.classList.add('active'); // Highlight all - in the active hierarchy
+ // Highlight all
- in the active hierarchy
+ tocEntry.classList.add('o_active_toc_entry');
+
+ // Expand all related
const relatedTocEntryList = tocEntry.querySelector('ul');
if (relatedTocEntryList) {
- relatedTocEntryList.classList.add('show'); // Expand all related
+ relatedTocEntryList.classList.add('show');
}
}
tocEntry = tocEntry.parentElement;
@@ -110,9 +118,4 @@
*/
const _flagFirstHeadingRef = () => this.headingRefs[0].classList.add('o_page_toc_title');
- /**
- * Entirely hide the local tree of contents.
- */
- const _hidePageToc = () => this.pageToc.style.visibility = 'hidden';
-
})();
diff --git a/extensions/odoo_theme/static/js/utils.js b/extensions/odoo_theme/static/js/utils.js
index 9c1d50bd2..4892eb761 100644
--- a/extensions/odoo_theme/static/js/utils.js
+++ b/extensions/odoo_theme/static/js/utils.js
@@ -1,3 +1,4 @@
+let tocEntryListId = 0; // Used to generate IDs of toc entry lists for both the menu and page TOC
/**
* Update the provided TOC to allow collapsing its entries with Bootstrap's accordion.
*
@@ -31,13 +32,10 @@ const _prepareAccordion = (tocElement) => {
// Start at the second TOC entry list (