Skip to content

Commit

Permalink
Add TextTrackCue ctor & cue + cuebackground attrs
Browse files Browse the repository at this point in the history
  • Loading branch information
marcoscaceres committed Sep 25, 2023
1 parent d6ce12a commit 5362a5e
Showing 1 changed file with 154 additions and 1 deletion.
155 changes: 154 additions & 1 deletion source
Original file line number Diff line number Diff line change
Expand Up @@ -2880,6 +2880,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
<li><dfn data-x-href="https://webidl.spec.whatwg.org/#datacloneerror">"<code>DataCloneError</code>"</dfn></li>
<li><dfn data-x-href="https://webidl.spec.whatwg.org/#encodingerror">"<code>EncodingError</code>"</dfn></li>
<li><dfn data-x-href="https://webidl.spec.whatwg.org/#notallowederror">"<code>NotAllowedError</code>"</dfn></li>
<li><dfn data-x-href="https://webidl.spec.whatwg.org/#invalidnodetypeerror">"<code>InvalidNodeTypeError</code>"</dfn></li>
</ul>

<p>When this specification requires a user agent to <dfn>create a <code>Date</code> object</dfn>
Expand Down Expand Up @@ -3185,7 +3186,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
<li>The <dfn data-x="finding flattened slottables" data-x-href="https://dom.spec.whatwg.org/#find-flattened-slotables">find flattened slottables</dfn> algorithm</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#slottable-manual-slot-assignment">manual slot assignment</dfn> concept</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#assign-a-slot">assign a slot</dfn> algorithm</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-node-pre-insert">pre-insert</dfn>, <dfn data-x="concept-node-insert" data-x-href="https://dom.spec.whatwg.org/#concept-node-insert">insert</dfn>, <dfn data-x="concept-node-append" data-x-href="https://dom.spec.whatwg.org/#concept-node-append">append</dfn>, <dfn data-x="concept-node-replace" data-x-href="https://dom.spec.whatwg.org/#concept-node-replace">replace</dfn>, <dfn data-x="concept-node-replace-all" data-x-href="https://dom.spec.whatwg.org/#concept-node-replace-all">replace all</dfn>, <dfn data-x-href="https://dom.spec.whatwg.org/#string-replace-all">string replace all</dfn>, <dfn data-x="concept-node-remove" data-x-href="https://dom.spec.whatwg.org/#concept-node-remove">remove</dfn>, and <dfn data-x="concept-node-adopt" data-x-href="https://dom.spec.whatwg.org/#concept-node-adopt">adopt</dfn> algorithms for nodes</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-node-pre-insert">pre-insert</dfn>, <dfn data-x-href="https://dom.spec.whatwg.org/#concept-node-ensure-pre-insertion-validity">ensure pre-insertion validity</dfn>, <dfn data-x="concept-node-insert" data-x-href="https://dom.spec.whatwg.org/#concept-node-insert">insert</dfn>, <dfn data-x="concept-node-append" data-x-href="https://dom.spec.whatwg.org/#concept-node-append">append</dfn>, <dfn data-x="concept-node-replace" data-x-href="https://dom.spec.whatwg.org/#concept-node-replace">replace</dfn>, <dfn data-x="concept-node-replace-all" data-x-href="https://dom.spec.whatwg.org/#concept-node-replace-all">replace all</dfn>, <dfn data-x-href="https://dom.spec.whatwg.org/#string-replace-all">string replace all</dfn>, <dfn data-x="concept-node-remove" data-x-href="https://dom.spec.whatwg.org/#concept-node-remove">remove</dfn>, and <dfn data-x="concept-node-adopt" data-x-href="https://dom.spec.whatwg.org/#concept-node-adopt">adopt</dfn> algorithms for nodes</li>
<li>The <dfn data-x="concept-tree-descendant" data-x-href="https://dom.spec.whatwg.org/#concept-tree-descendant">descendant</dfn> concept</li>
<li>The <dfn data-x="concept-node-insert-ext" data-x-href="https://dom.spec.whatwg.org/#concept-node-insert-ext">insertion steps</dfn>,
<dfn data-x="concept-node-remove-ext" data-x-href="https://dom.spec.whatwg.org/#concept-node-remove-ext">removing steps</dfn>,
Expand Down Expand Up @@ -3271,6 +3272,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
<li><dfn data-x-href="https://dom.spec.whatwg.org/#abortsignal-aborted" data-x="AbortSignal-aborted">aborted</dfn></li>
<li><dfn data-x-href="https://dom.spec.whatwg.org/#abortcontroller-signal-abort">signal abort</dfn></li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-element-attributes-get-by-name">get an attribute by name</dfn> algorithm</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#exclusive-text-node">exclusive <code>Text</code> node</dfn> concept</li>
</ul>

<p>The following features are defined in <cite>UI Events</cite>: <ref>UIEVENTS</ref></p>
Expand Down Expand Up @@ -12941,6 +12943,8 @@ https://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%
<li><code data-x="attr-autocapitalize">autocapitalize</code></li>
<li><code data-x="attr-fe-autofocus">autofocus</code></li>
<li><code data-x="attr-contenteditable">contenteditable</code></li>
<li><code data-x="attr-cue">cue</code></li>
<li><code data-x="attr-cuebackground">cuebackground</code></li>
<li><code data-x="attr-dir">dir</code></li>
<li><code data-x="attr-draggable">draggable</code></li>
<li><code data-x="attr-enterkeyhint">enterkeyhint</code></li>
Expand Down Expand Up @@ -39074,6 +39078,16 @@ interface <dfn interface>VideoTrack</dfn> {
<p>An arbitrary string.</p>
</dd>

<dt><dfn data-x="text track cue fragment">A fragment</dfn>
<dd>
<p>A <code>DocumentFragment</code> that is the content of the cue.</p>
</dd>

<dt><dfn data-x="text track cue pseudo-elements">Pseudo-elements</dfn>
<dd>
<p>A <span data-x="ordered map">map</span> representing the pseudo-element associated with the cue.</p>
</dd>

<dt><dfn data-x="text track cue start time">A start time</dfn>
<dd>
<p>The time, in seconds and fractions of a second, that describes the beginning of the range of
Expand Down Expand Up @@ -40124,6 +40138,7 @@ interface <dfn interface>TextTrackCueList</dfn> {

<pre><code class="idl">[Exposed=Window]
interface <dfn interface>TextTrackCue</dfn> : <span>EventTarget</span> {
<span data-x="dom-TextTrackCue">constructor</span>(double startTime, double endTime, DocumentFragment cueFragment);
readonly attribute <span>TextTrack</span>? <span data-x="dom-TextTrackCue-track">track</span>;

attribute DOMString <span data-x="dom-TextTrackCue-id">id</span>;
Expand All @@ -40136,6 +40151,10 @@ interface <dfn interface>TextTrackCue</dfn> : <span>EventTarget</span> {
};</code></pre>

<dl class="domintro">
<dt><code data-x=""><var>cue</var> = new <span subdfn data-x="dom-TextTrackCue">TextTrackCue</span>(startTime, endTime, cueFragment)</code></dt>
<dd>
<p>Creates a <code>TextTrackCue</code> instance with the given parameters.</p>
</dd>
<dt><code data-x=""><var>cue</var>.<span subdfn data-x="dom-TextTrackCue-track">track</span></code></dt>
<dd>
<p>Returns the <code>TextTrack</code> object to which this <span>text track cue</span> belongs,
Expand Down Expand Up @@ -40175,6 +40194,124 @@ interface <dfn interface>TextTrackCue</dfn> : <span>EventTarget</span> {
</dl>

<div w-nodev>
<p>The <dfn constructor for="TextTrackCue"><code
data-x="dom-TextTrackCue">TextTrackCue(<var>startTime</var>, <var>endTime</var>,
<var>cueFragment</var>)</code></dfn> constructor runs the following steps:</p>
<ol>
<li><p>If <var>cueFragment</var> first child is null or a <code>Text</code> node, then throw an
<span>"<code>InvalidNodeTypeError</code>"</span> <code>DOMException</code>.</p></li>
<li>
<p>For each <var>child</var> in <var>cueFragment</var>'s children:</p>
<ol>
<li><p>Ensure <var>child</var> is an <span>allowed cue descendant</span>.</p></li>
</ol>
</li>
<li><p>Let <var>fragment</var> be a newly created <code>DocumentFragment</code> using
<span>this</span>'s <span>relevant global object</span>'s <span
data-x="concept-document-window">associated <code>Document</code></span>.</li>
<li>
<p>Let <var>clones</var> be a clone of <var>cueFragment</var>, with the clone children flag
set to true.</p>
<p class="note">This is to prevent mutation of the <var>cueFragment</var>
after construction.</p>
</li>
<li>
<p><span data-x="concept-node-append">Append</span> <var>clones</var> into
<var>fragment</var>.</p>
<p class="note"><span data-x="concept-node-append">Append</span>
runs the <span>ensure pre-insertion validity</span> algorithm, which can throw.</p>
</li>
<li><p>Initialize <span>this</span>'s <span>text track cue pseudo-elements</span> to a new map
«[ "::cue" → null, "::cue-background" → null ]».</p></li>
<li><p><span data-x="required pseudo-elements for cue">Assign the required pseudo-elements for
cue</span> passing <var>this</var> and <var>fragment</var>.</p></li>
<li><p>Set <span>this</span>'s <span>text track cue fragment</span> to
<var>fragment</var>.</p></li>
<li><p>Set <span>this</span>'s <span>text track cue start time</span> to
<var>startTime</var>.</p></li>
<li><p> Set <span>this</span>'s <span>text track cue end time</span> to
<var>endTime</var>.</p></li>
<li><p> Return <span>this</span>.</p></li>
</ol>

<p>To <dfn data-x="allowed cue descendant">ensure <code>Node</code> <var>node</var> is an
allowed cue descendant</dfn>, run these steps:</p>
<ol>
<li><p>If <var>node</var> is not an <span>exclusive <code>Text</code> node</span> or is not an
<code>Element</code>, then throw <span>"<code>InvalidNodeTypeError</code>"</span>
<code>DOMException</code>.</p></li>
<li>
<p>If <var>node</var> is an <code>Element</code>:</p>
<ol>
<li><p>If <var>node</var>'s namespace is not in the <span>HTML namespace</span>, then throw
<span>"<code>InvalidNodeTypeError</code>"</span> <code>DOMException</code>.</p></li>
<li><p>If <var>node</var>'s local name is not one of the following: "b", "br", "i", "div",
"p", "rb", "rt", "rtc", "ruby", "span", then throw
<span>"<code>InvalidNodeTypeError</code>"</span> <code>DOMException</code>.</p></li>
<li>
<p>For each <var>child</var> of node in tree order:
<ol>
<li><p>Ensure <var>child</var> is an <span>allowed cue descendant</span>.</p></li>
</ol>
</li>
</ol>
</li>
</ol>

<p>To <dfn data-x="required pseudo-elements for cue">assign required pseudo-elements for
cue</dfn> to a <code>TextTrack</code> <var>track</var> with a <code>Node</code> <var>node</var>
and an optional boolean <var>isRoot</var> (default true):</p>
<ol>
<li>
<p>If <var>node</var> is an <code>Element</code>:</p>
<ol>
<li><p>Let <var>pseudos</var> be <var>track</var>'s <span>text track cue
pseudo-elements</span>.</p></li>
<li>
<p>If <var>pseudos</var>["::cue-background"] is null:</p>
<ol>
<li><p>Set <var>pseudos</var>["::cue-background"] to the result of getting an attribute in
the <span>HTML namespace</span>, "cuebackground", <var>node</var>.</p></li>
</ol>
</li>
<li>
<p>If <var>pseudos</var>["::cue"] is null:</p>
<ol>
<li><p>Let <var>cue</var> be the result of getting an attribute in the <span>HTML
namespace</span>, "cue", <var>node</var>.</p></li>
<li>
<p>If <var>cue</var> is not null:</p>
<ol>
<li><p>Let <var>backgroundCue</var> be <var>pseudos</var>["::cue-background"].</p></li>
<li><p>If <var>backgroundCue</var> is null, then throw a
<span>"<code>HierarchyRequestError</code>"</span> <code>DOMException</code>.</p></li>
<li><p>If <var>backgroundCue</var> is not an inclusive ancestor of <var>cue</var>, then
throw a <span>"<code>HierarchyRequestError</code>"</span>
<code>DOMException</code>.</p></li>
<li><p>Set <var>pseudos</var>["::cue"] to <var>cue</var>.</p></li>
<li><p>Return.</p></li>
</ol>
</li>
</ol>
</li>
<li>
<p>For each <var>child</var> of <var>node</var> in tree order:</p>
<ol>
<li><p>Assign required pseudo-elements for cue passing <var>track</var>, <var>child</var>,
and false.</p></li>
</ol>
</li>
</ol>
</li>
<li>
<p>If <var>isRoot</var> is true:</p>
<ol>
<li><p>If <var>pseudos</var>["::cue"] is null or <var>pseudos</var>["::cue-background"] is
null, then throw an <span>"<code>InvalidNodeTypeError</code>"</span>
<code>DOMException</code>.</p></li>
</ol>
</li>
</ol>

<p>The <dfn attribute for="TextTrackCue"><code data-x="dom-TextTrackCue-track">track</code></dfn>
attribute, on getting, must return the <code>TextTrack</code> object of the <span>text
Expand Down Expand Up @@ -40219,6 +40356,7 @@ interface <dfn interface>TextTrackCue</dfn> : <span>EventTarget</span> {
unset otherwise.</p>



<h6 id="cue-events">Event handlers for objects of the text track APIs</h6>

<p>The following are the <span>event handlers</span> that (and their corresponding <span
Expand Down Expand Up @@ -40264,6 +40402,21 @@ interface <dfn interface>TextTrackCue</dfn> : <span>EventTarget</span> {



<h6>The <dfn data-x="attr-cue"><code>cue</code></dfn> and <dfn
data-x="attr-cuebackground"><code>cuebackground</code></dfn> attributes</h6>

<p>When the <code data-x="attr-cue">cue</code> attribute is present, the element serves as a <span>text track
cue</span>.</p>

<p>When the <code data-x="attr-cuebackground">cuebackground</code> attribute is present, the element serves as cue background
for a <span>text track cue</span>.</p>

<p>The <code data-x="attr-cue">cue</code> and <code data-x="attr-cuebackground">cuebackground</code> attributes must each be present once.</p>

<p class="note">The <code data-x="attr-cue">cue</code> and <code data-x="attr-cuebackground">cuebackground</code> can be present on the same element.</p>



<h6>Best practices for metadata text tracks</h6>

<!-- NON-NORMATIVE SECTION -->
Expand Down

0 comments on commit 5362a5e

Please sign in to comment.