Using both ctools 6.x-1.x dev and 6.x-1.7 + Panels, i'm not able to type text into ckeditors dialog popups e.g. when creating a hyperlink/adding an image to the content of a mini panel.

Using the WYSIWYG module.

After a bit of debugging found it to be because of the keyboard and focus event handler in modal.js

My fix being to allow cke dialog popups focus by modifying
[code] if( $(target).filter('*:visible').parents('#modalContent').size()) {[/code]
to
[code] if( $(target).filter('*:visible').parents('#modalContent,.cke_dialog').size()) {[/code]
adding the .cke_dialog class

Comments

Status:Needs review» Active

Needs review means there is a patch.

The code you have here, even if it were in the form of a patch, could never be committed to CTools since it refers directly to a class provided by a basically random module.

Status:Active» Needs work

I'm also not sure what this is doing.

No problem.

Sample Scenario:
If you create a mini panel, and add 'new custom content'. Then using ckeditor try and add an image to the body (using the button rather than html), you should find that you won't be able to type into the 'image properties' dialog box that comes up.

I found this to be because of the keyboard and focus event handler in modal.js, since it seems to restrict focus for keyboard input to within #modalContent, resulting in not being able to type in elements outside of #modalContent, ckeditor seems to adds its dialog boxes html after the #modalContent element.

Didn't want to always return true for that handler for a fix, figured its there for a reason so opted for adding that specific class and filing a report to see if there's a better fix.

Status:Needs work» Active

I can verify that this problem does exsist... I made the suggested change and my panels would work with CKeditor again. I agree that the fix above is not the right way to fix the problem however it does seem to work.

Status:Active» Needs work

Changing back to "needs work" since that is apparently still the correct status here.

Confirming this issue with the following
*CTools 1.7
*Drupal 6.19
*Panels 3.7
*Wysiwyg 2.1
*CKEditor Library 3.4.1

Status:Needs work» Needs review
StatusFileSize
new1.33 KB

Here is an experimental, untested patch. Use this with caution, but it may fix this on the theory that if an element is position: absolute, then we should allow it to be clicked on. Though we may need to look at the parent chain, so I'm not really sure this will work.

That patch does not work. This one does for me.

Can I get confirmation from someone else with this problem?

StatusFileSize
new735 bytes

EDIT: Ignore this comment. merlinofchaos and me posted our last comment at the same time. I suggest testing merlinofchaos' patch. Not this one.

Any volunteers for testing this patch?

Patch is for 6.x-1.x-dev (2010-Oct-19)

Apply this patch from the module root directory

Patch is based on DaRK's above first message. Thanks DaRK :)

Please disregard #9. I've already stated, categorically, that I will not put a CKEditor specific class in. Please test #8 instead.

I have this problem as well...thanks for reporting: I thought it was something bad in my sandwich.

Just before I go random patching: #8 gets dropped into the ctools root directory and then we run patch < modal_js_905546_7.patch right?

Confirming patch #8 works. Thanks merlinofchaos :)

Tested with:
*Drupal 6.19 fresh install
*CTools dev (2010-Oct-20)
*Panels 3.7
*Wysiwyg 2.1
*CKEditor Library 3.4.1
*Garland theme

Status:Needs review» Reviewed & tested by the community
Issue tags:+wysiwyg, +ckeditor
StatusFileSize
new71.44 KB

Note to self: Screenshot from testing result

I'm not sure I understand the screenshot. Is it a bad thing or a good thing?

A good thing. The patch works. You can ignore the screenshot. It's a note to myself. Sorry for the confusion.

Removed my tweak and tested with patch 8, all appears to be well.

Minor note in patch 8

+      var parents = $(target).parents().get();
+      for (var i in $(target).parents().get()) {

assuming you intended to use parents in the for as well?
so
+      var parents = $(target).parents().get();
+      for (var i in parents) {

just to be sure, checked again with the above change

Hi, Will with this patch it be possible to use fckeditor or ckeditor on the "New custom content" body field?
Thanks a lot in advance for your reply!
Greetings, Martijn

@Summit: I'm assuming you're referring to WYSIWYG module with ckeditor or fckeditor library. I can confirm that patch in comment #8 works with ckeditor on the "New custom content" body field. I never tried with fckeditor.

With
* Drupal 6.19 fresh install
* CTools dev (2010-Oct-20)
* Panels 3.7
* Wysiwyg 2.1
* CKEditor Library 3.4.1
* Garland theme

Just another confirmation that this works.

I have the following installed and manually installing this patch works (probably don't need to manually do it but I'm having other personal issues!)

  • Drupal core 6.20
  • Chaos tool suite 6.x-1.8
  • CKEditor - WYSIWYG HTML editor 6.x-1.2
  • Panels 6.x-3.9

I was having problems with adding urls to link fields and attributes to css fields (basically all the little pop up boxes.)

Cheers

I confirm that this patch #8 works fine for me.

Drupal core: 6.20
Chaos tools: 6.x-1.8
CKEditor: 6.x-1.2
Panels: 6.x-3.9

Cheers

Confirm Patch #8

Hi,

Tested with:
Drupal core: 6.20
Chaos tools: 6.x-1.8
FCKEditor: 6.x-2.1 with editor 2.6.6
Panels: 6.x-3.9

Not working. No editorscreen on "New custom content" body field.
Is there something different using Fckeditor.
Can't upgrade yet to Ckeditor because of special fckeditor buttons.
greetings, Martijn

Status:Reviewed & tested by the community» Fixed

Since this works with ckeditor, I'm going ahead and committing. I'm not sure about fckeditor. Will need someone using it to investigate, probably.

Hello!
#8 works fine, now I can add some links
But when I close popup browser freezes
Look http://drupal.org/node/1060188#comment-4146464
Is this something related to detachBehaviors issue?

Could anyone responds to me that have the same problem?
I don't have this error with ckeditor (3.5.2) not in modal window.
So I think it's caused by integration ctools modal window and ckeditor

merlinofchaos, do you have any idea how it could be solved?

csandanov: You are doing two very inappropriate things:

1) You are trying to hijack an issue. This issue is about how the modal window controls focus when it is up, and that focus interaction with wysiwyg editors is a primary issue. It has nothing to do with other wysiwyg related bugs.

2) You are bumping the issue you hijacked after only a day.

Both of these things are rude and inconsiderate.

Hello!

Ok, I got it. Sorry for that.
All I wanted is to get some feedback to be sure it's not only my problem, because I wasn't sure about that.
I wrote into this task because I didn't find another ckeditor related issue in ctools module issue tracker.

I add special issue for that - http://drupal.org/node/1078576
Thanks for you reply!

StatusFileSize
new400.17 KB

The patch #8 works partial.

With the patch it is possible to edit the forms in the CKEditor modal windows (image, link, ...). But when I confirm the selection and the data is send to the editor, the gray overlay does not disappear (see screensho).

We use:
- CKEditor 3.5.2
- Chaos tool suite 6.x-1.8

Status:Fixed» Closed (fixed)

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

Status:Closed (fixed)» Needs work

i am getting the exactly same experience as weri above at #29.
I am able to edit after applying patch..but once confirm edits etc. the grey overlay remains and i cant save the minipanel changes.

Drupal 6.20
Chaos tools 6.x-1.8
Mini panels 6.x-3.9
Panels 6.x-3.9
WYSIWYG Panels
Wysiwyg 6.x-2.3
CKEditor 3.5.1.6398

Same here as #29 and #31, but installing jquery_update-6.x-2.0-alpha1.tar.gz and using the latest release of CKEditor (3.6.1) solved the issue for me.

Status:Needs work» Reviewed & tested by the community

I never got around to testing it without jQuery Update 6.x-2.0-alpha1, but I have the same result with #32. I've tested it on both CKEditor 3.6.1 and CKEditor 3.4.2.6041 and they both work. I've also tested it on both "Panel content" tab and with Panels IPE.

Again, I'm not sure about jQuery pre 6.x-2.0-alpha1, but considering jQuery Update has been 6.x-2.0-alpha1 since 2010-Apr-23, I personally vote for the patch #8.

There is a slight annoyance. Perhaps instead of:

      var parents = $(target).parents().get();
      for (var i in $(target).parents().get()) {

We could have:

      var parents = $(target).parents().get();
      for (var i in parents) {

This should have no effect.

Status:Reviewed & tested by the community» Needs work

Sorry to push this back to [needs work], but I'm getting no joy from #8. My environment:
- Pressflow: 6.22
- CKEditor: 3.5.3 / 6.x-1.x-dev
- CKFinder: 2.0.2
- CTools CSS Cache: exists
- CTools: 6.x.1.8
- jQuery UI: 1.6 / 6.x-1.4
- Panels: 6.x-3.9

Patch was applied: here's the console output:

root: ../sites/all/modules/contrib/ctools# patch -p0 < 905546-let-absolute-divs-be-clicked-on_0.patch
root: patching file js/modal.js
root: ../sites/all/modules/contrib/ctools#

Around line 364 in ctools/js/modal.js I see this:

var parents = $(target).parents().get();
      for (var i in $(target).parents().get()) {
        var position = $(parents[i]).css('position');
        if (position == 'absolute' || position == 'fixed') {
          return true;
        }

But:
- Open a panels page
- Create new content
- Use CKEditor to place image (from toolbar)
then: image properties modal does not allow text input (although the form elements such as drop downs are live)

(edit) Is #8 dependent on an upgraded jQuery?

I'm afraid I cannot confirm whether it works on an old one, but it works with jQuery Update 6.x-2.0-alpha1.

EDIT: Also, it would seem the modal.js patch has gone in since a few weeks ago. I'd recommend getting the -dev release.

EDIT2: Of course, to get the -dev release of CTools, you'd have to get the -dev release of Panels, too.

Status:Needs work» Closed (fixed)

Thanks for the detail Jason. FWIW, I went around and upgraded everything ti the latest devs, and installed jquery_update...and it's all good now.
Guess I should set this back to closed as it seems the latest gear doesn't have the problem.

Status:Closed (fixed)» Fixed

Marking it as fixed so others can find it.

Status:Fixed» Closed (fixed)
Issue tags:-wysiwyg, -ckeditor

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