Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NEW dropdown top megamenu #13609

Open
wants to merge 11 commits into
base: develop
Choose a base branch
from
Open

NEW dropdown top megamenu #13609

wants to merge 11 commits into from

Conversation

dreggy
Copy link

@dreggy dreggy commented Apr 14, 2020

New dropdown top megamenu

From a previous pull request #11792

The megamenu actually work on css :hover, without javascript.
The background color of the menu is a darker color of the menu color, if you change the menu color also the background of the megamenu will change.
There is a small css animation on the menu popup, can be removed or tuned.
The menu will not render well on smaller screens (mobile), I plan to make a mobile menu after finishing the desktop version.

@atm-john
Copy link
Member

@dreggy take a look at https://github.com/atm-john/dolibarr/tree/dreggy_drop_down_menu
I moved drop down css to an other inc file, I removed transition effect because of a kind of "blink effect"
I will use this branch to send you exemples or ideas.

@dreggy
Copy link
Author

dreggy commented Apr 18, 2020

I copied your edits. By the way I think that a little delay on the menu popup will avoid erraneous opening of the menu while moving the mouse, for example while you transition the mouse to url bar or bookmarks.

Copy link
Member

@atm-john atm-john left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To prevent certain adventures we usually hide new things that have a strong impact on the core. For that, a good practice consists in using the parameter MAIN_FEATURES_LEVEL or an arbitrary hidden configuration.

@@ -530,6 +530,8 @@ function print_eldy_menu($db, $atarget, $type_user, &$tabMenu, &$menu, $noout =
foreach ($menu->liste as $menuval) {
print_start_menu_entry($menuval['idsel'], $menuval['classname'], $menuval['enabled']);
print_text_menu_entry($menuval['titre'], $menuval['enabled'], (($menuval['url'] != '#' && !preg_match('/^(http:\/\/|https:\/\/)/i', $menuval['url'])) ? DOL_URL_ROOT:'').$menuval['url'], $menuval['id'], $menuval['idsel'], $menuval['classname'], ($menuval['target'] ? $menuval['target'] : $atarget));
if (!$conf->dol_no_mouse_hover)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

need this :

if (!$conf->dol_no_mouse_hover && ($conf->global->TOP_MENU_USE_DROP_DOWN_MENU || $conf->global->MAIN_FEATURES_LEVEL >= 2))

@@ -593,10 +674,10 @@ function print_text_menu_entry($text, $showmode, $url, $id, $idsel, $classname,
global $langs;

if ($showmode == 1) {
print '<a class="tmenuimage" tabindex="-1" href="'.$url.'"'.($atarget ? ' target="'.$atarget.'"' : '').' title="'.dol_escape_htmltag($text).'">';
print '<a class="tmenuimage" tabindex="-1" href="'.$url.'"'.($atarget ? ' target="'.$atarget.'"' : '').' title="'./*dol_escape_htmltag($text).*/'">';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

replace default behavior only if megamenu is displayed

print '<div class="'.$id.' '.$idsel.' topmenuimage"><span class="'.$id.' tmenuimage" id="mainmenuspan_'.$idsel.'"></span></div>';
print '</a>';
print '<a '.$classname.' id="mainmenua_'.$idsel.'" href="'.$url.'"'.($atarget ? ' target="'.$atarget.'"' : '').' title="'.dol_escape_htmltag($text).'">';
print '<a '.$classname.' id="mainmenua_'.$idsel.'" href="'.$url.'"'.($atarget ? ' target="'.$atarget.'"' : '').' title="'./*dol_escape_htmltag($text).*/'">';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idem replace default behavior only if megamenu is displayed

@atm-john
Copy link
Member

On the last PR you asked me about "quick access" this a dirty quick exemple :
for me it's a hook call with current parent param that display free html to allow us to add quick view, access or alerts ....

exemple of free zone

@dreggy
Copy link
Author

dreggy commented Apr 20, 2020

Ok, I get it, thanks.
About replacing the default behavior, I can clone the function "print_text_menu_entry" to "print_text_megamenu_entry", so I can use it if the magamenu is enabled.
Regarding your example, i think the best way is to create a function "print_html_megamenu_entry" that will output more complex html entities. The hook have to modify the menu items (returned by "print_left_eldy_menu" function) and I think i can add a property "is_html" to the items, so i can call the proper function ( print_text_megamenu_entry or print_html_megamenu_entry ) to print the elements.

@atm-john
Copy link
Member

for the version 12 of Dolibarr, I wanted to dev a theme class with a theme class controller to allow theme to specify its own configurations compatibility ( and a lot of other cool stuff) but I couldn't this time... I will do it for the v13 of dolibarr

@dreggy
Copy link
Author

dreggy commented Apr 27, 2020

Ok I will wait for that.

@atm-john atm-john mentioned this pull request May 5, 2020
@BB2A-Anthony
Copy link
Contributor

it is still up to date

@eldy eldy added the PR postponed PR is postponed (will be processed later). Ie: feature pushed during a beta or need transition steps label Apr 10, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
PR postponed PR is postponed (will be processed later). Ie: feature pushed during a beta or need transition steps
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants