Account confirmers, Anti-spam team, canmove, Confirmed users, Bureaucrats and Sysops emeriti
4,083
edits
SeaMonkey:Toolkit Transition:PrefwindowPanes:HowTo: Difference between revisions
SeaMonkey:Toolkit Transition:PrefwindowPanes:HowTo (view source)
Revision as of 11:06, 1 October 2008
, 1 October 2008no edit summary
(Adding accessibility markup improvement suggestions.) |
No edit summary |
||
| (2 intermediate revisions by 2 users not shown) | |||
| Line 19: | Line 19: | ||
====Tree items==== | ====Tree items==== | ||
Edit [http://mxr.mozilla.org/seamonkey/source/suite/common/pref/preferences.xul /suite/common/pref/preferences.xul] (or the respective overlay, if | Edit [http://mxr.mozilla.org/seamonkey/source/suite/common/pref/preferences.xul /suite/common/pref/preferences.xul] (or the respective overlay, if e.g. you're migrating a MailNews panel) and set the following attributes on the respective <treeitem>: | ||
<treeitem container="true" | <treeitem container="true" | ||
| Line 111: | Line 111: | ||
These 'paneload' events are processed in the following order: | These 'paneload' events are processed in the following order: | ||
* SeaMonkey's derived <prefpane> 'paneload' handler is called, loading the scripts specified in the <prefpane>'s 'script' attribute. If defined, the <prefpane>'s Startup() function is called, so that <preference> elements can be created dynamically.<br><i style="color:red">Mind that UI elements tied to <preference>s are '''not''' yet initialized to their <preference> value here!</i> | * SeaMonkey's derived <prefpane> 'paneload' handler is called, loading the scripts specified in the <prefpane>'s 'script' attribute. If defined, the <prefpane>'s Startup() function is called, so that <preference> elements can be created dynamically.<br><i style="color:red">Mind that UI elements tied to <preference>s are '''not''' yet initialized to their <preference> value here!</i> Instead, simply read the value directly from the <preference> element. | ||
* Toolkit's <prefpane> 'paneload' handler is called and initializes the <preference> based UI elements. Any 'onsyncfrompreference' handlers attributes on such UI elements are evaluated. (See [https://bugzilla.mozilla.org/show_bug.cgi?id=308754 bug 308754] for problems with these handlers.) | * Toolkit's <prefpane> 'paneload' handler is called and initializes the <preference> based UI elements. Any 'onsyncfrompreference' handlers attributes on such UI elements are evaluated. (See [https://bugzilla.mozilla.org/show_bug.cgi?id=308754 bug 308754] for problems with these handlers.) | ||
* SeaMonkey's <prefwindow> 'paneload' handler is called, synchronizing <tree> and <prefpane>. | * SeaMonkey's <prefwindow> 'paneload' handler is called, synchronizing <tree> and <prefpane>. | ||
* Finally, any <prefpane> 'onpaneload' handler attribute is evaluated. | * Finally, any <prefpane> 'onpaneload' handler attribute is evaluated. | ||
====Reacting dynamically to user input and preference changes==== | |||
Under the v5 prefwindow it was very common for changes in one preference to affect the ability to use another preference. Since the preferences were a snapshot taken when the pane first loaded, the only synchronisation necessary was when the user interacted with the controlling preference. | |||
However unlike the v5 preferences, the v6 preferences support instant apply of preferences. This means that the preference elements need to keep themselves up-to-date with external preference changes so that the user can be sure they are seeing the current value of the preference. Synchronisation must therefore be done whenever the preference changes, whether or not this is due to a direct user interaction. | |||
Fortunately this is usually simply achieved by moving the oncommand or similar handler to an onchange handler on the <preference> element itself. | |||
== Accessibility markup enhancements == | == Accessibility markup enhancements == | ||
| Line 158: | Line 165: | ||
The accessible name for the textbox will become the first label, followed by the value currently inside the textbox, followed by the trailing label, giving the control a much more meaningful name. Keeping the "control" attribute on the label ensures that, if it is clicked, the textbox gets focus. "aria-labelledby" will, if present, override the label/textbox association for the accessible name. | The accessible name for the textbox will become the first label, followed by the value currently inside the textbox, followed by the trailing label, giving the control a much more meaningful name. Keeping the "control" attribute on the label ensures that, if it is clicked, the textbox gets focus. "aria-labelledby" will, if present, override the label/textbox association for the accessible name. | ||
Quoting [https://bugzilla.mozilla.org/show_bug.cgi?id=429143#c17 bug 429143 comment 17]: | |||
MarcoZ> IanN: Well, you can accomplish the wanted without ARIA, so use | |||
conventionals. ARIA should be used as a last resort, or with funny constructs | |||
where the label of a checkbox is the label for an adjacent textbox at the same | |||
time. So, use the label first, then the textbox, then the description, and | |||
point both control attributes to the textbox. | |||
=== Checking access keys === | === Checking access keys === | ||
| Line 163: | Line 178: | ||
* The access key should obviously be part of the control's caption/label. | * The access key should obviously be part of the control's caption/label. | ||
* Access keys in multipage dialogs such as the new pref window do not need to be unique across the whole dialog, they just need to be unique on a single pane. So while you should avoid having the letter "g" associated with two controls on the same pane, having the letter "g" on two different panes is no problem. | * Access keys in multipage dialogs such as the new pref window do not need to be unique across the whole dialog, they just need to be unique on a single pane. So while you should avoid having the letter "g" associated with two controls on the same pane, having the letter "g" on two different panes is no problem. | ||
[[category:SeaMonkey|t]] | |||