Inline editing + dialog in iframe; Dialogs are positioned according to iframe and not main window.

[Jakub Ś]

This is a continuation of #9391.

To reproduce:

1. Copy the attached file into ckeditor/samples folder and open it in a browser
2. Click on any dialog button

Results: Dialogs is displayed below the viewport because it is positioned according to iframe (it is 1753px high) and not main window.

[Piotrek Koszuliński]

The same happens for themed editor. And this is correct. Imagine that this iframe is tiny - 100px heigh. Then dialog centered according to main window will be invisible, because it'd be positioned out of iframe.

[Jakub Ś]

@Reinmar small iframe is a good example her. The same applies to iframe aligned to left or right and not taking all the view port.

Despite this approach being valid for two above scenarios it is still invalid for this one scenario described in ticket thus I have one question however. Can't there be some config option for iframe that is bigger than viewport or better, for all frames? I'm talking about giving users possibility to choose according to what they want to position dialogs.

[Piotrek Koszuliński]

No, I think we'll never implement this. First of all I'm not even sure it's possible (rather not - just like we can't display dialogs in parent frame), second devs should take care of displaying iframe with reasonable size.

[Mike Burgh]

If anyone is looking for a solution to this, here is a workaround you can tie to the dialogDefinition

CKEDITOR.on('dialogDefinition', dialogDefinition );

var dialogDefinition = function(e) {
	e.data.definition.dialog.on('show', function () {
			
	//So the dialog is right on the x, need to fix it's y to make it cetner viewport not center iframe we are in

	var editor = this.getParentEditor()
		,intFrameTop = $container.offset().top //get the top of the frame in the window that holds it
		,intScrollTop = $(top).scrollTop() //get scroll position
		,intFrameOffset =  intFrameTop - intScrollTop //frame offset
		,intDocumentHeight = $(top).height() //height of the current browser window
		,intPopupHeight = this.getSize().height
		,intNewTop = (intDocumentHeight/2) - (intPopupHeight/2) - intFrameOffset
		,objCurrentPos = this.getPosition()
		;

	if (intNewTop < 0) {
		intNewTop = 5; //If it's under the frame pad it 5px off it the top of it!
	}
	
	this.move( objCurrentPos.x, intNewTop ,false);
	

	
});

[Jakub Ś]

#8113 was marked as duplicate.

[Jakub Ś]

#13914 was marked as duplicate.