This is similar to #1114324: Problem with Zero Point theme, but relates to behavior in Drupal Commons themes (Commons Connect, Commons Roots, Commons Environs, Commons Origins).

The attached screenshot shows the original position of the Upload dialog when it's first displayed upon clicking the Upload button.

I can get the dialog to display fully only by scrolling the page until the site header scrolls up and away from the dialog. In simpler themes (e.g., Garland), this dialog can be dragged anywhere on the window. But in these Commons themes, the dialog will only display within borders of the FileDepot content; when I drag it beyond those borders, it slips "under" the other content and is clipped. Since the original/default position is high enough on the page to be outside these borders, the top of the dialog gets cut off.

Any recommendations on a fix for this behavior?

CommentFileSizeAuthor
#5 filedepot-dialog_clipping_in_commons-1369708-5.patch2.08 KBleducdubleuet
#2 filedepot-dialog_clipping_in_commons-1369708-2.patch2.11 KBTwoMice
clipping.png67.88 KBTwoMice

Comments

dizarter’s picture

dizarter commented

I don't have experience with that particular theme, but my custom theme had CSS property overflow set to hidden on few content divs, and it seems to me like you have this same problem.

If you know how to use Firefox addon called Firebug, try locating a div just above the filedepot div and see if it has css property overflow: hidden. If it's not that div, work your way up through the div hierarchy and it is very likely you will find one (or more) divs with this porperty set. Just change it to be overflow: visible.

Hope this solves your problem.

TwoMice’s picture

TwoMice commented
Status: Active » Needs review
StatusFileSize
new filedepot-dialog_clipping_in_commons-1369708-2.patch2.11 KB

I found the problem can be solved by sidestepping the theme's DOM tree altogether and moving all filedepot dialogs into <body>. This seems sane and reasonable to me, since the dialogs are not logically or structurally connected to the DOM tree itself but are layered atop the page layout completely.

The patch here applies these changes for the 6.x-1.x (dev) branch, should apply cleanly for 6.x-1.2 as well (in case anyone wants to try patching their own site with it).

Essentially what it does is move all filedepot dialogs into a <div> of their own directly under <body>, and then adds a couple of CSS rules to apply filedepot styling to those dialogs (since they're now outside the #filedepot containing div). Incidentally, a new CSS rule also raises the dialogs above the z-index of the modal overlay, which happens to take care of #1137934: Cannot upload or create new folders. Overlay blocks everything. without requiring you to disable modal dialogs.

blainelang’s picture

blainelang commented
Status: Needs review » Fixed

Alternatively, to the option @TwoMice has recommended, you can refer to this issue/fix as well - http://drupal.org/node/1114324

leducdubleuet’s picture

leducdubleuet commented

Setting useModalDialogs to false was not enough for us.

I applied manually TwoMice's patch in comment #2 to current dev and it did the trick! Thank you very much!

Any chance seeing this patch ported into git ?

Btw, this is a great module, thanks!

leducdubleuet’s picture

leducdubleuet commented
Status: Fixed » Needs review
StatusFileSize
new filedepot-dialog_clipping_in_commons-1369708-5.patch2.08 KB

Here is the same patch as in #2 but for the current 6.x-1.x (dev) branch version.

andrewm63au’s picture

andrewm63au commented

How do I apply the patch?

Isn't it an issue with the Theme?

I have enabled three themes and tried in each and Acquia Marina is the only one I have an issue with. I'm using IE8 and I've tried both 6.x-1.2 and 6.x-1.x-dev versions of file depot

leducdubleuet’s picture

leducdubleuet commented

Details to apply a patch are on these pages:
http://drupal.org/project/filedepot/git-instructions
http://drupal.org/node/1399218

Of course, you can always apply a patch manually:
http://drupal.org/node/534548

Yes, this issue occurs only with certain themes but the patch can't hurt and makes sense anyway. ;-)
I tested the patch successfully with IE9 using Commons Origins and Mix and Match / Fusion.
And filedepot does not show at all for me in IE8, javascript error, unrelated to this patch.

eggersrj’s picture

eggersrj commented

I tried the patches from #2 and #5 with their respective 6.x-1.2 & 6.x-1.x-dev versions on the Commons Origins theme but the upload dialog was still "clipped". Has anyone else had luck fixing this for the Commons Origins theme?

t-readyroc’s picture

t-readyroc commented

I can confirm that the patch from #2 functions with 6.x-1.2 & Acquia Marina 6.x-3.1.