Confirmed users
1,396
edits
(→Roles) |
|||
(13 intermediate revisions by the same user not shown) | |||
Line 474: | Line 474: | ||
}); | }); | ||
</pre> | </pre> | ||
====Questions/concerns==== | |||
* Interactions should be extended to allow to specify a control that triggers the action. The concept is described by InidieUI: you can use mouse, touchscreen, keyboard, voice control or a control element to invoke the action. Maybe Interactions should be renamed to Triggers to share terms with IndieUI. | |||
Here's the image of InideUI action/interaction concept. | |||
<div style="height: 254px; overflow: hidden;"> | |||
http://www.w3.org/WAI/intro/iui-scroll.png | |||
</div> | |||
Alternatively we could introduce relations between actions like "triggers" and "triggeredby". | |||
* What about highlevel actions (uberactions), for example, "press" buttons means "send something somewhere". This may be covered by label. Another example, selected listitem on the left changes a view on the right, "select" actions has meaning of "change view". Or checkbox that enables/disables related controls, "check/uncheck" action means "enable/disable controls". These examples correlates to controlledby/controllerfor relations, but the relations doesn't reveal type of control. | |||
===Parent-child relations=== | ===Parent-child relations=== | ||
Line 1,049: | Line 1,064: | ||
<code> | <code> | ||
AccessibleDocument .''text'' | AccessibleDocument .''text(AccessiblePos)'' | ||
::Returns the text enclosed between this and given accessible positions. | ::Returns the text enclosed between this and given accessible positions. | ||
AccessibleDocument .''text'' | AccessibleDocument .''text(CriteriaLiteral)'' | ||
::Returns the text at the position complying the given criteria. See [[#Criteria|criteria]] for options. | ::Returns the text at the position complying the given criteria. See [[#Criteria|criteria]] for options. | ||
</code> | </code> | ||
Line 1,103: | Line 1,118: | ||
p.textAttributes.get("font-weight") == 700; // true | p.textAttributes.get("font-weight") == 700; // true | ||
</pre> | </pre> | ||
==Caret and selection== | ==Caret and selection== | ||
Line 1,492: | Line 1,506: | ||
control.relations.add("labelledby", label.a11yment); | control.relations.add("labelledby", label.a11yment); | ||
</pre> | </pre> | ||
<div id="AccessibleSource"> | <div id="AccessibleSource"> | ||
===Extend the semantic via accessible source=== | ===Extend the semantic via accessible source=== | ||
</div> | </div> | ||
Line 1,963: | Line 1,959: | ||
===Implied semantics=== | ===Implied semantics=== | ||
The author | The idea is to help the author to keep the code less verbose as possible. If role implies a number of preset attributes or states then they are present on the accessible element by default, i.e. if the author didn't list them. For example, if <code>listitem</code> role is selectable and focusable by default then the author doesn't have to point <code>selectable</code> and <code>focusable</code> states when he describes a listitem source, in other words, these code snippets are equivalent: | ||
<pre> | <pre> | ||
var | var source1 = { | ||
role: "listitem" | role: "listitem" | ||
}; | }; | ||
var source2 = { | |||
var | |||
role: "listitem", | role: "listitem", | ||
states: [ "selectable" ] | states: [ "selectable", "focusable" ] | ||
}; | }; | ||
</pre> | </pre> | ||
Implied semantics is described by [[#SemanticsProviders|taxonomies]]. | |||
===Conflicts=== | ===Conflicts=== | ||
[to be done conflicts between native semantics, ARIA and this API] | [to be done conflicts between native semantics, ARIA and this API, I tend to think that the author should be able to replace/remove native semantics if needed. This can ruin the web page but it gives the absolute control over the page content. A dangerous but quite powerful tool like atomic energy. ] | ||
===Sniffing=== | ===Sniffing=== | ||
In order to make optimization the content provider has to know whether accessibility consumer is active. The provider can add a callback for <code>deploy</code> and <code>conceal</code> event types which will be triggered when consumer appears/gets inactive. | In order to make an optimization, the content provider has to know whether an accessibility consumer (like screen reader) is active. The provider can add a callback for <code>deploy</code> and <code>conceal</code> event types which will be triggered when consumer appears/gets inactive. | ||
<pre> | <pre> | ||
Line 2,230: | Line 2,226: | ||
sequence<DOMString> states; | sequence<DOMString> states; | ||
Object attributes; | Object attributes; | ||
sequence<DOMString> relations; | |||
sequence<DOMString> actions; | sequence<DOMString> actions; | ||
}; | }; | ||
Line 2,253: | Line 2,250: | ||
RoleTaxon .''attributes'' | RoleTaxon .''attributes'' | ||
::List of attributes supported by the role. Default value of the attribute may be specified as modifier. For example, "live:polite" points out that "live" object attribute has "polite" value by default. If default value is not specified then it's taken from referred attribute taxon description. | ::List of attributes supported by the role. Default value of the attribute may be specified as modifier. For example, "live:polite" points out that "live" object attribute has "polite" value by default. If default value is not specified then it's taken from referred attribute taxon description. | ||
RoleTaxon .''relations'' | |||
::List of relations supported by the role. | |||
RoleTaxon ..''actions'' | RoleTaxon ..''actions'' | ||
Line 2,315: | Line 2,315: | ||
DOMString description; | DOMString description; | ||
sequence<DOMString> dependents; | sequence<DOMString> dependents; | ||
DOMString | DOMString exclusives; | ||
} | } | ||
</pre> | </pre> | ||
Line 2,327: | Line 2,327: | ||
::List of all dependent states. For example, "focused" state always accompanied by "focusable" state. | ::List of all dependent states. For example, "focused" state always accompanied by "focusable" state. | ||
StateTaxon ..'' | StateTaxon ..''exclusives'' | ||
:: | ::Mutually exclusive states if applicable. For example, if "vertical" state is applied then "horizontal" is not and vice versa. | ||
</code> | </code> | ||
Line 2,340: | Line 2,340: | ||
}, | }, | ||
focused: { }, | focused: { }, | ||
singleline: { | singleline: { | ||
exlcusives: [ "multiline" ] | |||
}, | }, | ||
multiline: { | multiline: { | ||
exlcusives: [ "singleline" ] | |||
}, | }, | ||
readonly: { }, | readonly: { }, | ||
editable: { }, | editable: { }, | ||
required: { } | required: { }, | ||
checked: { | |||
exlusives: [ "mixed" ] | |||
}, | |||
mixed: { | |||
exlusives: [ "checked" ] | |||
} | |||
}; | }; | ||
</pre> | </pre> | ||
====Attributes==== | ====Attributes==== | ||
Line 2,470: | Line 2,478: | ||
crescendo: [note, ...] a list a notes the crescendo is applied to | crescendo: [note, ...] a list a notes the crescendo is applied to | ||
diminuendo: [note, ...] a list a notes the diminuendo is applied to | diminuendo: [note, ...] a list a notes the diminuendo is applied to | ||
</pre> | |||
Or in terms of taxonomies: | |||
<pre> | |||
document.import("role", { | |||
sheet: { | |||
description: "sheet", | |||
attributes: [ "instrument", "tempo", "clef" ] | |||
}, | |||
note: { | |||
description: "note", | |||
attributes: [ "key", "alteration", "octave", "duration", "effects" ], | |||
relations: [ "crescendo", "diminuendo" ] | |||
} | |||
}); | |||
document.import("attributes", { | |||
instrument: { | |||
description: "instrument type" | |||
}, | |||
tempo: { | |||
description: "tempo" | |||
}, | |||
clef: { | |||
description: "clef" | |||
}, | |||
key: { | |||
description: "key", | |||
values: [ "C", "D", "E", "F", "G", "A", "H" ], | |||
}, | |||
alteration: { | |||
description: "alteration", | |||
values: [ "none", "flat", "sharp" ], | |||
default: "none" | |||
}, | |||
octave: { | |||
description: "octave", | |||
values: [ "contra", "great", "small", "1line", "2line" ], | |||
}, | |||
duration: { | |||
description: "duration" | |||
}, | |||
effects: { | |||
description: "effects" | |||
} | |||
}); | |||
document.import("relations", { | |||
crescendo: { | |||
description: "crescendo" | |||
}, | |||
diminuendo: { | |||
description: "diminuendo" | |||
} | |||
}); | |||
</pre> | </pre> |