Opened 13 years ago

Closed 12 years ago

#2399 closed enhancement (wontfix)

allow Dialog widget to not recenter itself if larger than browser viewport

Reported by: guest Owned by: koranteng
Priority: high Milestone: 1.0
Component: Dijit Version: 0.4.1
Keywords: Dialog Cc:
Blocked By: Blocking:

Description

Hi,

I would like to offer a small enhancement to the Dialog widget. Currently, if a Dialog widget is larger than the browser viewport, when it recenters itself, its upper left corner moves off the screen. While mathematically correct, this causes any dialog controls outside the viewport to become essentially unusable. This enhancement prevents the Dialog widget from positioning its upper left corner off the screen, and prevents repositioning on scroll events under this same condition.

The enhancement consists of two modifications to the dojo/src/widget/Dialog.js file:


In function placeModalDialog(), Lines 220-221:

Replace:

			var x = scroll_offset.x + (viewport_size.width - mb.width)/2;
			var y = scroll_offset.y + (viewport_size.height - mb.height)/2;

With:

			// ensure placement is within browser viewport
			var x = (viewport_size.width > mb.width) ? (scroll_offset.x + (viewport_size.width - mb.width)/2) : 0;
			var y = (viewport_size.height > mb.height) ? (scroll_offset.y + (viewport_size.height - mb.height)/2) : 0;

In function _onScroll(), Line 301:

Replace:

			this.placeModalDialog();

With:

			// don't reposition dialog if it's larger than the browser viewport
			var viewport_size = dojo.html.getViewport();

			// find the size of the dialog (dialog needs to be showing to get the size)
			var mb;
			if(this.isShowing()){
				mb = dojo.html.getMarginBox(this.domNode);
			}else{
				dojo.html.setVisibility(this.domNode, false);
				dojo.html.show(this.domNode);
				mb = dojo.html.getMarginBox(this.domNode);
				dojo.html.hide(this.domNode);
				dojo.html.setVisibility(this.domNode, true);
			}

			if ((viewport_size.width > mb.width) &&
			    (viewport_size.height > mb.height))
			{
				this.placeModalDialog();
			}

I only tested the enhancement in Firefox 2.0 and IE 6. I did not observe any significant slowdown with the addition of code in the _onScroll function, but I did not know how to profile the actual execution time.

This enhancement is critical to my own application, but I understand the problem it addresses is relatively rare. However, I offer it in hopes that it will help someone else with a similar need.

Should the enhancement be incorporated, I authorize anyone to do anything they wish with this enhancement, under the auspices of the dojo license. If I need to have a signed CLA, please let me know how to obtain one.

Thanks very much for the consideration,

Dave B.

Change History (4)

comment:1 Changed 13 years ago by guest

Sorry, my full name is Dave Barndt, and my e-mail address is: webservant@…

comment:2 Changed 12 years ago by guest

FYI, a signed CLA is now on file with the Dojo Foundation and I predated it with a date from before I submitted this suggestion.

comment:3 Changed 12 years ago by bill

Component: WidgetsDijit
Milestone: 1.0
Owner: changed from bill to koranteng

comment:4 Changed 12 years ago by bill

Resolution: wontfix
Status: newclosed

The user can specify a size for the dialog and set overflow: auto to add a scrollbar if necessary. Anything beyond that doesn't seem useful in the general case (although surely it is useful for people that for some reason need really big dialogs), but it's not something I want to put into the dijit code. Could go into a super-dialog widget in dojox.

Note: See TracTickets for help on using tickets.