From 5e6541e08a879941e215e8070da1ea316bde3fda Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Maur=C3=ADcio=20Meneghini=20Fauth?= Date: Thu, 1 Dec 2022 23:17:33 -0300 Subject: [PATCH] Move menuResizer related functions to menu-resizer.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Maurício Meneghini Fauth --- js/src/main.js | 3 +- js/src/modules/ajax.js | 3 +- js/src/modules/functions.js | 21 ++---------- .../menu-resizer.js} | 34 +++++++++++++++++-- js/src/modules/navigation.js | 5 +-- libraries/classes/Header.php | 1 - test/classes/HeaderTest.php | 1 - webpack.config.cjs | 1 - 8 files changed, 41 insertions(+), 28 deletions(-) rename js/src/{menu_resizer.js => modules/menu-resizer.js} (90%) diff --git a/js/src/main.js b/js/src/main.js index 3b211d3ea8..87c939ca1e 100644 --- a/js/src/main.js +++ b/js/src/main.js @@ -7,6 +7,7 @@ import { PageSettings } from './modules/page_settings.js'; import { crossFramingProtection } from './modules/cross_framing_protection.js'; import { Indexes } from './modules/indexes.js'; import { Config } from './modules/config.js'; +import { initializeMenuResizer } from './modules/menu-resizer.js'; AJAX.registerOnload('main.js', () => AJAX.removeSubmitEvents()); $(AJAX.loadEventHandler()); @@ -33,7 +34,7 @@ AJAX.registerTeardown('main.js', Functions.off()); AJAX.registerOnload('main.js', Functions.on()); $(Functions.dismissNotifications()); -$(Functions.initializeMenuResizer()); +$(initializeMenuResizer()); $(Functions.floatingMenuBar()); $(Functions.breadcrumbScrollToTop()); diff --git a/js/src/modules/ajax.js b/js/src/modules/ajax.js index a4c4d2122d..fdd0805583 100644 --- a/js/src/modules/ajax.js +++ b/js/src/modules/ajax.js @@ -2,6 +2,7 @@ import $ from 'jquery'; import { Functions } from './functions.js'; import { Navigation } from './navigation.js'; import { CommonParams } from './common.js'; +import { initializeTopMenuResizer } from './menu-resizer.js'; /** * This object handles ajax requests for pages. It also @@ -221,7 +222,7 @@ const AJAX = { // Remove duplicate wrapper // TODO: don't send it in the response .children().first().remove(); - $('#topmenu').menuResizer(Functions.mainMenuResizerCallback); + initializeTopMenuResizer(); } }, /** diff --git a/js/src/modules/functions.js b/js/src/modules/functions.js index a9226b3cb3..7540502426 100644 --- a/js/src/modules/functions.js +++ b/js/src/modules/functions.js @@ -5,6 +5,7 @@ import { CommonActions, CommonParams } from './common.js'; import { mysqlDocKeyword, mysqlDocBuiltin } from './doc-links.js'; import { Indexes } from './indexes.js'; import { Config } from './config.js'; +import { resizeTopMenu } from './menu-resizer.js'; /* global ChartType, ColumnType, DataTable, JQPlotChartFactory */ // js/chart.js /* global DatabaseStructure */ // js/database/structure.js @@ -3300,24 +3301,6 @@ Functions.showHints = function ($div) { }); }; -Functions.mainMenuResizerCallback = function () { - // 5 px margin for jumping menu in Chrome - // eslint-disable-next-line compat/compat - return $(document.body).width() - 5; -}; - -/** - * @return {function} - */ -Functions.initializeMenuResizer = () => function () { - // Initialise the menu resize plugin - $('#topmenu').menuResizer(Functions.mainMenuResizerCallback); - // register resize event - $(window).on('resize', function () { - $('#topmenu').menuResizer('resize'); - }); -}; - /** * var toggleButton This is a function that creates a toggle * sliding button given a jQuery reference @@ -3840,7 +3823,7 @@ Functions.floatingMenuBar = () => function () { 'padding-top', $('#floating_menubar').outerHeight(true) ); - $('#topmenu').menuResizer('resize'); + resizeTopMenu(); }, 4); } }; diff --git a/js/src/menu_resizer.js b/js/src/modules/menu-resizer.js similarity index 90% rename from js/src/menu_resizer.js rename to js/src/modules/menu-resizer.js index 4c3497c678..802c899881 100644 --- a/js/src/menu_resizer.js +++ b/js/src/modules/menu-resizer.js @@ -1,5 +1,5 @@ import $ from 'jquery'; -import { Functions } from './modules/functions.js'; +import { Functions } from './functions.js'; /** * Handles the resizing of a menu according to the available screen width @@ -174,7 +174,7 @@ import { Functions } from './modules/functions.js'; /** * Extend jQuery * - * @param {string} method + * @param {string|Function} method * * @return {any} */ @@ -188,3 +188,33 @@ import { Functions } from './modules/functions.js'; } }; }($)); + +/** + * @return {void} + */ +function resizeTopMenu () { + $('#topmenu').menuResizer('resize'); +} + +/** + * @return {void} + */ +function initializeTopMenuResizer () { + $('#topmenu').menuResizer(() => $(document.body).width() - 5); +} + +/** + * @return {function} + */ +function initializeMenuResizer () { + return function () { + // Initialise the menu resize plugin + initializeTopMenuResizer(); + // register resize event + $(window).on('resize', function () { + resizeTopMenu(); + }); + }; +} + +export { initializeMenuResizer, initializeTopMenuResizer, resizeTopMenu }; diff --git a/js/src/modules/navigation.js b/js/src/modules/navigation.js index f79a4b4ce5..94568ef203 100644 --- a/js/src/modules/navigation.js +++ b/js/src/modules/navigation.js @@ -2,6 +2,7 @@ import $ from 'jquery'; import { Functions } from './functions.js'; import { CommonParams } from './common.js'; import { Config } from './config.js'; +import { resizeTopMenu } from './menu-resizer.js'; /** * function used in or for navigation panel @@ -1197,7 +1198,7 @@ Navigation.ResizeHandler = function () { this.mouseup = function (event) { $('body').css('cursor', ''); Functions.configSet('NavigationWidth', event.data.resize_handler.getPos(event)); - $('#topmenu').menuResizer('resize'); + resizeTopMenu(); $(document) .off('mousemove') .off('mouseup'); @@ -1284,7 +1285,7 @@ Navigation.ResizeHandler = function () { this.treeResize(); const callbackSuccessGetConfigValue = (data) => { this.setWidth(data); - $('#topmenu').menuResizer('resize'); + resizeTopMenu(); }; // Skip mobile if (isLoadedOnMobile === false) { diff --git a/libraries/classes/Header.php b/libraries/classes/Header.php index 0294f56cb1..7b5ef1dc16 100644 --- a/libraries/classes/Header.php +++ b/libraries/classes/Header.php @@ -140,7 +140,6 @@ class Header $this->scripts->addFile('vendor/jquery/jquery-ui-timepicker-addon.js'); $this->scripts->addFile('index.php', ['route' => '/messages', 'l' => $GLOBALS['lang']]); $this->scripts->addFile('shared.js'); - $this->scripts->addFile('menu_resizer.js'); $this->scripts->addFile('main.js'); $this->scripts->addCode($this->getJsParamsCode()); diff --git a/test/classes/HeaderTest.php b/test/classes/HeaderTest.php index cf34821de1..47b92b2e7e 100644 --- a/test/classes/HeaderTest.php +++ b/test/classes/HeaderTest.php @@ -262,7 +262,6 @@ class HeaderTest extends AbstractTestCase ['name' => 'vendor/jquery/jquery-ui-timepicker-addon.js', 'fire' => 0], ['name' => 'index.php', 'fire' => 0], ['name' => 'shared.js', 'fire' => 0], - ['name' => 'menu_resizer.js', 'fire' => 1], ['name' => 'main.js', 'fire' => 1], ]; $this->assertSame($expected, $scripts->getFiles()); diff --git a/webpack.config.cjs b/webpack.config.cjs index 321582dd8b..e6d591da33 100644 --- a/webpack.config.cjs +++ b/webpack.config.cjs @@ -43,7 +43,6 @@ module.exports = [ 'jquery.sortable-table': './js/src/jquery.sortable-table.js', 'main': './js/src/main.js', 'makegrid': './js/src/makegrid.js', - 'menu_resizer': './js/src/menu_resizer.js', 'multi_column_sort': './js/src/multi_column_sort.js', 'name-conflict-fixes': './js/src/name-conflict-fixes.js', 'normalization': './js/src/normalization.js',