I've created a small patch that adds an additional setting to make the menu item expand/contract when the user clicks on the list icon, and open the link itself when the item is clicked, much like a file browser.

It does this by creating a link that is superimposed over the icon using some CSS trickery. Because of this you may need to configure/override the dhtml_menu.css to get it to work for unusually large icons, but it should work in general.

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

cburschka’s picture

Status: Needs review » Needs work
href=#

Please use valid markup. :)

adaven’s picture

as in

href="#"

Or are you referring to the anchor name not being unique?

cburschka’s picture

Yeah, sorry for not being more clear. I'm not spending a lot of time here this week. The validation issue I meant was only the attribute quotes.

Personally, I like to put "javascript:void()" instead of "#" in links that are supposed to be Javascript-only (avoids jumping to the top of the page when JS is disabled), but as this link is generated by Javascript, that's superfluous.

adaven’s picture

FileSize
2.11 KB

Aforementioned quotes added. Merry Christmas!

arhak’s picture

subscribing

BTW: I recall doing some thing like this before, but dropped it because of cross-browser compatibility (it didn't worked the same in a couple of them, right now I don't remember which ones)

adaven’s picture

I've tested this one on IE6, IE7, FF, Chrome, and Safari and, touch wood, it seems to work ok so far.

adaven’s picture

Status: Needs work » Needs review

forgot to change the issue status.

cburschka’s picture

Thanks, I'll test this now.

This will fortunately not require any porting since D7 already has icon-expansion functionality.

cburschka’s picture

Status: Needs review » Needs work

Hi, I'm sorry but this doesn't work (and work at all) on my test site. You can check the demo here: http://dev.ermarian.net/dhtml_menu/ . As soon as you enable the new setting, everything is broken.

Basically, icons overlap with the link text, and neither clicking the link text nor the icon will actually cause anything to expand.

fumbling’s picture

Subscribing

webel’s picture

http://drupal.org/files/issues/dhtml_menu_8.patch

vs. Drupal 6.6+dhtml_menu-6.x-3.2

I agree it does not work properly yet.

Case 1:

  • [y] Animating sliding effect
  • [n] Go to the page on double-click
  • [y] Menus expand/collapse when icon clicked.

Clicking on link (not icon) of parent opens parent page: OK
Clicking on icon of OPEN parent closes branch: OK
Clicking on icon of CLOSED parent: FAILS: parent branch opens and closes immediately

Case 2:

  • [n] Animating sliding effect
  • [n] Go to the page on double-click
  • [y] Menus expand/collapse when icon clicked.

Clicking on link (not icon) of parent opens parent page: OK
Clicking on icon of OPEN parent closes branch: OK
Clicking on icon of CLOSED parent: opens branch OK however then goes to 'parent#' and to bottom of page

BTW (I had Pathologic 6.x-1.1-beta13 on, toggling it and reloading had no effect.)

Please persist, this could be a very useful improvement to DHTML, and Happy New Year in 2009 (from Sydney).

webel’s picture

PS: did not find '#' in patched .module.
Any idea where it comes from ?
If I can get rid of that I at least have a working non-animated solution.

cburschka’s picture

If you refer to the link element, it is generated by Javascript.

webel’s picture

Thanks Arancaytar,

From dhtml_menu.js:

// $Id: dhtml_menu.js,v 1.18.2.8 2008/11/09 23:03:35 arancaytar Exp $
..
    if(effects.iconclick) {
  	  $(li).find('a:first').addClass('menu-link');
  	  $(li).prepend('<a href="#" class="icon-link"></a>');
    }      	 

I hacked it to read:

    if(effects.iconclick) {
  	  $(li).find('a:first').addClass('menu-link');
  	  $(li).prepend('<a href="" class="icon-link"></a>');
    }      	

And now it seems to work exactly as I wish (as long as the animation mode is off).

Am most grateful for your help.

May I ask why the '#' is there in the first place ?

webel’s picture

I wrote:
> May I ask why the '#' is there in the first place ?

I was premature in my delight that my hack worked, it was an illusion.

If one waits a bit in fact the current page simply reloads whenever the icon link (with '#') is clicked.

!!! Can somebody please examine this and attempt a solution compatible with Drupal6.6. !!!

There have to be hundreds of drupal developers and maybe thousands of users who want
to be able to open and close branch icons and single click on a parent link to open its page.

#349269: Double clicking is unnatural

And I agree, and so do lots of others. Please persist. I would be very, very grateful.

webel’s picture

> a solution compatible with Drupal6.6. !!!
Better said, compatible with secure Drupal6.8

adaven’s picture

Apologies for the lack of response. I've managed to fix the problem referred to in #9, there was a missing "display: none" in the stylesheet. I guess that'll teach me to test my patches on non-standard themes!

I'll investigate the open/closing problem from #11 and see if I can fix it. Strangely, I can't replicate it on my site, but it does happen on Arancaytar's test site.

adaven’s picture

FileSize
2.34 KB

Ok, finally had a chance to sort this out. Just needed a few changes to the css file. Here's the updated patch. It should work on Minelli, but obviously I can't guarantee it'll work on every theme without some tweaking.

feadin’s picture

Works great so far!
I'm using Zen theme btw ;)

Thanks!!

EDIT: It has problems when using the "Keep only one menu open at a time" option. Menus will expand and automatically collapse again.

sorahn’s picture

Subscribe + Report:

The patch works ad advertised, which is exactly what i was looking for. I tried jquery menu, but the animations and ability to know which menu should be open were sub par. This module is perfect, and was actually trying to figure out how i could get this effect out of it.

That being said, have the same problem as reported above. Where if i have it set to keep only 1 menu item open at a time, it will auto close them. I'm looking through the javascript to see if i can figure out what's making them auto close.

StenBH’s picture

Subscribing

scroogie’s picture

+1 for this patch. I'd like it much more if clicking the link would open the page, and clicking the icon would open the tree.

cburschka’s picture

It has problems when using the "Keep only one menu open at a time" option. Menus will expand and automatically collapse again.

You may need to stop bubble propagation of the event - I experienced the same issue when I implemented "li"-clickable expansion. Nested elements will all get the event unless it gets canceled. I haven't looked at it in detail though.

Note that a feature like this already exists in the D7 branch, and I unfortunately won't be able to spend time backporting it to D6. I will gladly review and commit a working patch though. :)

hapydoyzer’s picture

Status: Needs work » Needs review

Forgot to change Status.
Subscribing.

okmi’s picture

subscribing - this would be incredibly useful for us. having something more stable than a patch for D6 would save our menu.

cburschka’s picture

Status: Needs review » Needs work

It has problems when using the "Keep only one menu open at a time" option. Menus will expand and automatically collapse again.

This patch is going nowhere while that still happens, unfortunately...

cburschka’s picture

Status: Needs work » Closed (fixed)

This feature is in D7 now. Once the present overhaul is done, the D7 version will be backported to D6 as version 6.x-4.0. That means that 6.x-3.x no longer needs a patch for the feature.

stefan81’s picture

Status: Closed (fixed) » Active

Hi

I applied the patch. a few things still don't work. so I set this to active again.

I installed 6.x-3.5 but there is no backport yet?
Still planning to do so?

Patch does not work on 6.x-3.5.
double click still needed, icon not clickable.

active sub-links are not visible (collapsed).

Kafu’s picture

subscribing.

When is planned the back-porting from D7 (or when is planned the 6.x-4.0 version ;) )?

Shadlington’s picture

Subscribing.
Any progress on the mentioned backport?

EDIT: Ah, I can see there is a 6.x-4.x-dev version kicking around with the backport in it.
I'll have a play with it to see how stable it is.

EDITED EDIT: Well the short answer is: It isn't! All sorts of problems with that version, its very broken.

EDITED EDITED EDIT: Hmmm. Mostly works on a clean install, so it must have a problem with one of the modules I have installed. Hell if I know which one, though.
One problem it has it that the folder icons aren't themselves clickable, its just the bullets. That seems wrong to me.

samhassell’s picture

The patches at http://drupal.org/node/564428#comment-2862258 seem to work pretty well with 6.x-3.5.

vuil’s picture

Issue summary: View changes
Status: Active » Fixed

I close the issue as Fixed. It is already applied to the 6.x branch.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.

vuil’s picture