When using CKEditor and the new administration Toolbar in Drupal 7, the Toolbar overlays the CKEditor toolbar - preventing any button clicks when the editor is maximized.

Digging into the code with firebug, I guess this is related to some complex z-index issue. I just can't seem to get ckeditor maximize to overlay the administration Toolbar.

This is true for Firefox as well as IE. I also guess, that this issue might be unsolvable in the CKEditor module.

Comments

dczepierga’s picture

Status: Active » Needs work
Issue tags: +D7, +#d7ux, +ckeditor-7.x

Hmmm i try to overwrite this in CSS and config file of CKEditor, but it's impossible to do that. If you disable overlay window everything works as u except, with overlay window i can't control that....

Maybe someone give idea how to fix it or make patch....

ThaboGoodDogs’s picture

Having same problem too. Major show stopper, same thing happens in Drupal 6.20 too as well as my new Drupal 7 install.

dczepierga’s picture

Try to disable overlay module in D7, then maximize work without problem.

Greetings

mkesicki’s picture

Status: Needs work » Closed (fixed)

I close this ticket. There was no new post such long time.

Devin Carlson’s picture

Version: 7.x-1.0 » 7.x-1.6
Status: Closed (fixed) » Active

I'm reopening this issue as it still occurs in IE, Firefox and Chrome.

What's odd is that the administration toolbar will overlay CKEditor after clicking the maximize button but if you resize your browser, CKEditor will be maximized properly, but the administration toolbar will disappear (unless you resize your browser again)!

dczepierga’s picture

Status: Active » Closed (won't fix)

@Devin Carlson:

Hmmm i try to overwrite this in CSS and config file of CKEditor, but it's impossible to do that. If you disable overlay window everything works as u except, with overlay window i can't control that....

If u read this issue from begging u will know that it's impossible to do that with overlay module enabled, if u know how to fix it feel free to add patch for this bug.
For now i closed this issue.

Greetings

KoCo’s picture

Status: Closed (won't fix) » Closed (duplicate)
KoCo’s picture

Status: Closed (duplicate) » Needs review

Okay, was wrong pointing to the issue cue for another module, but it gave me an idea.
I adapted /includes/ckeditor.utils.js

_ added right before loading the text_area settings Drupal.ckeditorOn (line 71):
var $drupalToolbar = $('#toolbar', Drupal.overlayChild ? window.parent.document : document);
_ added extra function under textarea_settings['on'] (line 108):

,
afterCommandExec: function(ev) {
      if (ev.data.name != 'maximize') { return; }
      if (ev.data.command.state == CKEDITOR.TRISTATE_ON) { $drupalToolbar.hide(); } else { $drupalToolbar.show(); }
} 

This off course is no beautiful patch, but I lack the tools here.
But now full screen doesn't dissapear under the toolbar, which automaticly hides/shows depending on maximized state.

Please test this ;-)

thx
Koen

dczepierga’s picture

@KoCo, really thx for path. I will check it asap and if works i commit it to GIT. Again really thx for help.

Greetings

dczepierga’s picture

Status: Needs review » Fixed

Changes commited to GIT (diff).

@KoCo, again really thx for patch.

Greetings

Status: Fixed » Closed (fixed)

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

marcopanichi’s picture

Same problem occurs with Admin-Menu Plugin

The solution is to add a line to /includes/ckeditor.utils.js in order to consider the #admin-menu div:

if( drupalTopToolbar.length==0 ) drupalTopToolbar = $('#admin-menu', Drupal.overlayChild ? window.parent.document : document);

I added the line below this one:

var drupalTopToolbar = $('#toolbar', Drupal.overlayChild ? window.parent.document : document);

It's not an elegant solution, but it works for me...hope it helps!

mkesicki’s picture

Status: Closed (fixed) » Needs review
dczepierga’s picture

Status: Needs review » Closed (fixed)

@marcopanichi, i moved your issue to new thread: #1567022: [D7] Overlays of administration toolbar appears in CKEditor maximized mode.

Next time pls open new issue with your bug and don't write in closed issues.

Greetings

Francewhoa’s picture

Issue summary: View changes

Thanks all for fixing this challenge :)

We were facing the same challenge with multiple Drupal 7 installs. When possible we upgraded CKEditor module to the latest version. Which fixed this challenge :)

Unfortunately in some cases, somehow it was not possible to upgrade CKEditor module, mostly due to large Drupal distributions 200+ modules, and rescue Drupal installs which use customized CKEditor module in relationship with numerous other customized modules :( Bummer. When facing this unusual challenge, the Ubertus team found this temporary workaround. Simply add those three CSS lines to any pages using CKEditor:

.cke_inner.cke_reset.cke_maximized {
    position: fixed !important;
}

Thanks to Jenn for this tip

Using CKEditor module old version 7.x-1.16, and CKEditor libraries old version ~4.4.7

Again we used this temporary workaround for specific and unusual cases only. When possible we preferred to upgrade CKEditor module to the latest version. Which really permanently fixed this challenge :)