--- a/src/indie-ui-events.html Wed Mar 26 22:19:18 2014 -0700
+++ b/src/indie-ui-events.html Tue Apr 01 22:38:58 2014 -0700
@@ -105,7 +105,7 @@
<section id="intro-background">
<h3>Background</h3>
<p>Scripting usable interfaces can be difficult, especially when one considers that user interface design patterns differ across software platforms, hardware, and locales, and that those interactions can be further customized based on personal preference. Individuals are accustomed to the way the interface works on their own system, and their preferred interface frequently differs from that of the web application author's preferred interface.</p>
- <p>For example, web application authors, wishing to intercept a user's intent to 'zoom in' on a custom image viewer or map view, need to "listen" for all of the following events:</p>
+ <p>For example, web application authors, wishing to intercept a user's intent to "zoom in" on a custom image viewer or map view, need to "listen" for all of the following events:</p>
<ul>
<li><kbd>Control+PLUS</kbd> on Windows and Linux.</li>
<li><kbd>Command+PLUS</kbd> on Mac OS X.</li>
@@ -114,7 +114,7 @@
<li>Additional gestures or speech commands on implementations that may not currently be detectable.</li>
</ul>
<p>In addition to the general user interface challenges, custom interfaces often don't take into account users who access web content via assistive technologies that use alternate forms of input such as screen readers, switch interfaces, or speech-based command and control interfaces.</p>
- <p>For example, a web page author may script a custom interface to look like a slider (e.g. one styled to look like an <abbr title="Hypertext Markup Language">HTML</abbr> 'range' input) and behave like a slider when using standard mouse-based input, but there is no standard way for the value of the slider to be controlled programmatically, so the control may not be usable without a mouse or other pointer-based input.</p>
+ <p>For example, a web page author may script a custom interface to look like a slider (e.g. one styled to look like an <abbr title="Hypertext Markup Language">HTML</abbr> "range" input) and behave like a slider when using standard mouse-based input, but there is no standard way for the value of the slider to be controlled programmatically, so the control may not be usable without a mouse or other pointer-based input.</p>
<p>It would be simpler to listen for a normalized request to "zoom in" on the current view, whereby the web application could determine the new scale factor and update its custom view accordingly. Whether through continuous physical events like a scroll wheel or discrete physical events like the keyboard shortcuts, a user could indicate his intent to "zoom in" and the web application author would only need to listen for a single type of event: <code>zoomrequest</code>.</p>
<p>IndieUI Events defines a way for web authors to register for these <em>request events</em> on a leaf node element or on a ancestor element acting as an event delegate. Authors also declaritively define which actions or behaviors a view responds to, and when it is appropriate for browsers to initiate these events.</p>
</section>
@@ -133,7 +133,7 @@
<h3>Document Scope</h3>
<p>Decisions regarding which specific physical user interactions (keyboard combinations, gestures, speech, etc.) trigger IndieUI events are explicitly listed as out-of-scope in the Working Group charter. User interface interaction patterns should be designed and defined by each operating system, rather than defined as part of any technical specification.</p>
<p>However, this document lists informative examples of certain keyboard and mouse events that <em>may</em> trigger each IndieUI event. They are listed here purely to aid in clarifying the reader's conceptual understanding of each event, as well as illustrating certain UI differences between platforms. These informative examples are primarily limited to keyboard and mouse events, because those physical modalities have been common in software interaction for decades, and their use is familiar to most readers.</p>
- <p>For example, it may be common for the <kbd>ESC</kbd> key to trigger a 'dismissrequest' event to close a dialog on most systems, but the specification does not require the user agent to use any particular physical event. It is an implementation detail, and left for the developers of each platform or assistive technology to determine whether <kbd>ESC</kbd> or some other interaction is the most appropriate way to trigger the 'dismissrequest' event. As long as there is a documented way for end users to initiate each event, the user agent will be considered a conforming implementation.</p>
+ <p>For example, it may be common for the <kbd>ESC</kbd> key to trigger a "dismissrequest" event to close a dialog on most systems, but the specification does not require the user agent to use any particular physical event. It is an implementation detail, and left for the developers of each platform or assistive technology to determine whether <kbd>ESC</kbd> or some other interaction is the most appropriate way to trigger the "dismissrequest" event. As long as there is a documented way for end users to initiate each event, the user agent will be considered a conforming implementation.</p>
</section>
<section id="intro-usage">
@@ -141,7 +141,7 @@
<section id="intro-example-dismissrequest">
<h4>Dismissing a Modal Dialog</h4>
- <p>The following example uses a 'dismissrequest' event to close or cancel out of a modal application dialog.</p>
+ <p>The following example uses a "dismissrequest" event to close or cancel out of a modal application dialog.</p>
<pre class="example highlight">
<!-- Declare which IndieUI event(s) this element receives. -->
<dialog <strong>uiactions="dismiss"</strong> id="myDialog">
@@ -150,22 +150,22 @@
<script type="text/javascript">
- var myDialog = document.getElementById('myDialog');
+ var myDialog = document.getElementById("myDialog");
- // register the event at initialization
- // <strong>Option #1:</strong> On the receiver itself... (See next example for Option #2)
- <strong>myDialog.addEventListener('dismissrequest', dismissHandler);</strong>
+ // Register the event at initialization.
+ // <strong>Option #1:</strong> On the receiver itself... See next example for Option #2.
+ <strong>myDialog.addEventListener("dismissrequest", dismissHandler);</strong>
- // at some point during runtime, the handler will be called
- // (e.g. if, for example, the user presses ESC key while focus is inside the dialog)
+ // At some point during runtime, the handler will be called.
+ // For example, if the user presses ESC key while focus is inside the dialog.
function dismissHandler(e) {
- // cancel and close the dialog (don't forget to move focus before closing)
+ // Cancel and close the dialog. Don't forget to move focus before closing.
closeDialog(<strong>e.receiver</strong>); // Event.receiver is a readonly property like Event.target
- // then cancel the event
- e.stopPropagation(); // stop the event from bubbling.
- <strong>e.preventDefault();</strong> // let the UA/AT know the event was intercepted successfully.
+ // Then cancel the event.
+ e.stopPropagation(); // Stop the event from bubbling.
+ <strong>e.preventDefault();</strong> // Let the UA/AT know the event was intercepted successfully.
}
</script>
@@ -174,7 +174,7 @@
<section id="intro-example-valuechangerequest">
<h4>Changing the Value of a Custom Slider</h4>
- <p>The following example uses a 'valuechangerequest' event to modify the value of a custom ARIA slider.</p>
+ <p>The following example uses a "valuechangerequest" event to modify the value of a custom ARIA slider.</p>
<p class="ednote">This example was cut. It needs to be rewritten once we add support for composite widgets with triggers or controllers (so the slider thumb can update the value via pointer-based events). See <a href="https://www.w3.org/WAI/IndieUI/track/actions/79">IndieUI-action-79</a>.</p>
<pre class="example highlight" hidden>
<!-- Declare which IndieUI event(s) this element receives. -->
@@ -182,25 +182,25 @@
<script type="text/javascript">
- // register the event at initialization
+ // Register the event at initialization.
// <strong>Option #2:</strong> Using event delegation on any node (such as the body) that is higher in the DOM than the receiver element...
- <strong>document.body.addEventListener('valuechangerequest', valueChangeHandler);</strong>
+ <strong>document.body.addEventListener("valuechangerequest", valueChangeHandler);</strong>
- // at some point during runtime, the handler will be called
+ // At some point during runtime, the handler will be called.
function valueChangeHandler(e) {
- // Find the event receiver element
+ // Find the event receiver element.
var slider = e.receiver;
- // grab context info from the Event object
+ // Grab context info from the Event object.
var changeType = <strong>e.changeType</strong>;
- // update the model and display
+ // Update the model and display.
myApp.requestValueChangeForElement(changeType, slider);
- // cancel the event
- e.stopPropagation(); // stop the event from bubbling
- <strong>e.preventDefault();</strong> // let the UA/AT know the event was intercepted successfully
+ // Cancel the event.
+ e.stopPropagation(); // Stop the event from bubbling.
+ <strong>e.preventDefault();</strong> // Let the UA/AT know the event was intercepted successfully.
}
</script>
@@ -212,7 +212,7 @@
<section id="intro-backwards-compatibility" class="informative">
<h3>Backwards-Compatibility</h3>
<p>One of the core principles behind <abbr title="User Interface">UI</abbr> Change Request Events is that they operate on a backwards-compatible, opt-in basis. In other words, the web application author has to first be aware of these events, then explicitly declare each event receiver and register an event listener, or user agents behave as normal and do not initiate these events.</p>
- <p>Change request events do not cause any direct manipulation or mutation of the <abbr title="Document Object Model">DOM</abbr>, and do not have any 'default action' in the context of a web view. Instead, the event conveys the user's intent to the web application, and allows the web application to perform the appropriate action on behalf of the user, including making potential changes to the DOM. If a web application is authored to understand the change request event, it can cancel the event, which informs the user agent that the event has been captured and understood. If a web application does not cancel the event, the user agent may attempt fallback behavior or communicate to the user that the input has not been recognized.</p>
+ <p>Change request events do not cause any direct manipulation or mutation of the <abbr title="Document Object Model">DOM</abbr>, and do not have any "default action" in the context of a web view. Instead, the event conveys the user's intent to the web application, and allows the web application to perform the appropriate action on behalf of the user, including making potential changes to the DOM. If a web application is authored to understand the change request event, it can cancel the event, which informs the user agent that the event has been captured and understood. If a web application does not cancel the event, the user agent may attempt fallback behavior or communicate to the user that the input has not been recognized.</p>
</section>
</section>
<!-- :::::::::::::::::::: END INTRO :::::::::::::::::::: -->
@@ -227,7 +227,7 @@
<p>The <code>uiactions</code> attribute of each instance of the Element interface MUST return a DOMTokenList <a href="#def_reflected_attribute">reflecting</a> the <a href="#uiactions-content-attribute"><code>uiactions</code> content attribute</a>.</p>
<dl title="partial interface Element" class="idl">
<dt>readonly attribute DOMTokenList uiactions</dt>
- <dd>A DOM element attribute whose DOMTokenList value <a href="#def_reflected_attribute">reflects</a> the value of the <a href="#uiactions-content-attribute"><code>uiactions</code> content attribute</a>. <p class="ednote">This attribute is readonly b/c DOMTokenList values are modified by methods (e.g. el.uiactions.add("pan");) rather than by string assignment (e.g. NOT el.uiactions = "pan";). Need to make sure this is clear for authors.</p></dd>
+ <dd>A DOM element attribute whose DOMTokenList value <a href="#def_reflected_attribute">reflects</a> the value of the <a href="#uiactions-content-attribute"><code>uiactions</code> content attribute</a>. <p class="ednote">This attribute is readonly b/c DOMTokenList values are modified by methods (e.g. <code>el.uiactions.add("pan");</code>) rather than by string assignment (e.g. NOT <code>el.uiactions = "pan";</code>). Need to make sure this is clear for authors.</p></dd>
</dl>
</section>
@@ -236,29 +236,29 @@
<p>Every element may have a <code>uiactions</code> attribute specified, which is necessary to define the <a href="#def_request_event_receiver">receiver</a> of each type of request event. The attribute, if specified, must have a value that is a set of whitespace-separated tokens representing the various actions to which the web application responds on behalf of this element. The actions that an element has assigned to it consists of all the tokens returned when the value of the <code>uiactions</code> attribute is split on whitespace. (Duplicates are ignored.)</p>
<p>User agents MUST <a href="#def_reflected_attribute">reflect</a> the <code>uiactions</code> content attribute in the <a href="#uiactions-attribute"><code>uiactions</code> IDL attribute</a>.</p>
<div data-transform="listActions"><!-- dynamically generates event list --></div>
- <!-- <p class="ednote">We could probably combine the 'manipulation' events into a single 'manipulation' action value. I don't foresee a case where an author would want to receive some, but not all of them, and even if that case exists, the author could just not listen for those specific events.</p> -->
+ <!-- <p class="ednote">We could probably combine the "manipulation" events into a single "manipulation" action value. I don't foresee a case where an author would want to receive some, but not all of them, and even if that case exists, the author could just not listen for those specific events.</p> -->
<pre class="example highlight">
- <!-- body element is event listener for all events, but event receiver only for 'delete' actions. -->
+ <!-- Body element is event listener for all events, but event receiver only for "delete" actions. -->
<body <strong>uiactions="delete"</strong>>
- <!-- Element container for custom 'mapview' is the event receiver for 'pan' and 'zoom' actions. -->
+ <!-- Element container for custom "mapview" is the event receiver for "pan" and "zoom" actions. -->
<div id="mapview" <strong>uiactions="pan zoom"</strong>> ... </div>
- <!-- This Dialog is the event receiver for 'dismiss' actions initiated on any lower-level event target. -->
+ <!-- This Dialog is the event receiver for "dismiss" actions initiated on any lower-level event target. -->
<dialog <strong>uiactions="dismiss"</strong>> ... </dialog>
</body>
<script type="text/javascript">
- // registered all of these on the body as an example of event delegation to help illustrate the difference between event
- // target (document.activeElement or other point-of-regard), receiver (element with defined actions), and listener (body)
- document.body.addEventListener(<strong>'dismissrequest'</strong>, handleDismiss);
- document.body.addEventListener(<strong>'panrequest'</strong>, handlePan);
- document.body.addEventListener(<strong>'deleterequest'</strong>, handleDelete);
- document.body.addEventListener(<strong>'zoomrequest'</strong>, handleZoom);
+ // Registered all of these on the body as an example of event delegation to help illustrate the difference between event...
+ // ...target (document.activeElement or other point-of-regard), receiver (element with defined actions), and listener (body).
+ document.body.addEventListener(<strong>"dismissrequest"</strong>, handleDismiss);
+ document.body.addEventListener(<strong>"panrequest"</strong>, handlePan);
+ document.body.addEventListener(<strong>"deleterequest"</strong>, handleDelete);
+ document.body.addEventListener(<strong>"zoomrequest"</strong>, handleZoom);
</script>
</pre>
- <p class="note">In the previous example, the 'deleterequest' event may be fired any time the user's point-of-regard was inside the document, presumably when the user triggered their platform's physical event to initiate a deletion, such as pressing the <kbd>DELETE</kbd> key. However, the 'dismissrequest' would only be fired when the user's point-of-regard was inside the dialog. Likewise, the 'panrequest' and 'zoomrequest' would only be fired when the user's <a href="#def_point_of_regard">point-of-regard</a> was inside the map view.</p>
+ <p class="note">In the previous example, the "deleterequest" event may be fired any time the user's point-of-regard was inside the document, presumably when the user triggered their platform's physical event to initiate a deletion, such as pressing the <kbd>DELETE</kbd> key. However, the "dismissrequest" would only be fired when the user's point-of-regard was inside the dialog. Likewise, the "panrequest" and "zoomrequest" would only be fired when the user's <a href="#def_point_of_regard">point-of-regard</a> was inside the map view.</p>
</section>
</section>
@@ -268,9 +268,9 @@
<section id="RequestEvents" class="normative">
<h2><abbr title="User Interface">UI</abbr> Request Events</h2>
- <p class="ednote">There is purposefully no request event for activating the default action. Authors are encouraged to use a standard <code>click</code> event for default actions.</p>
+ <p class="ednote">There is purposefully no request event for activating the default action. Authors are encouraged to use a standard <code>click</code> event for default actions. Update: Eitan (Mozilla) requested <a href="https://www.w3.org/WAI/IndieUI/track/actions/53">ACTION-53</a>: activate request event to augment default action trigger when click handlers are inappropriate.</p>
<p class="ednote">Event fires on point-of-regard (<code>document.activeElement</code>, clicked element, or AT equivalent) if applicable, or otherwise <code>document.body</code>.</p>
- <p class="ednote">Event order: These events should be asynchronous, but when used in conjunction with keyboard events, we need to define where each IndieUI event fires in the chain of <code>keydown</code>, <code>keyup</code>, and <code>keypress</code>. Probably also need an identifier to associate each event with other related physical events: e.g. this <code>dismissrequest</code> event is associated with the keyboard events <code>keydown</code>, <code>keyup</code>, and <code>keypress</code> of the <kbd>ESC</kbd> key.</p>
+ <p class="ednote">Event order: These events should be asynchronous, but when used in conjunction with keyboard events, we need to define where each IndieUI event fires in the chain of <code>keydown</code>, <code>keyup</code>, and <code>keypress</code>. Probably also need an identifier to associate each event with other related physical events: e.g. This <code>dismissrequest</code> event is associated with the keyboard events <code>keydown</code>, <code>keyup</code>, and <code>keypress</code> of the <kbd>ESC</kbd> key.</p>
<!-- :::::::::::::::::::: UIRequestEvent :::::::::::::::::::: -->
<section id="UIRequestEvent" class="normative">
@@ -286,8 +286,8 @@
<h2>Determining the Event Receiver</h2>
<p>The event receiver is determined using the following steps:</p>
<ol>
- <li>For each event name literal (e.g. <code>"dismissrequest"</code>), determine the corresponding uiactions token (e.g. <code>"dismiss"</code>).</li>
- <li>Starting with the event's target element, determine if the element's actions list contains the corresponding action for the event (e.g. <code>el.uiactions.contains("dismiss")</code>). If the current element's action list contains the corresponding uiactions token, the event target is also the event receiver.</li>
+ <li>For each event name literal (<code>"dismissrequest"</code>), determine the corresponding uiactions token (<code>"dismiss"</code>).</li>
+ <li>Starting with the event's target element, determine if the element's actions list contains the corresponding action for the event (<code>el.uiactions.contains("dismiss")</code>). If the current element's action list contains the corresponding uiactions token, the event target is also the event receiver.</li>
<li>If the current element's action list does not contain the corresponding uiactions token, move up to the parent element and try again. Continue until reaching the root element. The closest ancestor to match the corresponding action token is the event receiver.</li>
<li>If the event receiver is still undetermined upon reaching the root element, stop. There is no valid event receiver and the user agent MUST NOT initiate the event.</li>
</ol>
@@ -299,7 +299,7 @@
partial interface UIEvent {
readonly attribute EventID id; // UID of current event
readonly attribute EventList relatedEvents; // List of related events, with ID and potentially type of each event.
- // e.g. This 'dismissrequest' event is associated with the previous 'keydown' and 'keyup' events.
+ // This "dismissrequest" event is associated with the previous "keydown" and "keyup" events.
}</pre>
</div>
@@ -308,15 +308,15 @@
<dl title="dictionary UIRequestEventInit : UIEventInit" class="idl">
- <!-- Attributes from EventInit -->
+ <!-- Attributes from EventInit. -->
<dt>boolean bubbles = true</dt><dd></dd>
<dt>boolean cancelable = true</dt><dd></dd>
- <!-- Attributes from UIEventInit -->
+ <!-- Attributes from UIEventInit. -->
<dt>WindowProxy? view = null</dt><dd></dd>
<dt>long detail = 0</dt><dd></dd>
- <!-- Attribute from UIRequestEventInit -->
+ <!-- Attribute from UIRequestEventInit. -->
<dt>EventTarget receiver = null</dt><dd></dd>
</dl>
@@ -328,26 +328,26 @@
<dl>
<dt id="undorequest">Undo Request (<code class="event">undorequest</code>)</dt>
<dd>
- <p>Indicates the user desires to 'undo' the previous action.</p>
+ <p>Indicates the user desires to "undo" the previous action.</p>
<p class="ednote">May be superseded by the <a href="https://dvcs.w3.org/hg/undomanager/raw-file/tip/undomanager.html">UndoManager</a> interface.</p>
<ul>
<li>Bubbles: Yes</li>
<li>Cancelable: Yes</li>
</ul>
<div class="ex" title="Informative Example">
- <p>Users, wanting to 'undo' a discrete action in a web application, can indicate their intent a number of ways, including pressing <kbd>Control+Z</kbd> on Windows or Linux, <kbd>Command+Z</kbd> on Mac OS X, and even by shaking some accelerometer- or gyroscope-enabled mobile devices.</p>
+ <p>Users, wanting to "undo" a discrete action in a web application, can indicate their intent a number of ways, including pressing <kbd>Control+Z</kbd> on Windows or Linux, <kbd>Command+Z</kbd> on Mac OS X, and even by shaking some accelerometer- or gyroscope-enabled mobile devices.</p>
</div>
</dd>
<dt id="redorequest">Redo Request (<code class="event">redorequest</code>)</dt>
<dd>
- <p>Indicates the user desires to 'redo' the previously 'undone' action.</p>
+ <p>Indicates the user desires to "redo" the previously "undone" action.</p>
<p class="ednote">May be superseded by the <a href="https://dvcs.w3.org/hg/undomanager/raw-file/tip/undomanager.html">UndoManager</a> interface.</p>
<ul>
<li>Bubbles: Yes</li>
<li>Cancelable: Yes</li>
</ul>
<div class="ex" title="Informative Example">
- <p>Users, wanting to 'redo' a discrete action in a web application, can indicate their intent a number of ways, including pressing <kbd>Control+Shift+Z</kbd> on Windows or Linux, <kbd>Command+Shift+Z</kbd> on Mac OS X.</p>
+ <p>Users, wanting to "redo" a discrete action in a web application, can indicate their intent a number of ways, including pressing <kbd>Control+Shift+Z</kbd> on Windows or Linux, <kbd>Command+Shift+Z</kbd> on Mac OS X.</p>
</div>
</dd>
<dt id="expandrequest">Expand Request (<code class="event">expandrequest</code>)</dt>
@@ -368,18 +368,18 @@
</dd>
<dt id="dismissrequest">Dismiss Request (<code class="event">dismissrequest</code>)</dt>
<dd>
- <p>Indicates the user desires 'dismiss' the current view (e.g. canceling a dialog, or closing a popup menu).</p>
+ <p>Indicates the user desires "dismiss" the current view (e.g. canceling a dialog, or closing a popup menu).</p>
<ul>
<li>Bubbles: Yes</li>
<li>Cancelable: Yes</li>
</ul>
<div class="ex" title="Informative Example">
- <p>Users, wanting to 'escape from' or 'dismiss' a web application state (for example, closing a modal dialog), can indicate their intent a number of ways, most commonly by pressing <kbd>Escape</kbd> on keyboard-controlled operating systems. Web authors who have registered for this event should process the event to determine whether to cancel the event. If the 'dismiss' action is understood in the context of the web application, web authors should perform the appropriate action (such as closing the dialog), and cancel the event using the event object's <code>preventDefault()</code> method.</p>
+ <p>Users, wanting to "escape from" or "dismiss" a web application state (for example, closing a modal dialog), can indicate their intent a number of ways, most commonly by pressing <kbd>Escape</kbd> on keyboard-controlled operating systems. Web authors who have registered for this event should process the event to determine whether to cancel the event. If the "dismiss" action is understood in the context of the web application, web authors should perform the appropriate action (such as closing the dialog), and cancel the event using the event object's <code>preventDefault()</code> method.</p>
</div>
</dd>
<dt id="deleterequest">Delete Request (<code class="event">deleterequest</code>)</dt>
<dd>
- <p>Indicates the user wants to initiate a 'delete' action on the <a href="#def_marked_element">marked element</a> or current view.</p>
+ <p>Indicates the user wants to initiate a "delete" action on the <a href="#def_marked_element">marked element</a> or current view.</p>
<ul>
<li>Bubbles: Yes</li>
<li>Cancelable: Yes</li>
@@ -424,18 +424,18 @@
<h4>UIFocusRequestEventInit</h4>
<dl title="dictionary UIFocusRequestEventInit : UIRequestEventInit" class="idl">
- <!-- Attributes from EventInit -->
+ <!-- Attributes from EventInit. -->
<dt>boolean bubbles = true</dt><dd></dd>
<dt>boolean cancelable = true</dt><dd></dd>
- <!-- Attributes from UIEventInit -->
+ <!-- Attributes from UIEventInit. -->
<dt>WindowProxy? view = null</dt><dd></dd>
<dt>long detail = 0</dt><dd></dd>
- <!-- Attribute from UIRequestEventInit -->
+ <!-- Attribute from UIRequestEventInit. -->
<dt>EventTarget receiver = null</dt><dd></dd>
- <!-- Attributes from UIFocusRequestEventInit -->
+ <!-- Attributes from UIFocusRequestEventInit. -->
<dt>FocusRequestFocusType focusType = "NONE"</dt><dd>Type of linear or directional focus requested, as defined in the FocusRequestFocusType enumeration definition. Value remains "NONE" except when used for directionalfocusrequest or linearfocusrequest.</dd>
</dl>
@@ -443,7 +443,7 @@
<section id="UIFocusRequestEvents">
<h4>UIFocusRequestEvent Types</h4>
- <p class="ednote">Todo: explain these can cover focus changes when the element to focus is not yet loaded in the DOM or yet focusable (for example, in list or table views where the entire dataset is not displayed), or non-linear focus shortcuts or overrides when linear focus is not possible (for example, jumping directly from a contenteditable region to the editing toolbar, when Tab and Shift+Tab mean other things).</p>
+ <p class="ednote">FIXME: explain these can cover focus changes when the element to focus is not yet loaded in the DOM or yet focusable (for example, in list or table views where the entire dataset is not displayed), or non-linear focus shortcuts or overrides when linear focus is not possible (for example, jumping directly from a contenteditable region to the editing toolbar, when Tab and Shift+Tab mean other things).</p>
<p>The types of UIFocusRequestEvents that can occur are:</p>
<dl>
@@ -510,20 +510,20 @@
<h4>UIManipulationRequestEventInit</h4>
<dl title="dictionary UIManipulationRequestEventInit : UIRequestEventInit" class="idl">
- <!-- todo: Incorporate receiver into initializer -->
+ <!-- FIXME: Incorporate receiver into initializer. -->
- <!-- Attributes from EventInit -->
+ <!-- Attributes from EventInit. -->
<dt>boolean bubbles = true</dt><dd></dd>
<dt>boolean cancelable = true</dt><dd></dd>
- <!-- Attributes from UIEventInit -->
+ <!-- Attributes from UIEventInit. -->
<dt>WindowProxy? view = null</dt><dd></dd>
<dt>long detail = 0</dt><dd></dd>
- <!-- Attribute from UIRequestEventInit -->
+ <!-- Attribute from UIRequestEventInit. -->
<dt>EventTarget receiver = null</dt><dd></dd>
- <!-- Attributes from UIManipulationRequestEventInit -->
+ <!-- Attributes from UIManipulationRequestEventInit. -->
<dt>double? originX = null</dt>
<dd>The cartesian X coordinate origin point (if one exists), measured in CSS pixels from the inside(?) left edge of element border box for the <a href="#def_request_event_receiver">receiver element</a>.</dd>
@@ -596,7 +596,7 @@
</dl>
</section>
- <p class="ednote">There may be a need for a combined, continuous manipulation events (e.g. Pan+Zoom simultaneously) in addition to the discrete events listed above, but the following specification ideas are incomplete. For example, we're currently missing a feature to associate related events, and a description of what 'canceling' implies.</p>
+ <p class="ednote">There may be a need for a combined, continuous manipulation events (e.g. Pan+Zoom simultaneously) in addition to the discrete events listed above, but the following specification ideas are incomplete. For example, we're currently missing a feature to associate related events, and a description of what "canceling" implies.</p>
<section id="ContinuousUIManipulationRequestEvents">
<h4>Continuous UIManipulationRequestEvent Types</h4>
@@ -679,18 +679,18 @@
<h4>UIScrollRequestEventInit</h4>
<dl title="dictionary UIScrollRequestEventInit : UIRequestEventInit" class="idl">
- <!-- Attributes from EventInit -->
+ <!-- Attributes from EventInit. -->
<dt>boolean bubbles = true</dt><dd></dd>
<dt>boolean cancelable = true</dt><dd></dd>
- <!-- Attributes from UIEventInit -->
+ <!-- Attributes from UIEventInit. -->
<dt>WindowProxy? view = null</dt><dd></dd>
<dt>long detail = 0</dt><dd></dd>
- <!-- Attribute from UIRequestEventInit -->
+ <!-- Attribute from UIRequestEventInit. -->
<dt>EventTarget receiver = null</dt><dd></dd>
- <!-- Attributes from UIScrollRequestEventInit -->
+ <!-- Attributes from UIScrollRequestEventInit. -->
<dt>double? originX = 0.0</dt>
<dd>The cartesian X coordinate origin point (if one exists), measured in CSS pixels from the inside(?) left edge of element border box for the <a href="#def_request_event_receiver">receiver element</a>.</dd>
<dt>double? originY = 0.0</dt>
@@ -794,18 +794,18 @@
<h4>UIValueChangeRequestEventInit</h4>
<dl title="dictionary UIValueChangeRequestEventInit : UIRequestEventInit" class="idl">
- <!-- Attributes from EventInit -->
+ <!-- Attributes from EventInit. -->
<dt>boolean bubbles = true</dt><dd></dd>
<dt>boolean cancelable = true</dt><dd></dd>
- <!-- Attributes from UIEventInit -->
+ <!-- Attributes from UIEventInit. -->
<dt>WindowProxy? view = null</dt><dd></dd>
<dt>long detail = 0</dt><dd></dd>
- <!-- Attribute from UIRequestEventInit -->
+ <!-- Attribute from UIRequestEventInit. -->
<dt>EventTarget receiver = null</dt><dd></dd>
- <!-- Attributes from UIValueChangeRequestEventInit -->
+ <!-- Attributes from UIValueChangeRequestEventInit. -->
<dt>ValueChangeRequestChangeType changeType = "UNKNOWN"</dt><dd></dd>
</dl>
@@ -842,14 +842,14 @@
<p>Authors wishing to conditionally assign request event handlers based on whether the user agent supports these events can use standard objection detection for each event handler or property.</p>
<section id="feature-detection-example-dismissrequest">
<h4>Conditionally Assigning a UI Request Event</h4>
- <p>The following example conditionally assigns a 'dismissrequest' event based on whether the user agent has support for the feature.</p>
+ <p>The following example conditionally assigns a "dismissrequest" event based on whether the user agent has support for the feature.</p>
<pre class="example highlight">
- if (typeof document.body.ondismissrequest !== 'undefined') {
- // okay to use 'dismissrequest'
- document.body.addEventListener('dismissrequest', dismissHandler);
+ if (typeof document.body.ondismissrequest !== "undefined") {
+ // Okay to use "dismissrequest" event.
+ document.body.addEventListener("dismissrequest", dismissHandler);
} else {
- // otherwise catch the ESC key or another platform-specific equivalent event
- document.body.addEventListener('keyup', keyHandler);
+ // Otherwise catch the ESC key or another platform-specific equivalent event.
+ document.body.addEventListener("keyup", keyHandler);
}
</pre>
</section>
@@ -859,18 +859,18 @@
<!--
ReSpec: Use @data-transform to reuse a JavaScript content formatter, and @data-oninclude to transform external content before inclusion.
- <script type="text/javascript">function xmp(r, content) { return content.replace(/</g,'<').replace(/>/g,'>'); } </script>
- <pre data-transform='xmp'>This markup is <b>escaped</b> like an <code>xmp</code>.</pre>
+ <script type="text/javascript">function xmp(r, content) { return content.replace(/</g, "<").replace(/>/g, ">"); } </script>
+ <pre data-transform="xmp">This markup is <b>escaped</b> like an <code>xmp</code>.</pre>
-->
<section id="eventslist" class="appendix">
<h2>Events List (alphabetical)</h2>
- <div data-transform="listEvents"><!-- dynamically generates event list --></div>
+ <div data-transform="listEvents"><!-- Dynamically generates event list. --></div>
</section>
<section id="changelog" class="appendix">
<h2>Substantive, normative changes since the <a href="http://www.w3.org/TR/2013/WD-indie-ui-events-20130730/#changelog">last public working draft</a></h2>
<ul>
<li>18-Aug-2013: Enum constants formerly defined in <a href="#UIScrollRequestEvent">UIScrollRequestEvent</a>, <a href="#UIValueChangeRequestEvent">UIValueChangeRequestEvent</a>, and <a href="#UIFocusRequestEvent">UIFocusRequestEvent</a> have been changed to WebIDL enumeration identifier strings. (<a href="https://www.w3.org/WAI/IndieUI/track/actions/64">ACTION-64</a>)</li>
- <li>18-Aug-2013: Event initializer dictionaries (e.g. <a href="#UIRequestEventInit">UIRequestEventInit</a>, <a href="#UIFocusRequestEventInit">UIFocusRequestEventInit</a>) were missing inheritance declarations in the IDL.</li>
+ <li>18-Aug-2013: Event initializer dictionaries (<a href="#UIRequestEventInit">UIRequestEventInit</a>, <a href="#UIFocusRequestEventInit">UIFocusRequestEventInit</a>) were missing inheritance declarations in the IDL.</li>
<li>22-Aug-2013: <a href="#feature-detection">Feature detection section</a> recommends direct object detection now rather than using DOMImplementation.hasFeature().</li>
<li>5-Mar-2014: Added continuous events for <a href="#ContinuousUIManipulationRequestEvents">Manipulation Requests (zoom, pan, move, rotate)</a> as well as for <a href="#ContinuousUIScrollRequestEvents">Scroll Requests</a>.</li>
</ul>