Remove DHTML Menu code from Actual Links and Make Bullets The Clickable Element

From IRC:

[20:35]  <Morbus> bullets are /really/ hard to click on.
[20:35]  <Morbus> i'm not going to spend time clicking 3 pixels worth of space.
[20:35]  <Morbus> and neither is anyone else.
[20:35]  <craq> its 14px 
[20:35]  <craq> :P
[20:35]  <Morbus> regardless, it's not intuitive, imo.
[20:36]  <Morbus> it goes against, say, drupal fieldsets.
[20:36]  <craq> how is it not? it takes away the link from the actual link 
[20:36]  <Morbus> which can have both the bullet and the link clickable.
[20:36]  <craq> now the link can stay a link
[20:36]  <Morbus> yes - and i agree that that's a problem (it is with bot, actually)
[20:36]  <Morbus> but makign it different from fieldset, or unintuitive (people click links, not bullets) is not the solution.
[20:37]  <craq> its like os x finder.. you click the bullets to expand the folders ?
[20:37]  <Morbus> i don't care about os ox.
[20:37]  <Morbus> i care about mixing UI practices in a single application.
[20:38]  <Morbus> and i never use that view in the Finder, for what it's worse.
[20:38]  <Morbus> i always use the panel view.
[20:38]  <Morbus> Columns view.
[20:38]  <Morbus> *for what it's worth
[20:38]  <-- izaak has quit (Read error: 113 (No route to host))
[20:38]  --> davidstrauss (n=straussd@cpe-72-177-13-129.austin.res.rr.com) has joined #drupal
[20:38]  <craq> i c 

IMO it should be optional.

It can be configged.

+1

Hello,

This patch does not work for me.
Perhaps because I do not use CVS and patched i it manuallyll
It would be very nice if you might post the whole codeof the patched dhtmll.js and the menuu module

Thank you!

I know double click may conflict with another module, but how about using the simple click and the double :
simple click : open the link
double click : open the folder

another idea : enlarging the clickable zone of the bullet, say 3 or 4 px around it, giving this way a 10px zone. the cursor could change, and/or the bullet could become a different color, or turning 45° down, showing there is an special action there. The link itself would have different css rules when hovered (underline, color). This way, everybody is happy because it would be obvious that there are 2 different actions possible there...expanding or opening the link.

Hi Steve, just tried you patch on the "dhtml_menu-5.x-0.7" but it won't work. I checked the patch code but the code differences are too big for me to handle (yet). Could you please release a patch that will work on the "dhtml_menu-5.x-0.7" code?

Thanks in advance
Jan

I agree with merlinofchaos, it should be optional. Even though I think it is more logical to expand using a bullet (or some +/-) I think some users (like myself) hade adopted their sites to the current behaviour.

This patch does work! The trick is to clear your browser cache after patching. That did it for me. It's actually a simple patch to apply manually, if necessary.

Thanks!

Great work! I support making it work this way.

Can not mak this patch work, maybe because it is suposed to modify 0.x-dev and the only version available for download is version 0.7 (introducing doubleclick).

Would it be possible to make the 0.x-dev available again for download or to make a new patch of 0.7? I would really like to have something like this on my site!!!

I tested patch1 patching 0.7.
Patching worksm but the patch isnt complete yet. I reloaded my page several times and noticed that ony sometimes the menu opens/closes clicking the bullet. Mostly klicking the bullet just marks the link. Also mostly I cannot close the menu. It stays opened and as I said the link gets marked klicking he bullet.

http://drupal.org/node/113599 has been marked as a duplicate of this issue.

I just noticed that the settings page currently contains a commented-out setting for this:

//   $form['dhtml_menu_bullet'] = array(
//     '#type'          => 'checkbox',
//     '#title'         => t('Item bullets'),
//     '#description'   => t('The menu only collapses/exapand when clicking over the item bullet. WARNING: some themes do not show bullets!'),
//     '#default_value' => variable_get('dhtml_menu_bullet', 0)
//   );

When was this added, and is it in this patch? Just a bit confused because I thought all relevant commits and changes would go through this issue.

Subscribe.

BTW, an option to apply the drop-down function to only the bullets makes this module usable in a new installation that is being prototyped in the next 3 weeks.

Any resolution would be greatly appreciated! Thanks so much in advance for this great module.

Could we have an optional setting, please? I agree with Merlinofchaos, Morbus Iff and AdrianW on this - and the patch from #7 does not make this configurable.

However, the patch works (with fuzz) on current HEAD. It does not work in DRUPAL-5. I have adjusted the version of this issue to reflect this.

Just to make sure: has the developer determined that this definitely won't appear as a version 5 option? Even with a caveat that some styles won't support it?

This will be a make-or-break decision for a large site that requires a number of modules that aren't available for Drupal 6 next.

Well, I'm flummoxed. I unclicked admin/settings/dhtml_menu "JQuery slide effect" and clicked it again. (I think I made no other changes) ... and I'm seeing small plus icons next to DHTML menus that can be expanded ... and the text link only opens the page.

In other words, something changed and this is working for me ...

Nope. The correct action is showing with the book navigation block, not with DHTML_menu.

The Javascript tools/activemenu module is providing the correct actions as requested at the start of this thread.

The ReadMe file provides instructions for calling activemenu_js from any module.

Subscribe

Very useful, would really like this as an option on the settings page.

Yes, jstools modules's active_menu did this exact job and uses nice + and - icons too. Might mark this thread as fixed - it could also be cool to refer to that module as an alternative on your project page for people looking for the alternative functionality.

Lynn, not exactly. jstools active_menu expands only first level submenus... and it does a request each time, i find it rather too much overhead for such thing as navigation (I mean an ajax call each time). It's IMHO better when whole menu is fetched from db and then collapsed with javascript. Clickable bullets is a usability thing. I did not like the way link is lost because of the link:)

I agree.

This is very nice functionality. Personally, I am going to theme the bullets into plus/minus signs to make it obvious for the user.

Anyway, here is an attempt at converting this patch to 6.x-2.0

It seems to work for me...

I'm going to try my hand at this.

I believe that it is possible to keep the logic entirely in JS, only passing on a configuration option like the Slide Effect and Sibling Closer.

My idea is to change the list styles to plus/minus signs in Javascript if the option is enabled, and to listen for clicks on the li element rather than the a element. Inner elements override outer ones, so the Javascript should no longer block the link.

to listen for clicks on the li element rather than the a element.

Impossible due to the cascading event - nested li items will contain all the listeners of the parent items. I can't work around this. Postponed.

I'm following up from #280280: Expand without a link since this issue is more correct to discuss implementation of tree-view menus where clicking on plus/minus signs expands/collapses the submenu.

Since list style icons apparently cannot be made clickable, another way to implement is to prepend a new element with plus/minus signs to every expandable li. Such an element could listen to clicks to expand/collapse the submenu and have plus/minus signs as its background image. This also means disabling list-style-type and list-style-image on li elements.

This could provide a more elegant solution:

http://www.quirksmode.org/js/events_order.html

(No time to do that now, just saving the link for later.)

Clarification: The problem, as stated, is that you can only make list icons clickable by making the whole li clickable. Since the li elements are nested, clicking on one will trigger several events and wreak havoc. The above link shows how to stop propagation in overlapping click events.

	if (e.stopPropagation) e.stopPropagation(); // Compliant browsers.
	e.cancelBubble = true; // Internet Explorer hack

This will get into 7.x first.

Subscribe

It won't be in D6.

Why not? I mean, who is using D7? I don't understand developing features that people really need (asking for nearly 2 years) in a version of drupal that is supposed to be the current one in 1-2 years.

It's really frustrating having to possible solutions for menus (DHTML and Activemenus) and that each of them does right what the other doesn't, but neither is "complete"... Wouldn't be better try to work together? I know they are really different but maybe both could use solutions for the other one. Just one idea...

Anyway, maybe one day. Thanks for the hard work :)

I've been trying many things and I'm sorry to say that I entirely recommend to downgrade to the 6.x-2.2 and apply the patch in #33 if anyone wants this feature (and also to enable dhtml in some menus and fix some issues with Tabs in Zen theme).

If you apply the patch remember to disable and then enable once more the jQuery effect (it must be enabled to work) and clear the cache of your browser. The only problem I had with the patch was with bullets not showing in Opera with Zen theme. Any Idea? Thank you very much.