Dialogs

Problem statement

There's no markup or API for dialog boxes, tool palettes, hovering tooltips, the contents of popup widgets, and the like.

Real world examples today

Dialogs

Registration Dialogs

• http://www.reddit.com/ - make sure to be logged out if you have an account, and click the register link
• http://digg.com/ - make sure to be logged out if you have an account, and click the Join Digg! button
• http://slashdot.org/ - make sure to be logged out if you have an account, and click the Join link

Login Dialogs

• http://slashdot.org/ - make sure to be logged out if you have an account, and click the Log In link
• http://digg.com/ - make sure to be logged out if you have an account, and click the Login button
• http://newsvine/ - make sure to be logged out if you have an account, and click the Log In | Register link
• http://www.bahn.de/ - Login link is rightmost in main navigation bar - try tapping: funny handling of focus order, skipping positions, at times keyboard trap

Other Dialogs

• http://www.kongregate.com/ - register for account, log in, click Get Kreds, click Fund Your Account button
• GMail - Click "more" on the left, then Create New Label.

Tooltips

• The tooltips in the table of [1] are interesting because they are currently <div>s and force the parent to be a TD rather than a TH since TH is inline only, even though the visible content is really just phrasing content.

• GMail's contacts list has rich tooltips.

Lightboxes

• http://www.flickr.com/photos/christina_stasia/5317650777/in/pool-44124373027@N01/ - click on the magnifying glass icon in the top toolbar.

Other

A list of URLs from Steve Faulkner to look at — if anyone has the time to go through these and pick out those that are real use cases (as opposed to demos or examples, since those tend to not reflect real needs but more reflect what's easy to demo!) then please add them where appropriate above.

http://flowplayer.org/tools/overlay/index.html http://alloy.liferay.com/deploy/demos/dialog/ http://www.bbc.co.uk/glow/docs/1.5/furtherinfo/widgets/overlay/ http://rightjs.org/ui/dialog/demo http://jqueryui.com/demos/dialog/ http://download.dojotoolkit.org/release-0.4.2/dojo-0.4.2p1-widget/tests/widget/test_Dialog.html http://www.sencha.com/examples/pages/window/hello.html http://www.sencha.com/examples/pages/window/dialog.html http://www.sencha.com/examples/pages/window/accordion.html http://dev.sencha.com/deploy/ext-4.0.2a/examples/window/window.html http://leandrovieira.com/projects/jquery/lightbox/ http://www.huddletogether.com/projects/lightbox/ http://developer.yahoo.com/yui/examples/container/panel.html http://reghellin.com/milkbox/ http://bertramakers.com/moolabs/imagezoom.php http://www.aryweb.nl/projects/MooDialog/