search

googlearchive / paper-dialog

A dialog à la Material Design
19 stars 13 forks source link

Follow WAI-ARIA best practices #6

Open ryanflorence opened 10 years ago

ryanflorence commented 10 years ago

http://www.w3.org/TR/wai-aria-practices/#dialog_modal http://www.w3.org/TR/wai-aria-practices/#dialog_nonmodal http://www.w3.org/TR/2011/CR-wai-aria-20110118/roles#dialog

dfreedm commented 10 years ago

The "toggle between app and dialog" behavior is a bit tricky, since the app and dialog will most likely be uncoupled from one another, and the web has rather poor focus control mechanics.

ryanflorence commented 10 years ago

yeah, it was pretty tricky but not too bad when I implemented it here:

https://github.com/instructure/ic-modal/blob/master/lib/modal.js#L7-L21 https://github.com/instructure/ic-modal/blob/master/lib/modal.js#L196-L206 https://github.com/instructure/ic-modal/blob/master/lib/modal.js#L249-L261 https://github.com/instructure/ic-modal/blob/master/lib/tabbable-selector.js

Without jQuery's pseudo selectors there you're going to have fun times.

Keeping a "global" ref to an open model feels icky, but there's really nothing else to do when the user tabs up to the browser chrome and back in.

dfreedm commented 10 years ago

Thanks for the reference ideas.

I imagine that if we build something like this into core-overlay, then perhaps future implementations could achieve this as well.

Or maybe <dialog> will come to save us all before that.

ryanflorence commented 10 years ago

maybe, depends on design abilities, its not like anybody uses prompt and we constantly battle the select tag styles :|