I have been using DHTML Menu for a while without any issues, and recently I installed IMCE. I found that the IMCE File Browser is not working (no icons and no preview of image etc.) unless I disable DHTML Menu.

So, I wondered if the IMCE File Browser Navigation is being considered as if it is a Drupal menu, and DHTML Menu is trying to DHTML enable it.

I have configured DHTML Menu to enable only for Administrator menu and Navigation menu - this doesn't fix the issue.

I am using Firefox so I used Firebug and found the code where the error occurs.

In Firebug console I get:

$(".menu li").css("margin-left") is undefined

Then, it shows the line of code where the problem occurs. It is line 508 in the code segment shown below:

505 // When using LTR, all icons can be shifted as one, as the text width is not relevant.
506 if (settings.nav == 'bullet' && !rtl) {
507 // Shift overlay to the left by the width of the icon and the distance between icon and text.
508 var shift = '-' + (Math.ceil(($('.menu li').css('margin-left').replace('px', ''))) + 16) + 'px';
509 // Shift the overlay using a negative left-hand offset, and the text using a negative right-hand margin.
510 $('.dhtml-menu-icon').css('left', shift).css('margin-right', shift);
511 }

So, does this mean there is something wrong with CSS or is this a bug in DHTLM Menu ? I am trying to understand why DHTML Menu would be attempting to process the menu, which is actually part of IMCE File Browser. It also looks like this problem only occurs if I use 'bullet' mode in DHTML Menu settings.

I noticed some other people have had issue with IMCE, where the buttons do not appear and the theme module called ThemeKey was used to fix it. I tried this, but the DHTML menu is not linked to a theme, it is interferring with the way the IMCE menu works, but I am not sure how to fix it. I opened an issue with DHTML menu, but didn't get any response. Since the issue is with IMCE project, i wondered if anybody using IMCE has any ideas which might help me ?

Comments

ufku’s picture

ufku commented

Which version of dhtml_menu are you using?
I couldn't reproduce the error using 6.x-3.5 and garland theme.

TimAlsop’s picture

TimAlsop commented

I am using 6.x-4.x-dev and it looks like the issue only occurs when the bullet option is selected in order to provide a click-able area on each menu item to expand/contract the group of menu items.

ufku’s picture

ufku commented
Status: Active » Closed (won't fix)

Confirmed. You can set the category of your dhtml_menu issue to bug report.
They need to fix that line. Replacing $('.menu li').css('margin-left') with ($('.menu li').css('margin-left') || '0') works. They may have a better fix.

ufku’s picture

ufku commented
Status: Closed (won't fix) » Closed (works as designed)
vrajak@gmail.com’s picture

vrajak@gmail.com commented

Have this same issue, but can't figure *what* code to modify. There's no code that long in any of the IMCE or DHTML files, or with those lines of code. Please help by actually specifying the file? Thanks.

jdemmers’s picture

jdemmers commented

Vraja - the file is dhtml_menu.js - around line 180 I believe. I'm running Drupal 7.14, IMCE 7.x-1.x-dev, and DHTML 7.x-1.0-beta1 and the fix worked for me.

BigEd’s picture

BigEd commented

I just arrived here after picking up a similar issue, a simple enough patch but the JS has changed since the previous comments. Any thoughts?

Current code in the JS file.

    // When using LTR, all icons can be shifted as one, as the text width is not relevant.
    if (settings.nav == 'bullet' && !rtl) {
      // Shift overlay to the left by the width of the icon and the distance between icon and text.
      var shift = '-' + (Math.ceil(($('.menu li').css('margin-left').replace('px', ''))) + 16) + 'px';
      // Shift the overlay using a negative left-hand offset, and the text using a negative right-hand margin.
      $('.dhtml-menu-icon').css('left', shift).css('margin-right', shift);
    }
joewickert’s picture

joewickert commented

Just hit this issue when turning on the bullets option.

Can confirm changing the code in dhtml_menu.js at line 179 from

var shift = '-' + (Math.ceil(($('.menu li').css('margin-left').replace('px', ''))) + 16) + 'px';

to
var shift = '-' + (Math.ceil(($('.menu li').css('margin-left') || '0').replace('px', ''))) + 16) + 'px';

Seems to work

gibbet’s picture

gibbet commented

Yea I'm seeing this issue as well... didn't want to patch the module,so just disabled the expand bullets setting... This issue broke a lot of things in the site (including the dhtml setting page's expand/collapse settings) so I hope the maintainers include this patch in the next update...

cegri’s picture

cegri commented
  • Same configuration:

Drupal 7.43
IMCE 7.x-1.10
DHTML Menu 7.x-1.0-beta1 ("Expand On Bullet")
CKEditor 7.x-1.17

  • Same problem:

Upload, Delete, Resize buttons not showing in IMCE

  • Same Solution:

Ufku's revision in message #3 (Thanks!)

  • Same wish:

Patch in next upgrade

cegri’s picture

cegri commented

There is a slight error in #8. Missing a paranthesis. Corrected:

var shift = '-' + (Math.ceil((($('.menu li').css('margin-left') || '0').replace('px', ''))) + 16) + 'px';

I hope this will be patched into next update.