Ticket #5286 (closed enhancement: fixed)

Opened 12 months ago

Last modified 4 months ago

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

Reported by: guest Owned by: bill
Priority: normal Milestone: 1.2
Component: Dijit Version: 1.0
Severity: normal Keywords:
Cc:

Description (last modified by dylan) (diff)

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

Changed 11 months 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?

Changed 9 months ago by bill

  • summary changed from Dialog titlebar is hidden to Dialog: large dialogs go off-screen, can't see top or bottom
  • milestone set to 1.2

Changed 8 months 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

Changed 6 months ago by dylan

  • owner set to dante
  • description modified (diff)
  • summary changed from Dialog: large dialogs go off-screen, can't see top or bottom to [patch][cla] Dialog: large dialogs go off-screen, can't see top or bottom

Changed 5 months ago by dante

  • type changed from defect to enhancement
  • milestone changed from 1.2 to 1.3

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.

Changed 4 months ago by doughays

ibm 90503

Changed 4 months ago by doughays

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.

Changed 4 months ago by bill

  • owner changed from dante to bill
  • status changed from new to assigned
  • milestone changed from 1.3 to 1.2

I'll fix this.

Changed 4 months ago by bill

  • status changed from assigned to closed
  • resolution set to fixed

(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.