Opened 12 years ago

Closed 11 years ago

#5286 closed enhancement (fixed)

[patch][cla] Dialog: large dialogs go off-screen, can't see top or bottom

Reported by: guest Owned by: bill
Priority: high Milestone: 1.2
Component: Dijit Version: 1.0
Keywords: Cc:
Blocked By: Blocking:

Description (last modified by dylan)

When Dialog hight is taller than browser window Dialog titlebar is hidden, and this is a showstopper for the whole application. Dialog titlebar should never be hidden. I suggest putting something like

var top = Math.floor((viewport.t + (viewport.h - mb.h) / 2)); style.top = (top < 0 ? 0 : top) + "px";

into Dialog._position

Change History (9)

comment:1 Changed 12 years ago by bill

Hmm, I could do that but it still wouldn't solve your problem, because the user would have no way to see the bottom of the dialog, right?

comment:2 Changed 12 years ago by bill

Milestone: 1.2
Summary: Dialog titlebar is hiddenDialog: large dialogs go off-screen, can't see top or bottom

comment:3 Changed 12 years ago by guest

Here's a solution from my thread http://www.dojotoolkit.org/forum/dijit-dijit-0-9/dijit-development-discussion/dijit-dialog-error-putting-dialog-center-only-wor

_position: function(){
	// summary: position modal dialog in center of screen
	
	if(dojo.hasClass(dojo.body(),"dojoMove")){ return; }
	var viewport = dijit.getViewport();
	var mb = dojo.marginBox(this.domNode);

	var style = this.domNode.style;
	style.left = Math.floor((viewport.l + (viewport.w - mb.w)/2)) + "px";
	
	// Change to avoid the dialog being outside the viewport
	var top = Math.floor((viewport.t + (viewport.h - mb.h)/2));
	
	// A standard margin is nice to have for layout reasons
	// I think it should be proportional to the page height
	var margin = Math.floor(viewport.h/30);
	
	// The top can't be less than viewport top
	if (top - margin < viewport.t)
	{
		top = viewport.t + margin;
	}
	
	// If the height of the box is the same or bigger than the viewport
	// it means that the box should be made scrollable and a bottom should be set
	if (mb.h + margin*2 >= viewport.h){
		style.overflow = "auto";
		// The bottom is margin - the scroll of the page
		style.bottom = (margin - viewport.t) + "px";
	}
	style.top = top + "px";
},

/Max Gordon

comment:4 Changed 11 years ago by dylan

Description: modified (diff)
Owner: set to dante
Summary: Dialog: large dialogs go off-screen, can't see top or bottom[patch][cla] Dialog: large dialogs go off-screen, can't see top or bottom

comment:5 Changed 11 years ago by dante

Milestone: 1.21.3
Type: defectenhancement

this turned out to be a lot more difficult than i had anticipated, and might add a lot of kludge in the end to keep it supported. the dojox.widget Dialog always stays in the viewport based on a padding param passed, but I don't think that concept will make it into dijit. bumping for now.

comment:6 Changed 11 years ago by Douglas Hays

ibm 90503

comment:7 Changed 11 years ago by Douglas Hays

I recommend changing the Math.floor(blah) in _position() to
Math.max(0, Math.floor(blah)) for dojo 1.2 just to make the Dialog semi-usable until a complete solution is committed.

comment:8 Changed 11 years ago by bill

Milestone: 1.31.2
Owner: changed from dante to bill
Status: newassigned

I'll fix this.

comment:9 Changed 11 years ago by bill

Resolution: fixed
Status: assignedclosed

(In [14682]) Fixes #5286: when viewport is too small to show dialog, resize dialog's content pane to have scroll bars. !strict

Note: See TracTickets for help on using tickets.