Convert MSE spec to use ReSpec.
authorAaron Colwell <acolwell@google.com>
Thu, 08 Nov 2012 17:13:35 -0800
changeset 453e4d27b3a98f
parent 44 ae41dd28af33
child 46 0c638da9a67a
Convert MSE spec to use ReSpec.
media-source/generate-html-spec.cmd
media-source/generate-html-spec.sh
media-source/main.css
media-source/media-source-respec.html
media-source/media-source.html
media-source/media-source.js
media-source/media-source.xml
media-source/respec-w3c-common.js
media-source/spec-html.xsl
media-source/video-working-draft.css
     1.1 --- a/media-source/generate-html-spec.cmd	Wed Oct 31 17:47:58 2012 +0100
     1.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.3 @@ -1,2 +0,0 @@
     1.4 -
     1.5 -xsltproc spec-html.xsl media-source.xml > media-source.html
     2.1 --- a/media-source/generate-html-spec.sh	Wed Oct 31 17:47:58 2012 +0100
     2.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     2.3 @@ -1,2 +0,0 @@
     2.4 -#!/bin/bash
     2.5 -xsltproc spec-html.xsl media-source.xml > media-source.html
     3.1 --- a/media-source/main.css	Wed Oct 31 17:47:58 2012 +0100
     3.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     3.3 @@ -1,81 +0,0 @@
     3.4 -/* Style for a public "Working Draft" */
     3.5 -
     3.6 -/*
     3.7 -   Copyright 1997-2003 W3C (MIT, ERCIM, Keio). All Rights Reserved.
     3.8 -   The following software licensing rules apply:
     3.9 -   http://www.w3.org/Consortium/Legal/copyright-software */
    3.10 -
    3.11 -/* $Id: base.css,v 1.25 2006/04/18 08:42:53 bbos Exp $ */
    3.12 -
    3.13 -body {
    3.14 -  padding: 2em 1em 2em 70px;
    3.15 -  margin: 0;
    3.16 -  font-family: sans-serif;
    3.17 -  color: black;
    3.18 -  background: white;
    3.19 -  background-position: top left;
    3.20 -  background-attachment: fixed;
    3.21 -  background-repeat: no-repeat;
    3.22 -}
    3.23 -:link { color: #00C; background: transparent }
    3.24 -:visited { color: #609; background: transparent }
    3.25 -a:active { color: #C00; background: transparent }
    3.26 -
    3.27 -a:link img, a:visited img { border-style: none } /* no border on img links */
    3.28 -
    3.29 -a img { color: white; }        /* trick to hide the border in Netscape 4 */
    3.30 -@media all {                   /* hide the next rule from Netscape 4 */
    3.31 -  a img { color: inherit; }    /* undo the color change above */
    3.32 -}
    3.33 -
    3.34 -th, td { /* ns 4 */
    3.35 -  font-family: sans-serif;
    3.36 -}
    3.37 -
    3.38 -h1, h2, h3, h4, h5, h6 { text-align: left }
    3.39 -/* background should be transparent, but WebTV has a bug */
    3.40 -h1, h2, h3 { color: #005A9C; background: white }
    3.41 -h1 { font: 170% sans-serif }
    3.42 -h2 { font: 140% sans-serif }
    3.43 -h3 { font: 120% sans-serif }
    3.44 -h4 { font: bold 100% sans-serif }
    3.45 -h5 { font: italic 100% sans-serif }
    3.46 -h6 { font: small-caps 100% sans-serif }
    3.47 -
    3.48 -.hide { display: none }
    3.49 -
    3.50 -div.head { margin-bottom: 1em }
    3.51 -div.head h1 { margin-top: 2em; clear: both }
    3.52 -div.head table { margin-left: 2em; margin-top: 2em }
    3.53 -
    3.54 -p.copyright { font-size: small }
    3.55 -p.copyright small { font-size: small }
    3.56 -
    3.57 -@media screen {  /* hide from IE3 */
    3.58 -a[href]:hover { background: #ffa }
    3.59 -}
    3.60 -
    3.61 -pre { margin-left: 2em }
    3.62 -/*
    3.63 -p {
    3.64 -  margin-top: 0.6em;
    3.65 -  margin-bottom: 0.6em;
    3.66 -}
    3.67 -*/
    3.68 -dt, dd { margin-top: 0; margin-bottom: 0 } /* opera 3.50 */
    3.69 -dt { font-weight: bold }
    3.70 -
    3.71 -pre, code { font-family: monospace } /* navigator 4 requires this */
    3.72 -
    3.73 -ul.toc, ol.toc {
    3.74 -    list-style: disc;/* Mac NS has problem with 'none' */
    3.75 -  list-style: none;
    3.76 -}
    3.77 -
    3.78 -@media aural {  
    3.79 -  h1, h2, h3 { stress: 20; richness: 90 }
    3.80 -  .hide { speak: none }
    3.81 -  p.copyright { volume: x-soft; speech-rate: x-fast }
    3.82 -  dt { pause-before: 20% }
    3.83 -  pre { speak-punctuation: code } 
    3.84 -}
     4.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     4.2 +++ b/media-source/media-source-respec.html	Thu Nov 08 17:13:35 2012 -0800
     4.3 @@ -0,0 +1,1346 @@
     4.4 +<!DOCTYPE html SYSTEM "about:legacy-compat">
     4.5 +<html>
     4.6 +  <head>
     4.7 +    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     4.8 +    <title>Media Source Extensions</title>
     4.9 +    <script src="respec-w3c-common.js" class="remove"></script>
    4.10 +    <script src="media-source.js" class="remove"></script>
    4.11 +    <script class="remove">
    4.12 +      var respecConfig = {
    4.13 +      // specification status (e.g. WD, LCWD, NOTE, etc.). If in doubt use ED.
    4.14 +      specStatus:           "ED",
    4.15 +
    4.16 +      // the specification's short name, as in http://www.w3.org/TR/short-name/
    4.17 +      shortName:            "",
    4.18 +
    4.19 +      // if there a publicly available Editor's Draft, this is the link
    4.20 +      edDraftURI:           "http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html",
    4.21 +
    4.22 +      // if this is a LCWD, uncomment and set the end of its review period
    4.23 +      // lcEnd: "2009-08-05",
    4.24 +
    4.25 +      // editors, add as many as you like
    4.26 +      // only "name" is required
    4.27 +      editors:  [
    4.28 +      { name: "Aaron Colwell",  url: "",
    4.29 +      company: "Google Inc.", companyURL: "http://google.com/" },
    4.30 +      { name: "Adrian Bateman", url: "",
    4.31 +      company: "Microsoft Corporation", companyURL: "http://microsoft.com/" },
    4.32 +      { name: "Mark Watson", url: "",
    4.33 +      company: "Netflix Inc.", companyURL: "http://netflix.com/" },
    4.34 +      ],
    4.35 +
    4.36 +      // name of the WG
    4.37 +      wg:           "HTML Working Group",
    4.38 +
    4.39 +      // URI of the public WG page
    4.40 +      wgURI:        "http://www.w3.org/html/wg/",
    4.41 +
    4.42 +      // name (without the @w3c.org) of the public mailing to which comments are due
    4.43 +      wgPublicList: "public-html-media",
    4.44 +
    4.45 +      // URI of the patent status for this WG, for Rec-track documents
    4.46 +      // !!!! IMPORTANT !!!!
    4.47 +      // This is important for Rec-track documents, do not copy a patent URI from a random
    4.48 +      // document unless you know what you're doing. If in doubt ask your friendly neighbourhood
    4.49 +      // Team Contact.
    4.50 +      wgPatentURI:  "",
    4.51 +
    4.52 +      noIDLIn: true,
    4.53 +
    4.54 +      postProcess: [ mediaSourcePostProcessor ]
    4.55 +      };
    4.56 +    </script>
    4.57 +
    4.58 +    <style type="text/css">
    4.59 +      .nonnormative { color: green; margin: 2em 0 2em 0em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
    4.60 +      .nonnormative h3 { color: inherit; background: inherit; }
    4.61 +      .nonnormative:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This section is non-normative.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
    4.62 +
    4.63 +      .example { color: green; margin: 2em 0 2em 2em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
    4.64 +      hr + dl.example, div.impl + dl.domintro { margin-top: 2.5em; margin-bottom: 1.5em; }
    4.65 +      dl.example dt, dl.domintro dt * { color: black; text-decoration: none; }
    4.66 +      dl.example dd { margin: 0.5em 0 1em 2em; padding: 0; }
    4.67 +      dl.example dd p { margin: 0.5em 0; }
    4.68 +
    4.69 +      .example:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This box is non-normative. Implementation requirements are given below this box.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
    4.70 +
    4.71 +      .iso-box { font-weight: bold; }
    4.72 +      .iso-var { font-style: italic; }
    4.73 +
    4.74 +      table.old-table { border-collapse: collapse; border-style: hidden hidden none hidden; }
    4.75 +      table.old-table thead, table tbody { border-bottom: solid; }
    4.76 +      table.old-table tbody th:first-child { border-left: solid; }
    4.77 +      table.old-table tbody th { text-align: left; }
    4.78 +      table.old-table td, table th { border-left: solid; border-right: solid; border-bottom: solid thin; vertical-align: top; padding: 0.2em; }
    4.79 +
    4.80 +      dl.switch { padding-left: 2em; }
    4.81 +      dl.switch > dt { text-indent: -1.5em; }
    4.82 +      dl.switch > dt:before { content: '\21AA'; padding: 0 0.5em 0 0; display: inline-block; width: 1em; text-align: right; line-height: 0.5em; }
    4.83 +
    4.84 +      p + * > li, dd li { margin: 1em 0; }
    4.85 +
    4.86 +      @media screen { code :link, code :visited { color: inherit; } }
    4.87 +    </style>
    4.88 +  </head>
    4.89 +  <body>
    4.90 +    
    4.91 +    <section id="sotd">
    4.92 +    </section>
    4.93 +
    4.94 +    <section id="abstract">
    4.95 +      This proposal extends HTMLMediaElement to allow 
    4.96 +      JavaScript to generate media streams for playback. 
    4.97 +      Allowing JavaScript to generate streams facilitates a variety of use 
    4.98 +      cases like adaptive streaming and time shifting live streams.
    4.99 +    </section>
   4.100 +
   4.101 +
   4.102 +    <section id="introduction">
   4.103 +      <h2>Introduction</h2>
   4.104 +      <p>This proposal allows JavaScript to dynamically construct media streams for &lt;audio&gt; and &lt;video&gt;. 
   4.105 +        It defines objects that allow JavaScript to pass media segments to an <a def-id="videoref" name="htmlmediaelement">HTMLMediaElement</a>.
   4.106 +        A buffering model is also included to describe how the user agent should act when different media segments are 
   4.107 +        appended at different times. Byte stream specifications for WebM &amp; ISO Base Media File Format are given to specify the
   4.108 +        expected format of media segments used with these extensions.</p>
   4.109 +      <img src="pipeline_model.png">
   4.110 +
   4.111 +      <section id="goals">
   4.112 +        <h3>Goals</h3>
   4.113 +        <p>This proposal was designed with the following goals in mind:</p>
   4.114 +        <ul>
   4.115 +          <li>Allow JavaScript to construct media streams independent of how the media is fetched.</li>
   4.116 +          <li>Define a splicing and buffering model that facilitates use cases like adaptive streaming, ad-insertion, time-shifting, and video editing.</li>
   4.117 +          <li>Minimize the need for media parsing in JavaScript.</li>
   4.118 +          <li>Leverage the browser cache as much as possible.</li>
   4.119 +          <li>Provide byte stream definitions for WebM &amp; the ISO Base Media File Format.</li>
   4.120 +          <li>Not require support for any particular media format or codec.</li>
   4.121 +        </ul>
   4.122 +      </section>
   4.123 +
   4.124 +      <section id="definitions">
   4.125 +        <h3>Definitions</h3>
   4.126 +
   4.127 +        <dl>
   4.128 +          <dt id="init-segment">Initialization Segment</dt>
   4.129 +          <dd>
   4.130 +	    <p>A sequence of bytes that contains all of the initialization information required to decode a sequence of <a def-id="media-segments"></a>. This includes codec initialization data, <a def-id="track-id"></a> mappings for multiplexed segments, and timestamp offsets (e.g. edit lists).</p>
   4.131 +	    <dl class="example">
   4.132 +	      <p>Container specific examples of initialization segments:</p>
   4.133 +	      <dt>ISO Base Media File Format</dt>
   4.134 +	      <dd>A <span class="iso-box">moov</span> box.</dd>
   4.135 +	      <dt>WebM</dt>
   4.136 +	      <dd>The concatenation of the the EBML Header, Segment Header, Info element, and Tracks element.</dd>
   4.137 +	    </dl>
   4.138 +          </dd>
   4.139 +
   4.140 +          <dt id="media-segment">Media Segment</dt>
   4.141 +          <dd>
   4.142 +	    <p>A sequence of bytes that contain packetized &amp; timestamped media data for a portion of the presentation timeline. Media segments are always associated with the most recently appended <a def-id="init-segment"></a>.</p>
   4.143 +	    <dl class="example">
   4.144 +	      <p>Container specific examples of media segments:</p>
   4.145 +	      <dt>ISO Base Media File Format</dt>
   4.146 +	      <dd>A <span class="iso-box">moof</span> box followed by one or more <span class="iso-box">mdat</span> boxes.</dd>
   4.147 +	      <dt>WebM</dt>
   4.148 +	      <dd>A Cluster element</dd>
   4.149 +	    </dl>
   4.150 +          </dd>
   4.151 +          
   4.152 +          <dt id="source-buffer">Source Buffer</dt>
   4.153 +          <dd><p>A hypothetical buffer that contains a distinct sequence of <a def-id="init-segments"></a> &amp; <a def-id="media-segments"></a>. When <a def-id="media-segments"></a> are passed to <a def-id="append"></a> they update the state of this buffer. The source buffer only allows a single <a def-id="media-segment"></a> to cover a specific point in the presentation timeline of each track. If a <a def-id="media-segment"></a> gets appended that contains media data overlapping (in presentation time) with media data from an existing segment, then the new media data will override the old media data. Since <a def-id="media-segments"></a> depend on <a def-id="init-segments"></a> the source buffer is also responsible for maintaining these associations. During playback, the media element pulls segment data out of the source buffers, demultiplexes it if necessary, and enqueues it into <a def-id="track-buffers"></a> so it will get decoded and displayed. <a def-id="buffered"></a> describes the time ranges that are covered by <a def-id="media-segments"></a> in the source buffer.</p></dd>
   4.154 +
   4.155 +          <dt id="active-source-buffers">Active Source Buffers</dt>
   4.156 +          <dd><p>The set of <a def-id="source-buffers"></a> that are providing the <a def-id="videoref" name="dom-videotrack-selected">selected video track</a>, the <a def-id="videoref" name="dom-audiotrack-enabled">enabled audio tracks</a>, and the <a def-id="videoref" name="dom-texttrack-showing">"showing"</a> or <a def-id="videoref" name="dom-texttrack-hidden">"hidden"</a> text tracks. This is a subset of all the source buffers associated with a specific <a>MediaSource</a> object. See <a href="#active-source-buffer-changes">Changes to selected/enabled track state</a> for details.</p></dd>
   4.157 +          
   4.158 +          <dt id="track-buffer">Track Buffer</dt>
   4.159 +          <dd><p>A hypothetical buffer that represents initialization and media data for a single <a def-id="audio-track"></a>, <a def-id="video-track"></a>, or <a def-id="text-track"></a> that has been queued for playback. This buffer may not exist in actual implementations, but it is intended to represent media data that will be decoded no matter what <a def-id="media-segments"></a> are appended to update the <a def-id="source-buffer"></a>. This distinction is important when considering appends that happen close to the current playback position. See <a href="#source-buffer-to-track-buffer">Source Buffer to Track Buffer transfer</a> for details.</p></dd>
   4.160 +
   4.161 +          <dt id="random-access-point">Random Access Point</dt>
   4.162 +          <dd><p>A position in a <a def-id="media-segment"></a> where decoding and continuous playback can begin without relying on any previous data in the segment. For video this tends to be the location of I-frames. In the case of audio, most audio frames can be treated as a random access point. Since video tracks tend to have a more sparse distribution of random access points, the location of these points are usually considered the random access points for multiplexed streams.</p></dd>
   4.163 +
   4.164 +          <dt id="presentation-start-time">Presentation Start Time</dt>
   4.165 +          <dd><p>The presentation start time is the earliest time point in the presentation and specifies the <a def-id="videoref" name="initial-playback-position">initial playback position</a> and <a def-id="videoref" name="earliest-possible-position">earliest possible position</a>. All presentations created using this specification have a presentation start time of 0. Appending <a def-id="media-segments"></a> with negative timestamps will cause playback to terminate with a <a def-id="media-err-decode"></a> error unless <a def-id="timestampOffset"></a> is used to make the timestamps greater than or equal to 0.</p></dd>
   4.166 +
   4.167 +          <dt id="mediasource-object-url">MediaSource object URL</dt>
   4.168 +          <dd>
   4.169 +            <p>A MediaSource object URL is a unique <a def-id="blob-uri"></a> created by <a def-id="createObjectURL"></a>. It is used to attach a <a>MediaSource</a> object to an HTMLMediaElement.</p>
   4.170 +            <p>These URLs are the same as what the <a def-id="FileAPI"></a> specification calls a <a def-id="blob-uri"></a>, except that anything in the definition of that feature that refers to <a def-id="File"></a> and <a def-id="Blob"></a> objects is hereby extended to also apply to <a>MediaSource</a> objects.</p>
   4.171 +          </dd>
   4.172 +
   4.173 +          <dt id="track-id">Track ID</dt>
   4.174 +          <dd><p>A Track ID is a byte stream format specific identifier that marks sections of the byte stream as being part of a specific track. The Track ID in a <a def-id="track-description"></a> identifies which sections of a <a def-id="media-segment"></a> belong to that track.</p></dd>
   4.175 +
   4.176 +          <dt id="track-description">Track Description</dt>
   4.177 +          <dd><p>A byte stream format specific structure that provides the <a def-id="track-id"></a>, codec configuration, and other metadata for a single track. Each track description inside a single <a def-id="init-segment"></a> must have a unique <a def-id="track-id"></a>.</p></dd>
   4.178 +
   4.179 +          <dt id="coded-frame">Coded Frame</dt>
   4.180 +          <dd><p>A unit of compressed media data that has a presentation timestamp and  decode timestamp. The presentation timestamp indicates when the frame should be rendered. The decode timestamp indicates when the frame needs to be decoded. If frames can be decoded out of order, then the decode timestamp must be present in the bytestream. If frames cannot be decoded out of order and a decode timestamp is not present in the bytestream, then the decode timestamp is equal to the presentation timestamp.</p></dd>
   4.181 +
   4.182 +          <dt id="parent-media-source">Parent Media Source</dt> 
   4.183 +          <dd>The parent media source of a <a>SourceBuffer</a> object is the <a>MediaSource</a> object that created it.</p>
   4.184 +        </dl>
   4.185 +      </section>
   4.186 +    </section>
   4.187 +
   4.188 +
   4.189 +    <section id="source-buffer-model">
   4.190 +      <h2>Source Buffer Model</h2>
   4.191 +      <p>The subsections below outline the buffering model for this proposal. It describes how to add and remove <a def-id="source-buffers"></a> from the presentation and describes the various rules and behaviors associated with appending data to an individual <a def-id="source-buffer"></a>. At the highest level, the web application simply creates <a def-id="source-buffers"></a> and appends a sequence of <a def-id="init-segments"></a> and <a def-id="media-segments"></a> to update the buffer's state. The media element pulls media data out of the <a def-id="source-buffers"></a>, plays it, and fires events just like it would if a normal URL was passed to the <a def-id="media-src"></a> attribute. The web application is expected to monitor media element events to determine when it needs to append more <a def-id="media-segments"></a>.</p>
   4.192 +
   4.193 +      <section id="source-buffer-create">
   4.194 +        <h3>Creating Source Buffers</h3>
   4.195 +        <p><a>SourceBuffer</a> objects can be created once a <a>MediaSource</a> object enters the <a def-id="open"></a> state. The application calls <a def-id="addSourceBuffer"></a> with a type string that indicates the format of the data it intends to append to the new SourceBuffer. If the user agent supports the format and has sufficient resources, a new <a>SourceBuffer</a> object is created, added to <a def-id="sourceBuffers"></a>, and returned by the method. If the user agent doesn't support the specified format or can't support another <a>SourceBuffer</a> then it will throw an appropriate exception to signal why the request couldn't be satisfied.</p>
   4.196 +      </section>
   4.197 +
   4.198 +      <section id="source-buffer-remove">
   4.199 +        <h3>Removing Source Buffers</h3>
   4.200 +        <p>Removing a <a>SourceBuffer</a> with <a def-id="removeSourceBuffer"></a> releases all resources associated with the object. This includes destroying the all the segment data, <a def-id="track-buffers"></a>, and decoders. The media element will also remove the appropriate tracks from <a def-id="audiotracks"></a>, <a def-id="videotracks"></a>,  &amp; <a def-id="texttracks"></a> and fire the necessary <a def-id="videoref" name="handler-tracklist-onchange">change</a> events. Playback may become degraded or stop if the currently selected <a def-id="video-track"></a> or the only enabled <a def-id="audio-tracks"></a> are removed.</p>
   4.201 +      </section>
   4.202 +
   4.203 +      <section id="source-buffer-basic-append">
   4.204 +        <h3>Basic appending model</h3>
   4.205 +        <p>Updating the state of a <a def-id="source-buffer"></a> requires appending at least one <a def-id="init-segment"></a> and one or more <a def-id="media-segments"></a> via <a def-id="append"></a>. The following list outlines some of the basic rules for appending segments.
   4.206 +          <ul>
   4.207 +	    <li>The first segment appended must be an <a def-id="init-segment"></a>.</li>
   4.208 +	    <li>All <a def-id="media-segments"></a> are associated with the most recently appended <a def-id="init-segment"></a>.</li>
   4.209 +	    <li>A whole segment must be appended before another segment can be started unless <a def-id="abort"></a> is called.</li>
   4.210 +	    <li>Segments can be appended in pieces. (i.e. A 4096 byte segment can be spread across four 1024 byte calls to <a def-id="append"></a>).</li>
   4.211 +	    <li>If a <a def-id="media-segment"></a> requires different configuration information (e.g. codec parameters, new <a def-id="track-ids"></a>, metadata) from what is in the most recently appended <a def-id="init-segment"></a>, a new <a def-id="init-segment"></a> with the new configuration information must be appended before the <a def-id="media-segment"></a> requiring this information is appended.</li>
   4.212 +	    <li>A new <a def-id="media-segment"></a> can overlap, in presentation time, a segment that was previously appended. The new segment will override the previous data.</li>
   4.213 +	    <li>Media segments can be appended in any order.<p class="note">In practice finite buffer space and maintaining uninterrupted playback will bias appending towards time increasing order near the current playback position. Out of order appends facilitate adaptive streaming, ad insertion, and video editing use cases.</p>
   4.214 +            </li>
   4.215 +	    <li>The media element may start copying data from a <a def-id="media-segment"></a> to the <a def-id="track-buffers"></a> before the entire segment has been appended. This prevents unnecessary delays for <a def-id="media-segments"></a> that cover a large time range.</li>
   4.216 +          </ul>
   4.217 +        </p>
   4.218 +      </section>
   4.219 +
   4.220 +      <section id="source-buffer-init-segment-constraints">
   4.221 +        <h3>Initialization Segment constraints</h3>
   4.222 +        <p>To simplify the implementation and facilitate interoperability, a few constraints are placed on the <a def-id="init-segments"></a> that are appended to a specific <a>SourceBuffer</a>:
   4.223 +          <ul>
   4.224 +	    <li>The number and type of tracks must be consistent across all <a def-id="init-segments"></a>. <br>For example, if the first <a def-id="init-segment"></a> has 2 audio tracks and 1 video track, then all <a def-id="init-segments"></a> that follow, for this <a>SourceBuffer</a> must describe 2 audio tracks and 1 video track.</li>
   4.225 +	    <li>
   4.226 +              <a def-id="track-ids"></a> do not need to be the same across <a def-id="init-segments"></a> only if the segment describes one track of each type.<br> For example, if an <a def-id="init-segment"></a> describes a single audio track and a single video track, the internal <a def-id="track-ids"></a> do not need to be the same.</li>
   4.227 +	    <li>
   4.228 +              <a def-id="track-ids"></a> must be the same across <a def-id="init-segments"></a> if multiple tracks for a single type are described. (e.g. 2 audio tracks).</li>
   4.229 +	    <li>Codecs changes are not allowed. <br> For example, you can't have an <a def-id="init-segment"></a> that specifies a single AAC track and then follows it with one that contains AMR-WB. Support for multiple codecs is handled with multiple <a>SourceBuffer</a> objects.</li>
   4.230 +	    <li>Video frame size changes are allowed and must be supported seamlessly.<p class="note">This will cause the &lt;video&gt; display region to change size if you don't use CSS or HTML attributes (width/height) to constrain the element size.</p>
   4.231 +            </li>
   4.232 +	    <li>Audio channel count changes are allowed, but they may not be seamless and could trigger downmixing.<p class="note">This is a quality of implementation issue because changing the channel count may require reinitializing the audio device, resamplers, and channel mixers which tends to be audible.</p>
   4.233 +            </li>
   4.234 +          </ul>
   4.235 +        </p>
   4.236 +      </section>
   4.237 +
   4.238 +      <section id="source-buffer-media-segment-constraints">
   4.239 +        <h3>Media Segment constraints</h3>
   4.240 +        <p>To simplify the implementation and facilitate interoperability, a few constraints are placed on the <a def-id="media-segments"></a> that are appended to a specific <a>SourceBuffer</a>:
   4.241 +          <ul>
   4.242 +	    <li>All timestamps must be mapped to the same presentation timeline.</li>
   4.243 +	    <li>Segments must start with a <a def-id="random-access-point"></a> to facilitate seamless splicing at the segment boundary.</li>
   4.244 +	    <li>Gaps between <a def-id="media-segments"></a> that are smaller than the audio frame size are allowed and must not cause playback to stall. Such gaps must not be reflected by <a def-id="buffered"></a>.
   4.245 +	      <p class="note">This is intended to simplify switching between audio streams where the frame boundaries don't always line up across encodings (e.g. Vorbis).</p>
   4.246 +            </li>
   4.247 +          </ul>
   4.248 +        </p>
   4.249 +      </section>
   4.250 +
   4.251 +      <section id="source-buffer-first-init-segment">
   4.252 +        <h3>Appending the first Initialization Segment</h3>
   4.253 +        <p>Once a new <a>SourceBuffer</a> has been created, it expects an <a def-id="init-segment"></a> to be appended first. This first segment indicates the number and type of streams contained in the <a def-id="media-segments"></a> that follow. This allows the media element to configure the necessary decoders and output devices. This first segment can also cause a <a def-id="ready-state"></a> transition to <a def-id="have-metadata"></a> if this is the first <a>SourceBuffer</a>, or if it is the first track of a specific type (i.e. first audio, first video track, or first text track). If neither of the conditions hold then the tracks for this new <a>SourceBuffer</a> will just appear as disabled tracks and won't affect the current <a def-id="ready-state"></a> until they are selected. The media element will also add the appropriate tracks to the <a def-id="audiotracks"></a>, <a def-id="videotracks"></a>, &amp; <a def-id="texttracks"></a> collections and fire the necessary <a def-id="videoref" name="handler-tracklist-onchange">change</a> events. The description for <a def-id="append"></a> contains all the details.</p>
   4.254 +      </section>
   4.255 +      
   4.256 +      <section id="source-buffer-media-segment-unbuffered">
   4.257 +        <h3>Appending a Media Segment to an unbuffered region</h3>
   4.258 +        <p>If a <a def-id="media-segment"></a> is appended to a time range that is not covered by existing segments in the <a def-id="source-buffer"></a>, then its data is copied directly into the <a def-id="source-buffer"></a>. Addition of this data may trigger <a def-id="ready-state"></a> transitions depending on what other data is buffered and whether the media element has determined if it can start playback. Calls to <a def-id="buffered"></a> will always reflect the current <a def-id="timeranges"></a> buffered in the <a>SourceBuffer</a>.</p>
   4.259 +      </section>
   4.260 +
   4.261 +      <section id="source-buffer-overlapping-segments">
   4.262 +        <h3>Appending a Media Segment over a buffered region</h3>
   4.263 +        <p>There are several ways that <a def-id="media-segments"></a> can overlap segments in the <a def-id="source-buffer"></a>. Behavior for the different overlap situations are described below. If more than one overlap applies, then the <a href="#source-buffer-overlap-start">start overlap</a> gets resolved first, followed by any <a href="#source-buffer-overlap-complete">complete overlaps</a>, and finally the <a href="#source-buffer-overlap-end">end overlap</a>. If a segment contains multiple tracks then the overlap is resolved independently for each track.</p>
   4.264 +
   4.265 +        <section id="source-buffer-overlap-complete">
   4.266 +          <h4>Complete Overlap</h4>
   4.267 +          <img src="complete_overlap.png">
   4.268 +          <p>The figure above shows how the <a def-id="source-buffer"></a> gets updated when a new <a def-id="media-segment"></a> completely overlaps a segment in the buffer. In this case, the new segment completely replaces the old segment.</p>
   4.269 +        </section>
   4.270 +
   4.271 +        <section id="source-buffer-overlap-start">
   4.272 +          <h4>Start Overlap</h4>
   4.273 +          <img src="start_overlap.png">
   4.274 +          <p>The figure above shows how the <a def-id="source-buffer"></a> gets updated when the beginning of a new <a def-id="media-segment"></a> overlaps a segment in the buffer. In this case the new segment replaces all the old media data in the overlapping region. Since <a def-id="media-segments"></a> are constrained to starting with <a def-id="random-access-points"></a>, this provides a seamless transition between segments.</p>
   4.275 +          <p>When an audio frame in the <a def-id="source-buffer"></a> overlaps with the start of the new <a def-id="media-segment"></a> special behavior is required. At a minimum implementations must support dropping the old audio frame that overlaps the start of the new segment and insert silence for the small gap that is created. Higher quality implementations may support crossfading or crosslapping between the overlapping audio frames. No matter which strategy is implemented, no gaps are created in the ranges reported by <a def-id="buffered"></a> and playback must never stall at the overlap.</p>
   4.276 +        </section>
   4.277 +
   4.278 +        <section id="source-buffer-overlap-end">
   4.279 +          <h4>End Overlap</h4>
   4.280 +          <img src="end_overlap.png">
   4.281 +          <p>The figure above shows how the <a def-id="source-buffer"></a> gets updated when the end of a new <a def-id="media-segment"></a> overlaps a segment in the buffer. In this case, the media element tries to keep as much of the old segment as possible. The amount saved depends on where the closest <a def-id="random-access-point"></a>, in the old segment, is to the end of the new segment. In the case of audio, if the gap is smaller than the size of an audio frame, then the media element should insert silence for this gap and not reflect it in <a def-id="buffered"></a>.</p>
   4.282 +          <p>An implementation may keep old segment data before the end of the new segment to avoid creating a gap if it wishes. Doing this though can significantly increase implementation complexity and could cause delays at the splice point. The key property that must be preserved is the entirety of the new segment gets added to the <a def-id="source-buffer"></a> and it is up to the implementation how much of the old segment data is retained. The web application can use <a def-id="buffered"></a> to determine how much of the old segment was preserved.</p>
   4.283 +        </section>
   4.284 +
   4.285 +        <section id="source-buffer-overlap-middle">
   4.286 +          <h4>Middle Overlap</h4>
   4.287 +          <img src="middle_overlap.png">
   4.288 +          <p>The figure above shows how the <a def-id="source-buffer"></a> gets updated when the new <a def-id="media-segment"></a> is in the middle of the old segment. This condition is handled by first resolving the <a href="#source-buffer-overlap-start">start overlap</a> and then resolving the <a href="#source-buffer-overlap-end">end overlap</a>.</p>
   4.289 +        </section>
   4.290 +      </section>
   4.291 +
   4.292 +      <section id="source-buffer-to-track-buffer">
   4.293 +        <h3>Source Buffer to Track Buffer transfer</h3>
   4.294 +        <p>The <a def-id="source-buffer"></a> represents the media that the web application would like the media element to play. The <a def-id="track-buffer"></a> contains the data that will actually get decoded and rendered. In most cases the <a def-id="track-buffer"></a> will simply contain a subset of the <a def-id="source-buffer"></a> near the current playback position. These two buffers start to diverge though when <a def-id="media-segments"></a> that overlap or are very close to the current playback position are appended. Depending on the contents of the new <a def-id="media-segment"></a> it may not be possible to switch to the new data immediately because there isn't a <a def-id="random-access-point"></a> close enough to the current playback position. The quality of the implementation determines how much data is considered "in the <a def-id="track-buffer"></a>". It should transfer data to the <a def-id="track-buffer"></a> as late as possible whilst maintaining seamless playback. Some implementations may be able to instantiate multiple decoders or decode the new data significantly faster than real-time to achieve a seamless splice immediately. Other implementations may delay until the next <a def-id="random-access-point"></a> before switching to the newly appended data. Notice that this difference in behavior is only observable when appending close to the current playback position. The <a def-id="track-buffer"></a> represents a media subsegment, like a group of pictures or something with similar decode dependencies, that the media element commits to playing. This commitment may be influenced by a variety of things like limited decoding resources, hardware decode buffers, a jitter buffer, or the desire to limit implementation complexity.</p>
   4.295 +        
   4.296 +        <p>Here is an example to help clarify the role of the <a def-id="track-buffer"></a>. Say the current playback position has a timestamp of 8 and the media element pulled frames with timestamp 9 &amp; 10 into the track buffer. The web application then appends a higher quality <a def-id="media-segment"></a> that starts with a <a def-id="random-access-point"></a> at timestamp 9. The <a def-id="source-buffer"></a> will get updated with the higher quality data, but the media element won't be able to switch to this higher quality data until the next <a def-id="random-access-point"></a> at timestamp 20. This is because a frame for timestamp 9 is already in the track buffer. As you can see the track buffer represents the "point of no return." for decoding. If a seek occurs the media element may choose to use the higher quality data since a seek might imply flushing the <a def-id="track-buffer"></a> and the user expects a break in playback.</p>
   4.297 +      </section>
   4.298 +
   4.299 +
   4.300 +      <section id="source-buffer-segment-eviction">
   4.301 +        <h3>Media Segment Eviction</h3>
   4.302 +        <p>When a new <a def-id="media-segment"></a> is appended, memory constraints may cause previously appended segments to get evicted from the <a def-id="source-buffer"></a>. The eviction algorithm is implementation dependent, but segments that aren't likely to be needed soon are the most likely to get evicted. The <a def-id="buffered"></a> attribute allows the web application to monitor what time ranges are currently buffered in the <a def-id="source-buffer"></a>.</p>
   4.303 +      </section>
   4.304 +
   4.305 +      <section id="source-buffer-timestamp-offsets">
   4.306 +        <h3>Applying Timestamp Offsets</h3>
   4.307 +        <p>For some use cases like ad-insertion or seamless playlists, the web application may want to insert a <a def-id="media-segment"></a> in the presentation timeline at a location that is different than what the internal timestamps indicate. This can be accomplished by using the <a def-id="timestampOffset"></a> attribute on the <a>SourceBuffer</a> object. The value of <a def-id="timestampOffset"></a> is added to all timestamps inside a <a def-id="media-segment"></a> before the contents of that segment are added to the <a def-id="source-buffer"></a>. The <a def-id="timestampOffset"></a> applies to an entire media segment. An exception is thrown if the application tries to update the attribute when only part of a media segment has been appended. Both positive or negative offsets can be assigned to <a def-id="timestampOffset"></a>. If an offset causes a <a def-id="media-segment"></a> timestamp to get converted to a time before the <a def-id="presentation-start-time"></a>, playback will terminate with a <a def-id="media-err-decode"></a> error.</p>
   4.308 +
   4.309 +        <p>Here is a simple example to clarify how <a def-id="timestampOffset"></a> can be used. Say I have two sounds I want to play in sequence. The first sound is 5 seconds long and the second one is 10 seconds. Both sound files have timestamps that start at 0. First append the <a def-id="init-segment"></a> and all <a def-id="media-segments"></a> for the first sound. Now set <a def-id="timestampOffset"></a> to 5 seconds. Finally append the <a def-id="init-segment"></a> and <a def-id="media-segments"></a> for the second sound. This will result in a 15 second presentation that plays the two sounds in sequence.</p>
   4.310 +      </section>
   4.311 +    </section>
   4.312 +
   4.313 +    <section id="mediasource">
   4.314 +      <h2>MediaSource Object</h2>
   4.315 +      <p>The MediaSource object represents a source of media data for an HTMLMediaElement. It keeps track of the <a def-id="readyState"></a> for this source as well as a list of <a>SourceBuffer</a> objects that can be used to add media data to the presentation. MediaSource objects are created by the web application and then attached to an HTMLMediaElement. The application uses the <a>SourceBuffer</a> objects in <a def-id="sourceBuffers"></a> to add media data to this source. The HTMLMediaElement fetches this media data from the <a>MediaSource</a> object when it is needed during playback.</p>
   4.316 +
   4.317 +      <dl title="enum ReadyState" class="idl">
   4.318 +        <dt><dfn id="dom-closed">closed</dfn></dt>
   4.319 +        <dd>
   4.320 +          Indicates the source is not currently attached to a media element.
   4.321 +        </dd>
   4.322 +        <dt>open</dt>
   4.323 +        <dd>
   4.324 +          The source has been opened by a media element and is ready for data to be appended to the <a>SourceBuffer</a> objects in <a def-id="sourceBuffers"></a>.
   4.325 +        </dd>
   4.326 +        <dt>ended</dt>
   4.327 +        <dd>
   4.328 +          The source is still attached to a media element, but <a def-id="endOfStream"></a> has been called. Appending data to <a>SourceBuffer</a> objects in this state is not allowed.
   4.329 +        </dd>
   4.330 +      </dl>
   4.331 +
   4.332 +      <dl title="enum EndOfStreamError" class="idl">
   4.333 +        <dt>network</dt>
   4.334 +        <dd>
   4.335 +          <p>Terminates playback and signals that a network error has occured.</p>
   4.336 +          <p class="note">If the JavaScript fetching media data encounters a network error it should use this status code to terminate playback.</p>
   4.337 +        </dd>
   4.338 +        <dt>decode</dt>
   4.339 +        <dd>
   4.340 +          <p>Terminates playback and signals that a decoding error has occured.</p>
   4.341 +          <p class="note">If the JavaScript code fetching media data has problems parsing the data it should use this status code to terminate playback.</p>
   4.342 +        </dd>
   4.343 +      </dl>
   4.344 +
   4.345 +      <dl title="[Constructor] interface MediaSource : EventTarget" class='idl'>
   4.346 +        <dt>readonly attribute SourceBufferList sourceBuffers</dt>
   4.347 +        <dd>
   4.348 +          Contains the list of <a>SourceBuffer</a> objects associated with this <a>MediaSource</a>. When <a def-id="readyState"></a> equals <a def-id="closed"></a> this list will be empty. Once <a def-id="readyState"></a> transitions to <a def-id="open"></a> SourceBuffer objects can be added to this list by using <a def-id="addSourceBuffer"></a>.
   4.349 +        </dd>
   4.350 +
   4.351 +        <dt>readonly attribute SourceBufferList activeSourceBuffers</dt>
   4.352 +        <dd>
   4.353 +          Contains the subset of <a def-id="sourceBuffers"></a> that represents the <a def-id="active-source-buffers"></a>.
   4.354 +        </dd>
   4.355 +
   4.356 +        <dt>attribute unrestricted double duration</dt>
   4.357 +        <dd>
   4.358 +          <p>Allows the web application to set the presentation duration. The duration is initially set to NaN when the <a>MediaSource</a> object is created.</p>
   4.359 +          <p>On getting, run the following steps:</p>
   4.360 +          <ol>
   4.361 +            <li>If the <a def-id="readyState"></a> attribute is <a def-id="closed"></a> then return NaN and abort these steps.</li>
   4.362 +            <li>Return the current value of the attribute.</li>
   4.363 +          </ol>
   4.364 +          <p>On setting, run the following steps:</p>
   4.365 +          <ol>
   4.366 +            <li>If the value being set is negative or NaN then throw an <a def-id="invalid-access-err"></a> exception and abort these steps.</li>
   4.367 +            <li>If the <a def-id="readyState"></a> attribute is not <a def-id="open"></a> then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.368 +            <li>Run the <a def-id="duration-change-algorithm"></a> with <var>new duration</var> set to the value being set.
   4.369 +	      <p class="note"><a def-id="append"></a> and <a def-id="endOfStream"></a> can update the duration under certain circumstances.</p>
   4.370 +            </li>
   4.371 +          </ol>
   4.372 +        </dd>
   4.373 +
   4.374 +        <dt>SourceBuffer addSourceBuffer(DOMString type)</dt>
   4.375 +        <dd>
   4.376 +          <p>Adds a new <a>SourceBuffer</a> to <a def-id="sourceBuffers"></a>.</p>
   4.377 +          <p>When this method is invoked, the user agent must run the following steps:</p>
   4.378 +          <ol>
   4.379 +            <li>If <var title="true">type</var> is null or an empty string then throw an <a def-id="invalid-access-err"></a> exception and abort these steps.</li>
   4.380 +            <li>If <var title="true">type</var> contains a MIME type that is not supported or contains a MIME type that is not supported with the types specified for the other <a>SourceBuffer</a> objects in <a def-id="sourceBuffers"></a>, then throw a <a def-id="not-supported-err"></a> exception and abort these steps.</li>
   4.381 +            <li>If the user agent can't handle any more SourceBuffer objects then throw a <a def-id="quota-exceeded-err"></a> exception and abort these steps.</li>
   4.382 +            <li>If the <a def-id="readyState"></a> attribute is not in the <a def-id="open"></a> state then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.383 +            <li>Create a new <a>SourceBuffer</a> object and associated resources.</li>
   4.384 +            <li>Add the new object to <a def-id="sourceBuffers"></a> and <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="addsourcebuffer"></a> at <a def-id="sourceBuffers"></a>.</li>
   4.385 +            <li>Return the new object.</li>
   4.386 +          </ol>
   4.387 +        </dd>
   4.388 +
   4.389 +        <dt>void removeSourceBuffer(SourceBuffer sourceBuffer)</dt>
   4.390 +        <dd>
   4.391 +          <p>Removes a <a>SourceBuffer</a> from <a def-id="sourceBuffers"></a>.</p>
   4.392 +
   4.393 +          <p>When this method is invoked, the user agent must run the following steps:</p>
   4.394 +          <ol>
   4.395 +            <li>If <var title="true">sourceBuffer</var> is null then throw an <a def-id="invalid-access-err"></a> exception and abort these steps.</li>
   4.396 +            <li>If <var title="true">sourceBuffer</var> specifies an object that is not in <a def-id="sourceBuffers"></a> then throw a <a def-id="not-found-err"></a> exception and abort these steps.</li>
   4.397 +            <li>Remove track information from <a def-id="audiotracks"></a>, <a def-id="videotracks"></a>, and <a def-id="texttracks"></a> for all tracks associated with <var title="true">sourceBuffer</var> and <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="videoref" name="handler-tracklist-onchange">change</a> at the modified lists.</li>
   4.398 +            <li>If <var title="true">sourceBuffer</var> is in <a def-id="activeSourceBuffers"></a>, then remove it from <a def-id="activeSourceBuffers"></a> and <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="removesourcebuffer"></a> at <a def-id="activeSourceBuffers"></a>.</li>
   4.399 +            <li>Remove <var title="true">sourceBuffer</var> from <a def-id="sourceBuffers"></a> and <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="removesourcebuffer"></a> at <a def-id="sourceBuffers"></a>.</li>
   4.400 +            <li>Destroy all resources for <var title="true">sourceBuffer</var>.</li>
   4.401 +          </ol>
   4.402 +        </dd>
   4.403 +
   4.404 +        <dt>readonly attribute ReadyState readyState</dt>
   4.405 +        <dd>
   4.406 +          <p>Indicates the current state of the <a>MediaSource</a> object. When the <a>MediaSource</a> is created <a def-id="readyState"></a> must be set to <a def-id="closed"></a>.
   4.407 +        </dd>
   4.408 +        <dt>void endOfStream(optional EndOfStreamError error)</dt>
   4.409 +        <dd>
   4.410 +          <p>Signals the end of the stream.</p>
   4.411 +          <p>When this method is invoked, the user agent must run the following steps:</p>
   4.412 +          <ol>
   4.413 +            <li>If the <a def-id="readyState"></a> attribute is not in the <a def-id="open"></a> state then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.414 +            <li>Change the <a def-id="readyState"></a> attribute value to <a def-id="ended"></a>.</li>
   4.415 +            <li>
   4.416 +              <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="sourceended"></a> at the <a>MediaSource</a>.</li>
   4.417 +            <li><dl class="switch">
   4.418 +                <dt>If <var title="true">error</var> is not set, null, or an empty string</dt>
   4.419 +                <dd>
   4.420 +	          <ol>
   4.421 +	            <li>Run the <a def-id="duration-change-algorithm"></a> with <var>new duration</var> set to the highest end timestamp across all <a>SourceBuffer</a> objects in <a def-id="sourceBuffers"></a>.<br>
   4.422 +		      <p class="note">This allows the duration to properly reflect the end of the appended media segments. For example, if the duration was explicitly set to 10 seconds and only media segments for 0 to 5 seconds were appended before endOfStream() was called, then the duration will get updated to 5 seconds.</p>
   4.423 +	            </li>
   4.424 +	            <li>Notify the media element that it now has all of the media data. Playback should continue until all the media passed in via <a def-id="append"></a> has been played.</li>
   4.425 +	          </ol>
   4.426 +	        </dd>
   4.427 +                <dt>If <var title="true">error</var> is set to <a def-id="network"></a>
   4.428 +                </dt>
   4.429 +                <dd>
   4.430 +	          <dl class="switch">
   4.431 +	            <dt>If the <a def-id="ready-state"></a> attribute equals <a def-id="have-nothing"></a>
   4.432 +                    </dt>
   4.433 +	            <dd>Run the <a def-id="media-data-cannot-be-fetched"></a> steps of the <a def-id="resource-fetch-algorithm"></a>.</dd>
   4.434 +	            <dt>If the <a def-id="ready-state"></a> attribute is greater than <a def-id="have-nothing"></a>
   4.435 +                    </dt>
   4.436 +	            <dd>Run the "<i>If the connection is interrupted after some media data has been received, causing the user agent to give up trying to fetch the resource</i>" steps of the <a def-id="resource-fetch-algorithm"></a>.</dd>
   4.437 +	          </dl>
   4.438 +	        </dd>
   4.439 +                <dt>If <var title="true">error</var> is set to <a def-id="decode"></a>
   4.440 +                </dt>
   4.441 +                <dd>
   4.442 +	          <dl class="switch">
   4.443 +	            <dt>If the <a def-id="ready-state"></a> attribute equals <a def-id="have-nothing"></a>
   4.444 +                    </dt>
   4.445 +	            <dd>Run the "<i>If the media data can be fetched but is found by inspection to be in an unsupported format, or can otherwise not be rendered at all</i>" steps of the <a def-id="resource-fetch-algorithm"></a>.</dd>
   4.446 +	            <dt>If the <a def-id="ready-state"></a> attribute is greater than <a def-id="have-nothing"></a>
   4.447 +                    </dt>
   4.448 +	            <dd>Run the <a def-id="media-data-is-corrupted"></a> steps of the <a def-id="resource-fetch-algorithm"></a>.</dd>
   4.449 +	          </dl>
   4.450 +	        </dd>
   4.451 +                <dt>Otherwise</dt>
   4.452 +                <dd>Throw an <a def-id="invalid-access-err"></a> exception.</dd>
   4.453 +              </dl>
   4.454 +            </li>
   4.455 +          </ol>
   4.456 +        </dd>
   4.457 +      </dl>
   4.458 +
   4.459 +      <section id="mediasource-events">
   4.460 +        <h3>Event Summary</h3>
   4.461 +        <table class="old-table">
   4.462 +          <thead>
   4.463 +            <tr>
   4.464 +              <th>Event name</th>
   4.465 +              <th>Interface</th>
   4.466 +              <th>Dispatched when...</th>
   4.467 +            </tr>
   4.468 +          </thead>
   4.469 +          <tbody>
   4.470 +            <tr>
   4.471 +              <td><a def-id="eventdfn">sourceopen</a></td>
   4.472 +              <td><code>Event</code></td>
   4.473 +              <td>When <a def-id="readyState"></a> transitions from <a def-id="closed"></a> to <a def-id="open"></a> or from <a def-id="ended"></a> to <a def-id="open"></a>.</td>
   4.474 +            </tr>
   4.475 +            <tr>
   4.476 +              <td><a def-id="eventdfn">sourceended</a></td>
   4.477 +              <td><code>Event</code></td>
   4.478 +              <td>When <a def-id="readyState"></a> transitions from <a def-id="open"></a> to <a def-id="ended"></a>.</td>
   4.479 +            </tr>
   4.480 +            <tr>
   4.481 +              <td><a def-id="eventdfn">sourceclose</a></td>
   4.482 +              <td><code>Event</code></td>
   4.483 +	      <td>When <a def-id="readyState"></a> transitions from <a def-id="open"></a> to <a def-id="closed"></a> or <a def-id="ended"></a> to <a def-id="closed"></a>.</td>
   4.484 +            </tr>
   4.485 +          </tbody>
   4.486 +        </table>
   4.487 +      </section>
   4.488 +
   4.489 +      <section id="mediasource-algorithms">
   4.490 +        <h3>Algorithms</h3>
   4.491 +
   4.492 +        <section id="mediasource-attach">
   4.493 +          <h4>Attaching to a media element</h4>
   4.494 +          <p> A <a>MediaSource</a> object can be attached to a media element by assigning a <a def-id="MediaSource-object-URL"></a> to the media element <a def-id="media-src"></a> attribute or the src attribute of a &lt;source&gt; inside a media element. A <a def-id="MediaSource-object-URL"></a> is created by passing a MediaSource object to <a def-id="createObjectURL"></a>.</p>
   4.495 +          <p>If the <a def-id="resource-fetch-algorithm"></a> absolute URL matches the MediaSource object URL, run the following steps right before the "Perform a potentially
   4.496 +            CORS-enabled fetch" step in the <a def-id="resource-fetch-algorithm"></a>.</p>
   4.497 +          <ol>
   4.498 +            <dl class="switch">
   4.499 +              <dt>If <a def-id="readyState"></a> is NOT set to <a def-id="closed"></a></dt>
   4.500 +              <dd>Run the <a def-id="media-data-cannot-be-fetched"></a> steps of the <a def-id="resource-fetch-algorithm"></a>.</dd>
   4.501 +              <dt>Otherwise</dt>
   4.502 +              <dd>
   4.503 +                <ol>
   4.504 +                  <li>Set the <a def-id="readyState"></a> attribute to <a def-id="open"></a>.</li>
   4.505 +                  <li>
   4.506 +                    <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="sourceopen"></a> at the <a>MediaSource</a>.</li>
   4.507 +                  <li>Allow the <a def-id="resource-fetch-algorithm"></a> to progress based on data passed in via <a def-id="append"></a>.</li>
   4.508 +                </ol>
   4.509 +              </dd>
   4.510 +            </dl>
   4.511 +          </ol>
   4.512 +        </section>
   4.513 +
   4.514 +        <section id="mediasource-detach">
   4.515 +          <h4>Detaching from a media element</h4>
   4.516 +          <p>The following steps are run in any case where the media element is going to transition to <a def-id="videoref" name="dom-media-network_empty">NETWORK_EMPTY</a> and <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="videoref" name="event-mediacontroller-emptied">emptied</a> at the media element. These steps should be run right before the transition.</p>
   4.517 +          <ol>
   4.518 +            <li>Set the <a def-id="readyState"></a> attribute to <a def-id="closed"></a>.</li>
   4.519 +            <li>Set the <a def-id="duration"></a> attribute to NaN.</li>
   4.520 +            <li>Remove all the <a>SourceBuffer</a> objects from <a def-id="activeSourceBuffers"></a>.</li>
   4.521 +            <li>
   4.522 +              <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="removesourcebuffer"></a> at <a def-id="activeSourceBuffers"></a>.</li>
   4.523 +            <li>Remove all the <a>SourceBuffer</a> objects from <a def-id="sourceBuffers"></a>.</li>
   4.524 +            <li>
   4.525 +              <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="removesourcebuffer"></a> at <a def-id="sourceBuffers"></a>.</li>
   4.526 +            <li>
   4.527 +              <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="sourceclose"></a> at the <a>MediaSource</a>.</li>
   4.528 +          </ol>
   4.529 +        </section>
   4.530 +
   4.531 +        <section id="mediasource-seeking">
   4.532 +          <h4>Seeking</h4>
   4.533 +          <p>Run the following steps as part of the "<i>Wait until the user agent has established whether or not the media data for the new playback position is available, and, if it is, until it has decoded enough data to play back that position"</i> step of the <a def-id="hme-seek-algorithm"></a>:</p>
   4.534 +          <ol>
   4.535 +            <li>The media element looks for <a def-id="media-segments"></a> containing the <var title="true">new playback position</var> in each <a>SourceBuffer</a> object in <a def-id="activeSourceBuffers"></a>.</li>
   4.536 +            <dl class="switch">
   4.537 +	      <dt>If one or more of the objects in <a def-id="activeSourceBuffers"></a> is missing <a def-id="media-segments"></a> for the <var title="true">new playback position</var>
   4.538 +              </dt>
   4.539 +	      <dd>
   4.540 +	        <ol>
   4.541 +	          <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-metadata"></a>.</li>
   4.542 +	          <li>The media element waits for the necessary <a def-id="media-segments"></a> to be passed to <a def-id="append"></a>. The web application can use <a def-id="buffered"></a> to determine what the media element needs to resume playback.</li>
   4.543 +	        </ol>
   4.544 +	      </dd>
   4.545 +	      <dt>Otherwise</dt>
   4.546 +	      <dd>Continue</dd>
   4.547 +            </dl>
   4.548 +            <li>The media element resets all decoders and initializes each one with data from the appropriate <a def-id="init-segment"></a>.</li>
   4.549 +            <li>The media element feeds data from the <a def-id="media-segments"></a> into the decoders until the <var title="true">new playback position</var> is reached.</li>
   4.550 +            <li>Resume the <a def-id="hme-seek-algorithm"></a> at the "<i>Await a stable state</i>" step.</li>
   4.551 +          </ol>
   4.552 +        </section>
   4.553 +
   4.554 +
   4.555 +        <section id="buffer-monitoring">
   4.556 +          <h4>SourceBuffer Monitoring</h4>
   4.557 +          <p>The following steps are periodically run during playback to make sure that all of the <a>SourceBuffer</a> objects in <a def-id="activeSourceBuffers"></a> have enough data to ensure uninterrupted playback. Appending new segments and changes to <a def-id="activeSourceBuffers"></a> also cause these steps to run because they affect the conditions that trigger state transitions. The web application can monitor changes in <a def-id="ready-state"></a> to drive <a def-id="media-segment"></a> appending.</p>
   4.558 +          <dl class="switch">
   4.559 +            <dt>If <a def-id="buffered"></a> for all objects in <a def-id="activeSourceBuffers"></a> do not contain <a def-id="timeranges"></a> for the current playback position:</dt>
   4.560 +            <dd>
   4.561 +	      <ol>
   4.562 +	        <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-metadata"></a>.</li>
   4.563 +	        <li>If this is the first transition to <a def-id="have-metadata"></a>, then <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="loadedmetadata"></a> at the media element.</li>
   4.564 +	        <li>Abort these steps.</li>
   4.565 +	      </ol>
   4.566 +            </dd>
   4.567 +            <dt>If <a def-id="buffered"></a> for all objects in <a def-id="activeSourceBuffers"></a> contain <a def-id="timeranges"></a> that include the current playback position and enough data to ensure uninterrupted playback:</dt>
   4.568 +            <dd>
   4.569 +	      <ol>
   4.570 +	        <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-enough-data"></a>.</li>
   4.571 +	        <li>
   4.572 +                  <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="canplaythrough"></a> at the media element.</li>
   4.573 +	        <li>Playback may resume at this point if it was previously suspended by a transition to <a def-id="have-current-data"></a>.</li>
   4.574 +	        <li>Abort these steps.</li>
   4.575 +	      </ol>
   4.576 +            </dd>
   4.577 +            <dt>If <a def-id="buffered"></a> for at least one object in <a def-id="activeSourceBuffers"></a> contains a <a def-id="timerange"></a> that includes the current playback position but not enough data to ensure uninterrupted playback:</dt>
   4.578 +            <dd>
   4.579 +	      <ol>
   4.580 +	        <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-future-data"></a>.</li>
   4.581 +	        <li>If the previous value of <a def-id="ready-state"></a> was less than <a def-id="have-future-data"></a>, then <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="canplay"></a> at the media element.</li>
   4.582 +	        <li>Playback may resume at this point if it was previously suspended by a transition to <a def-id="have-current-data"></a>.</li>
   4.583 +	        <li>Abort these steps.</li>
   4.584 +	      </ol>
   4.585 +            </dd>
   4.586 +            <dt>If <a def-id="buffered"></a> for at least one object in <a def-id="activeSourceBuffers"></a> contains a <a def-id="timerange"></a> that ends at the current playback position and does not have a range covering the time immediately after the current position:</dt>
   4.587 +            <dd>
   4.588 +	      <ol>
   4.589 +	        <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-current-data"></a>.</li>
   4.590 +	        <li>If this is the first transition to <a def-id="have-current-data"></a>, then <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="loadeddata"></a> at the media element.</li>
   4.591 +	        <li>Playback is suspended at this point since the media element doesn't have enough data to advance the timeline.</li>
   4.592 +	        <li>Abort these steps.</li>
   4.593 +	      </ol>
   4.594 +            </dd>
   4.595 +          </dl>
   4.596 +        </section>
   4.597 +
   4.598 +        <section id="active-source-buffer-changes">
   4.599 +          <h4>Changes to selected/enabled track state</h4>
   4.600 +          <p>During playback <a def-id="activeSourceBuffers"></a> needs to be updated if the <a def-id="videoref" name="dom-videotrack-selected">selected video track</a>, the <a def-id="videoref" name="dom-audiotrack-enabled">enabled audio tracks</a>, or a text track <a def-id="videoref" name="dom-texttrack-mode">mode</a> changes. When one or more of these changes occur the following steps need to be followed.</p>
   4.601 +          <dl class="switch">
   4.602 +            <dt>If the selected video track changes:</dt>
   4.603 +            <dd>
   4.604 +	      <ol>
   4.605 +	        <li>If the <a>SourceBuffer</a> associated with the previously selected video track is not associated with any other enabled tracks, run the following steps:
   4.606 +  	          <ol>
   4.607 +	            <li>Remove the <a>SourceBuffer</a> from <a def-id="activeSourceBuffers"></a>.</li>
   4.608 +	            <li>
   4.609 +                      <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="removesourcebuffer"></a> at <a def-id="activeSourceBuffers"></a>
   4.610 +                    </li>
   4.611 +	          </ol>
   4.612 +	        </li>
   4.613 +	        <li>If the <a>SourceBuffer</a> associated with the newly selected video track is not already in <a def-id="activeSourceBuffers"></a>, run the following steps:
   4.614 +	          <ol>
   4.615 +	            <li>Add the <a>SourceBuffer</a> to <a def-id="activeSourceBuffers"></a>.</li>
   4.616 +	            <li>
   4.617 +                      <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="addsourcebuffer"></a> at <a def-id="activeSourceBuffers"></a>
   4.618 +                    </li>
   4.619 +	          </ol>
   4.620 +	        </li>
   4.621 +	      </ol>
   4.622 +            </dd>
   4.623 +            <dt>If an audio track becomes disabled and the <a>SourceBuffer</a> associated with this track is not associated with any other enabled or selected track</dt>
   4.624 +            <dd>
   4.625 +	      <ol>
   4.626 +	        <li>Remove the <a>SourceBuffer</a> associated with the audio track from <a def-id="activeSourceBuffers"></a>
   4.627 +                </li>
   4.628 +	        <li>
   4.629 +                  <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="removesourcebuffer"></a> at <a def-id="activeSourceBuffers"></a>
   4.630 +                </li>
   4.631 +	      </ol>
   4.632 +            </dd>
   4.633 +            <dt>If an audio track becomes enabled and the <a>SourceBuffer</a> associated with this track is not already in <a def-id="activeSourceBuffers"></a>
   4.634 +            </dt>
   4.635 +            <dd>
   4.636 +	      <ol>
   4.637 +	        <li>Add the <a>SourceBuffer</a> associated with the audio track to <a def-id="activeSourceBuffers"></a>
   4.638 +                </li>
   4.639 +	        <li>
   4.640 +                  <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="addsourcebuffer"></a> at <a def-id="activeSourceBuffers"></a>
   4.641 +                </li>
   4.642 +	      </ol>
   4.643 +            </dd>
   4.644 +            <dt>If a text track <a def-id="videoref" name="dom-texttrack-mode">mode</a> becomes <a def-id="videoref" name="dom-texttrack-disabled">"disabled"</a> and the <a>SourceBuffer</a> associated with this track is not associated with any other enabled or selected track</dt>
   4.645 +            <dd>
   4.646 +	      <ol>
   4.647 +	        <li>Remove the <a>SourceBuffer</a> associated with the text track from <a def-id="activeSourceBuffers"></a>
   4.648 +                </li>
   4.649 +	        <li>
   4.650 +                  <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="removesourcebuffer"></a> at <a def-id="activeSourceBuffers"></a>
   4.651 +                </li>
   4.652 +	      </ol>
   4.653 +            </dd>
   4.654 +            <dt>If a text track <a def-id="videoref" name="dom-texttrack-mode">mode</a> becomes <a def-id="videoref" name="dom-texttrack-showing">"showing"</a> or <a def-id="videoref" name="dom-texttrack-hidden">"hidden"</a> and the <a>SourceBuffer</a> associated with this track is not already in <a def-id="activeSourceBuffers"></a>
   4.655 +            </dt>
   4.656 +            <dd>
   4.657 +	      <ol>
   4.658 +	        <li>Add the <a>SourceBuffer</a> associated with the text track to <a def-id="activeSourceBuffers"></a>
   4.659 +                </li>
   4.660 +	        <li>
   4.661 +                  <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="addsourcebuffer"></a> at <a def-id="activeSourceBuffers"></a>
   4.662 +                </li>
   4.663 +	      </ol>
   4.664 +            </dd>
   4.665 +          </dl>
   4.666 +        </section>
   4.667 +
   4.668 +        <section id="duration-change-algorithm">
   4.669 +          <h4>Duration change</h4>
   4.670 +          <p>Follow these steps when <a def-id="duration"></a> needs to change to a <var>new duration</var>.</p>
   4.671 +          <ol>
   4.672 +            <li>If the current value of <a def-id="duration"></a> is equal to <var>new duration</var>, then abort these steps.</li>
   4.673 +            <li>Update <a def-id="duration"></a> to <var>new duration</var>.</li>
   4.674 +            <li>Remove all media data with timestamps that are greater than <var>new duration</var> from all <a>SourceBuffer</a> objects in <a def-id="sourceBuffers"></a>.
   4.675 +              <p class="note">This preserves audio frames that start before and end after the <a def-id="duration"></a>. The user agent must end playback at <a def-id="duration"></a> even if the audio frame extends beyond this time.</p>
   4.676 +            </li>
   4.677 +            <li>Update the <a def-id="hme-duration"></a> to <var>new duration</var> and run the <a def-id="hme-duration-change-algorithm"></a>.</li>
   4.678 +          </ol>
   4.679 +        </section>
   4.680 +      </section>
   4.681 +    </section>
   4.682 +
   4.683 +    <section id="sourcebuffer">
   4.684 +      <h2>SourceBuffer Object</h2>
   4.685 +
   4.686 +      <dl title="interface SourceBuffer : EventTarget" class="idl">
   4.687 +        <dt>readonly attribute TimeRanges buffered</dt>
   4.688 +        <dd>
   4.689 +          <p>Indicates what <a def-id="timeranges"></a> are buffered in the <a>SourceBuffer</a>.</p>
   4.690 +          <p>When the attribute is read the following steps must occur:</p>
   4.691 +          <ol>
   4.692 +            <li>If this object has been removed from the <a def-id="sourceBuffers"></a> attribute of the <a def-id="parent-media-source"></a> then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.693 +            <li>Return a new static <a def-id="normalized-timeranges-object"></a> for the <a def-id="media-segments"></a> buffered.</li>
   4.694 +          </ol>
   4.695 +        </dd>
   4.696 +
   4.697 +        <dt>attribute double timestampOffset</dt>
   4.698 +        <dd>
   4.699 +          <p>Controls the offset applied to timestamps inside subsequent <a def-id="media-segments"></a> that are appended to this <a>SourceBuffer</a>. The <a def-id="timestampOffset"></a> is initially set to 0 which indicates that no offset is being applied.</p>
   4.700 +          <p> On getting, the initial value or the last value that was successfully set is returned.</p>
   4.701 +          <p>On setting, run following steps:</p>
   4.702 +          <ol>
   4.703 +            <li>If this object has been removed from the <a def-id="sourceBuffers"></a> attribute of the <a def-id="parent-media-source"></a>, then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.704 +            <li>If the <a def-id="readyState"></a> attribute of the <a def-id="parent-media-source"></a> is not in the <a def-id="open"></a> state, then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.705 +            <li>If this object is waiting for the end of a <a def-id="media-segment"></a> to be appended, then throw an <a def-id="invalid-state-err"></a> and abort these steps.</li>
   4.706 +            <li>Update the attribute to the new value.</li>
   4.707 +          </ol>
   4.708 +        </dd>
   4.709 +
   4.710 +        <dt>void append(Uint8Array data)</dt>
   4.711 +        <dd>
   4.712 +          <p>Appends segment data to the source buffer.</p>
   4.713 +
   4.714 +          <p>When this method is invoked, the user agent must run the following steps:</p>
   4.715 +          <ol>
   4.716 +            <li>If <var title="true">data</var> is null then throw an <a def-id="invalid-access-err"></a> exception and abort these steps.</li>
   4.717 +            <li>If this object has been removed from the <a def-id="sourceBuffers"></a> attribute of the <a def-id="parent-media-source"></a> then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.718 +            <li>If the <a def-id="readyState"></a> attribute of the <a def-id="parent-media-source"></a> is in the <a def-id="closed"></a> state then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.719 +            <li>
   4.720 +              <p>If the <a def-id="readyState"></a> attribute of the <a def-id="parent-media-source"></a> is in the <a def-id="ended"></a> state then run the following steps:</p>
   4.721 +              <ol>
   4.722 +	        <li>Set the <a def-id="readyState"></a> attribute of the <a def-id="parent-media-source"></a> to <a def-id="open"></a>
   4.723 +                </li>
   4.724 +	        <li>
   4.725 +                  <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="sourceopen"></a> at the <a def-id="parent-media-source"></a> .</li>
   4.726 +              </ol>
   4.727 +            </li>
   4.728 +            <li>If <var title="true">data</var>.byteLength is 0, then abort these steps.</li>
   4.729 +            <li>Add <var title="true">data</var> to the end of the <a def-id="input-buffer"></a>
   4.730 +            </li>
   4.731 +            <li>Run the <a def-id="segment-parser-loop"></a>.</li>
   4.732 +          </ol>
   4.733 +        </dd>
   4.734 +
   4.735 +        <dt>void abort()</dt>
   4.736 +        <dd>
   4.737 +          <p>Aborts the current segment and resets the segment parser.</p>
   4.738 +
   4.739 +          <p>When this method is invoked, the user agent must run the following steps:</p>
   4.740 +          <ol>
   4.741 +            <li>If this object has been removed from the <a def-id="sourceBuffers"></a> attribute of the <a def-id="parent-media-source"></a> then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.742 +            <li>If the <a def-id="readyState"></a> attribute of the <a def-id="parent-media-source"></a> is not in the <a def-id="open"></a> state then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.743 +            <li>The media element aborts parsing the current segment.</li>
   4.744 +            <li>If the <a def-id="append-state"></a> equals <a def-id="parsing-media-segment"></a> and the <a def-id="input-buffer"></a> contains some complete <a def-id="coded-frames"></a>, then run the <a def-id="coded-frame-processing-algorithm"></a> as if the media segment only contained these frames.</li>
   4.745 +            <li>Remove all bytes from the <a def-id="input-buffer"></a>.</li>
   4.746 +            <li>Set <a def-id="append-state"></a> to <a def-id="waiting-for-segment"></a>.</li>
   4.747 +          </ol>
   4.748 +        </dd>
   4.749 +
   4.750 +        <dt>void remove(double start, double end)</dt>
   4.751 +        <dd>
   4.752 +          <p>Removes media for a specific time range.</p>
   4.753 +
   4.754 +          <p>When this method is invoked, the user agent must run the following steps:</p>
   4.755 +          <ol>
   4.756 +            <li>If <var title="true">start</var> is negative or greater than <a def-id="duration"></a>, then throw an <a def-id="invalid-access-err"></a> exception and abort these steps.</li>
   4.757 +            <li>If <var title="true">end</var> is less than or equal to <var title="true">start</var>, then throw an <a def-id="invalid-access-err"></a> exception and abort these steps.</li>
   4.758 +            <li>If this object has been removed from the <a def-id="sourceBuffers"></a> attribute of the <a def-id="parent-media-source"></a> then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.759 +            <li>If the <a def-id="readyState"></a> attribute of the <a def-id="parent-media-source"></a> is not in the <a def-id="open"></a> state then throw an <a def-id="invalid-state-err"></a> exception and abort these steps.</li>
   4.760 +            <li>
   4.761 +              <p>For each track in this source buffer, run the following steps:</p>
   4.762 +              <ol>
   4.763 +	        <li>
   4.764 +	          <p>Let <var title="true">next random access point timestamp</var> be the timestamp of the next <a def-id="random-access-point"></a>, for this track, that is greater than or equal to <var title="true">end</var>.</p>
   4.765 +	          <p class="note"><var title="true">next random access point timestamp</var> can be different across tracks because the dependencies between <a def-id="coded-frames"></a> within a track are usually different than the dependencies in another track.</p>
   4.766 +                </li>
   4.767 +	        <li>Remove all media data, for this track, that contain starting timestamps greater than or equal to <var title="true">start</var> and less than the <var title="true">next random access point timestamp</var>.</li>
   4.768 +	      </ol>
   4.769 +            </li>
   4.770 +        </ol>
   4.771 +
   4.772 +        </dd>
   4.773 +      </dl>
   4.774 +
   4.775 +      <section id="sourcebuffer-algorithms">
   4.776 +        <h3>Algorithms</h3>
   4.777 +
   4.778 +        <section id="sourcebuffer-segment-parser-loop">
   4.779 +          <h4>Segment Parser Loop</h4>
   4.780 +          <p>All SourceBuffer objects have an internal <dfn id="sourcebuffer-append-state">append state</dfn> variable that keeps track of the high-level segment parsing state. It is initially set to <a def-id="waiting-for-segment"></a> and can transition to the following states as data is appended.</p>
   4.781 +          <table class="old-table">
   4.782 +            <thead>
   4.783 +	      <tr>
   4.784 +                <th>Append state name</th>
   4.785 +                <th>Description</th>
   4.786 +              </tr>
   4.787 +            </thead>
   4.788 +            <tbody>
   4.789 +              <tr>
   4.790 +                <td><dfn id="sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</dfn></td>
   4.791 +                <td>Waiting for the start of an <a def-id="init-segment"></a> or <a def-id="media-segment"></a> to be appended.</td>
   4.792 +              </tr>
   4.793 +              <tr>
   4.794 +                <td><dfn id="sourcebuffer-parsing-init-segment">PARSING_INIT_SEGMENT</dfn></td>
   4.795 +                <td>Currently parsing an <a def-id="init-segment"></a>.</td>
   4.796 +              </tr>
   4.797 +	      <tr>
   4.798 +	        <td><dfn id="sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</dfn></td>
   4.799 +                <td>Currently parsing a <a def-id="media-segment"></a>.</td>
   4.800 +              </tr>
   4.801 +            </tbody>
   4.802 +          </table>
   4.803 +          
   4.804 +          <p>The <dfn id="sourcebuffer-input-buffer">input buffer</dfn> is a byte buffer that is used to hold unparsed bytes across <a def-id="append"></a> calls. The buffer is empty when the SourceBuffer object is created.</p>
   4.805 +
   4.806 +          <p>While the <a def-id="input-buffer"></a> is not empty, run the following steps in a loop:</p>
   4.807 +          <ol>
   4.808 +            <li>If the <a def-id="input-buffer"></a> starts with bytes that violate the <a def-id="byte-stream-format-specs"></a>, then call <a def-id="eos-decode"></a>, and abort this algorithm.</li>
   4.809 +            <li>Remove any bytes that the <a def-id="byte-stream-format-specs"></a> say should be ignored from the start of the <a def-id="input-buffer"></a>.</li>
   4.810 +            <li>
   4.811 +	      <p>If the <a def-id="append-state"></a> equals <a def-id="waiting-for-segment"></a>, then run the following steps:</p>
   4.812 +	      <ol>
   4.813 +	        <li>If the beginning of the <a def-id="input-buffer"></a> indicates the start of an <a def-id="init-segment"></a>, set the <a def-id="append-state"></a> to <a def-id="parsing-init-segment"></a>.</li>
   4.814 +	        <li>If the beginning of the <a def-id="input-buffer"></a> indicates the start of an <a def-id="media-segment"></a>, set <a def-id="append-state"></a> to <a def-id="parsing-media-segment"></a>.</li>
   4.815 +	        <li>Return  to the top of the loop.</li>
   4.816 +	      </ol>
   4.817 +            </li>
   4.818 +            <li>
   4.819 +	      <p>If the <a def-id="append-state"></a> equals <a def-id="parsing-init-segment"></a>, then run the following steps:</p>
   4.820 +	      <ol>
   4.821 +	        <li>If the <a def-id="input-buffer"></a> does not contain a complete <a def-id="init-segment"></a> yet, then exit the loop.</li>
   4.822 +	        <li>Run the <a def-id="init-segment-received-algorithm"></a>.</li>
   4.823 +	        <li>Remove the <a def-id="init-segment"></a> bytes from the beginning of the <a def-id="input-buffer"></a>.</li>
   4.824 +	        <li>Set <a def-id="append-state"></a> to <a def-id="waiting-for-segment"></a>.</li>
   4.825 +	        <li>Return  to the top of the loop.</li>
   4.826 +	      </ol>
   4.827 +            </li>
   4.828 +            <li>
   4.829 +	      <p>If the <a def-id="append-state"></a> equals <a def-id="parsing-media-segment"></a>, then run the following steps:</p>
   4.830 +	      <ol>
   4.831 +	        <li>
   4.832 +	          <p>If the <a def-id="input-buffer"></a> does not contain a complete <a def-id="media-segment"></a> header yet, then exit the loop.</p>
   4.833 +	          <p class="note">Implementations may choose to implement this state as an incremental parser so that it is not necessary to have the entire media segment before running the <a def-id="coded-frame-processing-algorithm"></a>.</p>
   4.834 +	        </li>
   4.835 +	        <li>Run the <a def-id="coded-frame-processing-algorithm"></a>.</li>
   4.836 +	        <li>Remove the <a def-id="media-segment"></a> bytes from the beginning of the <a def-id="input-buffer"></a>.</li>
   4.837 +	        <li>
   4.838 +	          <p>Set <a def-id="append-state"></a> to <a def-id="waiting-for-segment"></a>.</p>
   4.839 +	          <p class="note">Incremental parsers should only do this transition after the entire media segment has been received.</p>
   4.840 +	        </li>
   4.841 +	        <li>Return  to the top of the loop.</li>
   4.842 +	      </ol>
   4.843 +            </li>
   4.844 +          </ol>
   4.845 +        </section>
   4.846 +
   4.847 +        <section id="sourcebuffer-init-segment-received">
   4.848 +          <h4>Initialization Segment Received</h4>
   4.849 +          <p>The following steps are run when the <a def-id="segment-parser-loop"></a> successfully parses a complete <a def-id="init-segment"></a>:</p>
   4.850 +          <ol>
   4.851 +            <li>Update the <a def-id="duration"></a> attribute if it currently equals NaN:</li>
   4.852 +            <dl class="switch">
   4.853 +	      <dt>If the initialization segment contains a duration:</dt>
   4.854 +	      <dd>Run the <a def-id="duration-change-algorithm"></a> with <var>new duration</var> set to the duration in the initialization segment.</dd>
   4.855 +	      <dt>Otherwise:</dt>
   4.856 +	      <dd>Run the <a def-id="duration-change-algorithm"></a> with <var>new duration</var> set to positive Infinity.</dd>
   4.857 +            </dl>
   4.858 +            <li>Handle state transitions:</li>
   4.859 +            <dl class="switch">
   4.860 +	      <dt>If the <a def-id="ready-state"></a> attribute is <a def-id="have-nothing"></a>:</dt>
   4.861 +	      <dd>
   4.862 +	        <ol>
   4.863 +	          <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-metadata"></a>.</li>
   4.864 +	          <li>
   4.865 +                    <a def-id="Queue-a-task-to-fire-an-event-named"></a>  <a def-id="loadedmetadata"></a> at the media element.</li>
   4.866 +	        </ol>
   4.867 +	      </dd>
   4.868 +	      <dt>If the <a def-id="ready-state"></a> attribute is greater than <a def-id="have-current-data"></a> and the <a def-id="init-segment"></a> contains the first video or first audio track in the presentation:</dt>
   4.869 +	      <dd>
   4.870 +	        Set the <a def-id="ready-state"></a> attribute to <a def-id="have-metadata"></a>.
   4.871 +	      </dd>
   4.872 +	      <dt>Otherwise:</dt>
   4.873 +	      <dd>Continue</dd>
   4.874 +            </dl>
   4.875 +            <li>Update <a def-id="audiotracks"></a>
   4.876 +            </li>
   4.877 +            <dl class="switch">
   4.878 +	      <dt>If <a def-id="init-segment"></a> contains the first audio track:</dt>
   4.879 +	      <dd>
   4.880 +	        <ol>
   4.881 +	          <li>Add an <a def-id="audio-track"></a> and mark it as enabled.</li>
   4.882 +	          <li>Add this <a>SourceBuffer</a> to <a def-id="activeSourceBuffers"></a>.</li>
   4.883 +	        </ol>
   4.884 +	      </dd>
   4.885 +	      <dt>If <a def-id="init-segment"></a> contains audio tracks beyond those already in the presentation:</dt>
   4.886 +	      <dd>Add a disabled <a def-id="audio-track"></a> for each audio track in the <a def-id="init-segment"></a>.</dd>
   4.887 +            </dl>
   4.888 +            <li>Update <a def-id="videotracks"></a>:</li>
   4.889 +            <dl class="switch">
   4.890 +	      <dt>If <a def-id="init-segment"></a> contains the first video track:</dt>
   4.891 +	      <dd>
   4.892 +	        <ol>
   4.893 +	          <li>Add a <a def-id="video-track"></a> and mark it as selected.</li>
   4.894 +	          <li>Add this <a>SourceBuffer</a> to <a def-id="activeSourceBuffers"></a>.</li>
   4.895 +	        </ol>
   4.896 +	      </dd>
   4.897 +	      <dt>If <a def-id="init-segment"></a> contains the video tracks beyond those already in the presentation:</dt>
   4.898 +	      <dd>Add a disabled <a def-id="video-track"></a> for each video track in the <a def-id="init-segment"></a>.</dd>
   4.899 +            </dl>
   4.900 +            <li>Update <a def-id="texttracks"></a>
   4.901 +            </li>
   4.902 +            <dl class="switch">
   4.903 +	      <dd>
   4.904 +	        <ol>
   4.905 +	          <li>Add a <a def-id="text-track"></a> for each text track in the <a def-id="init-segment"></a>.</li>
   4.906 +	          <li>If the text track <a def-id="videoref" name="dom-texttrack-mode">mode</a> is <a def-id="videoref" name="dom-texttrack-showing">"showing"</a> or <a def-id="videoref" name="dom-texttrack-hidden">"hidden"</a> then add this <a>SourceBuffer</a> to <a def-id="activeSourceBuffers"></a>.</li>
   4.907 +	        </ol>
   4.908 +	      </dd>
   4.909 +            </dl>
   4.910 +          </ol>
   4.911 +        </section>
   4.912 +
   4.913 +        <section id="sourcebuffer-coded-frame-processing">
   4.914 +          <h4>Coded Frame Processing</h4>
   4.915 +          <p>When a complete <a def-id="coded-frame"></a> has been parsed by the <a def-id="segment-parser-loop"></a> then the following steps are run:</p>
   4.916 +          <ol>
   4.917 +            <li>
   4.918 +	      <p>For each <a def-id="coded-frame"></a> in the <a def-id="media-segment"></a> run the following steps:</p>
   4.919 +	      <ol>
   4.920 +	        <li>Let <var>presentation timestamp</var> be a double precision floating point representation of the coded frame's presentation timestamp.</li>
   4.921 +	        <li>Let <var>decode timestamp</var> be a double precision floating point representation of the coded frame's decode timestamp.</li>
   4.922 +	        <li>
   4.923 +	          <p>If <a def-id="timestampOffset"></a> is not 0, then run the following steps:</p>
   4.924 +	          <ol>
   4.925 +	            <li>Add <a def-id="timestampOffset"></a> to the <var>presentation timestamp</var>.</li>
   4.926 +	            <li>Add <a def-id="timestampOffset"></a> to the <var>decode timestamp</var>.</li>
   4.927 +	            <li>If the <var>presentation timestamp</var> or <var>decode timestamp</var> is less than the <a def-id="presentation-start-time"></a>, then call <a def-id="eos-decode"></a>, and abort these steps.</li>
   4.928 +	          </ol>
   4.929 +	        </li>
   4.930 +	        <li>Add the <a def-id="coded-frame"></a> with the <var>presentation timestamp</var> and <var title="true">decode timestamp</var>, to the source buffer.</li>
   4.931 +	      </ol>
   4.932 +            </li>
   4.933 +            <li>
   4.934 +              <p>If the <a def-id="ready-state"></a> attribute is <a def-id="have-metadata"></a> and the new <a def-id="coded-frames"></a> cause all objects in <a def-id="activeSourceBuffers"></a> to have media data for the current playback position, then run the following steps:</p>
   4.935 +	      <ol>
   4.936 +	        <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-current-data"></a>.</li>
   4.937 +	        <li>If this is the first transition to <a def-id="have-current-data"></a>, then <a def-id="queue-a-task-to-fire-an-event-named"></a> <a def-id="loadeddata"></a> at the media element.</li>
   4.938 +	      </ol>
   4.939 +            </li>
   4.940 +            <li>
   4.941 +	      <p>If the <a def-id="ready-state"></a> attribute is <a def-id="have-current-data"></a> and the new <a def-id="coded-frames"></a> cause all objects in <a def-id="activeSourceBuffers"></a> to have media data beyond the current playback position, then run the following steps:</p>
   4.942 +	      <ol>
   4.943 +	        <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-future-data"></a>.</li>
   4.944 +	        <li>
   4.945 +                  <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="canplay"></a> at the media element.</li>
   4.946 +	      </ol>
   4.947 +            </li>
   4.948 +            <li>
   4.949 +	      <p>If the <a def-id="ready-state"></a> attribute is <a def-id="have-future-data"></a> and the new <a def-id="coded-frames"></a> cause all objects in <a def-id="activeSourceBuffers"></a> to have enough data to start playback, then run the following steps:</p>
   4.950 +	      <ol>
   4.951 +	        <li>Set the <a def-id="ready-state"></a> attribute to <a def-id="have-enough-data"></a>.</li>
   4.952 +	        <li>
   4.953 +                  <a def-id="Queue-a-task-to-fire-an-event-named"></a> <a def-id="canplaythrough"></a> at the media element.</li>
   4.954 +	      </ol>
   4.955 +            </li>
   4.956 +            <li>If the <a def-id="media-segment"></a> contains data beyond the current <a def-id="duration"></a>, then run the <a def-id="duration-change-algorithm"></a> with <var>new duration</var> set to the maximum of the current duration and the highest end timestamp reported by <a def-id="hme-buffered"></a>.</li>
   4.957 +          </ol>
   4.958 +        </section>
   4.959 +      </section>
   4.960 +    </section>
   4.961 +
   4.962 +    <section id="sourcebufferlist">
   4.963 +      <h2>SourceBufferList Object</h2>
   4.964 +      <p>SourceBufferList is a simple container object for <a>SourceBuffer</a> objects. It provides read-only array access and fires events when the list is modified.</p>
   4.965 +
   4.966 +      <dl title="interface SourceBufferList : EventTarget" class="idl">
   4.967 +        <dt>readonly attribute unsigned long length</dt>
   4.968 +        <dd>
   4.969 +          <p>Indicates the number of <a>SourceBuffer</a> objects in the list.</p>
   4.970 +        </dd>
   4.971 +        <dt>getter SourceBuffer (unsigned long index)</dt>
   4.972 +        <dd>
   4.973 +          <p>Allows the SourceBuffer objects in the list to be accessed with an array operator (i.e. []).</p>
   4.974 +          <p>When this method is invoked, the user agent must run the following steps:</p>
   4.975 +          <ol>
   4.976 +            <li>If <var>index</var> is greater than or equal to the <a def-id="length"></a> attribute then return undefined and abort these steps.</li>
   4.977 +            <li>Return the <var>index</var>'th <a>SourceBuffer</a> object in the list.</li>
   4.978 +          </ol>
   4.979 +        </dd>
   4.980 +      </dl>
   4.981 +
   4.982 +      <section id="sourcebufferlist-events">
   4.983 +        <h3>Event Summary</h3>
   4.984 +        <table class="old-table">
   4.985 +          <thead>
   4.986 +            <tr>
   4.987 +              <th>Event name</th>
   4.988 +              <th>Interface</th>
   4.989 +              <th>Dispatched when...</th>
   4.990 +            </tr>
   4.991 +          </thead>
   4.992 +          <tbody>
   4.993 +            <tr>
   4.994 +              <td><a def-id="eventdfn">addsourcebuffer</a></td>
   4.995 +              <td><code>Event</code></td>
   4.996 +              <td>When a <a>SourceBuffer</a> is added to the list.</td>
   4.997 +            </tr>
   4.998 +            <tr>
   4.999 +              <td><a def-id="eventdfn">removesourcebuffer</a></td>
  4.1000 +              <td><code>Event</code></td>
  4.1001 +              <td>When a <a>SourceBuffer</a> is removed from the list.</td>
  4.1002 +            </tr>
  4.1003 +          </tbody>
  4.1004 +        </table>
  4.1005 +      </section>
  4.1006 +    </section>
  4.1007 +
  4.1008 +    <section id="url">
  4.1009 +      <h2>URL Object</h2>
  4.1010 +      <p></p>
  4.1011 +
  4.1012 +      <dl title="partial interface URL" class="idl">
  4.1013 +        <dt>static DOMString createObjectURL(MediaSource mediaSource)</dt>
  4.1014 +        <dd>
  4.1015 +          <p>Creates URLs for <a>MediaSource</a> objects.</p>
  4.1016 +          <p>When this method is invoked, the user agent must run the following steps:</p>
  4.1017 +          <ol>
  4.1018 +            <li>If <var>mediaSource</var> is NULL the return null.</li>
  4.1019 +            <li>Return a unique <a def-id="MediaSource-object-URL"></a> that can be used to dereference the <var>mediaSource</var> argument, and run the rest of the algorithm asynchronously.</li>
  4.1020 +            <li><a def-id="provide-a-stable-state"></a></li>
  4.1021 +            <li>Revoke the <a def-id="MediaSource-object-URL"></a> by calling <a def-id="file-revokeObjectURL"></a> on it.</li>
  4.1022 +          </ol>
  4.1023 +          <p class="note">This algorithm is intended to mirror the behavior of the <a def-id="FileAPI"></a> <a def-id="file-createObjectURL"></a> method with autoRevoke set to true.</p>
  4.1024 +        </dd>
  4.1025 +      </dl>
  4.1026 +    </section>
  4.1027 +
  4.1028 +    <section id="htmlmediaelement-attributes">
  4.1029 +      <h2>HTMLMediaElement attributes</h2>
  4.1030 +      <p>This section specifies what existing attributes on the <a def-id="videoref" name="htmlmediaelement">HTMLMediaElement</a> should return when a <a>MediaSource</a> is attached to the element.</p>
  4.1031 +
  4.1032 +      <p>The <a def-id="videoref" name="dom-media-seekable">HTMLMediaElement.seekable</a> attribute returns a new static <a def-id="normalized-timeranges-object"></a> created based on the following steps:</p>
  4.1033 +      <dl class="switch">
  4.1034 +        <dt>If <a def-id="duration"></a> equals NaN</dt>
  4.1035 +        <dd>Return an empty <a def-id="timeranges"></a> object.</dd>
  4.1036 +        <dt>If <a def-id="duration"></a> equals positive Infinity</dt>
  4.1037 +        <dd>Return a single range with a start time of 0 and an end time equal to the highest end time reported by the <a def-id="hme-buffered"></a> attribute.</dd>
  4.1038 +        <dt>Otherwise</dt>
  4.1039 +        <dd>Return a single range with a start time of 0 and an end time equal to <a def-id="duration"></a>.</dd>
  4.1040 +      </dl>
  4.1041 +
  4.1042 +      <p id="dom-htmlmediaelement.buffered">The <a def-id="hme-buffered"></a> attribute returns a new static <a def-id="normalized-timeranges-object"></a> created based on the following steps:</p>
  4.1043 +      <ol>
  4.1044 +        <li>Let <var>active ranges</var> be the ranges returned by <a def-id="buffered"></a> for each <a>SourceBuffer</a> object in <a def-id="activeSourceBuffers"></a>.</li>
  4.1045 +        <li>Let <var>intersection range</var> be the intersection of the <var>active ranges</var>.</li>
  4.1046 +        <li>
  4.1047 +          <p>If <a def-id="readyState"></a> is <a def-id="ended"></a>, then run the following steps:</p>
  4.1048 +          <ol>
  4.1049 +	    <li>Let <var>highest end time</var> be the largest end time in the <var>active ranges</var>.</li>
  4.1050 +	    <li>Let <var>highest intersection end time</var> be the highest end time in the <var>intersection range</var>.</li>
  4.1051 +	    <li>If the <var>highest intersection end time</var> is less than the <var>highest end time</var>, then update the <var>intersection range</var> so that the <var>highest intersection end time</var> equals the <var>highest end time</var>.</li>
  4.1052 +	  </ol>
  4.1053 +        </li>
  4.1054 +        <li>Return the <var>intersection range</var>.</li>
  4.1055 +      </ol>
  4.1056 +    </section>
  4.1057 +    
  4.1058 +    <section id="byte-stream-formats">
  4.1059 +      <h2>Byte Stream Formats</h2>
  4.1060 +      <p>The bytes provided through <a def-id="append"></a> for a <a>SourceBuffer</a> form a logical byte stream. The format of this byte stream depends on the media container format in use and is defined in a byte stream format specification. Byte stream format specifications based on WebM and the ISO Base Media File Format are provided below. If these formats are supported then the byte stream formats described below must be supported.</p>
  4.1061 +      <p>This section provides general requirements for all byte stream formats:</p>
  4.1062 +      <ul>
  4.1063 +        <li>A byte stream format specification may define <a def-id="init-segments"></a> and must define <a def-id="media-segments"></a>.</li>
  4.1064 +        <li>It must be possible to identify segment boundaries and segment type (initialization or media) by examining the byte stream alone.</li>
  4.1065 +        <li>The combination of an Initialization Segment and any contiguous sequence of Media Segments associated with it must:
  4.1066 +	  <ol>
  4.1067 +	    <li>Identify the number and type (audio, video, text, etc.) of tracks in the Segments</li>
  4.1068 +	    <li>Identify the decoding capabilities needed to decode each track (i.e. codec and codec parameters)</li>
  4.1069 +	    <li>If a track is encrypted, provide any encryption parameters necessary to decrypt the content (except the encryption key itself)</li>
  4.1070 +	    <li>For each track, provide all information necessary to decode and render the earliest <a def-id="random-access-point"></a> in the sequence of Media Segments and all subsequent samples in the sequence (in presentation time). This includes, in particular,
  4.1071 +	      <ul>
  4.1072 +	        <li>Information that determines the <a def-id="intrinsic-width-and-height"></a> of the video (specifically, this requires either the picture or pixel aspect ratio, together with the encoded resolution).</li>
  4.1073 +	        <li>Information necessary to convert the video decoder output to a format suitable for display</li>
  4.1074 +	      </ul>
  4.1075 +	    </li>
  4.1076 +	    <li>Identify the global presentation timestamp of every sample in the sequence of Media Segments</li>
  4.1077 +	    <p>For example, if I1 is associated with M1, M2, M3 then the above must hold for all the combinations I1+M1, I1+M2, I1+M1+M2, I1+M2+M3, etc.</p>
  4.1078 +	  </ol>
  4.1079 +        </li>
  4.1080 +      </ul>
  4.1081 +      <p>Byte stream specifications must at a minimum define constraints which ensure that the above requirements hold. Additional constraints may be defined, for example to simplify implementation.</p>
  4.1082 +
  4.1083 +      <p>Initialization segments are an optimization. They allow a byte stream format to avoid duplication of information in Media Segments that is the same for many Media Segments. Byte stream format specifications need not specify Initialization Segment formats, however. They may instead require that such information is duplicated in every Media Segment.</p>
  4.1084 +
  4.1085 +      <section id="webm" class="nonnormative">
  4.1086 +        <h3>WebM Byte Streams</h3>
  4.1087 +        <p>This section defines segment formats for implementations that choose to support WebM.</p>
  4.1088 +
  4.1089 +        <section id="webm-init-segments">
  4.1090 +          <h4>Initialization Segments</h4>
  4.1091 +          <p>A WebM <a def-id="init-segment"></a> must contain a subset of the elements at the start of a typical WebM file.</p>
  4.1092 +          <p>The following rules apply to WebM initialization segments:</p>
  4.1093 +          <ol>
  4.1094 +	    <li>The <a def-id="init-segment"></a> must start with an <a def-id="webm-ebml-header"></a> element, followed by a <a def-id="webm-segment"></a> header.</li>
  4.1095 +	    <li>The size value in the <a def-id="webm-segment"></a> header must signal an "unknown size" or contain a value large enough to include the <a def-id="webm-info"></a> and <a def-id="webm-tracks"></a> elements that follow.</li>
  4.1096 +	    <li>A <a def-id="webm-info"></a> element and a <a def-id="webm-tracks"></a> element must appear, in that order, after the <a def-id="webm-segment"></a> header and before any further <a def-id="webm-ebml-header"></a> or <a def-id="webm-cluster"></a> elements.</li>
  4.1097 +	    <li>Any elements other than an <a def-id="webm-ebml-header"></a> or a <a def-id="webm-cluster"></a> that occur before, in between, or after the <a def-id="webm-info"></a> and <a def-id="webm-tracks"></a> elements are ignored.</li>
  4.1098 +          </ol>
  4.1099 +        </section>
  4.1100 +
  4.1101 +        <section id="webm-media-segments">
  4.1102 +          <h4>Media Segments</h4>
  4.1103 +          <p>A WebM <a def-id="media-segment"></a> is a single <a def-id="webm-cluster"></a> element.</p>
  4.1104 +          <p>The following rules apply to WebM media segments:</p>
  4.1105 +          <ol>
  4.1106 +	    <li>The Timecode element in the <a def-id="webm-cluster"></a> contains a presentation timestamp in TimecodeScale units.</li>
  4.1107 +	    <li>The TimecodeScale in the <a def-id="webm-init-segment"></a> most recently appended applies to all timestamps in the <a def-id="webm-cluster"></a>
  4.1108 +            </li>
  4.1109 +	    <li>The Cluster header may contain an "unknown" size value. If it does then the end of the cluster is reached when another <a def-id="webm-cluster"></a> header or an element header that indicates the start of an <a def-id="webm-init-segment"></a> is encountered.</li>
  4.1110 +	    <li>Block &amp; SimpleBlock elements must be in time increasing order consistent with the <a def-id="webm-spec"></a>.</li>
  4.1111 +	    <li>If the most recent <a def-id="webm-init-segment"></a> describes multiple tracks, then blocks from all the tracks must be interleaved in time increasing order. At least one block from all audio and video tracks must be present.</li>
  4.1112 +	    <li>
  4.1113 +              <a def-id="webm-cues"></a> or <a def-id="webm-chapters"></a> elements may follow a <a def-id="webm-cluster"></a> element. These elements must be accepted and ignored by the user agent.</li>
  4.1114 +          </ol>
  4.1115 +        </section>
  4.1116 +
  4.1117 +        <section id="webm-random-access-points">
  4.1118 +          <h4>Random Access Points</h4>
  4.1119 +          <p>A SimpleBlock element with its Keyframe flag set signals the location of a <a def-id="random-access-point"></a> for that track. Media segments containing multiple tracks are only considered a random access point if the first SimpleBlock for each track has its Keyframe flag set. The order of the multiplexed blocks must conform to the <a def-id="webm-muxer-guidelines"></a>.</p>
  4.1120 +        </section>
  4.1121 +      </section>
  4.1122 +      
  4.1123 +      <section id="iso" class="nonnormative">
  4.1124 +        <h3>ISO Base Media File Format Byte Streams</h3>
  4.1125 +        <p>This section defines segment formats for implementations that choose to support the ISO Base Media File Format
  4.1126 +	  <a def-id="iso-14496-12"></a> (ISO BMFF).</p> 
  4.1127 +
  4.1128 +	<section id="iso-init-segments">
  4.1129 +          <h4>Initialization Segments</h4>
  4.1130 +          <p>An ISO BMFF <a def-id="init-segment"></a> must contain a single Movie Header Box (<span class="iso-box">moov</span>). The tracks in the Movie Header Box must not contain any samples (i.e. the <span class="iso-var">entry_count</span> in the <span class="iso-box">stts</span>, <span class="iso-box">stsc</span> and <span class="iso-box">stco</span> boxes must be set to zero). A Movie Extends (<span class="iso-box">mvex</span>) box must be contained in the
  4.1131 +	    Movie Header Box to indicate that Movie Fragments are to be expected.</p>
  4.1132 +          <p>The <a def-id="init-segment"></a> may contain Edit Boxes (<span class="iso-box">edts</span>) which provide a mapping of composition times for each track to the global presentation time.</p>
  4.1133 +	</section>
  4.1134 +        
  4.1135 +	<section id="iso-media-segments">
  4.1136 +          <h4>Media Segments</h4>
  4.1137 +          <p>An ISO BMFF <a def-id="media-segment"></a> must contain a single Movie Fragment Box (<span class="iso-box">moof</span>) followed by one or more Media Data Boxes (<span class="iso-box">mdat</span>).</p>
  4.1138 +          <p>The following rules apply to ISO BMFF media segments:</p>
  4.1139 +          <ol>
  4.1140 +	    <li>The Movie Fragment Box must contain at least one Track Fragment Box (<span class="iso-box">traf</span>).</li>
  4.1141 +	    <li>The Movie Fragment Box must use movie-fragment relative addressing and the flag <span class="iso-var">default-base-is-moof</span> must be set; absolute byte-offsets must not be used.</li>
  4.1142 +	    <li>External data references must not be used.</li>
  4.1143 +	    <li>If the Movie Fragment contains multiple tracks, the duration by which each track extends should be as close to equal as practical.</li>
  4.1144 +	    <li>Each Track Fragment Box must contain a Track Fragment Decode Time Box (<span class="iso-box">tfdt</span>)</li>
  4.1145 +	    <li>The first sample in each Track Fragment Run Box (<span class="iso-box">trun</span>) must indicate that the sample is a <a def-id="random-access-point"></a>.</li>
  4.1146 +	    <li>The Media Data Boxes must contain all the samples referenced by the Track Fragment Run Boxes (<span class="iso-box">trun</span>) of the Movie Fragment Box.</li>
  4.1147 +          </ol>
  4.1148 +	</section>
  4.1149 +
  4.1150 +	<section id="iso-random-access-points">
  4.1151 +          <h4>Random Access Points</h4>
  4.1152 +          <p>A <a def-id="random-access-point"></a> as defined in this specification corresponds to a Stream Access Point of type 1 or 2 as defined in Annex I of <a def-id="iso-14496-12"></a>.</p>
  4.1153 +	</section>
  4.1154 +      </section>
  4.1155 +    </section>
  4.1156 +
  4.1157 +    <section id="examples">
  4.1158 +      <h2>Examples</h2>
  4.1159 +      <p>Example use of the Media Source Extensions</p>
  4.1160 +      <div class="block">
  4.1161 +        <div class="blockContent">
  4.1162 +          <pre class="code">
  4.1163 +&lt;script&gt;
  4.1164 +  function onSourceOpen(videoTag, e) {
  4.1165 +    var mediaSource = e.target;
  4.1166 +    var sourceBuffer = mediaSource.addSourceBuffer('video/webm; codecs="vorbis,vp8"');
  4.1167 +
  4.1168 +    videoTag.addEventListener('seeking', onSeeking.bind(videoTag, mediaSource));
  4.1169 +    videoTag.addEventListener('progress', onProgress.bind(videoTag, mediaSource));
  4.1170 +
  4.1171 +    var initSegment = GetInitializationSegment();
  4.1172 +
  4.1173 +    if (initSegment == null) {
  4.1174 +      // Error fetching the initialization segment. Signal end of stream with an error.
  4.1175 +      mediaSource.endOfStream("network");
  4.1176 +      return;
  4.1177 +    }
  4.1178 +
  4.1179 +    // Append the initialization segment.
  4.1180 +    sourceBuffer.append(initSegment);
  4.1181 +
  4.1182 +    // Append some initial media data.
  4.1183 +    appendNextMediaSegment(mediaSource);
  4.1184 +  }
  4.1185 +
  4.1186 +  function appendNextMediaSegment(mediaSource) {
  4.1187 +    if (mediaSource.readyState == "ended")
  4.1188 +      return;
  4.1189 +
  4.1190 +    // If we have run out of stream data, then signal end of stream.
  4.1191 +    if (!HaveMoreMediaSegments()) {
  4.1192 +      mediaSource.endOfStream();
  4.1193 +      return;
  4.1194 +    }
  4.1195 +
  4.1196 +    var mediaSegment = GetNextMediaSegment();
  4.1197 +
  4.1198 +    if (!mediaSegment) {
  4.1199 +      // Error fetching the next media segment.
  4.1200 +      mediaSource.endOfStream("network");
  4.1201 +      return;
  4.1202 +    }
  4.1203 +
  4.1204 +    mediaSource.sourceBuffers[0].append(mediaSegment);
  4.1205 +  }
  4.1206 +
  4.1207 +  function onSeeking(mediaSource, e) {
  4.1208 +    var video = e.target;
  4.1209 +
  4.1210 +    // Abort current segment append.
  4.1211 +    mediaSource.sourceBuffers[0].abort();
  4.1212 +
  4.1213 +    // Notify the media segment loading code to start fetching data at the
  4.1214 +    // new playback position.
  4.1215 +    SeekToMediaSegmentAt(video.currentTime);
  4.1216 +
  4.1217 +    // Append media segments from the new playback position.
  4.1218 +    appendNextMediaSegment(mediaSource);
  4.1219 +    appendNextMediaSegment(mediaSource);
  4.1220 +  }
  4.1221 +
  4.1222 +  function onProgress(mediaSource, e) {
  4.1223 +    appendNextMediaSegment(mediaSource);
  4.1224 +  }
  4.1225 +&lt;/script&gt;
  4.1226 +
  4.1227 +&lt;video id="v" autoplay&gt; &lt;/video&gt;
  4.1228 +
  4.1229 +&lt;script&gt;
  4.1230 +  var video = document.getElementById('v');
  4.1231 +  var mediaSource = new MediaSource();
  4.1232 +  mediaSource.addEventListener('sourceopen', onSourceOpen.bind(this, video));
  4.1233 +  video.src = window.URL.createObjectURL(mediaSource);
  4.1234 +&lt;/script&gt;
  4.1235 +          </pre>
  4.1236 +        </div>
  4.1237 +      </div>
  4.1238 +    </section>
  4.1239 +
  4.1240 +    <section id="revision-history">
  4.1241 +      <h2>Revision History</h2>
  4.1242 +      <table class="old-table">
  4.1243 +        <thead>
  4.1244 +          <tr>
  4.1245 +            <th>Version</th>
  4.1246 +            <th>Comment</th>
  4.1247 +          </tr>
  4.1248 +        </thead>
  4.1249 +        <tbody>
  4.1250 +          <tr>
  4.1251 +	    <td>09 November 2012</a></td>
  4.1252 +            <td>Converted document to ReSpec.</td>
  4.1253 +          </tr>
  4.1254 +	  <tr>
  4.1255 +	    <td><a href="http://dvcs.w3.org/hg/html-media/rev/e029f71aafca">18 October 2012</a></td>
  4.1256 +            <td>Refactored SourceBuffer.append() &amp; added SourceBuffer.remove().</td>
  4.1257 +          </tr>
  4.1258 +	  <tr>
  4.1259 +	    <td><a href="http://dvcs.w3.org/hg/html-media/rev/6d127e69c9f8">8 October 2012</a></td>
  4.1260 +            <td>
  4.1261 +	      <ul>
  4.1262 +	        <li>Defined what HTMLMediaElement.seekable and HTMLMediaElement.buffered should return.</li>
  4.1263 +	        <li>Updated seeking algorithm to run inside Step 10 of the HTMLMediaElement seeking algorithm.</li>
  4.1264 +	        <li>Removed transition from "ended" to "open" in the seeking algorithm.</li>
  4.1265 +	        <li>Clarified all the event targets.</li>
  4.1266 +	      </ul>
  4.1267 +	    </td>
  4.1268 +          </tr>
  4.1269 +	  <tr>
  4.1270 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/7bab66368f2c/media-source/media-source.html">1 October 2012</a></td>
  4.1271 +            <td>Fixed various addsourcebuffer &amp; removesourcebuffer bugs and allow append() in ended state.</td>
  4.1272 +          </tr>
  4.1273 +          <tr>
  4.1274 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/349559debcc3/media-source/media-source.html">13 September 2012</a></td>
  4.1275 +            <td>Updated endOfStream() behavior to change based on the value of HTMLMediaElement.readyState.</td>
  4.1276 +          </tr>
  4.1277 +          <tr>
  4.1278 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/ca093bbbbefb/media-source/media-source.html">24 August 2012</a></td>
  4.1279 +            <td>
  4.1280 +	      <ul>
  4.1281 +	        <li>Added early abort on to duration change algorithm.</li>
  4.1282 +	        <li>Added createObjectURL() IDL &amp; algorithm.</li>
  4.1283 +                <li>Added Track ID &amp; Track description definitions.</li>
  4.1284 +                <li>Rewrote start overlap for audio frames text.</li>
  4.1285 +                <li>Removed rendering silence requirement from section 2.5.</li>
  4.1286 +	      </ul>
  4.1287 +	    </td>
  4.1288 +          </tr>
  4.1289 +	  <tr>
  4.1290 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/340786fcae83/media-source/media-source.html">22 August 2012</a></td>
  4.1291 +            <td>
  4.1292 +	      <ul>
  4.1293 +	        <li>Clarified WebM byte stream requirements.</li>
  4.1294 +	        <li>Clarified SourceBuffer.buffered return value.</li>
  4.1295 +	        <li>Clarified addsourcebuffer &amp; removesourcebuffer event targets.</li>
  4.1296 +	        <li>Clarified when media source attaches to the HTMLMediaElement.</li>
  4.1297 +	        <li>Introduced duration change algorithm and update relevant algorithms to use it.</li>
  4.1298 +	      </ul>
  4.1299 +	    </td>
  4.1300 +          </tr>
  4.1301 +          <tr>
  4.1302 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/032f7b8681d1/media-source/media-source.html">17 August 2012</a></td>
  4.1303 +            <td>Minor editorial fixes.</td>
  4.1304 +          </tr>
  4.1305 +          <tr>
  4.1306 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/29687c019735/media-source/media-source.html">09 August 2012</a></td>
  4.1307 +            <td>Change presentation start time to always be 0 instead of using format specific rules about the first media segment appended.</td>
  4.1308 +          </tr>
  4.1309 +	  <tr>
  4.1310 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/087ea42f59c8/media-source/media-source.html">30 July 2012</a></td>
  4.1311 +            <td>Added SourceBuffer.timestampOffset and MediaSource.duration.</td>
  4.1312 +          </tr>
  4.1313 +          <tr>
  4.1314 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/ab36e8e882c6/media-source/media-source.html">17 July 2012</a></td>
  4.1315 +            <td>Replaced SourceBufferList.remove() with MediaSource.removeSourceBuffer().</td>
  4.1316 +          </tr>
  4.1317 +	  <tr>
  4.1318 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/b499a199e427/media-source/media-source.html">02 July 2012</a></td>
  4.1319 +            <td>Converted to the object-oriented API</td>
  4.1320 +          </tr>
  4.1321 +	  <tr>
  4.1322 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/9bbfe09653e4/media-source/media-source.html">26 June 2012</a></td>
  4.1323 +            <td>Converted to Editor's draft.</td>
  4.1324 +          </tr>
  4.1325 +	  <tr>
  4.1326 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/e433598d22a7/media-source/media-source.html">0.5</a></td>
  4.1327 +            <td>Minor updates before proposing to W3C HTML-WG.</td>
  4.1328 +          </tr>
  4.1329 +          <tr>
  4.1330 +            <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.4/draft-spec/mediasource-draft-spec.html">0.4</a></td>
  4.1331 +            <td>Major revision. Adding source IDs, defining buffer model, and clarifying byte stream formats.</td>
  4.1332 +          </tr>
  4.1333 +	  <tr>
  4.1334 +            <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.3/draft-spec/mediasource-draft-spec.html">0.3</a></td>
  4.1335 +            <td>Minor text updates.</td>
  4.1336 +          </tr>
  4.1337 +          <tr>
  4.1338 +            <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.2/draft-spec/mediasource-draft-spec.html">0.2</a></td>
  4.1339 +            <td>Updates to reflect initial WebKit implementation.</td>
  4.1340 +          </tr>
  4.1341 +          <tr>
  4.1342 +            <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.1/draft-spec/mediasource-draft-spec.html">0.1</a></td>
  4.1343 +            <td>Initial Proposal</td>
  4.1344 +          </tr>
  4.1345 +        </tbody>
  4.1346 +      </table>
  4.1347 +    </section>
  4.1348 +  </body>
  4.1349 +</html>
     5.1 --- a/media-source/media-source.html	Wed Oct 31 17:47:58 2012 +0100
     5.2 +++ b/media-source/media-source.html	Thu Nov 08 17:13:35 2012 -0800
     5.3 @@ -1,1154 +1,1554 @@
     5.4 -<!DOCTYPE html SYSTEM "about:legacy-compat">
     5.5 -<html>
     5.6 -  <head>
     5.7 -<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     5.8 +<!DOCTYPE html>
     5.9 +<html lang="en" dir="ltr">
    5.10 +<head>
    5.11 +    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    5.12      <title>Media Source Extensions</title>
    5.13 -    <link rel="stylesheet" href="video-working-draft.css">
    5.14 -    <link rel="stylesheet" href="main.css">
    5.15 -    <link type="text/css" rel="stylesheet" href="http://www.w3.org/StyleSheets/TR/w3c-ed.css">
    5.16 +    
    5.17 +    
    5.18 +    
    5.19 +
    5.20      <style type="text/css">
    5.21 -          
    5.22 -          .issue {
    5.23 -          padding:    1em;
    5.24 -          margin: 1em 0em 0em;
    5.25 -          border: 1px solid #f00;
    5.26 -          background: #fcc;
    5.27 -          }
    5.28 -          .issue::before {
    5.29 -          content:    "Issue";
    5.30 -          display:    block;
    5.31 -          width:  150px;
    5.32 -          margin: -1.5em 0 0.5em 0;
    5.33 -          font-weight:    bold;
    5.34 -          border: 1px solid #f00;
    5.35 -          background: #fff;
    5.36 -          padding:    3px 1em;
    5.37 -          }
    5.38 +      .nonnormative { color: green; margin: 2em 0 2em 0em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
    5.39 +      .nonnormative h3 { color: inherit; background: inherit; }
    5.40 +      .nonnormative:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This section is non-normative.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
    5.41  
    5.42 -	  div.nonnormative { color: green; margin: 2em 0 2em 0em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
    5.43 -	  .nonnormative:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This section is non-normative.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
    5.44 +      .example { color: green; margin: 2em 0 2em 2em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
    5.45 +      hr + dl.example, div.impl + dl.domintro { margin-top: 2.5em; margin-bottom: 1.5em; }
    5.46 +      dl.example dt, dl.domintro dt * { color: black; text-decoration: none; }
    5.47 +      dl.example dd { margin: 0.5em 0 1em 2em; padding: 0; }
    5.48 +      dl.example dd p { margin: 0.5em 0; }
    5.49  
    5.50 -	  
    5.51 -	  .example { color: green; margin: 2em 0 2em 2em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
    5.52 -	  hr + dl.example, div.impl + dl.domintro { margin-top: 2.5em; margin-bottom: 1.5em; }
    5.53 -	  dl.example dt, dl.domintro dt * { color: black; text-decoration: none; }
    5.54 -	  dl.example dd { margin: 0.5em 0 1em 2em; padding: 0; }
    5.55 -	  dl.example dd p { margin: 0.5em 0; }
    5.56 +      .example:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This box is non-normative. Implementation requirements are given below this box.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
    5.57  
    5.58 -	  .example:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This box is non-normative. Implementation requirements are given below this box.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
    5.59 +      .iso-box { font-weight: bold; }
    5.60 +      .iso-var { font-style: italic; }
    5.61 +
    5.62 +      table.old-table { border-collapse: collapse; border-style: hidden hidden none hidden; }
    5.63 +      table.old-table thead, table tbody { border-bottom: solid; }
    5.64 +      table.old-table tbody th:first-child { border-left: solid; }
    5.65 +      table.old-table tbody th { text-align: left; }
    5.66 +      table.old-table td, table th { border-left: solid; border-right: solid; border-bottom: solid thin; vertical-align: top; padding: 0.2em; }
    5.67 +
    5.68 +      dl.switch { padding-left: 2em; }
    5.69 +      dl.switch > dt { text-indent: -1.5em; }
    5.70 +      dl.switch > dt:before { content: '\21AA'; padding: 0 0.5em 0 0; display: inline-block; width: 1em; text-align: right; line-height: 0.5em; }
    5.71 +
    5.72 +      p + * > li, dd li { margin: 1em 0; }
    5.73 +
    5.74 +      @media screen { code :link, code :visited { color: inherit; } }
    5.75      </style>
    5.76 -  </head>
    5.77 -  <body>
    5.78 -    <div class="head">
    5.79 -      <p><a href="http://www.w3.org/"><img src="http://www.w3.org/Icons/w3c_home" alt="W3C" width="72" height="48"></a></p>
    5.80 -      <h1>Media Source Extensions</h1>
    5.81 -      <h2>W3C Editor's Draft 18 October 2012</h2>
    5.82 -      <dl>
    5.83 -	<dt>Latest published version:</dt>
    5.84 -	<dd>Not yet published</dd>
    5.85 -	<dt>Latest editor's draft:</dt>
    5.86 -	<dd><a href="http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html">http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html</a></dd>
    5.87 -	<dt>Editors:</dt>
    5.88 -	<dd>Aaron Colwell, Google, Inc.</dd>
    5.89 -	<dd>Adrian Bateman, Microsoft Corporation</dd>
    5.90 -	<dd>Mark Watson, Netflix, Inc.</dd>
    5.91 -	<dt>Bug/Issue lists:</dt>
    5.92 -	<dd>
    5.93 -<a href="http://w3.org/brief/Mjcw">Bugzilla</a>, <a href="http://www.w3.org/html/wg/tracker/products/20">Tracker</a>
    5.94 -</dd>
    5.95 -	<dt>Discussion list:</dt>
    5.96 -	<dd><a href="http://lists.w3.org/Archives/Public/public-html-media/">public-html-media@w3.org</a></dd>
    5.97 -	<dt>Test Suite:</dt>
    5.98 -	<dd>None yet</dd>
    5.99 +  <style>/*****************************************************************
   5.100 + * ReSpec 3 CSS
   5.101 + * Robin Berjon - http://berjon.com/
   5.102 + *****************************************************************/
   5.103  
   5.104 -      </dl>
   5.105 -    </div>
   5.106 -    <p class="copyright"><a href="http://www.w3.org/Consortium/Legal/2002/ipr-notice-20021231#Copyright">Copyright</a> © 2012 <a href="http://www.w3.org/"><abbr title="World Wide Web Consortium">W3C</abbr></a><sup>®</sup> (<a href="http://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>, <a href="http://www.ercim.eu/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>, <a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a href="http://www.w3.org/Consortium/Legal/2002/ipr-notice-20021231#Legal_Disclaimer">liability</a>, <a href="http://www.w3.org/Consortium/Legal/2002/ipr-notice-20021231#W3C_Trademarks">trademark</a> and <a href="http://www.w3.org/Consortium/Legal/copyright-documents">document use</a> rules apply.</p>
   5.107 +/* --- INLINES --- */
   5.108 +em.rfc2119 { 
   5.109 +    text-transform:     lowercase;
   5.110 +    font-variant:       small-caps;
   5.111 +    font-style:         normal;
   5.112 +    color:              #900;
   5.113 +}
   5.114  
   5.115 -    <h2>Status of this Document</h2>
   5.116 +h1 acronym, h2 acronym, h3 acronym, h4 acronym, h5 acronym, h6 acronym, a acronym,
   5.117 +h1 abbr, h2 abbr, h3 abbr, h4 abbr, h5 abbr, h6 abbr, a abbr {
   5.118 +    border: none;
   5.119 +}
   5.120 +
   5.121 +dfn {
   5.122 +    font-weight:    bold;
   5.123 +}
   5.124 +
   5.125 +a.internalDFN {
   5.126 +    color:  inherit;
   5.127 +    border-bottom:  1px solid #99c;
   5.128 +    text-decoration:    none;
   5.129 +}
   5.130 +
   5.131 +a.externalDFN {
   5.132 +    color:  inherit;
   5.133 +    border-bottom:  1px dotted #ccc;
   5.134 +    text-decoration:    none;
   5.135 +}
   5.136 +
   5.137 +a.bibref {
   5.138 +    text-decoration:    none;
   5.139 +}
   5.140 +
   5.141 +cite .bibref {
   5.142 +    font-style: normal;
   5.143 +}
   5.144 +
   5.145 +code {
   5.146 +    color:  #ff4500;
   5.147 +}
   5.148 +
   5.149 +
   5.150 +/* --- --- */
   5.151 +ol.algorithm { counter-reset:numsection; list-style-type: none; }
   5.152 +ol.algorithm li { margin: 0.5em 0; }
   5.153 +ol.algorithm li:before { font-weight: bold; counter-increment: numsection; content: counters(numsection, ".") ") "; }
   5.154 +
   5.155 +/* --- TOC --- */
   5.156 +.toc a, .tof a {
   5.157 +    text-decoration:    none;
   5.158 +}
   5.159 +
   5.160 +a .secno, a .figno {
   5.161 +    color:  #000;
   5.162 +}
   5.163 +
   5.164 +ul.tof, ol.tof {
   5.165 +    list-style: none outside none;
   5.166 +}
   5.167 +
   5.168 +.caption {
   5.169 +    margin-top: 0.5em;
   5.170 +    font-style:   italic;
   5.171 +}
   5.172 +
   5.173 +/* --- TABLE --- */
   5.174 +table.simple {
   5.175 +    border-spacing: 0;
   5.176 +    border-collapse:    collapse;
   5.177 +    border-bottom:  3px solid #005a9c;
   5.178 +}
   5.179 +
   5.180 +.simple th {
   5.181 +    background: #005a9c;
   5.182 +    color:  #fff;
   5.183 +    padding:    3px 5px;
   5.184 +    text-align: left;
   5.185 +}
   5.186 +
   5.187 +.simple th[scope="row"] {
   5.188 +    background: inherit;
   5.189 +    color:  inherit;
   5.190 +    border-top: 1px solid #ddd;
   5.191 +}
   5.192 +
   5.193 +.simple td {
   5.194 +    padding:    3px 10px;
   5.195 +    border-top: 1px solid #ddd;
   5.196 +}
   5.197 +
   5.198 +.simple tr:nth-child(even) {
   5.199 +    background: #f0f6ff;
   5.200 +}
   5.201 +
   5.202 +/* --- DL --- */
   5.203 +.section dd > p:first-child {
   5.204 +    margin-top: 0;
   5.205 +}
   5.206 +
   5.207 +.section dd > p:last-child {
   5.208 +    margin-bottom: 0;
   5.209 +}
   5.210 +
   5.211 +.section dd {
   5.212 +    margin-bottom:  1em;
   5.213 +}
   5.214 +
   5.215 +.section dl.attrs dd, .section dl.eldef dd {
   5.216 +    margin-bottom:  0;
   5.217 +}
   5.218 +</style><style>/* --- ISSUES/NOTES --- */
   5.219 +div.issue-title, div.note-title {
   5.220 +    padding-right:  1em;
   5.221 +    min-width: 7.5em;
   5.222 +    color: #b9ab2d;
   5.223 +}
   5.224 +div.issue-title { color: #e05252; }
   5.225 +div.note-title { color: #52e052; }
   5.226 +div.issue-title span, div.note-title span {
   5.227 +    text-transform: uppercase;
   5.228 +}
   5.229 +div.note, div.issue {
   5.230 +    margin-top: 1em;
   5.231 +    margin-bottom: 1em;
   5.232 +}
   5.233 +.note > p:first-child, .issue > p:first-child { margin-top: 0 }
   5.234 +.issue, .note {
   5.235 +    padding: .5em;
   5.236 +    border-left-width: .5em;
   5.237 +    border-left-style: solid;
   5.238 +}
   5.239 +div.issue, div.note {
   5.240 +    padding: 0.5em;
   5.241 +    margin: 1em 0;
   5.242 +    position: relative;
   5.243 +    clear: both;
   5.244 +}
   5.245 +span.note, span.issue { padding: .1em .5em .15em; }
   5.246 +
   5.247 +.issue {
   5.248 +    border-color: #e05252;
   5.249 +    background: #fbe9e9;
   5.250 +}
   5.251 +.note {
   5.252 +    border-color: #52e052;
   5.253 +    background: #e9fbe9;
   5.254 +}
   5.255 +
   5.256 +
   5.257 +</style><style>/* --- WEB IDL --- */
   5.258 +pre.idl {
   5.259 +    border-top: 1px solid #90b8de;
   5.260 +    border-bottom: 1px solid #90b8de;
   5.261 +    padding:    1em;
   5.262 +    line-height:    120%;
   5.263 +}
   5.264 +
   5.265 +pre.idl::before {
   5.266 +    content:    "WebIDL";
   5.267 +    display:    block;
   5.268 +    width:      150px;
   5.269 +    background: #90b8de;
   5.270 +    color:  #fff;
   5.271 +    font-family:    initial;
   5.272 +    padding:    3px;
   5.273 +    font-weight:    bold;
   5.274 +    margin: -1em 0 1em -1em;
   5.275 +}
   5.276 +
   5.277 +.idlType {
   5.278 +    color:  #ff4500;
   5.279 +    font-weight:    bold;
   5.280 +    text-decoration:    none;
   5.281 +}
   5.282 +
   5.283 +/*.idlModule*/
   5.284 +/*.idlModuleID*/
   5.285 +/*.idlInterface*/
   5.286 +.idlInterfaceID, .idlDictionaryID, .idlCallbackID, .idlEnumID {
   5.287 +    font-weight:    bold;
   5.288 +    color:  #005a9c;
   5.289 +}
   5.290 +
   5.291 +.idlSuperclass {
   5.292 +    font-style: italic;
   5.293 +    color:  #005a9c;
   5.294 +}
   5.295 +
   5.296 +/*.idlAttribute*/
   5.297 +.idlAttrType, .idlFieldType, .idlMemberType {
   5.298 +    color:  #005a9c;
   5.299 +}
   5.300 +.idlAttrName, .idlFieldName, .idlMemberName {
   5.301 +    color:  #ff4500;
   5.302 +}
   5.303 +.idlAttrName a, .idlFieldName a, .idlMemberName a {
   5.304 +    color:  #ff4500;
   5.305 +    border-bottom:  1px dotted #ff4500;
   5.306 +    text-decoration: none;
   5.307 +}
   5.308 +
   5.309 +/*.idlMethod*/
   5.310 +.idlMethType, .idlCallbackType {
   5.311 +    color:  #005a9c;
   5.312 +}
   5.313 +.idlMethName {
   5.314 +    color:  #ff4500;
   5.315 +}
   5.316 +.idlMethName a {
   5.317 +    color:  #ff4500;
   5.318 +    border-bottom:  1px dotted #ff4500;
   5.319 +    text-decoration: none;
   5.320 +}
   5.321 +
   5.322 +/*.idlParam*/
   5.323 +.idlParamType {
   5.324 +    color:  #005a9c;
   5.325 +}
   5.326 +.idlParamName {
   5.327 +    font-style: italic;
   5.328 +}
   5.329 +
   5.330 +.extAttr {
   5.331 +    color:  #666;
   5.332 +}
   5.333 +
   5.334 +/*.idlConst*/
   5.335 +.idlConstType {
   5.336 +    color:  #005a9c;
   5.337 +}
   5.338 +.idlConstName {
   5.339 +    color:  #ff4500;
   5.340 +}
   5.341 +.idlConstName a {
   5.342 +    color:  #ff4500;
   5.343 +    border-bottom:  1px dotted #ff4500;
   5.344 +    text-decoration: none;
   5.345 +}
   5.346 +
   5.347 +/*.idlException*/
   5.348 +.idlExceptionID {
   5.349 +    font-weight:    bold;
   5.350 +    color:  #c00;
   5.351 +}
   5.352 +
   5.353 +.idlTypedefID, .idlTypedefType {
   5.354 +    color:  #005a9c;
   5.355 +}
   5.356 +
   5.357 +.idlRaises, .idlRaises a.idlType, .idlRaises a.idlType code, .excName a, .excName a code {
   5.358 +    color:  #c00;
   5.359 +    font-weight:    normal;
   5.360 +}
   5.361 +
   5.362 +.excName a {
   5.363 +    font-family:    monospace;
   5.364 +}
   5.365 +
   5.366 +.idlRaises a.idlType, .excName a.idlType {
   5.367 +    border-bottom:  1px dotted #c00;
   5.368 +}
   5.369 +
   5.370 +.excGetSetTrue, .excGetSetFalse, .prmNullTrue, .prmNullFalse, .prmOptTrue, .prmOptFalse {
   5.371 +    width:  45px;
   5.372 +    text-align: center;
   5.373 +}
   5.374 +.excGetSetTrue, .prmNullTrue, .prmOptTrue { color:  #0c0; }
   5.375 +.excGetSetFalse, .prmNullFalse, .prmOptFalse { color:  #c00; }
   5.376 +
   5.377 +.idlImplements a {
   5.378 +    font-weight:    bold;
   5.379 +}
   5.380 +
   5.381 +dl.attributes, dl.methods, dl.constants, dl.fields, dl.dictionary-members {
   5.382 +    margin-left:    2em;
   5.383 +}
   5.384 +
   5.385 +.attributes dt, .methods dt, .constants dt, .fields dt, .dictionary-members dt {
   5.386 +    font-weight:    normal;
   5.387 +}
   5.388 +
   5.389 +.attributes dt code, .methods dt code, .constants dt code, .fields dt code, .dictionary-members dt code {
   5.390 +    font-weight:    bold;
   5.391 +    color:  #000;
   5.392 +    font-family:    monospace;
   5.393 +}
   5.394 +
   5.395 +.attributes dt code, .fields dt code, .dictionary-members dt code {
   5.396 +    background:  #ffffd2;
   5.397 +}
   5.398 +
   5.399 +.attributes dt .idlAttrType code, .fields dt .idlFieldType code, .dictionary-members dt .idlMemberType code {
   5.400 +    color:  #005a9c;
   5.401 +    background:  transparent;
   5.402 +    font-family:    inherit;
   5.403 +    font-weight:    normal;
   5.404 +    font-style: italic;
   5.405 +}
   5.406 +
   5.407 +.methods dt code {
   5.408 +    background:  #d9e6f8;
   5.409 +}
   5.410 +
   5.411 +.constants dt code {
   5.412 +    background:  #ddffd2;
   5.413 +}
   5.414 +
   5.415 +.attributes dd, .methods dd, .constants dd, .fields dd, .dictionary-members dd {
   5.416 +    margin-bottom:  1em;
   5.417 +}
   5.418 +
   5.419 +table.parameters, table.exceptions {
   5.420 +    border-spacing: 0;
   5.421 +    border-collapse:    collapse;
   5.422 +    margin: 0.5em 0;
   5.423 +    width:  100%;
   5.424 +}
   5.425 +table.parameters { border-bottom:  1px solid #90b8de; }
   5.426 +table.exceptions { border-bottom:  1px solid #deb890; }
   5.427 +
   5.428 +.parameters th, .exceptions th {
   5.429 +    color:  #fff;
   5.430 +    padding:    3px 5px;
   5.431 +    text-align: left;
   5.432 +    font-family:    initial;
   5.433 +    font-weight:    normal;
   5.434 +    text-shadow:    #666 1px 1px 0;
   5.435 +}
   5.436 +.parameters th { background: #90b8de; }
   5.437 +.exceptions th { background: #deb890; }
   5.438 +
   5.439 +.parameters td, .exceptions td {
   5.440 +    padding:    3px 10px;
   5.441 +    border-top: 1px solid #ddd;
   5.442 +    vertical-align: top;
   5.443 +}
   5.444 +
   5.445 +.parameters tr:first-child td, .exceptions tr:first-child td {
   5.446 +    border-top: none;
   5.447 +}
   5.448 +
   5.449 +.parameters td.prmName, .exceptions td.excName, .exceptions td.excCodeName {
   5.450 +    width:  100px;
   5.451 +}
   5.452 +
   5.453 +.parameters td.prmType {
   5.454 +    width:  120px;
   5.455 +}
   5.456 +
   5.457 +table.exceptions table {
   5.458 +    border-spacing: 0;
   5.459 +    border-collapse:    collapse;
   5.460 +    width:  100%;
   5.461 +}
   5.462 +</style><link rel="stylesheet" href="http://www.w3.org/StyleSheets/TR/W3C-ED"><!--[if lt IE 9]><script src='http://www.w3.org/2008/site/js/html5shiv.js'></script><![endif]--></head>
   5.463 +  <body><div class="head">
   5.464 +  <p>
   5.465 +    
   5.466 +      <a href="http://www.w3.org/"><img width="72" height="48" src="http://www.w3.org/Icons/w3c_home" alt="W3C"></a>
   5.467 +    
   5.468 +  </p>
   5.469 +  <h1 class="title" id="title">Media Source Extensions</h1>
   5.470 +  
   5.471 +  <h2 id="w3c-editor-s-draft-09-november-2012"><abbr title="World Wide Web Consortium">W3C</abbr> Editor's Draft 09 November 2012</h2>
   5.472 +  <dl>
   5.473 +    
   5.474 +      <dt>This version:</dt>
   5.475 +      <dd><a href="http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html">http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html</a></dd>
   5.476 +      <dt>Latest published version:</dt>
   5.477 +      <dd><a href="http://www.w3.org/TR//">http://www.w3.org/TR//</a></dd>
   5.478 +    
   5.479 +    
   5.480 +      <dt>Latest editor's draft:</dt>
   5.481 +      <dd><a href="http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html">http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html</a></dd>
   5.482 +    
   5.483 +    
   5.484 +    
   5.485 +    
   5.486        
   5.487 -    <p><em>
   5.488 -      This section describes the status of this document at the time of its publication. Other documents may supersede this document.
   5.489 -      A list of current W3C publications and the latest revision of this technical report can be found in the
   5.490 -      <a href="http://www.w3.org/TR/">W3C technical reports index</a> at http://www.w3.org/TR/.
   5.491 -    </em></p>
   5.492 +    
   5.493 +    
   5.494 +    
   5.495 +    <dt>Editors:</dt>
   5.496 +    <dd><span>Aaron Colwell</span>, <a href="http://google.com/">Google Inc.</a></dd>
   5.497 +<dd><span>Adrian Bateman</span>, <a href="http://microsoft.com/">Microsoft Corporation</a></dd>
   5.498 +<dd><span>Mark Watson</span>, <a href="http://netflix.com/">Netflix Inc.</a></dd>
   5.499  
   5.500 -    <p>
   5.501 -      This document was published by the <a href="http://www.w3.org/html/wg/">HTML working group</a> as an Editor's Draft.
   5.502 -      Please submit comments regarding this document by using the W3C's (<a href="https://www.w3.org/Bugs/Public/enter_bug.cgi?product=HTML%20WG&amp;component=Media%20Source%20Extensions">public bug database</a>) with the product set to <kbd>HTML WG</kbd> and the component set to
   5.503 -      <kbd>Media Source Extensions</kbd>.
   5.504 -      If you cannot access the bug database, submit comments to <a href="mailto:public-html-media@w3.org">public-html-media@w3.org</a>
   5.505 -      (<a href="mailto:public-html-media-request@w3.org?subject=subscribe">subscribe</a>,
   5.506 -      <a href="http://lists.w3.org/Archives/Public/public-html-media/">archives</a>) and arrangements will be made to transpose the comments to the bug database.
   5.507 -      All feedback is welcome.
   5.508 -    </p>
   5.509 +    
   5.510 +  </dl>
   5.511 +  
   5.512 +  
   5.513 +  
   5.514 +  
   5.515 +    
   5.516 +      <p class="copyright">
   5.517 +        <a href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a> © 
   5.518 +        2012
   5.519 +        
   5.520 +        <a href="http://www.w3.org/"><abbr title="World Wide Web Consortium">W3C</abbr></a><sup>®</sup> 
   5.521 +        (<a href="http://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>,
   5.522 +        <a href="http://www.ercim.eu/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>,
   5.523 +        <a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved.
   5.524 +        <abbr title="World Wide Web Consortium">W3C</abbr> <a href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>,
   5.525 +        <a href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a> and
   5.526 +        <a href="http://www.w3.org/Consortium/Legal/copyright-documents">document use</a> rules apply.
   5.527 +      </p>
   5.528 +    
   5.529 +  
   5.530 +  <hr>
   5.531 +</div>
   5.532 +    
   5.533 +    
   5.534  
   5.535 -    <p>
   5.536 -      Publication as a Editor's Draft does not imply endorsement by the W3C Membership. This is a draft document and may be updated,
   5.537 -      replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.
   5.538 -    </p>
   5.539 -    <p>
   5.540 -      This document was produced by a group operating under the <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February 2004 W3C Patent Policy</a>.
   5.541 -      W3C maintains a <a href="http://www.w3.org/2004/01/pp-impl/40318/status" rel="disclosure">public list of any patent disclosures</a> made in connection with
   5.542 -      the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which
   5.543 -      the individual believes contains <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential Claim(s)</a> must disclose the
   5.544 -      information in accordance with <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section 6 of the W3C Patent Policy</a>.
   5.545 -    </p>     
   5.546 -
   5.547 -    <h2>Abstract</h2>
   5.548 -    <p>
   5.549 +    <section id="abstract" class="introductory"><h2>Abstract</h2><p>
   5.550        This proposal extends HTMLMediaElement to allow 
   5.551        JavaScript to generate media streams for playback. 
   5.552        Allowing JavaScript to generate streams facilitates a variety of use 
   5.553        cases like adaptive streaming and time shifting live streams.
   5.554 -    </p>
   5.555 +    </p></section><section id="sotd" class="introductory"><h2>Status of This Document</h2>
   5.556 +  
   5.557 +    
   5.558 +      
   5.559 +        <p>
   5.560 +          <em>This section describes the status of this document at the time of its publication. Other
   5.561 +          documents may supersede this document. A list of current <abbr title="World Wide Web Consortium">W3C</abbr> publications and the latest revision
   5.562 +          of this technical report can be found in the <a href="http://www.w3.org/TR/"><abbr title="World Wide Web Consortium">W3C</abbr> technical reports
   5.563 +          index</a> at http://www.w3.org/TR/.</em>
   5.564 +        </p>
   5.565 +        
   5.566 +    
   5.567 +        <p>
   5.568 +          This document was published by the <a href="http://www.w3.org/html/wg/">HTML Working Group</a> as an Editor's Draft.
   5.569 +          
   5.570 +          If you wish to make comments regarding this document, please send them to 
   5.571 +          <a href="mailto:public-html-media@w3.org">public-html-media@w3.org</a> 
   5.572 +          (<a href="mailto:public-html-media-request@w3.org?subject=subscribe">subscribe</a>,
   5.573 +          <a href="http://lists.w3.org/Archives/Public/public-html-media/">archives</a>).
   5.574 +          
   5.575 +          
   5.576 +          All feedback is welcome.
   5.577 +        </p>
   5.578 +        
   5.579 +          <p>
   5.580 +            Publication as an Editor's Draft does not imply endorsement by the <abbr title="World Wide Web Consortium">W3C</abbr> Membership.
   5.581 +            This is a draft document and may be updated, replaced or obsoleted by other documents at 
   5.582 +            any time. It is inappropriate to cite this document as other than work in progress.
   5.583 +          </p>
   5.584 +        
   5.585 +        
   5.586 +        <p>
   5.587 +          
   5.588 +            This document was produced by a group operating under the 
   5.589 +            <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February 2004 <abbr title="World Wide Web Consortium">W3C</abbr> Patent Policy</a>.
   5.590 +          
   5.591 +          
   5.592 +          
   5.593 +            
   5.594 +              <abbr title="World Wide Web Consortium">W3C</abbr> maintains a <a href="" rel="disclosure">public list of any patent disclosures</a> 
   5.595 +            
   5.596 +            made in connection with the deliverables of the group; that page also includes instructions for 
   5.597 +            disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains
   5.598 +            <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential Claim(s)</a> must disclose the
   5.599 +            information in accordance with <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section
   5.600 +            6 of the <abbr title="World Wide Web Consortium">W3C</abbr> Patent Policy</a>.
   5.601 +          
   5.602 +          
   5.603 +        </p>
   5.604 +        
   5.605 +      
   5.606 +    
   5.607 +  
   5.608 +</section><section id="toc"><h2 class="introductory">Table of Contents</h2><ul class="toc"><li class="tocline"><a href="#introduction" class="tocxref"><span class="secno">1. </span>Introduction</a><ul class="toc"><li class="tocline"><a href="#goals" class="tocxref"><span class="secno">1.1 </span>Goals</a></li><li class="tocline"><a href="#definitions" class="tocxref"><span class="secno">1.2 </span>Definitions</a></li></ul></li><li class="tocline"><a href="#source-buffer-model" class="tocxref"><span class="secno">2. </span>Source Buffer Model</a><ul class="toc"><li class="tocline"><a href="#source-buffer-create" class="tocxref"><span class="secno">2.1 </span>Creating Source Buffers</a></li><li class="tocline"><a href="#source-buffer-remove" class="tocxref"><span class="secno">2.2 </span>Removing Source Buffers</a></li><li class="tocline"><a href="#source-buffer-basic-append" class="tocxref"><span class="secno">2.3 </span>Basic appending model</a></li><li class="tocline"><a href="#source-buffer-init-segment-constraints" class="tocxref"><span class="secno">2.4 </span>Initialization Segment constraints</a></li><li class="tocline"><a href="#source-buffer-media-segment-constraints" class="tocxref"><span class="secno">2.5 </span>Media Segment constraints</a></li><li class="tocline"><a href="#source-buffer-first-init-segment" class="tocxref"><span class="secno">2.6 </span>Appending the first Initialization Segment</a></li><li class="tocline"><a href="#source-buffer-media-segment-unbuffered" class="tocxref"><span class="secno">2.7 </span>Appending a Media Segment to an unbuffered region</a></li><li class="tocline"><a href="#source-buffer-overlapping-segments" class="tocxref"><span class="secno">2.8 </span>Appending a Media Segment over a buffered region</a><ul class="toc"><li class="tocline"><a href="#source-buffer-overlap-complete" class="tocxref"><span class="secno">2.8.1 </span>Complete Overlap</a></li><li class="tocline"><a href="#source-buffer-overlap-start" class="tocxref"><span class="secno">2.8.2 </span>Start Overlap</a></li><li class="tocline"><a href="#source-buffer-overlap-end" class="tocxref"><span class="secno">2.8.3 </span>End Overlap</a></li><li class="tocline"><a href="#source-buffer-overlap-middle" class="tocxref"><span class="secno">2.8.4 </span>Middle Overlap</a></li></ul></li><li class="tocline"><a href="#source-buffer-to-track-buffer" class="tocxref"><span class="secno">2.9 </span>Source Buffer to Track Buffer transfer</a></li><li class="tocline"><a href="#source-buffer-segment-eviction" class="tocxref"><span class="secno">2.10 </span>Media Segment Eviction</a></li><li class="tocline"><a href="#source-buffer-timestamp-offsets" class="tocxref"><span class="secno">2.11 </span>Applying Timestamp Offsets</a></li></ul></li><li class="tocline"><a href="#mediasource" class="tocxref"><span class="secno">3. </span>MediaSource Object</a><ul class="toc"><li class="tocline"><a href="#attributes" class="tocxref"><span class="secno">3.1 </span>Attributes</a></li><li class="tocline"><a href="#methods" class="tocxref"><span class="secno">3.2 </span>Methods</a></li><li class="tocline"><a href="#mediasource-events" class="tocxref"><span class="secno">3.3 </span>Event Summary</a></li><li class="tocline"><a href="#mediasource-algorithms" class="tocxref"><span class="secno">3.4 </span>Algorithms</a><ul class="toc"><li class="tocline"><a href="#mediasource-attach" class="tocxref"><span class="secno">3.4.1 </span>Attaching to a media element</a></li><li class="tocline"><a href="#mediasource-detach" class="tocxref"><span class="secno">3.4.2 </span>Detaching from a media element</a></li><li class="tocline"><a href="#mediasource-seeking" class="tocxref"><span class="secno">3.4.3 </span>Seeking</a></li><li class="tocline"><a href="#buffer-monitoring" class="tocxref"><span class="secno">3.4.4 </span>SourceBuffer Monitoring</a></li><li class="tocline"><a href="#active-source-buffer-changes" class="tocxref"><span class="secno">3.4.5 </span>Changes to selected/enabled track state</a></li><li class="tocline"><a href="#duration-change-algorithm" class="tocxref"><span class="secno">3.4.6 </span>Duration change</a></li></ul></li></ul></li><li class="tocline"><a href="#sourcebuffer" class="tocxref"><span class="secno">4. </span>SourceBuffer Object</a><ul class="toc"><li class="tocline"><a href="#attributes-1" class="tocxref"><span class="secno">4.1 </span>Attributes</a></li><li class="tocline"><a href="#methods-1" class="tocxref"><span class="secno">4.2 </span>Methods</a></li><li class="tocline"><a href="#sourcebuffer-algorithms" class="tocxref"><span class="secno">4.3 </span>Algorithms</a><ul class="toc"><li class="tocline"><a href="#sourcebuffer-segment-parser-loop" class="tocxref"><span class="secno">4.3.1 </span>Segment Parser Loop</a></li><li class="tocline"><a href="#sourcebuffer-init-segment-received" class="tocxref"><span class="secno">4.3.2 </span>Initialization Segment Received</a></li><li class="tocline"><a href="#sourcebuffer-coded-frame-processing" class="tocxref"><span class="secno">4.3.3 </span>Coded Frame Processing</a></li></ul></li></ul></li><li class="tocline"><a href="#sourcebufferlist" class="tocxref"><span class="secno">5. </span>SourceBufferList Object</a><ul class="toc"><li class="tocline"><a href="#attributes-2" class="tocxref"><span class="secno">5.1 </span>Attributes</a></li><li class="tocline"><a href="#methods-2" class="tocxref"><span class="secno">5.2 </span>Methods</a></li><li class="tocline"><a href="#sourcebufferlist-events" class="tocxref"><span class="secno">5.3 </span>Event Summary</a></li></ul></li><li class="tocline"><a href="#url" class="tocxref"><span class="secno">6. </span>URL Object</a><ul class="toc"><li class="tocline"><a href="#methods-3" class="tocxref"><span class="secno">6.1 </span>Methods</a></li></ul></li><li class="tocline"><a href="#htmlmediaelement-attributes" class="tocxref"><span class="secno">7. </span>HTMLMediaElement attributes</a></li><li class="tocline"><a href="#byte-stream-formats" class="tocxref"><span class="secno">8. </span>Byte Stream Formats</a><ul class="toc"><li class="tocline"><a href="#webm" class="tocxref"><span class="secno">8.1 </span>WebM Byte Streams</a><ul class="toc"><li class="tocline"><a href="#webm-init-segments" class="tocxref"><span class="secno">8.1.1 </span>Initialization Segments</a></li><li class="tocline"><a href="#webm-media-segments" class="tocxref"><span class="secno">8.1.2 </span>Media Segments</a></li><li class="tocline"><a href="#webm-random-access-points" class="tocxref"><span class="secno">8.1.3 </span>Random Access Points</a></li></ul></li><li class="tocline"><a href="#iso" class="tocxref"><span class="secno">8.2 </span>ISO Base Media File Format Byte Streams</a><ul class="toc"><li class="tocline"><a href="#iso-init-segments" class="tocxref"><span class="secno">8.2.1 </span>Initialization Segments</a></li><li class="tocline"><a href="#iso-media-segments" class="tocxref"><span class="secno">8.2.2 </span>Media Segments</a></li><li class="tocline"><a href="#iso-random-access-points" class="tocxref"><span class="secno">8.2.3 </span>Random Access Points</a></li></ul></li></ul></li><li class="tocline"><a href="#examples" class="tocxref"><span class="secno">9. </span>Examples</a></li><li class="tocline"><a href="#revision-history" class="tocxref"><span class="secno">10. </span>Revision History</a></li></ul></section>
   5.609  
   5.610 -    <h2>Table of Contents</h2>
   5.611  
   5.612 -    <ul id="toc" class="toc">
   5.613 -      <li><a href="#introduction">1. Introduction</a></li>
   5.614 -      <li>
   5.615 -	<ul>
   5.616 -	  <li><a href="#goals">1.1 Goals</a></li>
   5.617 -	  <li><a href="#definitions">1.2 Definitions</a></li>
   5.618 -	</ul>
   5.619 -      </li>
   5.620 -      <li><a href="#source-buffer-model">2. Source Buffer Model</a></li>
   5.621 -      <li>
   5.622 -	<ul>
   5.623 -	  <li><a href="#source-buffer-create">2.1. Creating Source Buffers</a></li>
   5.624 -	  <li><a href="#source-buffer-remove">2.2. Removing Source Buffers</a></li>
   5.625 -	  <li><a href="#source-buffer-basic-append">2.3. Basic appending model</a></li>
   5.626 -	  <li><a href="#source-buffer-init-segment-constraints">2.4.  Initialization Segment constraints</a></li>
   5.627 -	  <li><a href="#source-buffer-media-segment-constraints">2.5. Media Segment constraints</a></li>
   5.628 -	  <li><a href="#source-buffer-first-init-segment">2.6. Appending the first Initialization Segment</a></li>
   5.629 -	  <li><a href="#source-buffer-media-segment-unbuffered">2.7. Appending a Media Segment to an unbuffered region</a></li>
   5.630 -	  <li><a href="#source-buffer-overlapping-segments">2.8. Appending a Media Segment over a buffered region</a></li>
   5.631 -	  <li><a href="#source-buffer-to-track-buffer">2.9. Source Buffer to Track Buffer transfer</a></li>
   5.632 -	  <li><a href="#source-buffer-segment-eviction">2.10. Media Segment Eviction</a></li>
   5.633 -	  <li><a href="#source-buffer-timestamp-offsets">2.11. Applying Timestamp Offsets</a></li>
   5.634 -	</ul>
   5.635 -      </li>
   5.636 -      <li>
   5.637 -<a href="#mediasource">3. MediaSource Object</a>
   5.638 -	<ul>
   5.639 -	  <li><a href="#mediasource-methods">3.1. Methods and Attributes</a></li>
   5.640 -	  <li><a href="#mediasource-events">3.2. Event Summary</a></li>
   5.641 -	  <li><a href="#mediasource-algorithms">3.3. Algorithms</a></li>
   5.642 -	</ul>
   5.643 -      </li>
   5.644 -      <li>
   5.645 -<a href="#sourcebuffer">4. SourceBuffer Object</a>
   5.646 +    <section id="introduction">
   5.647 +      <!--OddPage--><h2><span class="secno">1. </span>Introduction</h2>
   5.648 +      <p>This proposal allows JavaScript to dynamically construct media streams for &lt;audio&gt; and &lt;video&gt;. 
   5.649 +        It defines objects that allow JavaScript to pass media segments to an <a href="http://dev.w3.org/html5/spec/media-elements.html#htmlmediaelement">HTMLMediaElement</a>.
   5.650 +        A buffering model is also included to describe how the user agent should act when different media segments are 
   5.651 +        appended at different times. Byte stream specifications for WebM &amp; ISO Base Media File Format are given to specify the
   5.652 +        expected format of media segments used with these extensions.</p>
   5.653 +      <img src="pipeline_model.png">
   5.654 +
   5.655 +      <section id="goals">
   5.656 +        <h3><span class="secno">1.1 </span>Goals</h3>
   5.657 +        <p>This proposal was designed with the following goals in mind:</p>
   5.658          <ul>
   5.659 -	  <li><a href="#sourcebuffer-methods">4.1. Methods and Attributes</a></li>
   5.660 -	  <li><a href="#sourcebuffer-algorithms">4.2. Algorithms</a></li>
   5.661 -	</ul>
   5.662 -      </li>
   5.663 +          <li>Allow JavaScript to construct media streams independent of how the media is fetched.</li>
   5.664 +          <li>Define a splicing and buffering model that facilitates use cases like adaptive streaming, ad-insertion, time-shifting, and video editing.</li>
   5.665 +          <li>Minimize the need for media parsing in JavaScript.</li>
   5.666 +          <li>Leverage the browser cache as much as possible.</li>
   5.667 +          <li>Provide byte stream definitions for WebM &amp; the ISO Base Media File Format.</li>
   5.668 +          <li>Not require support for any particular media format or codec.</li>
   5.669 +        </ul>
   5.670 +      </section>
   5.671  
   5.672 -      <li>
   5.673 -<a href="#sourcebufferlist">5. SourceBufferList Object</a>
   5.674 -	<ul>
   5.675 -	  <li><a href="#sourcebufferlist-methods">5.1. Methods and Attributes</a></li>
   5.676 -	  <li><a href="#sourcebufferlist-events">5.2. Event Summary</a></li>
   5.677 -	</ul>
   5.678 -      </li>
   5.679 -      <li>
   5.680 -<a href="#url">6. URL Object</a>
   5.681 -	<ul>
   5.682 -	  <li><a href="#url-methods">6.1. Methods</a></li>
   5.683 -	</ul>
   5.684 -      </li>
   5.685 -      <li><a href="#htmlmediaelement-attributes">7. HTMLMediaElement attributes</a></li>
   5.686 -      <li><a href="#byte-stream-formats">8. Byte Stream Formats</a></li>
   5.687 -      <li>
   5.688 -	<ul>
   5.689 -	  <li><a href="#webm">8.1 WebM</a></li>
   5.690 -	  <li><a href="#iso">8.2 ISO Base Media File Format</a></li>
   5.691 -	</ul>
   5.692 -      </li>
   5.693 -      <li><a href="#examples">9. Examples</a></li>
   5.694 -      <li><a href="#revision-history">10. Revision History</a></li>
   5.695 -    </ul>
   5.696 +      <section id="definitions">
   5.697 +        <h3><span class="secno">1.2 </span>Definitions</h3>
   5.698  
   5.699 -    <h2 id="introduction">1. Introduction</h2>
   5.700 -    <p>This proposal allows JavaScript to dynamically construct media streams for &lt;audio&gt; and &lt;video&gt;. 
   5.701 -       It defines objects that allow JavaScript to pass media segments to an <code><a href="http://dev.w3.org/html5/spec/media-elements.html#htmlmediaelement">HTMLMediaElement</a></code>.
   5.702 -       A buffering model is also included to describe how the user agent should act when different media segments are 
   5.703 -       appended at different times. Byte stream specifications for WebM &amp; ISO Base Media File Format are given to specify the
   5.704 -       expected format of media segments used with these extensions.</p>
   5.705 -    <img src="pipeline_model.png">
   5.706 +        <dl>
   5.707 +          <dt id="init-segment">Initialization Segment</dt>
   5.708 +          <dd>
   5.709 +	    <p>A sequence of bytes that contains all of the initialization information required to decode a sequence of <a href="#media-segment">media segments</a>. This includes codec initialization data, <a href="#track-id">Track ID</a> mappings for multiplexed segments, and timestamp offsets (e.g. edit lists).</p>
   5.710 +	    <dl class="example">
   5.711 +	      <p>Container specific examples of initialization segments:</p>
   5.712 +	      <dt>ISO Base Media File Format</dt>
   5.713 +	      <dd>A <span class="iso-box">moov</span> box.</dd>
   5.714 +	      <dt>WebM</dt>
   5.715 +	      <dd>The concatenation of the the EBML Header, Segment Header, Info element, and Tracks element.</dd>
   5.716 +	    </dl>
   5.717 +          </dd>
   5.718  
   5.719 -    <h3 id="goals">1.1. Goals</h3>
   5.720 -    <p>This proposal was designed with the following goals in mind:</p>
   5.721 -    <ul>
   5.722 -      <li>Allow JavaScript to construct media streams independent of how the media is fetched.</li>
   5.723 -      <li>Define a splicing and buffering model that facilitates use cases like adaptive streaming, ad-insertion, time-shifting, and video editing.</li>
   5.724 -      <li>Minimize the need for media parsing in JavaScript.</li>
   5.725 -      <li>Leverage the browser cache as much as possible.</li>
   5.726 -      <li>Provide byte stream definitions for WebM &amp; the ISO Base Media File Format.</li>
   5.727 -      <li>Not require support for any particular media format or codec.</li>
   5.728 -    </ul>
   5.729 +          <dt id="media-segment">Media Segment</dt>
   5.730 +          <dd>
   5.731 +	    <p>A sequence of bytes that contain packetized &amp; timestamped media data for a portion of the presentation timeline. Media segments are always associated with the most recently appended <a href="#init-segment">initialization segment</a>.</p>
   5.732 +	    <dl class="example">
   5.733 +	      <p>Container specific examples of media segments:</p>
   5.734 +	      <dt>ISO Base Media File Format</dt>
   5.735 +	      <dd>A <span class="iso-box">moof</span> box followed by one or more <span class="iso-box">mdat</span> boxes.</dd>
   5.736 +	      <dt>WebM</dt>
   5.737 +	      <dd>A Cluster element</dd>
   5.738 +	    </dl>
   5.739 +          </dd>
   5.740 +          
   5.741 +          <dt id="source-buffer">Source Buffer</dt>
   5.742 +          <dd><p>A hypothetical buffer that contains a distinct sequence of <a href="#init-segment">initialization segments</a> &amp; <a href="#media-segment">media segments</a>. When <a href="#media-segment">media segments</a> are passed to <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code> they update the state of this buffer. The source buffer only allows a single <a href="#media-segment">media segment</a> to cover a specific point in the presentation timeline of each track. If a <a href="#media-segment">media segment</a> gets appended that contains media data overlapping (in presentation time) with media data from an existing segment, then the new media data will override the old media data. Since <a href="#media-segment">media segments</a> depend on <a href="#init-segment">initialization segments</a> the source buffer is also responsible for maintaining these associations. During playback, the media element pulls segment data out of the source buffers, demultiplexes it if necessary, and enqueues it into <a href="#track-buffer">track buffers</a> so it will get decoded and displayed. <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> describes the time ranges that are covered by <a href="#media-segment">media segments</a> in the source buffer.</p></dd>
   5.743  
   5.744 -    <h3 id="definitions">1.2. Definitions</h3>
   5.745 +          <dt id="active-source-buffers">Active Source Buffers</dt>
   5.746 +          <dd><p>The set of <a href="#source-buffer">source buffers</a> that are providing the <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-videotrack-selected">selected video track</a>, the <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-audiotrack-enabled">enabled audio tracks</a>, and the <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-showing">"showing"</a> or <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-hidden">"hidden"</a> text tracks. This is a subset of all the source buffers associated with a specific <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> object. See <a href="#active-source-buffer-changes">Changes to selected/enabled track state</a> for details.</p></dd>
   5.747 +          
   5.748 +          <dt id="track-buffer">Track Buffer</dt>
   5.749 +          <dd><p>A hypothetical buffer that represents initialization and media data for a single <code><a href="http://dev.w3.org/html5/spec/media-elements.html#audiotrack">AudioTrack</a></code>, <code><a href="http://dev.w3.org/html5/spec/media-elements.html#videotrack">VideoTrack</a></code>, or <code><a href="http://dev.w3.org/html5/spec/media-elements.html#texttrack">TextTrack</a></code> that has been queued for playback. This buffer may not exist in actual implementations, but it is intended to represent media data that will be decoded no matter what <a href="#media-segment">media segments</a> are appended to update the <a href="#source-buffer">source buffer</a>. This distinction is important when considering appends that happen close to the current playback position. See <a href="#source-buffer-to-track-buffer">Source Buffer to Track Buffer transfer</a> for details.</p></dd>
   5.750  
   5.751 -    <h4 id="init-segment">1.2.1. Initialization Segment</h4>
   5.752 -    <p>A sequence of bytes that contains all of the initialization information required to decode a sequence of <a href="#media-segment">media segments</a>. This includes codec initialization data, <a href="#track-id">Track ID</a> mappings for multiplexed segments, and timestamp offsets (e.g. edit lists).</p>
   5.753 +          <dt id="random-access-point">Random Access Point</dt>
   5.754 +          <dd><p>A position in a <a href="#media-segment">media segment</a> where decoding and continuous playback can begin without relying on any previous data in the segment. For video this tends to be the location of I-frames. In the case of audio, most audio frames can be treated as a random access point. Since video tracks tend to have a more sparse distribution of random access points, the location of these points are usually considered the random access points for multiplexed streams.</p></dd>
   5.755  
   5.756 -    <dl class="example">
   5.757 -      <p>Container specific examples of initialization segments:</p>
   5.758 -      <dt>ISO Base Media File Format</dt>
   5.759 -      <dd>A <strong>moov</strong> box.</dd>
   5.760 -      <dt>WebM</dt>
   5.761 -      <dd>The concatenation of the the EBML Header, Segment Header, Info element, and Tracks element.</dd>
   5.762 -    </dl>
   5.763 +          <dt id="presentation-start-time">Presentation Start Time</dt>
   5.764 +          <dd><p>The presentation start time is the earliest time point in the presentation and specifies the <a href="http://dev.w3.org/html5/spec/media-elements.html#initial-playback-position">initial playback position</a> and <a href="http://dev.w3.org/html5/spec/media-elements.html#earliest-possible-position">earliest possible position</a>. All presentations created using this specification have a presentation start time of 0. Appending <a href="#media-segment">media segments</a> with negative timestamps will cause playback to terminate with a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-mediaerror-media_err_decode">MediaError.MEDIA_ERR_DECODE</a></code> error unless <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> is used to make the timestamps greater than or equal to 0.</p></dd>
   5.765  
   5.766 -    <h4 id="media-segment">1.2.2. Media Segment</h4>
   5.767 -    <p>A sequence of bytes that contain packetized &amp; timestamped media data for a portion of the presentation timeline. Media segments are always associated with the most recently appended <a href="#init-segment">initialization segment</a>.</p>
   5.768 +          <dt id="mediasource-object-url">MediaSource object URL</dt>
   5.769 +          <dd>
   5.770 +            <p>A MediaSource object URL is a unique <a href="http://www.w3.org/TR/FileAPI/#url">Blob URI</a> created by <code><a href="#widl-URL-createObjectURL-DOMString-MediaSource-mediaSource">createObjectURL()</a></code>. It is used to attach a <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> object to an HTMLMediaElement.</p>
   5.771 +            <p>These URLs are the same as what the <a href="http://www.w3.org/TR/FileAPI/#">File API</a> specification calls a <a href="http://www.w3.org/TR/FileAPI/#url">Blob URI</a>, except that anything in the definition of that feature that refers to <a href="http://www.w3.org/TR/FileAPI/#dfn-file">File</a> and <a href="http://www.w3.org/TR/FileAPI/#dfn-blob">Blob</a> objects is hereby extended to also apply to <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> objects.</p>
   5.772 +          </dd>
   5.773  
   5.774 -    <dl class="domintro">
   5.775 -      <p>Container specific examples of media segments:</p>
   5.776 -      <dt>ISO Base Media File Format</dt>
   5.777 -      <dd>A <strong>moof</strong> box followed by one or more <strong>mdat</strong> boxes.</dd>
   5.778 -      <dt>WebM</dt>
   5.779 -      <dd>A Cluster element</dd>
   5.780 -    </dl>
   5.781 +          <dt id="track-id">Track ID</dt>
   5.782 +          <dd><p>A Track ID is a byte stream format specific identifier that marks sections of the byte stream as being part of a specific track. The Track ID in a <a href="#track-description">track description</a> identifies which sections of a <a href="#media-segment">media segment</a> belong to that track.</p></dd>
   5.783  
   5.784 -    <h4 id="source-buffer">1.2.3. Source Buffer</h4>
   5.785 -    <p>A hypothetical buffer that contains a distinct sequence of <a href="#init-segment">initialization segments</a> &amp; <a href="#media-segment">media segments</a>. When <a href="#media-segment">media segments</a> are passed to <code><a href="#dom-append">append()</a></code> they update the state of this buffer. The source buffer only allows a single <a href="#media-segment">media segment</a> to cover a specific point in the presentation timeline of each track. If a <a href="#media-segment">media segment</a> gets appended that contains media data overlapping (in presentation time) with media data from an existing segment, then the new media data will override the old media data. Since <a href="#media-segment">media segments</a> depend on <a href="#init-segment">initialization segments</a> the source buffer is also responsible for maintaining these associations. During playback, the media element pulls segment data out of the source buffers, demultiplexes it if necessary, and enqueues it into <a href="#track-buffer">track buffers</a> so it will get decoded and displayed. <code><a href="#dom-buffered">buffered</a></code> describes the time ranges that are covered by <a href="#media-segment">media segments</a> in the source buffer.</p>
   5.786 +          <dt id="track-description">Track Description</dt>
   5.787 +          <dd><p>A byte stream format specific structure that provides the <a href="#track-id">Track ID</a>, codec configuration, and other metadata for a single track. Each track description inside a single <a href="#init-segment">initialization segment</a> must have a unique <a href="#track-id">Track ID</a>.</p></dd>
   5.788  
   5.789 -    <h4 id="active-source-buffers">1.2.4. Active Source Buffers</h4>
   5.790 -    <p>The set of <a href="#source-buffer">source buffers</a> that are providing the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-videotrack-selected">selected video track</a></code>, the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-audiotrack-enabled">enabled audio tracks</a></code>, and the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-showing">"showing"</a></code> or <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-hidden">"hidden"</a></code> text tracks. This is a subset of all the source buffers associated with a specific <code><a href="#dom-mediasource">MediaSource</a></code> object. See <a href="#active-source-buffer-changes">Changes to selected/enabled track state</a> for details.</p>
   5.791 +          <dt id="coded-frame">Coded Frame</dt>
   5.792 +          <dd><p>A unit of compressed media data that has a presentation timestamp and  decode timestamp. The presentation timestamp indicates when the frame should be rendered. The decode timestamp indicates when the frame needs to be decoded. If frames can be decoded out of order, then the decode timestamp must be present in the bytestream. If frames cannot be decoded out of order and a decode timestamp is not present in the bytestream, then the decode timestamp is equal to the presentation timestamp.</p></dd>
   5.793  
   5.794 +          <dt id="parent-media-source">Parent Media Source</dt> 
   5.795 +          <dd>The parent media source of a <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> object is the <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> object that created it.<p></p>
   5.796 +        </dd></dl>
   5.797 +      </section>
   5.798 +    </section>
   5.799  
   5.800 -    <h4 id="track-buffer">1.2.5. Track Buffer</h4>
   5.801 -    <p>A hypothetical buffer that represents initialization and media data for a single <code><a href="http://dev.w3.org/html5/spec/media-elements.html#audiotrack">AudioTrack</a></code>, <code><a href="http://dev.w3.org/html5/spec/media-elements.html#videotrack">VideoTrack</a></code>, or <code><a href="http://dev.w3.org/html5/spec/media-elements.html#texttrack">TextTrack</a></code> that has been queued for playback. This buffer may not exist in actual implementations, but it is intended to represent media data that will be decoded no matter what <a href="#media-segment">media segments</a> are appended to update the <a href="#source-buffer">source buffer</a>. This distinction is important when considering appends that happen close to the current playback position. See <a href="#source-buffer-to-track-buffer">Source Buffer to Track Buffer transfer</a> for details.</p>
   5.802  
   5.803 +    <section id="source-buffer-model">
   5.804 +      <!--OddPage--><h2><span class="secno">2. </span>Source Buffer Model</h2>
   5.805 +      <p>The subsections below outline the buffering model for this proposal. It describes how to add and remove <a href="#source-buffer">source buffers</a> from the presentation and describes the various rules and behaviors associated with appending data to an individual <a href="#source-buffer">source buffer</a>. At the highest level, the web application simply creates <a href="#source-buffer">source buffers</a> and appends a sequence of <a href="#init-segment">initialization segments</a> and <a href="#media-segment">media segments</a> to update the buffer's state. The media element pulls media data out of the <a href="#source-buffer">source buffers</a>, plays it, and fires events just like it would if a normal URL was passed to the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#attr-media-src">src</a></code> attribute. The web application is expected to monitor media element events to determine when it needs to append more <a href="#media-segment">media segments</a>.</p>
   5.806  
   5.807 -    <h4 id="random-access-point">1.2.6. Random Access Point</h4>
   5.808 -    <p>A position in a <a href="#media-segment">media segment</a> where decoding and continuous playback can begin without relying on any previous data in the segment. For video this tends to be the location of I-frames. In the case of audio, most audio frames can be treated as a random access point. Since video tracks tend to have a more sparse distribution of random access points, the location of these points are usually considered the random access points for multiplexed streams.</p>
   5.809 +      <section id="source-buffer-create">
   5.810 +        <h3><span class="secno">2.1 </span>Creating Source Buffers</h3>
   5.811 +        <p><a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects can be created once a <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> object enters the <code><a href="#idl-def-ReadyState">"open"</a></code> state. The application calls <code><a href="#widl-MediaSource-addSourceBuffer-SourceBuffer-DOMString-type">addSourceBuffer()</a></code> with a type string that indicates the format of the data it intends to append to the new SourceBuffer. If the user agent supports the format and has sufficient resources, a new <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> object is created, added to <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>, and returned by the method. If the user agent doesn't support the specified format or can't support another <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> then it will throw an appropriate exception to signal why the request couldn't be satisfied.</p>
   5.812 +      </section>
   5.813  
   5.814 -    <h4 id="presentation-start-time">1.2.7. Presentation Start Time</h4>
   5.815 -    <p>The presentation start time is the earliest time point in the presentation and specifies the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#initial-playback-position">initial playback position</a></code> and <code><a href="http://dev.w3.org/html5/spec/media-elements.html#earliest-possible-position">earliest possible position</a></code>. All presentations created using this specification have a presentation start time of 0. Appending <a href="#media-segment">media segments</a> with negative timestamps will cause playback to terminate with a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-mediaerror-media_err_decode">MediaError.MEDIA_ERR_DECODE</a></code> error unless <code><a href="#dom-timestampoffset">timestampOffset</a></code> is used to make the timestamps greater than or equal to 0.</p>
   5.816 +      <section id="source-buffer-remove">
   5.817 +        <h3><span class="secno">2.2 </span>Removing Source Buffers</h3>
   5.818 +        <p>Removing a <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> with <code><a href="#widl-MediaSource-removeSourceBuffer-void-SourceBuffer-sourceBuffer">removeSourceBuffer()</a></code> releases all resources associated with the object. This includes destroying the all the segment data, <a href="#track-buffer">track buffers</a>, and decoders. The media element will also remove the appropriate tracks from <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-audiotracks">audioTracks</a></code>, <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-videotracks">videoTracks</a></code>,  &amp; <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-texttracks">textTracks</a></code> and fire the necessary <a href="http://dev.w3.org/html5/spec/media-elements.html#handler-tracklist-onchange">change</a> events. Playback may become degraded or stop if the currently selected <code><a href="http://dev.w3.org/html5/spec/media-elements.html#videotrack">VideoTrack</a></code> or the only enabled <code><a href="http://dev.w3.org/html5/spec/media-elements.html#audiotrack">AudioTracks</a></code> are removed.</p>
   5.819 +      </section>
   5.820  
   5.821 -    <h4 id="mediasource-object-url">1.2.8. MediaSource object URL</h4>
   5.822 -    <p>A MediaSource object URL is a unique <a href="http://www.w3.org/TR/FileAPI/#url">Blob URI</a> created by <code><a href="#dom-createobjecturl">createObjectURL()</a></code>. It is used to attach a <code><a href="#dom-mediasource">MediaSource</a></code> object to an HTMLMediaElement.</p>
   5.823 -    <p>These URLs are the same as what the <a href="http://www.w3.org/TR/FileAPI/#">File API</a> specification calls a <a href="http://www.w3.org/TR/FileAPI/#url">Blob URI</a>, except that anything in the definition of that feature that refers to <a href="http://www.w3.org/TR/FileAPI/#dfn-file">File</a> and <a href="http://www.w3.org/TR/FileAPI/#dfn-blob">Blob</a> objects is hereby extended to also apply to <code><a href="#dom-mediasource">MediaSource</a></code> objects.</p>
   5.824 +      <section id="source-buffer-basic-append">
   5.825 +        <h3><span class="secno">2.3 </span>Basic appending model</h3>
   5.826 +        <p>Updating the state of a <a href="#source-buffer">source buffer</a> requires appending at least one <a href="#init-segment">initialization segment</a> and one or more <a href="#media-segment">media segments</a> via <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code>. The following list outlines some of the basic rules for appending segments.
   5.827 +          </p><ul>
   5.828 +	    <li>The first segment appended must be an <a href="#init-segment">initialization segment</a>.</li>
   5.829 +	    <li>All <a href="#media-segment">media segments</a> are associated with the most recently appended <a href="#init-segment">initialization segment</a>.</li>
   5.830 +	    <li>A whole segment must be appended before another segment can be started unless <code><a href="#widl-SourceBuffer-abort-void">abort()</a></code> is called.</li>
   5.831 +	    <li>Segments can be appended in pieces. (i.e. A 4096 byte segment can be spread across four 1024 byte calls to <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code>).</li>
   5.832 +	    <li>If a <a href="#media-segment">media segment</a> requires different configuration information (e.g. codec parameters, new <a href="#track-id">Track IDs</a>, metadata) from what is in the most recently appended <a href="#init-segment">initialization segment</a>, a new <a href="#init-segment">initialization segment</a> with the new configuration information must be appended before the <a href="#media-segment">media segment</a> requiring this information is appended.</li>
   5.833 +	    <li>A new <a href="#media-segment">media segment</a> can overlap, in presentation time, a segment that was previously appended. The new segment will override the previous data.</li>
   5.834 +	    <li>Media segments can be appended in any order.<div class="note"><div class="note-title"><span>Note</span></div><p class="">In practice finite buffer space and maintaining uninterrupted playback will bias appending towards time increasing order near the current playback position. Out of order appends facilitate adaptive streaming, ad insertion, and video editing use cases.</p></div>
   5.835 +            </li>
   5.836 +	    <li>The media element may start copying data from a <a href="#media-segment">media segment</a> to the <a href="#track-buffer">track buffers</a> before the entire segment has been appended. This prevents unnecessary delays for <a href="#media-segment">media segments</a> that cover a large time range.</li>
   5.837 +          </ul>
   5.838 +        <p></p>
   5.839 +      </section>
   5.840  
   5.841 -    <h4 id="track-id">1.2.9. Track ID</h4>
   5.842 -    <p>A Track ID is a byte stream format specific identifier that marks sections of the byte stream as being part of a specific track. The Track ID in a <a href="#track-id">track description</a> identifies which sections of a <a href="#media-segment">media segment</a> belong to that track.</p>
   5.843 +      <section id="source-buffer-init-segment-constraints">
   5.844 +        <h3><span class="secno">2.4 </span>Initialization Segment constraints</h3>
   5.845 +        <p>To simplify the implementation and facilitate interoperability, a few constraints are placed on the <a href="#init-segment">initialization segments</a> that are appended to a specific <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a>:
   5.846 +          </p><ul>
   5.847 +	    <li>The number and type of tracks must be consistent across all <a href="#init-segment">initialization segments</a>. <br>For example, if the first <a href="#init-segment">initialization segment</a> has 2 audio tracks and 1 video track, then all <a href="#init-segment">initialization segments</a> that follow, for this <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> must describe 2 audio tracks and 1 video track.</li>
   5.848 +	    <li>
   5.849 +              <a href="#track-id">Track IDs</a> do not need to be the same across <a href="#init-segment">initialization segments</a> only if the segment describes one track of each type.<br> For example, if an <a href="#init-segment">initialization segment</a> describes a single audio track and a single video track, the internal <a href="#track-id">Track IDs</a> do not need to be the same.</li>
   5.850 +	    <li>
   5.851 +              <a href="#track-id">Track IDs</a> must be the same across <a href="#init-segment">initialization segments</a> if multiple tracks for a single type are described. (e.g. 2 audio tracks).</li>
   5.852 +	    <li>Codecs changes are not allowed. <br> For example, you can't have an <a href="#init-segment">initialization segment</a> that specifies a single AAC track and then follows it with one that contains AMR-WB. Support for multiple codecs is handled with multiple <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects.</li>
   5.853 +	    <li>Video frame size changes are allowed and must be supported seamlessly.<div class="note"><div class="note-title"><span>Note</span></div><p class="">This will cause the &lt;video&gt; display region to change size if you don't use CSS or HTML attributes (width/height) to constrain the element size.</p></div>
   5.854 +            </li>
   5.855 +	    <li>Audio channel count changes are allowed, but they may not be seamless and could trigger downmixing.<div class="note"><div class="note-title"><span>Note</span></div><p class="">This is a quality of implementation issue because changing the channel count may require reinitializing the audio device, resamplers, and channel mixers which tends to be audible.</p></div>
   5.856 +            </li>
   5.857 +          </ul>
   5.858 +        <p></p>
   5.859 +      </section>
   5.860 +
   5.861 +      <section id="source-buffer-media-segment-constraints">
   5.862 +        <h3><span class="secno">2.5 </span>Media Segment constraints</h3>
   5.863 +        <p>To simplify the implementation and facilitate interoperability, a few constraints are placed on the <a href="#media-segment">media segments</a> that are appended to a specific <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a>:
   5.864 +          </p><ul>
   5.865 +	    <li>All timestamps must be mapped to the same presentation timeline.</li>
   5.866 +	    <li>Segments must start with a <a href="#random-access-point">random access point</a> to facilitate seamless splicing at the segment boundary.</li>
   5.867 +	    <li>Gaps between <a href="#media-segment">media segments</a> that are smaller than the audio frame size are allowed and must not cause playback to stall. Such gaps must not be reflected by <code><a href="#widl-SourceBuffer-buffered">buffered</a></code>.
   5.868 +	      <div class="note"><div class="note-title"><span>Note</span></div><p class="">This is intended to simplify switching between audio streams where the frame boundaries don't always line up across encodings (e.g. Vorbis).</p></div>
   5.869 +            </li>
   5.870 +          </ul>
   5.871 +        <p></p>
   5.872 +      </section>
   5.873 +
   5.874 +      <section id="source-buffer-first-init-segment">
   5.875 +        <h3><span class="secno">2.6 </span>Appending the first Initialization Segment</h3>
   5.876 +        <p>Once a new <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> has been created, it expects an <a href="#init-segment">initialization segment</a> to be appended first. This first segment indicates the number and type of streams contained in the <a href="#media-segment">media segments</a> that follow. This allows the media element to configure the necessary decoders and output devices. This first segment can also cause a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code> if this is the first <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a>, or if it is the first track of a specific type (i.e. first audio, first video track, or first text track). If neither of the conditions hold then the tracks for this new <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> will just appear as disabled tracks and won't affect the current <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> until they are selected. The media element will also add the appropriate tracks to the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-audiotracks">audioTracks</a></code>, <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-videotracks">videoTracks</a></code>, &amp; <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-texttracks">textTracks</a></code> collections and fire the necessary <a href="http://dev.w3.org/html5/spec/media-elements.html#handler-tracklist-onchange">change</a> events. The description for <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code> contains all the details.</p>
   5.877 +      </section>
   5.878 +      
   5.879 +      <section id="source-buffer-media-segment-unbuffered">
   5.880 +        <h3><span class="secno">2.7 </span>Appending a Media Segment to an unbuffered region</h3>
   5.881 +        <p>If a <a href="#media-segment">media segment</a> is appended to a time range that is not covered by existing segments in the <a href="#source-buffer">source buffer</a>, then its data is copied directly into the <a href="#source-buffer">source buffer</a>. Addition of this data may trigger <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> transitions depending on what other data is buffered and whether the media element has determined if it can start playback. Calls to <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> will always reflect the current <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> buffered in the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a>.</p>
   5.882 +      </section>
   5.883 +
   5.884 +      <section id="source-buffer-overlapping-segments">
   5.885 +        <h3><span class="secno">2.8 </span>Appending a Media Segment over a buffered region</h3>
   5.886 +        <p>There are several ways that <a href="#media-segment">media segments</a> can overlap segments in the <a href="#source-buffer">source buffer</a>. Behavior for the different overlap situations are described below. If more than one overlap applies, then the <a href="#source-buffer-overlap-start">start overlap</a> gets resolved first, followed by any <a href="#source-buffer-overlap-complete">complete overlaps</a>, and finally the <a href="#source-buffer-overlap-end">end overlap</a>. If a segment contains multiple tracks then the overlap is resolved independently for each track.</p>
   5.887 +
   5.888 +        <section id="source-buffer-overlap-complete">
   5.889 +          <h4><span class="secno">2.8.1 </span>Complete Overlap</h4>
   5.890 +          <img src="complete_overlap.png">
   5.891 +          <p>The figure above shows how the <a href="#source-buffer">source buffer</a> gets updated when a new <a href="#media-segment">media segment</a> completely overlaps a segment in the buffer. In this case, the new segment completely replaces the old segment.</p>
   5.892 +        </section>
   5.893 +
   5.894 +        <section id="source-buffer-overlap-start">
   5.895 +          <h4><span class="secno">2.8.2 </span>Start Overlap</h4>
   5.896 +          <img src="start_overlap.png">
   5.897 +          <p>The figure above shows how the <a href="#source-buffer">source buffer</a> gets updated when the beginning of a new <a href="#media-segment">media segment</a> overlaps a segment in the buffer. In this case the new segment replaces all the old media data in the overlapping region. Since <a href="#media-segment">media segments</a> are constrained to starting with <a href="#random-access-point">random access points</a>, this provides a seamless transition between segments.</p>
   5.898 +          <p>When an audio frame in the <a href="#source-buffer">source buffer</a> overlaps with the start of the new <a href="#media-segment">media segment</a> special behavior is required. At a minimum implementations must support dropping the old audio frame that overlaps the start of the new segment and insert silence for the small gap that is created. Higher quality implementations may support crossfading or crosslapping between the overlapping audio frames. No matter which strategy is implemented, no gaps are created in the ranges reported by <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> and playback must never stall at the overlap.</p>
   5.899 +        </section>
   5.900 +
   5.901 +        <section id="source-buffer-overlap-end">
   5.902 +          <h4><span class="secno">2.8.3 </span>End Overlap</h4>
   5.903 +          <img src="end_overlap.png">
   5.904 +          <p>The figure above shows how the <a href="#source-buffer">source buffer</a> gets updated when the end of a new <a href="#media-segment">media segment</a> overlaps a segment in the buffer. In this case, the media element tries to keep as much of the old segment as possible. The amount saved depends on where the closest <a href="#random-access-point">random access point</a>, in the old segment, is to the end of the new segment. In the case of audio, if the gap is smaller than the size of an audio frame, then the media element should insert silence for this gap and not reflect it in <code><a href="#widl-SourceBuffer-buffered">buffered</a></code>.</p>
   5.905 +          <p>An implementation may keep old segment data before the end of the new segment to avoid creating a gap if it wishes. Doing this though can significantly increase implementation complexity and could cause delays at the splice point. The key property that must be preserved is the entirety of the new segment gets added to the <a href="#source-buffer">source buffer</a> and it is up to the implementation how much of the old segment data is retained. The web application can use <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> to determine how much of the old segment was preserved.</p>
   5.906 +        </section>
   5.907 +
   5.908 +        <section id="source-buffer-overlap-middle">
   5.909 +          <h4><span class="secno">2.8.4 </span>Middle Overlap</h4>
   5.910 +          <img src="middle_overlap.png">
   5.911 +          <p>The figure above shows how the <a href="#source-buffer">source buffer</a> gets updated when the new <a href="#media-segment">media segment</a> is in the middle of the old segment. This condition is handled by first resolving the <a href="#source-buffer-overlap-start">start overlap</a> and then resolving the <a href="#source-buffer-overlap-end">end overlap</a>.</p>
   5.912 +        </section>
   5.913 +      </section>
   5.914 +
   5.915 +      <section id="source-buffer-to-track-buffer">
   5.916 +        <h3><span class="secno">2.9 </span>Source Buffer to Track Buffer transfer</h3>
   5.917 +        <p>The <a href="#source-buffer">source buffer</a> represents the media that the web application would like the media element to play. The <a href="#track-buffer">track buffer</a> contains the data that will actually get decoded and rendered. In most cases the <a href="#track-buffer">track buffer</a> will simply contain a subset of the <a href="#source-buffer">source buffer</a> near the current playback position. These two buffers start to diverge though when <a href="#media-segment">media segments</a> that overlap or are very close to the current playback position are appended. Depending on the contents of the new <a href="#media-segment">media segment</a> it may not be possible to switch to the new data immediately because there isn't a <a href="#random-access-point">random access point</a> close enough to the current playback position. The quality of the implementation determines how much data is considered "in the <a href="#track-buffer">track buffer</a>". It should transfer data to the <a href="#track-buffer">track buffer</a> as late as possible whilst maintaining seamless playback. Some implementations may be able to instantiate multiple decoders or decode the new data significantly faster than real-time to achieve a seamless splice immediately. Other implementations may delay until the next <a href="#random-access-point">random access point</a> before switching to the newly appended data. Notice that this difference in behavior is only observable when appending close to the current playback position. The <a href="#track-buffer">track buffer</a> represents a media subsegment, like a group of pictures or something with similar decode dependencies, that the media element commits to playing. This commitment may be influenced by a variety of things like limited decoding resources, hardware decode buffers, a jitter buffer, or the desire to limit implementation complexity.</p>
   5.918 +        
   5.919 +        <p>Here is an example to help clarify the role of the <a href="#track-buffer">track buffer</a>. Say the current playback position has a timestamp of 8 and the media element pulled frames with timestamp 9 &amp; 10 into the track buffer. The web application then appends a higher quality <a href="#media-segment">media segment</a> that starts with a <a href="#random-access-point">random access point</a> at timestamp 9. The <a href="#source-buffer">source buffer</a> will get updated with the higher quality data, but the media element won't be able to switch to this higher quality data until the next <a href="#random-access-point">random access point</a> at timestamp 20. This is because a frame for timestamp 9 is already in the track buffer. As you can see the track buffer represents the "point of no return." for decoding. If a seek occurs the media element may choose to use the higher quality data since a seek might imply flushing the <a href="#track-buffer">track buffer</a> and the user expects a break in playback.</p>
   5.920 +      </section>
   5.921 +
   5.922 +
   5.923 +      <section id="source-buffer-segment-eviction">
   5.924 +        <h3><span class="secno">2.10 </span>Media Segment Eviction</h3>
   5.925 +        <p>When a new <a href="#media-segment">media segment</a> is appended, memory constraints may cause previously appended segments to get evicted from the <a href="#source-buffer">source buffer</a>. The eviction algorithm is implementation dependent, but segments that aren't likely to be needed soon are the most likely to get evicted. The <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> attribute allows the web application to monitor what time ranges are currently buffered in the <a href="#source-buffer">source buffer</a>.</p>
   5.926 +      </section>
   5.927 +
   5.928 +      <section id="source-buffer-timestamp-offsets">
   5.929 +        <h3><span class="secno">2.11 </span>Applying Timestamp Offsets</h3>
   5.930 +        <p>For some use cases like ad-insertion or seamless playlists, the web application may want to insert a <a href="#media-segment">media segment</a> in the presentation timeline at a location that is different than what the internal timestamps indicate. This can be accomplished by using the <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> attribute on the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> object. The value of <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> is added to all timestamps inside a <a href="#media-segment">media segment</a> before the contents of that segment are added to the <a href="#source-buffer">source buffer</a>. The <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> applies to an entire media segment. An exception is thrown if the application tries to update the attribute when only part of a media segment has been appended. Both positive or negative offsets can be assigned to <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code>. If an offset causes a <a href="#media-segment">media segment</a> timestamp to get converted to a time before the <a href="#presentation-start-time">presentation start time</a>, playback will terminate with a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-mediaerror-media_err_decode">MediaError.MEDIA_ERR_DECODE</a></code> error.</p>
   5.931 +
   5.932 +        <p>Here is a simple example to clarify how <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> can be used. Say I have two sounds I want to play in sequence. The first sound is 5 seconds long and the second one is 10 seconds. Both sound files have timestamps that start at 0. First append the <a href="#init-segment">initialization segment</a> and all <a href="#media-segment">media segments</a> for the first sound. Now set <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> to 5 seconds. Finally append the <a href="#init-segment">initialization segment</a> and <a href="#media-segment">media segments</a> for the second sound. This will result in a 15 second presentation that plays the two sounds in sequence.</p>
   5.933 +      </section>
   5.934 +    </section>
   5.935 +
   5.936 +    <section id="mediasource">
   5.937 +      <!--OddPage--><h2><span class="secno">3. </span>MediaSource Object</h2>
   5.938 +      <p>The MediaSource object represents a source of media data for an HTMLMediaElement. It keeps track of the <code><a href="#widl-MediaSource-readyState">readyState</a></code> for this source as well as a list of <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects that can be used to add media data to the presentation. MediaSource objects are created by the web application and then attached to an HTMLMediaElement. The application uses the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects in <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> to add media data to this source. The HTMLMediaElement fetches this media data from the <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> object when it is needed during playback.</p>
   5.939 +
   5.940 +      <pre class="idl"><span class="idlEnum" id="idl-def-ReadyState">enum <span class="idlEnumID">ReadyState</span> {
   5.941 +    "<span class="idlEnumItem">closed</span>",
   5.942 +    "<span class="idlEnumItem">open</span>",
   5.943 +    "<span class="idlEnumItem">ended</span>"
   5.944 +};</span></pre><table class="simple"><tr><th colspan="2">Enumeration description</th></tr><tr><td><code>closed</code></td><td>
   5.945 +          Indicates the source is not currently attached to a media element.
   5.946 +        </td></tr><tr><td><code>open</code></td><td>
   5.947 +          The source has been opened by a media element and is ready for data to be appended to the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects in <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.
   5.948 +        </td></tr><tr><td><code>ended</code></td><td>
   5.949 +          The source is still attached to a media element, but <code><a href="#widl-MediaSource-endOfStream-void-EndOfStreamError-error">endOfStream()</a></code> has been called. Appending data to <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects in this state is not allowed.
   5.950 +        </td></tr></table>
   5.951 +
   5.952 +      <pre class="idl"><span class="idlEnum" id="idl-def-EndOfStreamError">enum <span class="idlEnumID">EndOfStreamError</span> {
   5.953 +    "<span class="idlEnumItem">network</span>",
   5.954 +    "<span class="idlEnumItem">decode</span>"
   5.955 +};</span></pre><table class="simple"><tr><th colspan="2">Enumeration description</th></tr><tr><td><code>network</code></td><td>
   5.956 +          <p>Terminates playback and signals that a network error has occured.</p>
   5.957 +          <div class="note"><div class="note-title"><span>Note</span></div><p class="">If the JavaScript fetching media data encounters a network error it should use this status code to terminate playback.</p></div>
   5.958 +        </td></tr><tr><td><code>decode</code></td><td>
   5.959 +          <p>Terminates playback and signals that a decoding error has occured.</p>
   5.960 +          <div class="note"><div class="note-title"><span>Note</span></div><p class="">If the JavaScript code fetching media data has problems parsing the data it should use this status code to terminate playback.</p></div>
   5.961 +        </td></tr></table>
   5.962 +
   5.963 +      <pre class="idl"><span class="idlInterface" id="idl-def-MediaSource">[<span class="extAttr">Constructor</span>]
   5.964 +interface <span class="idlInterfaceID">MediaSource</span> : <span class="idlSuperclass"><a>EventTarget</a></span> {
   5.965 +<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a href="#idl-def-SourceBufferList" class="idlType"><code>SourceBufferList</code></a></span>    <span class="idlAttrName"><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></span>;</span>
   5.966 +<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a href="#idl-def-SourceBufferList" class="idlType"><code>SourceBufferList</code></a></span>    <span class="idlAttrName"><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></span>;</span>
   5.967 +<span class="idlAttribute">             attribute <span class="idlAttrType"><a>unrestricted double</a></span> <span class="idlAttrName"><a href="#widl-MediaSource-duration">duration</a></span>;</span>
   5.968 +<span class="idlMethod">    <span class="idlMethType"><a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a></span> <span class="idlMethName"><a href="#widl-MediaSource-addSourceBuffer-SourceBuffer-DOMString-type">addSourceBuffer</a></span> (<span class="idlParam"><span class="idlParamType"><a>DOMString</a></span> <span class="idlParamName">type</span></span>);</span>
   5.969 +<span class="idlMethod">    <span class="idlMethType"><a>void</a></span>         <span class="idlMethName"><a href="#widl-MediaSource-removeSourceBuffer-void-SourceBuffer-sourceBuffer">removeSourceBuffer</a></span> (<span class="idlParam"><span class="idlParamType"><a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a></span> <span class="idlParamName">sourceBuffer</span></span>);</span>
   5.970 +<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a href="#idl-def-ReadyState" class="idlType"><code>ReadyState</code></a></span>          <span class="idlAttrName"><a href="#widl-MediaSource-readyState">readyState</a></span>;</span>
   5.971 +<span class="idlMethod">    <span class="idlMethType"><a>void</a></span>         <span class="idlMethName"><a href="#widl-MediaSource-endOfStream-void-EndOfStreamError-error">endOfStream</a></span> (<span class="idlParam">optional <span class="idlParamType"><a href="#idl-def-EndOfStreamError" class="idlType"><code>EndOfStreamError</code></a></span> <span class="idlParamName">error</span></span>);</span>
   5.972 +};</span></pre><section id="attributes"><h3><span class="secno">3.1 </span>Attributes</h3><dl class="attributes"><dt id="widl-MediaSource-activeSourceBuffers"><code>activeSourceBuffers</code> of type <span class="idlAttrType"><a href="#idl-def-SourceBufferList" class="idlType"><code>SourceBufferList</code></a></span>, readonly</dt><dd>
   5.973 +          Contains the subset of <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> that represents the <a href="#active-source-buffers">active source buffers</a>.
   5.974 +        </dd><dt id="widl-MediaSource-duration"><code>duration</code> of type <span class="idlAttrType"><a>unrestricted double</a></span></dt><dd>
   5.975 +          <p>Allows the web application to set the presentation duration. The duration is initially set to NaN when the <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> object is created.</p>
   5.976 +          <p>On getting, run the following steps:</p>
   5.977 +          <ol>
   5.978 +            <li>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute is <code><a href="#idl-def-ReadyState">"closed"</a></code> then return NaN and abort these steps.</li>
   5.979 +            <li>Return the current value of the attribute.</li>
   5.980 +          </ol>
   5.981 +          <p>On setting, run the following steps:</p>
   5.982 +          <ol>
   5.983 +            <li>If the value being set is negative or NaN then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
   5.984 +            <li>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute is not <code><a href="#idl-def-ReadyState">"open"</a></code> then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
   5.985 +            <li>Run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var>new duration</var> set to the value being set.
   5.986 +	      <div class="note"><div class="note-title"><span>Note</span></div><p class=""><code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code> and <code><a href="#widl-MediaSource-endOfStream-void-EndOfStreamError-error">endOfStream()</a></code> can update the duration under certain circumstances.</p></div>
   5.987 +            </li>
   5.988 +          </ol>
   5.989 +        </dd><dt id="widl-MediaSource-readyState"><code>readyState</code> of type <span class="idlAttrType"><a href="#idl-def-ReadyState" class="idlType"><code>ReadyState</code></a></span>, readonly</dt><dd>
   5.990 +          <p>Indicates the current state of the <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> object. When the <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> is created <code><a href="#widl-MediaSource-readyState">readyState</a></code> must be set to <code><a href="#idl-def-ReadyState">"closed"</a></code>.
   5.991 +        </p></dd><dt id="widl-MediaSource-sourceBuffers"><code>sourceBuffers</code> of type <span class="idlAttrType"><a href="#idl-def-SourceBufferList" class="idlType"><code>SourceBufferList</code></a></span>, readonly</dt><dd>
   5.992 +          Contains the list of <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects associated with this <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a>. When <code><a href="#widl-MediaSource-readyState">readyState</a></code> equals <code><a href="#idl-def-ReadyState">"closed"</a></code> this list will be empty. Once <code><a href="#widl-MediaSource-readyState">readyState</a></code> transitions to <code><a href="#idl-def-ReadyState">"open"</a></code> SourceBuffer objects can be added to this list by using <code><a href="#widl-MediaSource-addSourceBuffer-SourceBuffer-DOMString-type">addSourceBuffer()</a></code>.
   5.993 +        </dd></dl></section><section id="methods"><h3><span class="secno">3.2 </span>Methods</h3><dl class="methods"><dt id="widl-MediaSource-addSourceBuffer-SourceBuffer-DOMString-type"><code>addSourceBuffer</code></dt><dd>
   5.994 +          <p>Adds a new <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> to <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.</p>
   5.995 +          <p>When this method is invoked, the user agent must run the following steps:</p>
   5.996 +          <ol>
   5.997 +            <li>If <var title="true">type</var> is null or an empty string then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
   5.998 +            <li>If <var title="true">type</var> contains a MIME type that is not supported or contains a MIME type that is not supported with the types specified for the other <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects in <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>, then throw a <code><a href="http://dom.spec.whatwg.org/#dom-domexception-not_supported_err">NOT_SUPPORTED_ERR</a></code> exception and abort these steps.</li>
   5.999 +            <li>If the user agent can't handle any more SourceBuffer objects then throw a <code><a href="http://dom.spec.whatwg.org/#dom-domexception-quota_exceeded_err">QUOTA_EXCEEDED_ERR</a></code> exception and abort these steps.</li>
  5.1000 +            <li>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute is not in the <code><a href="#idl-def-ReadyState">"open"</a></code> state then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1001 +            <li>Create a new <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> object and associated resources.</li>
  5.1002 +            <li>Add the new object to <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-addsourcebuffer">addsourcebuffer</a></code> at <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.</li>
  5.1003 +            <li>Return the new object.</li>
  5.1004 +          </ol>
  5.1005 +        <table class="parameters"><tr><th>Parameter</th><th>Type</th><th>Nullable</th><th>Optional</th><th>Description</th></tr><tr><td class="prmName">type</td><td class="prmType"><code><a>DOMString</a></code></td><td class="prmNullFalse">✘</td><td class="prmOptFalse">✘</td><td class="prmDesc"></td></tr></table><div><em>Return type: </em><code><a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a></code></div></dd><dt id="widl-MediaSource-endOfStream-void-EndOfStreamError-error"><code>endOfStream</code></dt><dd>
  5.1006 +          <p>Signals the end of the stream.</p>
  5.1007 +          <p>When this method is invoked, the user agent must run the following steps:</p>
  5.1008 +          <ol>
  5.1009 +            <li>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute is not in the <code><a href="#idl-def-ReadyState">"open"</a></code> state then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1010 +            <li>Change the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute value to <code><a href="#idl-def-ReadyState">"ended"</a></code>.</li>
  5.1011 +            <li>
  5.1012 +              <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-sourceended">sourceended</a></code> at the <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a>.</li>
  5.1013 +            <li><dl class="switch">
  5.1014 +                <dt>If <var title="true">error</var> is not set, null, or an empty string</dt>
  5.1015 +                <dd>
  5.1016 +	          <ol>
  5.1017 +	            <li>Run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var>new duration</var> set to the highest end timestamp across all <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects in <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.<br>
  5.1018 +		      <div class="note"><div class="note-title"><span>Note</span></div><p class="">This allows the duration to properly reflect the end of the appended media segments. For example, if the duration was explicitly set to 10 seconds and only media segments for 0 to 5 seconds were appended before endOfStream() was called, then the duration will get updated to 5 seconds.</p></div>
  5.1019 +	            </li>
  5.1020 +	            <li>Notify the media element that it now has all of the media data. Playback should continue until all the media passed in via <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code> has been played.</li>
  5.1021 +	          </ol>
  5.1022 +	        </dd>
  5.1023 +                <dt>If <var title="true">error</var> is set to <code><a href="#idl-def-EndOfStreamError">"network"</a></code>
  5.1024 +                </dt>
  5.1025 +                <dd>
  5.1026 +	          <dl class="switch">
  5.1027 +	            <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute equals <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>
  5.1028 +                    </dt>
  5.1029 +	            <dd>Run the  steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1030 +	            <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is greater than <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>
  5.1031 +                    </dt>
  5.1032 +	            <dd>Run the "<i>If the connection is interrupted after some media data has been received, causing the user agent to give up trying to fetch the resource</i>" steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1033 +	          </dl>
  5.1034 +	        </dd>
  5.1035 +                <dt>If <var title="true">error</var> is set to <code><a href="#idl-def-EndOfStreamError">"decode"</a></code>
  5.1036 +                </dt>
  5.1037 +                <dd>
  5.1038 +	          <dl class="switch">
  5.1039 +	            <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute equals <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>
  5.1040 +                    </dt>
  5.1041 +	            <dd>Run the "<i>If the media data can be fetched but is found by inspection to be in an unsupported format, or can otherwise not be rendered at all</i>" steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1042 +	            <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is greater than <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>
  5.1043 +                    </dt>
  5.1044 +	            <dd>Run the <a href="http://dev.w3.org/html5/spec/media-elements.html#fatal-decode-error">media data is corrupted</a> steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1045 +	          </dl>
  5.1046 +	        </dd>
  5.1047 +                <dt>Otherwise</dt>
  5.1048 +                <dd>Throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception.</dd>
  5.1049 +              </dl>
  5.1050 +            </li>
  5.1051 +          </ol>
  5.1052 +        <table class="parameters"><tr><th>Parameter</th><th>Type</th><th>Nullable</th><th>Optional</th><th>Description</th></tr><tr><td class="prmName">error</td><td class="prmType"><code><a href="#idl-def-EndOfStreamError" class="idlType"><code>EndOfStreamError</code></a></code></td><td class="prmNullFalse">✘</td><td class="prmOptTrue">✔</td><td class="prmDesc"></td></tr></table><div><em>Return type: </em><code><a>void</a></code></div></dd><dt id="widl-MediaSource-removeSourceBuffer-void-SourceBuffer-sourceBuffer"><code>removeSourceBuffer</code></dt><dd>
  5.1053 +          <p>Removes a <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> from <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.</p>
  5.1054 +
  5.1055 +          <p>When this method is invoked, the user agent must run the following steps:</p>
  5.1056 +          <ol>
  5.1057 +            <li>If <var title="true">sourceBuffer</var> is null then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.1058 +            <li>If <var title="true">sourceBuffer</var> specifies an object that is not in <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> then throw a <code><a href="http://dom.spec.whatwg.org/#dom-domexception-not_found_err">NOT_FOUND_ERR</a></code> exception and abort these steps.</li>
  5.1059 +            <li>Remove track information from <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-audiotracks">audioTracks</a></code>, <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-videotracks">videoTracks</a></code>, and <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-texttracks">textTracks</a></code> for all tracks associated with <var title="true">sourceBuffer</var> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <a href="http://dev.w3.org/html5/spec/media-elements.html#handler-tracklist-onchange">change</a> at the modified lists.</li>
  5.1060 +            <li>If <var title="true">sourceBuffer</var> is in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>, then remove it from <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1061 +            <li>Remove <var title="true">sourceBuffer</var> from <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.</li>
  5.1062 +            <li>Destroy all resources for <var title="true">sourceBuffer</var>.</li>
  5.1063 +          </ol>
  5.1064 +        <table class="parameters"><tr><th>Parameter</th><th>Type</th><th>Nullable</th><th>Optional</th><th>Description</th></tr><tr><td class="prmName">sourceBuffer</td><td class="prmType"><code><a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a></code></td><td class="prmNullFalse">✘</td><td class="prmOptFalse">✘</td><td class="prmDesc"></td></tr></table><div><em>Return type: </em><code><a>void</a></code></div></dd></dl></section>
  5.1065 +
  5.1066 +      <section id="mediasource-events">
  5.1067 +        <h3><span class="secno">3.3 </span>Event Summary</h3>
  5.1068 +        <table class="old-table">
  5.1069 +          <thead>
  5.1070 +            <tr>
  5.1071 +              <th>Event name</th>
  5.1072 +              <th>Interface</th>
  5.1073 +              <th>Dispatched when...</th>
  5.1074 +            </tr>
  5.1075 +          </thead>
  5.1076 +          <tbody>
  5.1077 +            <tr>
  5.1078 +              <td><dfn id="dom-evt-sourceopen"><code>sourceopen</code></dfn></td>
  5.1079 +              <td><code>Event</code></td>
  5.1080 +              <td>When <code><a href="#widl-MediaSource-readyState">readyState</a></code> transitions from <code><a href="#idl-def-ReadyState">"closed"</a></code> to <code><a href="#idl-def-ReadyState">"open"</a></code> or from <code><a href="#idl-def-ReadyState">"ended"</a></code> to <code><a href="#idl-def-ReadyState">"open"</a></code>.</td>
  5.1081 +            </tr>
  5.1082 +            <tr>
  5.1083 +              <td><dfn id="dom-evt-sourceended"><code>sourceended</code></dfn></td>
  5.1084 +              <td><code>Event</code></td>
  5.1085 +              <td>When <code><a href="#widl-MediaSource-readyState">readyState</a></code> transitions from <code><a href="#idl-def-ReadyState">"open"</a></code> to <code><a href="#idl-def-ReadyState">"ended"</a></code>.</td>
  5.1086 +            </tr>
  5.1087 +            <tr>
  5.1088 +              <td><dfn id="dom-evt-sourceclose"><code>sourceclose</code></dfn></td>
  5.1089 +              <td><code>Event</code></td>
  5.1090 +	      <td>When <code><a href="#widl-MediaSource-readyState">readyState</a></code> transitions from <code><a href="#idl-def-ReadyState">"open"</a></code> to <code><a href="#idl-def-ReadyState">"closed"</a></code> or <code><a href="#idl-def-ReadyState">"ended"</a></code> to <code><a href="#idl-def-ReadyState">"closed"</a></code>.</td>
  5.1091 +            </tr>
  5.1092 +          </tbody>
  5.1093 +        </table>
  5.1094 +      </section>
  5.1095 +
  5.1096 +      <section id="mediasource-algorithms">
  5.1097 +        <h3><span class="secno">3.4 </span>Algorithms</h3>
  5.1098 +
  5.1099 +        <section id="mediasource-attach">
  5.1100 +          <h4><span class="secno">3.4.1 </span>Attaching to a media element</h4>
  5.1101 +          <p> A <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> object can be attached to a media element by assigning a <a href="#mediasource-object-url">MediaSource object URL</a> to the media element <code><a href="http://dev.w3.org/html5/spec/media-elements.html#attr-media-src">src</a></code> attribute or the src attribute of a &lt;source&gt; inside a media element. A <a href="#mediasource-object-url">MediaSource object URL</a> is created by passing a MediaSource object to <code><a href="#widl-URL-createObjectURL-DOMString-MediaSource-mediaSource">createObjectURL()</a></code>.</p>
  5.1102 +          <p>If the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a> absolute URL matches the MediaSource object URL, run the following steps right before the "Perform a potentially
  5.1103 +            CORS-enabled fetch" step in the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</p>
  5.1104 +          <ol>
  5.1105 +            <dl class="switch">
  5.1106 +              <dt>If <code><a href="#widl-MediaSource-readyState">readyState</a></code> is NOT set to <code><a href="#idl-def-ReadyState">"closed"</a></code></dt>
  5.1107 +              <dd>Run the  steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1108 +              <dt>Otherwise</dt>
  5.1109 +              <dd>
  5.1110 +                <ol>
  5.1111 +                  <li>Set the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute to <code><a href="#idl-def-ReadyState">"open"</a></code>.</li>
  5.1112 +                  <li>
  5.1113 +                    <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-sourceopen">sourceopen</a></code> at the <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a>.</li>
  5.1114 +                  <li>Allow the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a> to progress based on data passed in via <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code>.</li>
  5.1115 +                </ol>
  5.1116 +              </dd>
  5.1117 +            </dl>
  5.1118 +          </ol>
  5.1119 +        </section>
  5.1120 +
  5.1121 +        <section id="mediasource-detach">
  5.1122 +          <h4><span class="secno">3.4.2 </span>Detaching from a media element</h4>
  5.1123 +          <p>The following steps are run in any case where the media element is going to transition to <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-network_empty">NETWORK_EMPTY</a> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <a href="http://dev.w3.org/html5/spec/media-elements.html#event-mediacontroller-emptied">emptied</a> at the media element. These steps should be run right before the transition.</p>
  5.1124 +          <ol>
  5.1125 +            <li>Set the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute to <code><a href="#idl-def-ReadyState">"closed"</a></code>.</li>
  5.1126 +            <li>Set the <code><a href="#widl-MediaSource-duration">duration</a></code> attribute to NaN.</li>
  5.1127 +            <li>Remove all the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects from <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1128 +            <li>
  5.1129 +              <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1130 +            <li>Remove all the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects from <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.</li>
  5.1131 +            <li>
  5.1132 +              <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.</li>
  5.1133 +            <li>
  5.1134 +              <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-sourceclose">sourceclose</a></code> at the <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a>.</li>
  5.1135 +          </ol>
  5.1136 +        </section>
  5.1137 +
  5.1138 +        <section id="mediasource-seeking">
  5.1139 +          <h4><span class="secno">3.4.3 </span>Seeking</h4>
  5.1140 +          <p>Run the following steps as part of the "<i>Wait until the user agent has established whether or not the media data for the new playback position is available, and, if it is, until it has decoded enough data to play back that position"</i> step of the <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-seek">seek algorithm</a>:</p>
  5.1141 +          <ol>
  5.1142 +            <li>The media element looks for <a href="#media-segment">media segments</a> containing the <var title="true">new playback position</var> in each <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> object in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1143 +            <dl class="switch">
  5.1144 +	      <dt>If one or more of the objects in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> is missing <a href="#media-segment">media segments</a> for the <var title="true">new playback position</var>
  5.1145 +              </dt>
  5.1146 +	      <dd>
  5.1147 +	        <ol>
  5.1148 +	          <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>.</li>
  5.1149 +	          <li>The media element waits for the necessary <a href="#media-segment">media segments</a> to be passed to <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code>. The web application can use <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> to determine what the media element needs to resume playback.</li>
  5.1150 +	        </ol>
  5.1151 +	      </dd>
  5.1152 +	      <dt>Otherwise</dt>
  5.1153 +	      <dd>Continue</dd>
  5.1154 +            </dl>
  5.1155 +            <li>The media element resets all decoders and initializes each one with data from the appropriate <a href="#init-segment">initialization segment</a>.</li>
  5.1156 +            <li>The media element feeds data from the <a href="#media-segment">media segments</a> into the decoders until the <var title="true">new playback position</var> is reached.</li>
  5.1157 +            <li>Resume the <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-seek">seek algorithm</a> at the "<i>Await a stable state</i>" step.</li>
  5.1158 +          </ol>
  5.1159 +        </section>
  5.1160 +
  5.1161 +
  5.1162 +        <section id="buffer-monitoring">
  5.1163 +          <h4><span class="secno">3.4.4 </span>SourceBuffer Monitoring</h4>
  5.1164 +          <p>The following steps are periodically run during playback to make sure that all of the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> have enough data to ensure uninterrupted playback. Appending new segments and changes to <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> also cause these steps to run because they affect the conditions that trigger state transitions. The web application can monitor changes in <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> to drive <a href="#media-segment">media segment</a> appending.</p>
  5.1165 +          <dl class="switch">
  5.1166 +            <dt>If <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> for all objects in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> do not contain <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> for the current playback position:</dt>
  5.1167 +            <dd>
  5.1168 +	      <ol>
  5.1169 +	        <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>.</li>
  5.1170 +	        <li>If this is the first transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>, then <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-loadedmetadata">loadedmetadata</a></code> at the media element.</li>
  5.1171 +	        <li>Abort these steps.</li>
  5.1172 +	      </ol>
  5.1173 +            </dd>
  5.1174 +            <dt>If <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> for all objects in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> contain <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> that include the current playback position and enough data to ensure uninterrupted playback:</dt>
  5.1175 +            <dd>
  5.1176 +	      <ol>
  5.1177 +	        <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_enough_data">HAVE_ENOUGH_DATA</a></code>.</li>
  5.1178 +	        <li>
  5.1179 +                  <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-canplaythrough">canplaythrough</a></code> at the media element.</li>
  5.1180 +	        <li>Playback may resume at this point if it was previously suspended by a transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>.</li>
  5.1181 +	        <li>Abort these steps.</li>
  5.1182 +	      </ol>
  5.1183 +            </dd>
  5.1184 +            <dt>If <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> for at least one object in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> contains a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRange</a></code> that includes the current playback position but not enough data to ensure uninterrupted playback:</dt>
  5.1185 +            <dd>
  5.1186 +	      <ol>
  5.1187 +	        <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_future_data">HAVE_FUTURE_DATA</a></code>.</li>
  5.1188 +	        <li>If the previous value of <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> was less than <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_future_data">HAVE_FUTURE_DATA</a></code>, then <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-canplay">canplay</a></code> at the media element.</li>
  5.1189 +	        <li>Playback may resume at this point if it was previously suspended by a transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>.</li>
  5.1190 +	        <li>Abort these steps.</li>
  5.1191 +	      </ol>
  5.1192 +            </dd>
  5.1193 +            <dt>If <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> for at least one object in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> contains a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRange</a></code> that ends at the current playback position and does not have a range covering the time immediately after the current position:</dt>
  5.1194 +            <dd>
  5.1195 +	      <ol>
  5.1196 +	        <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>.</li>
  5.1197 +	        <li>If this is the first transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>, then <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-loadeddata">loadeddata</a></code> at the media element.</li>
  5.1198 +	        <li>Playback is suspended at this point since the media element doesn't have enough data to advance the timeline.</li>
  5.1199 +	        <li>Abort these steps.</li>
  5.1200 +	      </ol>
  5.1201 +            </dd>
  5.1202 +          </dl>
  5.1203 +        </section>
  5.1204 +
  5.1205 +        <section id="active-source-buffer-changes">
  5.1206 +          <h4><span class="secno">3.4.5 </span>Changes to selected/enabled track state</h4>
  5.1207 +          <p>During playback <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> needs to be updated if the <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-videotrack-selected">selected video track</a>, the <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-audiotrack-enabled">enabled audio tracks</a>, or a text track <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-mode">mode</a> changes. When one or more of these changes occur the following steps need to be followed.</p>
  5.1208 +          <dl class="switch">
  5.1209 +            <dt>If the selected video track changes:</dt>
  5.1210 +            <dd>
  5.1211 +	      <ol>
  5.1212 +	        <li>If the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with the previously selected video track is not associated with any other enabled tracks, run the following steps:
  5.1213 +  	          <ol>
  5.1214 +	            <li>Remove the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> from <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1215 +	            <li>
  5.1216 +                      <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1217 +                    </li>
  5.1218 +	          </ol>
  5.1219 +	        </li>
  5.1220 +	        <li>If the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with the newly selected video track is not already in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>, run the following steps:
  5.1221 +	          <ol>
  5.1222 +	            <li>Add the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> to <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1223 +	            <li>
  5.1224 +                      <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-addsourcebuffer">addsourcebuffer</a></code> at <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1225 +                    </li>
  5.1226 +	          </ol>
  5.1227 +	        </li>
  5.1228 +	      </ol>
  5.1229 +            </dd>
  5.1230 +            <dt>If an audio track becomes disabled and the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with this track is not associated with any other enabled or selected track</dt>
  5.1231 +            <dd>
  5.1232 +	      <ol>
  5.1233 +	        <li>Remove the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with the audio track from <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1234 +                </li>
  5.1235 +	        <li>
  5.1236 +                  <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1237 +                </li>
  5.1238 +	      </ol>
  5.1239 +            </dd>
  5.1240 +            <dt>If an audio track becomes enabled and the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with this track is not already in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1241 +            </dt>
  5.1242 +            <dd>
  5.1243 +	      <ol>
  5.1244 +	        <li>Add the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with the audio track to <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1245 +                </li>
  5.1246 +	        <li>
  5.1247 +                  <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-addsourcebuffer">addsourcebuffer</a></code> at <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1248 +                </li>
  5.1249 +	      </ol>
  5.1250 +            </dd>
  5.1251 +            <dt>If a text track <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-mode">mode</a> becomes <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-disabled">"disabled"</a> and the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with this track is not associated with any other enabled or selected track</dt>
  5.1252 +            <dd>
  5.1253 +	      <ol>
  5.1254 +	        <li>Remove the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with the text track from <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1255 +                </li>
  5.1256 +	        <li>
  5.1257 +                  <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1258 +                </li>
  5.1259 +	      </ol>
  5.1260 +            </dd>
  5.1261 +            <dt>If a text track <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-mode">mode</a> becomes <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-showing">"showing"</a> or <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-hidden">"hidden"</a> and the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with this track is not already in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1262 +            </dt>
  5.1263 +            <dd>
  5.1264 +	      <ol>
  5.1265 +	        <li>Add the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> associated with the text track to <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1266 +                </li>
  5.1267 +	        <li>
  5.1268 +                  <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-addsourcebuffer">addsourcebuffer</a></code> at <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>
  5.1269 +                </li>
  5.1270 +	      </ol>
  5.1271 +            </dd>
  5.1272 +          </dl>
  5.1273 +        </section>
  5.1274 +
  5.1275 +        <section id="duration-change-algorithm">
  5.1276 +          <h4><span class="secno">3.4.6 </span>Duration change</h4>
  5.1277 +          <p>Follow these steps when <code><a href="#widl-MediaSource-duration">duration</a></code> needs to change to a <var>new duration</var>.</p>
  5.1278 +          <ol>
  5.1279 +            <li>If the current value of <code><a href="#widl-MediaSource-duration">duration</a></code> is equal to <var>new duration</var>, then abort these steps.</li>
  5.1280 +            <li>Update <code><a href="#widl-MediaSource-duration">duration</a></code> to <var>new duration</var>.</li>
  5.1281 +            <li>Remove all media data with timestamps that are greater than <var>new duration</var> from all <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects in <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code>.
  5.1282 +              <div class="note"><div class="note-title"><span>Note</span></div><p class="">This preserves audio frames that start before and end after the <code><a href="#widl-MediaSource-duration">duration</a></code>. The user agent must end playback at <code><a href="#widl-MediaSource-duration">duration</a></code> even if the audio frame extends beyond this time.</p></div>
  5.1283 +            </li>
  5.1284 +            <li>Update the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#media-controller-duration">media controller duration</a></code> to <var>new duration</var> and run the <a href="http://dev.w3.org/html5/spec/media-elements.html#durationChange">HTMLMediaElement duration change algorithm</a>.</li>
  5.1285 +          </ol>
  5.1286 +        </section>
  5.1287 +      </section>
  5.1288 +    </section>
  5.1289 +
  5.1290 +    <section id="sourcebuffer">
  5.1291 +      <!--OddPage--><h2><span class="secno">4. </span>SourceBuffer Object</h2>
  5.1292 +
  5.1293 +      <pre class="idl"><span class="idlInterface" id="idl-def-SourceBuffer">interface <span class="idlInterfaceID">SourceBuffer</span> : <span class="idlSuperclass"><a>EventTarget</a></span> {
  5.1294 +<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a>TimeRanges</a></span> <span class="idlAttrName"><a href="#widl-SourceBuffer-buffered">buffered</a></span>;</span>
  5.1295 +<span class="idlAttribute">             attribute <span class="idlAttrType"><a>double</a></span>     <span class="idlAttrName"><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></span>;</span>
  5.1296 +<span class="idlMethod">    <span class="idlMethType"><a>void</a></span> <span class="idlMethName"><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append</a></span> (<span class="idlParam"><span class="idlParamType"><a>Uint8Array</a></span> <span class="idlParamName">data</span></span>);</span>
  5.1297 +<span class="idlMethod">    <span class="idlMethType"><a>void</a></span> <span class="idlMethName"><a href="#widl-SourceBuffer-abort-void">abort</a></span> ();</span>
  5.1298 +<span class="idlMethod">    <span class="idlMethType"><a>void</a></span> <span class="idlMethName"><a href="#widl-SourceBuffer-remove-void-double-start-double-end">remove</a></span> (<span class="idlParam"><span class="idlParamType"><a>double</a></span> <span class="idlParamName">start</span></span>, <span class="idlParam"><span class="idlParamType"><a>double</a></span> <span class="idlParamName">end</span></span>);</span>
  5.1299 +};</span></pre><section id="attributes-1"><h3><span class="secno">4.1 </span>Attributes</h3><dl class="attributes"><dt id="widl-SourceBuffer-buffered"><code>buffered</code> of type <span class="idlAttrType"><a>TimeRanges</a></span>, readonly</dt><dd>
  5.1300 +          <p>Indicates what <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> are buffered in the <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a>.</p>
  5.1301 +          <p>When the attribute is read the following steps must occur:</p>
  5.1302 +          <ol>
  5.1303 +            <li>If this object has been removed from the <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> attribute of the <a href="#parent-media-source">parent media source</a> then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1304 +            <li>Return a new static <a href="http://dev.w3.org/html5/spec/media-elements.html#normalized-timeranges-object">normalized TimeRanges object</a> for the <a href="#media-segment">media segments</a> buffered.</li>
  5.1305 +          </ol>
  5.1306 +        </dd><dt id="widl-SourceBuffer-timestampOffset"><code>timestampOffset</code> of type <span class="idlAttrType"><a>double</a></span></dt><dd>
  5.1307 +          <p>Controls the offset applied to timestamps inside subsequent <a href="#media-segment">media segments</a> that are appended to this <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a>. The <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> is initially set to 0 which indicates that no offset is being applied.</p>
  5.1308 +          <p> On getting, the initial value or the last value that was successfully set is returned.</p>
  5.1309 +          <p>On setting, run following steps:</p>
  5.1310 +          <ol>
  5.1311 +            <li>If this object has been removed from the <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> attribute of the <a href="#parent-media-source">parent media source</a>, then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1312 +            <li>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute of the <a href="#parent-media-source">parent media source</a> is not in the <code><a href="#idl-def-ReadyState">"open"</a></code> state, then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1313 +            <li>If this object is waiting for the end of a <a href="#media-segment">media segment</a> to be appended, then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> and abort these steps.</li>
  5.1314 +            <li>Update the attribute to the new value.</li>
  5.1315 +          </ol>
  5.1316 +        </dd></dl></section><section id="methods-1"><h3><span class="secno">4.2 </span>Methods</h3><dl class="methods"><dt id="widl-SourceBuffer-abort-void"><code>abort</code></dt><dd>
  5.1317 +          <p>Aborts the current segment and resets the segment parser.</p>
  5.1318 +
  5.1319 +          <p>When this method is invoked, the user agent must run the following steps:</p>
  5.1320 +          <ol>
  5.1321 +            <li>If this object has been removed from the <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> attribute of the <a href="#parent-media-source">parent media source</a> then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1322 +            <li>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute of the <a href="#parent-media-source">parent media source</a> is not in the <code><a href="#idl-def-ReadyState">"open"</a></code> state then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1323 +            <li>The media element aborts parsing the current segment.</li>
  5.1324 +            <li>If the <a href="#sourcebuffer-append-state">append state</a> equals <a href="#sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</a> and the <a href="#sourcebuffer-input-buffer">input buffer</a> contains some complete <a href="#coded-frame">coded frames</a>, then run the <a href="#sourcebuffer-coded-frame-processing">coded frame processing algorithm</a> as if the media segment only contained these frames.</li>
  5.1325 +            <li>Remove all bytes from the <a href="#sourcebuffer-input-buffer">input buffer</a>.</li>
  5.1326 +            <li>Set <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a>.</li>
  5.1327 +          </ol>
  5.1328 +        <div><em>No parameters.</em></div><div><em>Return type: </em><code><a>void</a></code></div></dd><dt id="widl-SourceBuffer-append-void-Uint8Array-data"><code>append</code></dt><dd>
  5.1329 +          <p>Appends segment data to the source buffer.</p>
  5.1330 +
  5.1331 +          <p>When this method is invoked, the user agent must run the following steps:</p>
  5.1332 +          <ol>
  5.1333 +            <li>If <var title="true">data</var> is null then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.1334 +            <li>If this object has been removed from the <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> attribute of the <a href="#parent-media-source">parent media source</a> then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1335 +            <li>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute of the <a href="#parent-media-source">parent media source</a> is in the <code><a href="#idl-def-ReadyState">"closed"</a></code> state then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1336 +            <li>
  5.1337 +              <p>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute of the <a href="#parent-media-source">parent media source</a> is in the <code><a href="#idl-def-ReadyState">"ended"</a></code> state then run the following steps:</p>
  5.1338 +              <ol>
  5.1339 +	        <li>Set the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute of the <a href="#parent-media-source">parent media source</a> to <code><a href="#idl-def-ReadyState">"open"</a></code>
  5.1340 +                </li>
  5.1341 +	        <li>
  5.1342 +                  <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="#dom-evt-sourceopen">sourceopen</a></code> at the <a href="#parent-media-source">parent media source</a> .</li>
  5.1343 +              </ol>
  5.1344 +            </li>
  5.1345 +            <li>If <var title="true">data</var>.byteLength is 0, then abort these steps.</li>
  5.1346 +            <li>Add <var title="true">data</var> to the end of the <a href="#sourcebuffer-input-buffer">input buffer</a>
  5.1347 +            </li>
  5.1348 +            <li>Run the <a href="#sourcebuffer-segment-parser-loop">segment parser loop</a>.</li>
  5.1349 +          </ol>
  5.1350 +        <table class="parameters"><tr><th>Parameter</th><th>Type</th><th>Nullable</th><th>Optional</th><th>Description</th></tr><tr><td class="prmName">data</td><td class="prmType"><code><a>Uint8Array</a></code></td><td class="prmNullFalse">✘</td><td class="prmOptFalse">✘</td><td class="prmDesc"></td></tr></table><div><em>Return type: </em><code><a>void</a></code></div></dd><dt id="widl-SourceBuffer-remove-void-double-start-double-end"><code>remove</code></dt><dd>
  5.1351 +          <p>Removes media for a specific time range.</p>
  5.1352 +
  5.1353 +          <p>When this method is invoked, the user agent must run the following steps:</p>
  5.1354 +          <ol>
  5.1355 +            <li>If <var title="true">start</var> is negative or greater than <code><a href="#widl-MediaSource-duration">duration</a></code>, then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.1356 +            <li>If <var title="true">end</var> is less than or equal to <var title="true">start</var>, then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.1357 +            <li>If this object has been removed from the <code><a href="#widl-MediaSource-sourceBuffers">sourceBuffers</a></code> attribute of the <a href="#parent-media-source">parent media source</a> then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1358 +            <li>If the <code><a href="#widl-MediaSource-readyState">readyState</a></code> attribute of the <a href="#parent-media-source">parent media source</a> is not in the <code><a href="#idl-def-ReadyState">"open"</a></code> state then throw an <code><a href="http://dom.spec.whatwg.org/#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1359 +            <li>
  5.1360 +              <p>For each track in this source buffer, run the following steps:</p>
  5.1361 +              <ol>
  5.1362 +	        <li>
  5.1363 +	          <p>Let <var title="true">next random access point timestamp</var> be the timestamp of the next <a href="#random-access-point">random access point</a>, for this track, that is greater than or equal to <var title="true">end</var>.</p>
  5.1364 +	          <div class="note"><div class="note-title"><span>Note</span></div><p class=""><var title="true">next random access point timestamp</var> can be different across tracks because the dependencies between <a href="#coded-frame">coded frames</a> within a track are usually different than the dependencies in another track.</p></div>
  5.1365 +                </li>
  5.1366 +	        <li>Remove all media data, for this track, that contain starting timestamps greater than or equal to <var title="true">start</var> and less than the <var title="true">next random access point timestamp</var>.</li>
  5.1367 +	      </ol>
  5.1368 +            </li>
  5.1369 +        </ol>
  5.1370 +
  5.1371 +        <table class="parameters"><tr><th>Parameter</th><th>Type</th><th>Nullable</th><th>Optional</th><th>Description</th></tr><tr><td class="prmName">start</td><td class="prmType"><code><a>double</a></code></td><td class="prmNullFalse">✘</td><td class="prmOptFalse">✘</td><td class="prmDesc"></td></tr><tr><td class="prmName">end</td><td class="prmType"><code><a>double</a></code></td><td class="prmNullFalse">✘</td><td class="prmOptFalse">✘</td><td class="prmDesc"></td></tr></table><div><em>Return type: </em><code><a>void</a></code></div></dd></dl></section>
  5.1372 +
  5.1373 +      <section id="sourcebuffer-algorithms">
  5.1374 +        <h3><span class="secno">4.3 </span>Algorithms</h3>
  5.1375 +
  5.1376 +        <section id="sourcebuffer-segment-parser-loop">
  5.1377 +          <h4><span class="secno">4.3.1 </span>Segment Parser Loop</h4>
  5.1378 +          <p>All SourceBuffer objects have an internal <dfn id="sourcebuffer-append-state">append state</dfn> variable that keeps track of the high-level segment parsing state. It is initially set to <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a> and can transition to the following states as data is appended.</p>
  5.1379 +          <table class="old-table">
  5.1380 +            <thead>
  5.1381 +	      <tr>
  5.1382 +                <th>Append state name</th>
  5.1383 +                <th>Description</th>
  5.1384 +              </tr>
  5.1385 +            </thead>
  5.1386 +            <tbody>
  5.1387 +              <tr>
  5.1388 +                <td><dfn id="sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</dfn></td>
  5.1389 +                <td>Waiting for the start of an <a href="#init-segment">initialization segment</a> or <a href="#media-segment">media segment</a> to be appended.</td>
  5.1390 +              </tr>
  5.1391 +              <tr>
  5.1392 +                <td><dfn id="sourcebuffer-parsing-init-segment">PARSING_INIT_SEGMENT</dfn></td>
  5.1393 +                <td>Currently parsing an <a href="#init-segment">initialization segment</a>.</td>
  5.1394 +              </tr>
  5.1395 +	      <tr>
  5.1396 +	        <td><dfn id="sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</dfn></td>
  5.1397 +                <td>Currently parsing a <a href="#media-segment">media segment</a>.</td>
  5.1398 +              </tr>
  5.1399 +            </tbody>
  5.1400 +          </table>
  5.1401 +          
  5.1402 +          <p>The <dfn id="sourcebuffer-input-buffer">input buffer</dfn> is a byte buffer that is used to hold unparsed bytes across <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code> calls. The buffer is empty when the SourceBuffer object is created.</p>
  5.1403 +
  5.1404 +          <p>While the <a href="#sourcebuffer-input-buffer">input buffer</a> is not empty, run the following steps in a loop:</p>
  5.1405 +          <ol>
  5.1406 +            <li>If the <a href="#sourcebuffer-input-buffer">input buffer</a> starts with bytes that violate the <a href="#byte-stream-formats">byte stream format specifications</a>, then call <code><a href="#widl-MediaSource-endOfStream-void-EndOfStreamError-error">endOfStream("decode")</a></code>, and abort this algorithm.</li>
  5.1407 +            <li>Remove any bytes that the <a href="#byte-stream-formats">byte stream format specifications</a> say should be ignored from the start of the <a href="#sourcebuffer-input-buffer">input buffer</a>.</li>
  5.1408 +            <li>
  5.1409 +	      <p>If the <a href="#sourcebuffer-append-state">append state</a> equals <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a>, then run the following steps:</p>
  5.1410 +	      <ol>
  5.1411 +	        <li>If the beginning of the <a href="#sourcebuffer-input-buffer">input buffer</a> indicates the start of an <a href="#init-segment">initialization segment</a>, set the <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-parsing-init-segment">PARSING_INIT_SEGMENT</a>.</li>
  5.1412 +	        <li>If the beginning of the <a href="#sourcebuffer-input-buffer">input buffer</a> indicates the start of an <a href="#media-segment">media segment</a>, set <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</a>.</li>
  5.1413 +	        <li>Return  to the top of the loop.</li>
  5.1414 +	      </ol>
  5.1415 +            </li>
  5.1416 +            <li>
  5.1417 +	      <p>If the <a href="#sourcebuffer-append-state">append state</a> equals <a href="#sourcebuffer-parsing-init-segment">PARSING_INIT_SEGMENT</a>, then run the following steps:</p>
  5.1418 +	      <ol>
  5.1419 +	        <li>If the <a href="#sourcebuffer-input-buffer">input buffer</a> does not contain a complete <a href="#init-segment">initialization segment</a> yet, then exit the loop.</li>
  5.1420 +	        <li>Run the <a href="#sourcebuffer-init-segment-received">initialization segment received algorithm</a>.</li>
  5.1421 +	        <li>Remove the <a href="#init-segment">initialization segment</a> bytes from the beginning of the <a href="#sourcebuffer-input-buffer">input buffer</a>.</li>
  5.1422 +	        <li>Set <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a>.</li>
  5.1423 +	        <li>Return  to the top of the loop.</li>
  5.1424 +	      </ol>
  5.1425 +            </li>
  5.1426 +            <li>
  5.1427 +	      <p>If the <a href="#sourcebuffer-append-state">append state</a> equals <a href="#sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</a>, then run the following steps:</p>
  5.1428 +	      <ol>
  5.1429 +	        <li>
  5.1430 +	          <p>If the <a href="#sourcebuffer-input-buffer">input buffer</a> does not contain a complete <a href="#media-segment">media segment</a> header yet, then exit the loop.</p>
  5.1431 +	          <div class="note"><div class="note-title"><span>Note</span></div><p class="">Implementations may choose to implement this state as an incremental parser so that it is not necessary to have the entire media segment before running the <a href="#sourcebuffer-coded-frame-processing">coded frame processing algorithm</a>.</p></div>
  5.1432 +	        </li>
  5.1433 +	        <li>Run the <a href="#sourcebuffer-coded-frame-processing">coded frame processing algorithm</a>.</li>
  5.1434 +	        <li>Remove the <a href="#media-segment">media segment</a> bytes from the beginning of the <a href="#sourcebuffer-input-buffer">input buffer</a>.</li>
  5.1435 +	        <li>
  5.1436 +	          <p>Set <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a>.</p>
  5.1437 +	          <div class="note"><div class="note-title"><span>Note</span></div><p class="">Incremental parsers should only do this transition after the entire media segment has been received.</p></div>
  5.1438 +	        </li>
  5.1439 +	        <li>Return  to the top of the loop.</li>
  5.1440 +	      </ol>
  5.1441 +            </li>
  5.1442 +          </ol>
  5.1443 +        </section>
  5.1444 +
  5.1445 +        <section id="sourcebuffer-init-segment-received">
  5.1446 +          <h4><span class="secno">4.3.2 </span>Initialization Segment Received</h4>
  5.1447 +          <p>The following steps are run when the <a href="#sourcebuffer-segment-parser-loop">segment parser loop</a> successfully parses a complete <a href="#init-segment">initialization segment</a>:</p>
  5.1448 +          <ol>
  5.1449 +            <li>Update the <code><a href="#widl-MediaSource-duration">duration</a></code> attribute if it currently equals NaN:</li>
  5.1450 +            <dl class="switch">
  5.1451 +	      <dt>If the initialization segment contains a duration:</dt>
  5.1452 +	      <dd>Run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var>new duration</var> set to the duration in the initialization segment.</dd>
  5.1453 +	      <dt>Otherwise:</dt>
  5.1454 +	      <dd>Run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var>new duration</var> set to positive Infinity.</dd>
  5.1455 +            </dl>
  5.1456 +            <li>Handle state transitions:</li>
  5.1457 +            <dl class="switch">
  5.1458 +	      <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>:</dt>
  5.1459 +	      <dd>
  5.1460 +	        <ol>
  5.1461 +	          <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>.</li>
  5.1462 +	          <li>
  5.1463 +                    <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named  <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-loadedmetadata">loadedmetadata</a></code> at the media element.</li>
  5.1464 +	        </ol>
  5.1465 +	      </dd>
  5.1466 +	      <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is greater than <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code> and the <a href="#init-segment">initialization segment</a> contains the first video or first audio track in the presentation:</dt>
  5.1467 +	      <dd>
  5.1468 +	        Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>.
  5.1469 +	      </dd>
  5.1470 +	      <dt>Otherwise:</dt>
  5.1471 +	      <dd>Continue</dd>
  5.1472 +            </dl>
  5.1473 +            <li>Update <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-audiotracks">audioTracks</a></code>
  5.1474 +            </li>
  5.1475 +            <dl class="switch">
  5.1476 +	      <dt>If <a href="#init-segment">initialization segment</a> contains the first audio track:</dt>
  5.1477 +	      <dd>
  5.1478 +	        <ol>
  5.1479 +	          <li>Add an <code><a href="http://dev.w3.org/html5/spec/media-elements.html#audiotrack">AudioTrack</a></code> and mark it as enabled.</li>
  5.1480 +	          <li>Add this <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> to <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1481 +	        </ol>
  5.1482 +	      </dd>
  5.1483 +	      <dt>If <a href="#init-segment">initialization segment</a> contains audio tracks beyond those already in the presentation:</dt>
  5.1484 +	      <dd>Add a disabled <code><a href="http://dev.w3.org/html5/spec/media-elements.html#audiotrack">AudioTrack</a></code> for each audio track in the <a href="#init-segment">initialization segment</a>.</dd>
  5.1485 +            </dl>
  5.1486 +            <li>Update <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-videotracks">videoTracks</a></code>:</li>
  5.1487 +            <dl class="switch">
  5.1488 +	      <dt>If <a href="#init-segment">initialization segment</a> contains the first video track:</dt>
  5.1489 +	      <dd>
  5.1490 +	        <ol>
  5.1491 +	          <li>Add a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#videotrack">VideoTrack</a></code> and mark it as selected.</li>
  5.1492 +	          <li>Add this <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> to <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1493 +	        </ol>
  5.1494 +	      </dd>
  5.1495 +	      <dt>If <a href="#init-segment">initialization segment</a> contains the video tracks beyond those already in the presentation:</dt>
  5.1496 +	      <dd>Add a disabled <code><a href="http://dev.w3.org/html5/spec/media-elements.html#videotrack">VideoTrack</a></code> for each video track in the <a href="#init-segment">initialization segment</a>.</dd>
  5.1497 +            </dl>
  5.1498 +            <li>Update <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-texttracks">textTracks</a></code>
  5.1499 +            </li>
  5.1500 +            <dl class="switch">
  5.1501 +	      <dd>
  5.1502 +	        <ol>
  5.1503 +	          <li>Add a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#texttrack">TextTrack</a></code> for each text track in the <a href="#init-segment">initialization segment</a>.</li>
  5.1504 +	          <li>If the text track <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-mode">mode</a> is <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-showing">"showing"</a> or <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-hidden">"hidden"</a> then add this <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> to <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1505 +	        </ol>
  5.1506 +	      </dd>
  5.1507 +            </dl>
  5.1508 +          </ol>
  5.1509 +        </section>
  5.1510 +
  5.1511 +        <section id="sourcebuffer-coded-frame-processing">
  5.1512 +          <h4><span class="secno">4.3.3 </span>Coded Frame Processing</h4>
  5.1513 +          <p>When a complete <a href="#coded-frame">coded frame</a> has been parsed by the <a href="#sourcebuffer-segment-parser-loop">segment parser loop</a> then the following steps are run:</p>
  5.1514 +          <ol>
  5.1515 +            <li>
  5.1516 +	      <p>For each <a href="#coded-frame">coded frame</a> in the <a href="#media-segment">media segment</a> run the following steps:</p>
  5.1517 +	      <ol>
  5.1518 +	        <li>Let <var>presentation timestamp</var> be a double precision floating point representation of the coded frame's presentation timestamp.</li>
  5.1519 +	        <li>Let <var>decode timestamp</var> be a double precision floating point representation of the coded frame's decode timestamp.</li>
  5.1520 +	        <li>
  5.1521 +	          <p>If <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> is not 0, then run the following steps:</p>
  5.1522 +	          <ol>
  5.1523 +	            <li>Add <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> to the <var>presentation timestamp</var>.</li>
  5.1524 +	            <li>Add <code><a href="#widl-SourceBuffer-timestampOffset">timestampOffset</a></code> to the <var>decode timestamp</var>.</li>
  5.1525 +	            <li>If the <var>presentation timestamp</var> or <var>decode timestamp</var> is less than the <a href="#presentation-start-time">presentation start time</a>, then call <code><a href="#widl-MediaSource-endOfStream-void-EndOfStreamError-error">endOfStream("decode")</a></code>, and abort these steps.</li>
  5.1526 +	          </ol>
  5.1527 +	        </li>
  5.1528 +	        <li>Add the <a href="#coded-frame">coded frame</a> with the <var>presentation timestamp</var> and <var title="true">decode timestamp</var>, to the source buffer.</li>
  5.1529 +	      </ol>
  5.1530 +            </li>
  5.1531 +            <li>
  5.1532 +              <p>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code> and the new <a href="#coded-frame">coded frames</a> cause all objects in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> to have media data for the current playback position, then run the following steps:</p>
  5.1533 +	      <ol>
  5.1534 +	        <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>.</li>
  5.1535 +	        <li>If this is the first transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>, then <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-loadeddata">loadeddata</a></code> at the media element.</li>
  5.1536 +	      </ol>
  5.1537 +            </li>
  5.1538 +            <li>
  5.1539 +	      <p>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code> and the new <a href="#coded-frame">coded frames</a> cause all objects in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> to have media data beyond the current playback position, then run the following steps:</p>
  5.1540 +	      <ol>
  5.1541 +	        <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_future_data">HAVE_FUTURE_DATA</a></code>.</li>
  5.1542 +	        <li>
  5.1543 +                  <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-canplay">canplay</a></code> at the media element.</li>
  5.1544 +	      </ol>
  5.1545 +            </li>
  5.1546 +            <li>
  5.1547 +	      <p>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_future_data">HAVE_FUTURE_DATA</a></code> and the new <a href="#coded-frame">coded frames</a> cause all objects in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code> to have enough data to start playback, then run the following steps:</p>
  5.1548 +	      <ol>
  5.1549 +	        <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_enough_data">HAVE_ENOUGH_DATA</a></code>.</li>
  5.1550 +	        <li>
  5.1551 +                  <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-canplaythrough">canplaythrough</a></code> at the media element.</li>
  5.1552 +	      </ol>
  5.1553 +            </li>
  5.1554 +            <li>If the <a href="#media-segment">media segment</a> contains data beyond the current <code><a href="#widl-MediaSource-duration">duration</a></code>, then run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var>new duration</var> set to the maximum of the current duration and the highest end timestamp reported by <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-buffered">HTMLMediaElement.buffered</a></code>.</li>
  5.1555 +          </ol>
  5.1556 +        </section>
  5.1557 +      </section>
  5.1558 +    </section>
  5.1559 +
  5.1560 +    <section id="sourcebufferlist">
  5.1561 +      <!--OddPage--><h2><span class="secno">5. </span>SourceBufferList Object</h2>
  5.1562 +      <p>SourceBufferList is a simple container object for <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects. It provides read-only array access and fires events when the list is modified.</p>
  5.1563 +
  5.1564 +      <pre class="idl"><span class="idlInterface" id="idl-def-SourceBufferList">interface <span class="idlInterfaceID">SourceBufferList</span> : <span class="idlSuperclass"><a>EventTarget</a></span> {
  5.1565 +<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a>unsigned long</a></span> <span class="idlAttrName"><a href="#widl-SourceBufferList-length">length</a></span>;</span>
  5.1566 +<span class="idlMethod">    <span class="idlMethType"><a>getter</a></span> <span class="idlMethName"><a href="#widl-SourceBufferList-SourceBuffer-getter-unsigned-long-index">SourceBuffer</a></span> (<span class="idlParam"><span class="idlParamType"><a>unsigned long</a></span> <span class="idlParamName">index</span></span>);</span>
  5.1567 +};</span></pre><section id="attributes-2"><h3><span class="secno">5.1 </span>Attributes</h3><dl class="attributes"><dt id="widl-SourceBufferList-length"><code>length</code> of type <span class="idlAttrType"><a>unsigned long</a></span>, readonly</dt><dd>
  5.1568 +          <p>Indicates the number of <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> objects in the list.</p>
  5.1569 +        </dd></dl></section><section id="methods-2"><h3><span class="secno">5.2 </span>Methods</h3><dl class="methods"><dt id="widl-SourceBufferList-SourceBuffer-getter-unsigned-long-index"><code>SourceBuffer</code></dt><dd>
  5.1570 +          <p>Allows the SourceBuffer objects in the list to be accessed with an array operator (i.e. []).</p>
  5.1571 +          <p>When this method is invoked, the user agent must run the following steps:</p>
  5.1572 +          <ol>
  5.1573 +            <li>If <var>index</var> is greater than or equal to the <code><a href="#widl-SourceBufferList-length">length</a></code> attribute then return undefined and abort these steps.</li>
  5.1574 +            <li>Return the <var>index</var>'th <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> object in the list.</li>
  5.1575 +          </ol>
  5.1576 +        <table class="parameters"><tr><th>Parameter</th><th>Type</th><th>Nullable</th><th>Optional</th><th>Description</th></tr><tr><td class="prmName">index</td><td class="prmType"><code><a>unsigned long</a></code></td><td class="prmNullFalse">✘</td><td class="prmOptFalse">✘</td><td class="prmDesc"></td></tr></table><div><em>Return type: </em><code><a>getter</a></code></div></dd></dl></section>
  5.1577 +
  5.1578 +      <section id="sourcebufferlist-events">
  5.1579 +        <h3><span class="secno">5.3 </span>Event Summary</h3>
  5.1580 +        <table class="old-table">
  5.1581 +          <thead>
  5.1582 +            <tr>
  5.1583 +              <th>Event name</th>
  5.1584 +              <th>Interface</th>
  5.1585 +              <th>Dispatched when...</th>
  5.1586 +            </tr>
  5.1587 +          </thead>
  5.1588 +          <tbody>
  5.1589 +            <tr>
  5.1590 +              <td><dfn id="dom-evt-addsourcebuffer"><code>addsourcebuffer</code></dfn></td>
  5.1591 +              <td><code>Event</code></td>
  5.1592 +              <td>When a <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> is added to the list.</td>
  5.1593 +            </tr>
  5.1594 +            <tr>
  5.1595 +              <td><dfn id="dom-evt-removesourcebuffer"><code>removesourcebuffer</code></dfn></td>
  5.1596 +              <td><code>Event</code></td>
  5.1597 +              <td>When a <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> is removed from the list.</td>
  5.1598 +            </tr>
  5.1599 +          </tbody>
  5.1600 +        </table>
  5.1601 +      </section>
  5.1602 +    </section>
  5.1603 +
  5.1604 +    <section id="url">
  5.1605 +      <!--OddPage--><h2><span class="secno">6. </span>URL Object</h2>
  5.1606 +      <p></p>
  5.1607 +
  5.1608 +      <pre class="idl"><span class="idlInterface" id="idl-def-URL">partial interface <span class="idlInterfaceID">URL</span> {
  5.1609 +<span class="idlMethod">    static <span class="idlMethType"><a>DOMString</a></span> <span class="idlMethName"><a href="#widl-URL-createObjectURL-DOMString-MediaSource-mediaSource">createObjectURL</a></span> (<span class="idlParam"><span class="idlParamType"><a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a></span> <span class="idlParamName">mediaSource</span></span>);</span>
  5.1610 +};</span></pre><section id="methods-3"><h3><span class="secno">6.1 </span>Methods</h3><dl class="methods"><dt id="widl-URL-createObjectURL-DOMString-MediaSource-mediaSource"><code>createObjectURL</code>, static</dt><dd>
  5.1611 +          <p>Creates URLs for <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> objects.</p>
  5.1612 +          <p>When this method is invoked, the user agent must run the following steps:</p>
  5.1613 +          <ol>
  5.1614 +            <li>If <var>mediaSource</var> is NULL the return null.</li>
  5.1615 +            <li>Return a unique <a href="#mediasource-object-url">MediaSource object URL</a> that can be used to dereference the <var>mediaSource</var> argument, and run the rest of the algorithm asynchronously.</li>
  5.1616 +            <li><a href="http://dev.w3.org/html5/spec/webappapis.html#provide-a-stable-state">provide a stable state</a></li>
  5.1617 +            <li>Revoke the <a href="#mediasource-object-url">MediaSource object URL</a> by calling <a href="http://www.w3.org/TR/FileAPI/#dfn-revokeObjectURL">revokeObjectURL()</a> on it.</li>
  5.1618 +          </ol>
  5.1619 +          <div class="note"><div class="note-title"><span>Note</span></div><p class="">This algorithm is intended to mirror the behavior of the <a href="http://www.w3.org/TR/FileAPI/#">File API</a> <a href="http://www.w3.org/TR/FileAPI/#dfn-createObjectURL">createObjectURL()</a> method with autoRevoke set to true.</p></div>
  5.1620 +        <table class="parameters"><tr><th>Parameter</th><th>Type</th><th>Nullable</th><th>Optional</th><th>Description</th></tr><tr><td class="prmName">mediaSource</td><td class="prmType"><code><a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a></code></td><td class="prmNullFalse">✘</td><td class="prmOptFalse">✘</td><td class="prmDesc"></td></tr></table><div><em>Return type: </em><code><a>DOMString</a></code></div></dd></dl></section>
  5.1621 +    </section>
  5.1622 +
  5.1623 +    <section id="htmlmediaelement-attributes">
  5.1624 +      <!--OddPage--><h2><span class="secno">7. </span>HTMLMediaElement attributes</h2>
  5.1625 +      <p>This section specifies what existing attributes on the <a href="http://dev.w3.org/html5/spec/media-elements.html#htmlmediaelement">HTMLMediaElement</a> should return when a <a href="#idl-def-MediaSource" class="idlType"><code>MediaSource</code></a> is attached to the element.</p>
  5.1626 +
  5.1627 +      <p>The <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-seekable">HTMLMediaElement.seekable</a> attribute returns a new static <a href="http://dev.w3.org/html5/spec/media-elements.html#normalized-timeranges-object">normalized TimeRanges object</a> created based on the following steps:</p>
  5.1628 +      <dl class="switch">
  5.1629 +        <dt>If <code><a href="#widl-MediaSource-duration">duration</a></code> equals NaN</dt>
  5.1630 +        <dd>Return an empty <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> object.</dd>
  5.1631 +        <dt>If <code><a href="#widl-MediaSource-duration">duration</a></code> equals positive Infinity</dt>
  5.1632 +        <dd>Return a single range with a start time of 0 and an end time equal to the highest end time reported by the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-buffered">HTMLMediaElement.buffered</a></code> attribute.</dd>
  5.1633 +        <dt>Otherwise</dt>
  5.1634 +        <dd>Return a single range with a start time of 0 and an end time equal to <code><a href="#widl-MediaSource-duration">duration</a></code>.</dd>
  5.1635 +      </dl>
  5.1636 +
  5.1637 +      <p id="dom-htmlmediaelement.buffered">The <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-buffered">HTMLMediaElement.buffered</a></code> attribute returns a new static <a href="http://dev.w3.org/html5/spec/media-elements.html#normalized-timeranges-object">normalized TimeRanges object</a> created based on the following steps:</p>
  5.1638 +      <ol>
  5.1639 +        <li>Let <var>active ranges</var> be the ranges returned by <code><a href="#widl-SourceBuffer-buffered">buffered</a></code> for each <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> object in <code><a href="#widl-MediaSource-activeSourceBuffers">activeSourceBuffers</a></code>.</li>
  5.1640 +        <li>Let <var>intersection range</var> be the intersection of the <var>active ranges</var>.</li>
  5.1641 +        <li>
  5.1642 +          <p>If <code><a href="#widl-MediaSource-readyState">readyState</a></code> is <code><a href="#idl-def-ReadyState">"ended"</a></code>, then run the following steps:</p>
  5.1643 +          <ol>
  5.1644 +	    <li>Let <var>highest end time</var> be the largest end time in the <var>active ranges</var>.</li>
  5.1645 +	    <li>Let <var>highest intersection end time</var> be the highest end time in the <var>intersection range</var>.</li>
  5.1646 +	    <li>If the <var>highest intersection end time</var> is less than the <var>highest end time</var>, then update the <var>intersection range</var> so that the <var>highest intersection end time</var> equals the <var>highest end time</var>.</li>
  5.1647 +	  </ol>
  5.1648 +        </li>
  5.1649 +        <li>Return the <var>intersection range</var>.</li>
  5.1650 +      </ol>
  5.1651 +    </section>
  5.1652      
  5.1653 -   <h4 id="track-description">1.2.10. Track Description</h4>
  5.1654 -   <p>A byte stream format specific structure that provides the <a href="#track-id">Track ID</a>, codec configuration, and other metadata for a single track. Each track description inside a single <a href="#init-segment">initialization segment</a> must have a unique <a href="#track-id">Track ID</a>.</p>
  5.1655 +    <section id="byte-stream-formats">
  5.1656 +      <!--OddPage--><h2><span class="secno">8. </span>Byte Stream Formats</h2>
  5.1657 +      <p>The bytes provided through <code><a href="#widl-SourceBuffer-append-void-Uint8Array-data">append()</a></code> for a <a href="#idl-def-SourceBuffer" class="idlType"><code>SourceBuffer</code></a> form a logical byte stream. The format of this byte stream depends on the media container format in use and is defined in a byte stream format specification. Byte stream format specifications based on WebM and the ISO Base Media File Format are provided below. If these formats are supported then the byte stream formats described below must be supported.</p>
  5.1658 +      <p>This section provides general requirements for all byte stream formats:</p>
  5.1659 +      <ul>
  5.1660 +        <li>A byte stream format specification may define <a href="#init-segment">initialization segments</a> and must define <a href="#media-segment">media segments</a>.</li>
  5.1661 +        <li>It must be possible to identify segment boundaries and segment type (initialization or media) by examining the byte stream alone.</li>
  5.1662 +        <li>The combination of an Initialization Segment and any contiguous sequence of Media Segments associated with it must:
  5.1663 +	  <ol>
  5.1664 +	    <li>Identify the number and type (audio, video, text, etc.) of tracks in the Segments</li>
  5.1665 +	    <li>Identify the decoding capabilities needed to decode each track (i.e. codec and codec parameters)</li>
  5.1666 +	    <li>If a track is encrypted, provide any encryption parameters necessary to decrypt the content (except the encryption key itself)</li>
  5.1667 +	    <li>For each track, provide all information necessary to decode and render the earliest <a href="#random-access-point">random access point</a> in the sequence of Media Segments and all subsequent samples in the sequence (in presentation time). This includes, in particular,
  5.1668 +	      <ul>
  5.1669 +	        <li>Information that determines the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-video-intrinsic-width">intrinsic width and height</a> of the video (specifically, this requires either the picture or pixel aspect ratio, together with the encoded resolution).</li>
  5.1670 +	        <li>Information necessary to convert the video decoder output to a format suitable for display</li>
  5.1671 +	      </ul>
  5.1672 +	    </li>
  5.1673 +	    <li>Identify the global presentation timestamp of every sample in the sequence of Media Segments</li>
  5.1674 +	    <p>For example, if I1 is associated with M1, M2, M3 then the above must hold for all the combinations I1+M1, I1+M2, I1+M1+M2, I1+M2+M3, etc.</p>
  5.1675 +	  </ol>
  5.1676 +        </li>
  5.1677 +      </ul>
  5.1678 +      <p>Byte stream specifications must at a minimum define constraints which ensure that the above requirements hold. Additional constraints may be defined, for example to simplify implementation.</p>
  5.1679  
  5.1680 -   <h4 id="coded-frame">1.2.11. Coded Frame</h4>
  5.1681 -   <p>A unit of compressed media data that has a presentation timestamp and  decode timestamp. The presentation timestamp indicates when the frame should be rendered. The decode timestamp indicates when the frame needs to be decoded. If frames can be decoded out of order, then the decode timestamp must be present in the bytestream. If frames cannot be decoded out of order and a decode timestamp is not present in the bytestream, then the decode timestamp is equal to the presentation timestamp.</p>
  5.1682 +      <p>Initialization segments are an optimization. They allow a byte stream format to avoid duplication of information in Media Segments that is the same for many Media Segments. Byte stream format specifications need not specify Initialization Segment formats, however. They may instead require that such information is duplicated in every Media Segment.</p>
  5.1683  
  5.1684 +      <section id="webm" class="nonnormative">
  5.1685 +        <h3><span class="secno">8.1 </span>WebM Byte Streams</h3>
  5.1686 +        <p>This section defines segment formats for implementations that choose to support WebM.</p>
  5.1687  
  5.1688 -    <h2 id="source-buffer-model">2. Source Buffer Model</h2>
  5.1689 -    <p>The subsections below outline the buffering model for this proposal. It describes how to add and remove <a href="#source-buffer">source buffers</a> from the presentation and describes the various rules and behaviors associated with appending data to an individual <a href="#source-buffer">source buffer</a>. At the highest level, the web application simply creates <a href="#source-buffer">source buffers</a> and appends a sequence of <a href="#init-segment">initialization segments</a> and <a href="#media-segment">media segments</a> to update the buffer's state. The media element pulls media data out of the <a href="#source-buffer">source buffers</a>, plays it, and fires events just like it would if a normal URL was passed to the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#attr-media-src">src</a></code> attribute. The web application is expected to monitor media element events to determine when it needs to append more <a href="#media-segment">media segments</a>.</p>
  5.1690 +        <section id="webm-init-segments">
  5.1691 +          <h4><span class="secno">8.1.1 </span>Initialization Segments</h4>
  5.1692 +          <p>A WebM <a href="#init-segment">initialization segment</a> must contain a subset of the elements at the start of a typical WebM file.</p>
  5.1693 +          <p>The following rules apply to WebM initialization segments:</p>
  5.1694 +          <ol>
  5.1695 +	    <li>The <a href="#init-segment">initialization segment</a> must start with an <a href="http://www.webmproject.org/code/specs/container/#ebml-basics">EBML Header</a> element, followed by a <a href="http://www.webmproject.org/code/specs/container/#segment">Segment</a> header.</li>
  5.1696 +	    <li>The size value in the <a href="http://www.webmproject.org/code/specs/container/#segment">Segment</a> header must signal an "unknown size" or contain a value large enough to include the <a href="http://www.webmproject.org/code/specs/container/#segment-information">Segment Information</a> and <a href="http://www.webmproject.org/code/specs/container/#track">Tracks</a> elements that follow.</li>
  5.1697 +	    <li>A <a href="http://www.webmproject.org/code/specs/container/#segment-information">Segment Information</a> element and a <a href="http://www.webmproject.org/code/specs/container/#track">Tracks</a> element must appear, in that order, after the <a href="http://www.webmproject.org/code/specs/container/#segment">Segment</a> header and before any further <a href="http://www.webmproject.org/code/specs/container/#ebml-basics">EBML Header</a> or <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> elements.</li>
  5.1698 +	    <li>Any elements other than an <a href="http://www.webmproject.org/code/specs/container/#ebml-basics">EBML Header</a> or a <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> that occur before, in between, or after the <a href="http://www.webmproject.org/code/specs/container/#segment-information">Segment Information</a> and <a href="http://www.webmproject.org/code/specs/container/#track">Tracks</a> elements are ignored.</li>
  5.1699 +          </ol>
  5.1700 +        </section>
  5.1701  
  5.1702 -    <h3 id="source-buffer-create">2.1. Creating Source Buffers</h3>
  5.1703 -    <p><code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects can be created once a <code><a href="#dom-mediasource">MediaSource</a></code> object enters the <code><a href="#dom-%22open%22">"open"</a></code> state. The application calls <code><a href="#dom-addsourcebuffer">addSourceBuffer()</a></code> with a type string that indicates the format of the data it intends to append to the new SourceBuffer. If the user agent supports the format and has sufficient resources, a new <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> object is created, added to <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>, and returned by the method. If the user agent doesn't support the specified format or can't support another <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> then it will throw an appropriate exception to signal why the request couldn't be satisfied.</p>
  5.1704 +        <section id="webm-media-segments">
  5.1705 +          <h4><span class="secno">8.1.2 </span>Media Segments</h4>
  5.1706 +          <p>A WebM <a href="#media-segment">media segment</a> is a single <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> element.</p>
  5.1707 +          <p>The following rules apply to WebM media segments:</p>
  5.1708 +          <ol>
  5.1709 +	    <li>The Timecode element in the <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> contains a presentation timestamp in TimecodeScale units.</li>
  5.1710 +	    <li>The TimecodeScale in the <a href="#webm-init-segments">WebM initialization segment</a> most recently appended applies to all timestamps in the <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a>
  5.1711 +            </li>
  5.1712 +	    <li>The Cluster header may contain an "unknown" size value. If it does then the end of the cluster is reached when another <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> header or an element header that indicates the start of an <a href="#webm-init-segments">WebM initialization segment</a> is encountered.</li>
  5.1713 +	    <li>Block &amp; SimpleBlock elements must be in time increasing order consistent with the <a href="http://www.webmproject.org/code/specs/container/#webm-guidelines">WebM spec</a>.</li>
  5.1714 +	    <li>If the most recent <a href="#webm-init-segments">WebM initialization segment</a> describes multiple tracks, then blocks from all the tracks must be interleaved in time increasing order. At least one block from all audio and video tracks must be present.</li>
  5.1715 +	    <li>
  5.1716 +              <a href="http://www.webmproject.org/code/specs/container/#cueing-data">Cues</a> or <a href="http://www.webmproject.org/code/specs/container/#chapters">Chapters</a> elements may follow a <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> element. These elements must be accepted and ignored by the user agent.</li>
  5.1717 +          </ol>
  5.1718 +        </section>
  5.1719  
  5.1720 -    <h3 id="source-buffer-remove">2.2. Removing Source Buffers</h3>
  5.1721 -    <p>Removing a <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> with <code><a href="#dom-removesourcebuffer">removeSourceBuffer()</a></code> releases all resources associated with the object. This includes destroying the all the segment data, <a href="#track-buffer">track buffers</a>, and decoders. The media element will also remove the appropriate tracks from <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-audiotracks">audioTracks</a></code>, <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-videotracks">videoTracks</a></code>,  &amp; <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-texttracks">textTracks</a></code> and fire the necessary <code><a href="http://dev.w3.org/html5/spec/media-elements.html#handler-tracklist-onchange">change</a></code> events. Playback may become degraded or stop if the currently selected <code><a href="http://dev.w3.org/html5/spec/media-elements.html#videotrack">VideoTrack</a></code> or the only enabled <code><a href="http://dev.w3.org/html5/spec/media-elements.html#audiotrack">AudioTracks</a></code> are removed.</p>
  5.1722 +        <section id="webm-random-access-points">
  5.1723 +          <h4><span class="secno">8.1.3 </span>Random Access Points</h4>
  5.1724 +          <p>A SimpleBlock element with its Keyframe flag set signals the location of a <a href="#random-access-point">random access point</a> for that track. Media segments containing multiple tracks are only considered a random access point if the first SimpleBlock for each track has its Keyframe flag set. The order of the multiplexed blocks must conform to the <a href="http://www.webmproject.org/code/specs/container/#muxer-guidelines">WebM Muxer Guidelines</a>.</p>
  5.1725 +        </section>
  5.1726 +      </section>
  5.1727 +      
  5.1728 +      <section id="iso" class="nonnormative">
  5.1729 +        <h3><span class="secno">8.2 </span>ISO Base Media File Format Byte Streams</h3>
  5.1730 +        <p>This section defines segment formats for implementations that choose to support the ISO Base Media File Format
  5.1731 +	  <a href="http://standards.iso.org/ittf/PubliclyAvailableStandards/c061988_ISO_IEC_14496-12_2012.zip">ISO/IEC 14496-12</a> (ISO BMFF).</p> 
  5.1732  
  5.1733 -    <h3 id="source-buffer-basic-append">2.3. Basic appending model</h3>
  5.1734 -    <p>Updating the state of a <a href="#source-buffer">source buffer</a> requires appending at least one <a href="#init-segment">initialization segment</a> and one or more <a href="#media-segment">media segments</a> via <code><a href="#dom-append">append()</a></code>. The following list outlines some of the basic rules for appending segments.
  5.1735 -      <ul>
  5.1736 -	<li>The first segment appended must be an <a href="#init-segment">initialization segment</a>.</li>
  5.1737 -	<li>All <a href="#media-segment">media segments</a> are associated with the most recently appended <a href="#init-segment">initialization segment</a>.</li>
  5.1738 -	<li>A whole segment must be appended before another segment can be started unless <code><a href="#dom-abort">abort()</a></code> is called.</li>
  5.1739 -	<li>Segments can be appended in pieces. (i.e. A 4096 byte segment can be spread across four 1024 byte calls to <code><a href="#dom-append">append()</a></code>).</li>
  5.1740 -	<li>If a <a href="#media-segment">media segment</a> requires different configuration information (e.g. codec parameters, new <a href="#track-id">Track IDs</a>, metadata) from what is in the most recently appended <a href="#init-segment">initialization segment</a>, a new <a href="#init-segment">initialization segment</a> with the new configuration information must be appended before the <a href="#media-segment">media segment</a> requiring this information is appended.</li>
  5.1741 -	<li>A new <a href="#media-segment">media segment</a> can overlap, in presentation time, a segment that was previously appended. The new segment will override the previous data.</li>
  5.1742 -	<li>Media segments can be appended in any order.<br>Note: In practice finite buffer space and maintaining uninterrupted playback will bias appending towards time increasing order near the current playback position. Out of order appends facilitate adaptive streaming, ad insertion, and video editing use cases.</li>
  5.1743 -	<li>The media element may start copying data from a <a href="#media-segment">media segment</a> to the <a href="#track-buffer">track buffers</a> before the entire segment has been appended. This prevents unnecessary delays for <a href="#media-segment">media segments</a> that cover a large time range.</li>
  5.1744 -      </ul>
  5.1745 -    </p>
  5.1746 +	<section id="iso-init-segments">
  5.1747 +          <h4><span class="secno">8.2.1 </span>Initialization Segments</h4>
  5.1748 +          <p>An ISO BMFF <a href="#init-segment">initialization segment</a> must contain a single Movie Header Box (<span class="iso-box">moov</span>). The tracks in the Movie Header Box must not contain any samples (i.e. the <span class="iso-var">entry_count</span> in the <span class="iso-box">stts</span>, <span class="iso-box">stsc</span> and <span class="iso-box">stco</span> boxes must be set to zero). A Movie Extends (<span class="iso-box">mvex</span>) box must be contained in the
  5.1749 +	    Movie Header Box to indicate that Movie Fragments are to be expected.</p>
  5.1750 +          <p>The <a href="#init-segment">initialization segment</a> may contain Edit Boxes (<span class="iso-box">edts</span>) which provide a mapping of composition times for each track to the global presentation time.</p>
  5.1751 +	</section>
  5.1752 +        
  5.1753 +	<section id="iso-media-segments">
  5.1754 +          <h4><span class="secno">8.2.2 </span>Media Segments</h4>
  5.1755 +          <p>An ISO BMFF <a href="#media-segment">media segment</a> must contain a single Movie Fragment Box (<span class="iso-box">moof</span>) followed by one or more Media Data Boxes (<span class="iso-box">mdat</span>).</p>
  5.1756 +          <p>The following rules apply to ISO BMFF media segments:</p>
  5.1757 +          <ol>
  5.1758 +	    <li>The Movie Fragment Box must contain at least one Track Fragment Box (<span class="iso-box">traf</span>).</li>
  5.1759 +	    <li>The Movie Fragment Box must use movie-fragment relative addressing and the flag <span class="iso-var">default-base-is-moof</span> must be set; absolute byte-offsets must not be used.</li>
  5.1760 +	    <li>External data references must not be used.</li>
  5.1761 +	    <li>If the Movie Fragment contains multiple tracks, the duration by which each track extends should be as close to equal as practical.</li>
  5.1762 +	    <li>Each Track Fragment Box must contain a Track Fragment Decode Time Box (<span class="iso-box">tfdt</span>)</li>
  5.1763 +	    <li>The first sample in each Track Fragment Run Box (<span class="iso-box">trun</span>) must indicate that the sample is a <a href="#random-access-point">random access point</a>.</li>
  5.1764 +	    <li>The Media Data Boxes must contain all the samples referenced by the Track Fragment Run Boxes (<span class="iso-box">trun</span>) of the Movie Fragment Box.</li>
  5.1765 +          </ol>
  5.1766 +	</section>
  5.1767  
  5.1768 -    <h3 id="source-buffer-init-segment-constraints">2.4. Initialization Segment constraints</h3>
  5.1769 -    <p>To simplify the implementation and facilitate interoperability, a few constraints are placed on the <a href="#init-segment">initialization segments</a> that are appended to a specific <code><a href="#dom-sourcebuffer">SourceBuffer</a></code>:
  5.1770 -      <ul>
  5.1771 -	<li>The number and type of tracks must be consistent across all <a href="#init-segment">initialization segments</a>. <br>For example, if the first <a href="#init-segment">initialization segment</a> has 2 audio tracks and 1 video track, then all <a href="#init-segment">initialization segments</a> that follow, for this <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> must describe 2 audio tracks and 1 video track.</li>
  5.1772 -	<li>
  5.1773 -<a href="#track-id">Track IDs</a> do not need to be the same across <a href="#init-segment">initialization segments</a> only if the segment describes one track of each type.<br> For example, if an <a href="#init-segment">initialization segment</a> describes a single audio track and a single video track, the internal <a href="#track-id">Track IDs</a> do not need to be the same.</li>
  5.1774 -	<li>
  5.1775 -<a href="#track-id">Track IDs</a> must be the same across <a href="#init-segment">initialization segments</a> if multiple tracks for a single type are described. (e.g. 2 audio tracks).</li>
  5.1776 -	<li>Codecs changes are not allowed. <br> For example, you can't have an <a href="#init-segment">initialization segment</a> that specifies a single AAC track and then follows it with one that contains AMR-WB. Support for multiple codecs is handled with multiple <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects.</li>
  5.1777 -	<li>Video frame size changes are allowed and must be supported seamlessly.<br> Note: This will cause the &lt;video&gt; display region to change size if you don't use CSS or HTML attributes (width/height) to constrain the element size.</li>
  5.1778 -	<li>Audio channel count changes are allowed, but they may not be seamless and could trigger downmixing.<br> Note: This is a quality of implementation issue because changing the channel count may require reinitializing the audio device, resamplers, and channel mixers which tends to be audible.</li>
  5.1779 -      </ul>
  5.1780 -    </p>
  5.1781 +	<section id="iso-random-access-points">
  5.1782 +          <h4><span class="secno">8.2.3 </span>Random Access Points</h4>
  5.1783 +          <p>A <a href="#random-access-point">random access point</a> as defined in this specification corresponds to a Stream Access Point of type 1 or 2 as defined in Annex I of <a href="http://standards.iso.org/ittf/PubliclyAvailableStandards/c061988_ISO_IEC_14496-12_2012.zip">ISO/IEC 14496-12</a>.</p>
  5.1784 +	</section>
  5.1785 +      </section>
  5.1786 +    </section>
  5.1787  
  5.1788 -    <h3 id="source-buffer-media-segment-constraints">2.5. Media Segment constraints</h3>
  5.1789 -    <p>To simplify the implementation and facilitate interoperability, a few constraints are placed on the <a href="#media-segment">media segments</a> that are appended to a specific <code><a href="#dom-sourcebuffer">SourceBuffer</a></code>:
  5.1790 -      <ul>
  5.1791 -	<li>All timestamps must be mapped to the same presentation timeline.</li>
  5.1792 -	<li>Segments must start with a <a href="#random-access-point">random access point</a> to facilitate seamless splicing at the segment boundary.</li>
  5.1793 -	<li>Gaps between <a href="#media-segment">media segments</a> that are smaller than the audio frame size are allowed and must not cause playback to stall. Such gaps must not be reflected by <code><a href="#dom-buffered">buffered</a></code>.
  5.1794 -	  <p class="note">Note: This is intended to simplify switching between audio streams where the frame boundaries don't always line up across encodings (e.g. Vorbis).</p>
  5.1795 -</li>
  5.1796 -      </ul>
  5.1797 -    </p>
  5.1798 -
  5.1799 -    <h3 id="source-buffer-first-init-segment">2.6. Appending the first Initialization Segment</h3>
  5.1800 -    <p>Once a new <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> has been created, it expects an <a href="#init-segment">initialization segment</a> to be appended first. This first segment indicates the number and type of streams contained in the <a href="#media-segment">media segments</a> that follow. This allows the media element to configure the necessary decoders and output devices. This first segment can also cause a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code> if this is the first <code><a href="#dom-sourcebuffer">SourceBuffer</a></code>, or if it is the first track of a specific type (i.e. first audio, first video track, or first text track). If neither of the conditions hold then the tracks for this new <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> will just appear as disabled tracks and won't affect the current <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> until they are selected. The media element will also add the appropriate tracks to the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-audiotracks">audioTracks</a></code>, <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-videotracks">videoTracks</a></code>, &amp; <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-texttracks">textTracks</a></code> collections and fire the necessary <code><a href="http://dev.w3.org/html5/spec/media-elements.html#handler-tracklist-onchange">change</a></code> events. The description for <code><a href="#dom-append">append()</a></code> contains all the details.</p>
  5.1801 -    
  5.1802 -    <h3 id="source-buffer-media-segment-unbuffered">2.7. Appending a Media Segment to an unbuffered region</h3>
  5.1803 -    <p>If a <a href="#media-segment">media segment</a> is appended to a time range that is not covered by existing segments in the <a href="#source-buffer">source buffer</a>, then its data is copied directly into the <a href="#source-buffer">source buffer</a>. Addition of this data may trigger <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> transitions depending on what other data is buffered and whether the media element has determined if it can start playback. Calls to <code><a href="#dom-buffered">buffered</a></code> will always reflect the current <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> buffered in the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code>.</p>
  5.1804 -
  5.1805 -    <h3 id="source-buffer-overlapping-segments">2.8. Appending a Media Segment over a buffered region</h3>
  5.1806 -    <p>There are several ways that <a href="#media-segment">media segments</a> can overlap segments in the <a href="#source-buffer">source buffer</a>. Behavior for the different overlap situations are described below. If more than one overlap applies, then the <a href="#source-buffer-overlap-start">start overlap</a> gets resolved first, followed by any <a href="#source-buffer-overlap-complete">complete overlaps</a>, and finally the <a href="#source-buffer-overlap-end">end overlap</a>. If a segment contains multiple tracks then the overlap is resolved independently for each track.</p>
  5.1807 -
  5.1808 -    <h4 id="source-buffer-overlap-complete">2.8.1 Complete Overlap</h4>
  5.1809 -    <img src="complete_overlap.png">
  5.1810 -    <p>The figure above shows how the <a href="#source-buffer">source buffer</a> gets updated when a new <a href="#media-segment">media segment</a> completely overlaps a segment in the buffer. In this case, the new segment completely replaces the old segment.</p>
  5.1811 -
  5.1812 -    <h4 id="source-buffer-overlap-start">2.8.2 Start Overlap</h4>
  5.1813 -    <img src="start_overlap.png">
  5.1814 -    <p>The figure above shows how the <a href="#source-buffer">source buffer</a> gets updated when the beginning of a new <a href="#media-segment">media segment</a> overlaps a segment in the buffer. In this case the new segment replaces all the old media data in the overlapping region. Since <a href="#media-segment">media segments</a> are constrained to starting with <a href="#random-access-point">random access points</a>, this provides a seamless transition between segments.</p>
  5.1815 -    <p>When an audio frame in the <a href="#source-buffer">source buffer</a> overlaps with the start of the new <a href="#media-segment">media segment</a> special behavior is required. At a minimum implementations must support dropping the old audio frame that overlaps the start of the new segment and insert silence for the small gap that is created. Higher quality implementations may support crossfading or crosslapping between the overlapping audio frames. No matter which strategy is implemented, no gaps are created in the ranges reported by <code><a href="#dom-buffered">buffered</a></code> and playback must never stall at the overlap.</p>
  5.1816 -
  5.1817 -    <h4 id="source-buffer-overlap-end">2.8.3 End Overlap</h4>
  5.1818 -    <img src="end_overlap.png">
  5.1819 -    <p>The figure above shows how the <a href="#source-buffer">source buffer</a> gets updated when the end of a new <a href="#media-segment">media segment</a> overlaps a segment in the buffer. In this case, the media element tries to keep as much of the old segment as possible. The amount saved depends on where the closest <a href="#random-access-point">random access point</a>, in the old segment, is to the end of the new segment. In the case of audio, if the gap is smaller than the size of an audio frame, then the media element should insert silence for this gap and not reflect it in <code><a href="#dom-buffered">buffered</a></code>.</p>
  5.1820 -      <p>An implementation may keep old segment data before the end of the new segment to avoid creating a gap if it wishes. Doing this though can significantly increase implementation complexity and could cause delays at the splice point. The key property that must be preserved is the entirety of the new segment gets added to the <a href="#source-buffer">source buffer</a> and it is up to the implementation how much of the old segment data is retained. The web application can use <code><a href="#dom-buffered">buffered</a></code> to determine how much of the old segment was preserved.</p>
  5.1821 -
  5.1822 -    <h4 id="source-buffer-overlap-middle">2.8.4 Middle Overlap</h4>
  5.1823 -    <img src="middle_overlap.png">
  5.1824 -    <p>The figure above shows how the <a href="#source-buffer">source buffer</a> gets updated when the new <a href="#media-segment">media segment</a> is in the middle of the old segment. This condition is handled by first resolving the <a href="#source-buffer-overlap-start">start overlap</a> and then resolving the <a href="#source-buffer-overlap-end">end overlap</a>.</p>
  5.1825 -
  5.1826 -    <h3 id="source-buffer-to-track-buffer">2.9. Source Buffer to Track Buffer transfer</h3>
  5.1827 -    <p>The <a href="#source-buffer">source buffer</a> represents the media that the web application would like the media element to play. The <a href="#track-buffer">track buffer</a> contains the data that will actually get decoded and rendered. In most cases the <a href="#track-buffer">track buffer</a> will simply contain a subset of the <a href="#source-buffer">source buffer</a> near the current playback position. These two buffers start to diverge though when <a href="#media-segment">media segments</a> that overlap or are very close to the current playback position are appended. Depending on the contents of the new <a href="#media-segment">media segment</a> it may not be possible to switch to the new data immediately because there isn't a <a href="#random-access-point">random access point</a> close enough to the current playback position. The quality of the implementation determines how much data is considered "in the <a href="#track-buffer">track buffer</a>". It should transfer data to the <a href="#track-buffer">track buffer</a> as late as possible whilst maintaining seamless playback. Some implementations may be able to instantiate multiple decoders or decode the new data significantly faster than real-time to achieve a seamless splice immediately. Other implementations may delay until the next <a href="#random-access-point">random access point</a> before switching to the newly appended data. Notice that this difference in behavior is only observable when appending close to the current playback position. The <a href="#track-buffer">track buffer</a> represents a media subsegment, like a group of pictures or something with similar decode dependencies, that the media element commits to playing. This commitment may be influenced by a variety of things like limited decoding resources, hardware decode buffers, a jitter buffer, or the desire to limit implementation complexity.</p>
  5.1828 -    
  5.1829 -    <p>Here is an example to help clarify the role of the <a href="#track-buffer">track buffer</a>. Say the current playback position has a timestamp of 8 and the media element pulled frames with timestamp 9 &amp; 10 into the track buffer. The web application then appends a higher quality <a href="#media-segment">media segment</a> that starts with a <a href="#random-access-point">random access point</a> at timestamp 9. The <a href="#source-buffer">source buffer</a> will get updated with the higher quality data, but the media element won't be able to switch to this higher quality data until the next <a href="#random-access-point">random access point</a> at timestamp 20. This is because a frame for timestamp 9 is already in the track buffer. As you can see the track buffer represents the "point of no return." for decoding. If a seek occurs the media element may choose to use the higher quality data since a seek might imply flushing the <a href="#track-buffer">track buffer</a> and the user expects a break in playback.</p>
  5.1830 -
  5.1831 -
  5.1832 -    <h3 id="source-buffer-segment-eviction">2.10. Media Segment Eviction</h3>
  5.1833 -    <p>When a new <a href="#media-segment">media segment</a> is appended, memory constraints may cause previously appended segments to get evicted from the <a href="#source-buffer">source buffer</a>. The eviction algorithm is implementation dependent, but segments that aren't likely to be needed soon are the most likely to get evicted. The <code><a href="#dom-buffered">buffered</a></code> attribute allows the web application to monitor what time ranges are currently buffered in the <a href="#source-buffer">source buffer</a>.</p>
  5.1834 -
  5.1835 -    <h3 id="source-buffer-timestamp-offsets">2.11. Applying Timestamp Offsets</h3>
  5.1836 -    <p>For some use cases like ad-insertion or seamless playlists, the web application may want to insert a <a href="#media-segment">media segment</a> in the presentation timeline at a location that is different than what the internal timestamps indicate. This can be accomplished by using the <code><a href="#dom-timestampoffset">timestampOffset</a></code> attribute on the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> object. The value of <code><a href="#dom-timestampoffset">timestampOffset</a></code> is added to all timestamps inside a <a href="#media-segment">media segment</a> before the contents of that segment are added to the <a href="#source-buffer">source buffer</a>. The <code><a href="#dom-timestampoffset">timestampOffset</a></code> applies to an entire media segment. An exception is thrown if the application tries to update the attribute when only part of a media segment has been appended. Both positive or negative offsets can be assigned to <code><a href="#dom-timestampoffset">timestampOffset</a></code>. If an offset causes a <a href="#media-segment">media segment</a> timestamp to get converted to a time before the <a href="#presentation-start-time">presentation start time</a>, playback will terminate with a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-mediaerror-media_err_decode">MediaError.MEDIA_ERR_DECODE</a></code> error.</p>
  5.1837 -
  5.1838 -    <p>Here is a simple example to clarify how <code><a href="#dom-timestampoffset">timestampOffset</a></code> can be used. Say I have two sounds I want to play in sequence. The first sound is 5 seconds long and the second one is 10 seconds. Both sound files have timestamps that start at 0. First append the <a href="#init-segment">initialization segment</a> and all <a href="#media-segment">media segments</a> for the first sound. Now set <code><a href="#dom-timestampoffset">timestampOffset</a></code> to 5 seconds. Finally append the <a href="#init-segment">initialization segment</a> and <a href="#media-segment">media segments</a> for the second sound. This will result in a 15 second presentation that plays the two sounds in sequence.</p>
  5.1839 -
  5.1840 -    <h2 id="mediasource">3. MediaSource Object</h2>
  5.1841 -    <p>The MediaSource object represents a source of media data for an HTMLMediaElement. It keeps track of the <code><a href="#dom-readystate">readyState</a></code> for this source as well as a list of <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects that can be used to add media data to the presentation. MediaSource objects are created by the web application and then attached to an HTMLMediaElement. The application uses the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects in <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> to add media data to this source. The HTMLMediaElement fetches this media data from the <code><a href="#dom-mediasource">MediaSource</a></code> object when it is needed during playback.</p>
  5.1842 -
  5.1843 -    <pre class="idl">
  5.1844 -[Constructor]
  5.1845 -interface <dfn id="dom-mediasource">MediaSource</dfn> : EventTarget {
  5.1846 -  // All the source buffers created by this object.
  5.1847 -  readonly attribute <a href="#dom-sourcebufferlist">SourceBufferList</a> <a href="#dom-sourcebuffers">sourceBuffers</a>;
  5.1848 -
  5.1849 -  // Subset of sourceBuffers that provide data for the selected/enabled tracks.
  5.1850 -  readonly attribute <a href="#dom-sourcebufferlist">SourceBufferList</a> <a href="#dom-activesourcebuffers">activeSourceBuffers</a>;
  5.1851 -
  5.1852 -  attribute unrestricted double <a href="#dom-duration">duration</a>;
  5.1853 -
  5.1854 -  <a href="#dom-sourcebuffer">SourceBuffer</a> <a href="#dom-addsourcebuffer">addSourceBuffer</a>(DOMString type);
  5.1855 -  void <a href="#dom-removesourcebuffer">removeSourceBuffer</a>(<a href="#dom-sourcebuffer">SourceBuffer</a> sourceBuffer);
  5.1856 -
  5.1857 -  enum State { "closed", "open", "ended" };
  5.1858 -  readonly attribute State <a href="#dom-readystate">readyState</a>;
  5.1859 -
  5.1860 -  enum EndOfStreamError { "network", "decode" };
  5.1861 -  void <a href="#dom-endofstream">endOfStream</a>(optional EndOfStreamError error);
  5.1862 -};
  5.1863 -    </pre>
  5.1864 -    <h3 id="mediasource-methods">3.1. Methods and Attributes</h3>
  5.1865 -    
  5.1866 -    <p>The <dfn id="dom-sourcebuffers"><code>sourceBuffers</code></dfn> attribute contains the list of <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects associated with this <code><a href="#dom-mediasource">MediaSource</a></code>. When <code><a href="#dom-readystate">readyState</a></code> equals <code><a href="#dom-closed">"closed"</a></code> this list will be empty. Once <code><a href="#dom-readystate">readyState</a></code> transitions to <code><a href="#dom-%22open%22">"open"</a></code> SourceBuffer objects can be added to this list by using <code><a href="#dom-addsourcebuffer">addSourceBuffer()</a></code>.</p>
  5.1867 -
  5.1868 -    <p>The <dfn id="dom-activesourcebuffers"><code>activeSourceBuffers</code></dfn> attribute contains the subset of <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> that represents the <a href="#active-source-buffers">active source buffers</a>.</p>
  5.1869 -
  5.1870 -    <p>The <dfn id="dom-duration"><code>duration</code></dfn> attribute allows the web application to set the presentation duration. The duration is initially set to NaN when the <code><a href="#dom-mediasource">MediaSource</a></code> object is created.</p>
  5.1871 -    <p>On getting, run the following steps:</p>
  5.1872 -    <ol>
  5.1873 -      <li>If the <code><a href="#dom-readystate">readyState</a></code> attribute is <code><a href="#dom-closed">"closed"</a></code> then return NaN and abort these steps.</li>
  5.1874 -      <li>Return the current value of the attribute.</li>
  5.1875 -    </ol>
  5.1876 -    <p>On setting, run the following steps:</p>
  5.1877 -    <ol>
  5.1878 -      <li>If the value being set is negative or NaN then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.1879 -      <li>If the <code><a href="#dom-readystate">readyState</a></code> attribute is not <code><a href="#dom-%22open%22">"open"</a></code> then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1880 -      <li>Run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var title="true">new duration</var> set to the value being set.
  5.1881 -	<p class="note">Note: <code><a href="#dom-append">append()</a></code> and <code><a href="#dom-endofstream">endOfStream()</a></code> can update the duration under certain circumstances.</p>
  5.1882 -      </li>
  5.1883 -    </ol>
  5.1884 -
  5.1885 -    <p>The <dfn id="dom-addsourcebuffer"><code>addSourceBuffer(type)</code></dfn> method must run the following steps:</p>
  5.1886 -    <ol>
  5.1887 -      <li>If <var title="true">type</var> is null or an empty string then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.1888 -      <li>If <var title="true">type</var> contains a MIME type that is not supported or contains a MIME type that is not supported with the types specified for the other <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects in <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>, then throw a <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-not_supported_err">NOT_SUPPORTED_ERR</a></code> exception and abort these steps.</li>
  5.1889 -      <li>If the user agent can't handle any more SourceBuffer objects then throw a <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-quota_exceeded_err">QUOTA_EXCEEDED_ERR</a></code> exception and abort these steps.</li>
  5.1890 -      <li>If the <code><a href="#dom-readystate">readyState</a></code> attribute is not in the <code><a href="#dom-%22open%22">"open"</a></code> state then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1891 -      <li>Create a new <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> object and associated resources.</li>
  5.1892 -      <li>Add the new object to <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.1893 -   <code><a href="#dom-evt-addsourcebuffer">addsourcebuffer</a></code> at <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>.</li>
  5.1894 -      <li>Return the new object.</li>
  5.1895 -    </ol>
  5.1896 -    <p>The <dfn id="dom-removesourcebuffer"><code>removeSourceBuffer(sourceBuffer)</code></dfn> method must run the following steps:</p>
  5.1897 -    <ol>
  5.1898 -      <li>If <var title="true">sourceBuffer</var> is null then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.1899 -      <li>If <var title="true">sourceBuffer</var> specifies an object that is not in <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> then throw a <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-not_found_err">NOT_FOUND_ERR</a></code> exception and abort these steps.</li>
  5.1900 -      <li>Remove track information from <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-audiotracks">audioTracks</a></code>, <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-videotracks">videoTracks</a></code>, and <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-texttracks">textTracks</a></code> for all tracks associated with <var title="true">sourceBuffer</var> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.1901 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#handler-tracklist-onchange">change</a></code> at the modified lists.</li>
  5.1902 -      <li>If <var title="true">sourceBuffer</var> is in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>, then remove it from <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.1903 -   <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.1904 -      <li>Remove <var title="true">sourceBuffer</var> from <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.1905 -   <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>.</li>
  5.1906 -      <li>Destroy all resources for <var title="true">sourceBuffer</var>.</li>
  5.1907 -    </ol>
  5.1908 -
  5.1909 -
  5.1910 -    <p>The <dfn id="dom-readystate"><code>readyState</code></dfn> attribute indicates the current state of the <code><a href="#dom-mediasource">MediaSource</a></code> object. It can have the following values:</p>
  5.1911 -    <dl>
  5.1912 -      <dt><dfn id='dom-"closed"'><code>"closed"</code></dfn></dt>
  5.1913 -      <dd>Indicates the source is not currently attached to a media element.</dd>
  5.1914 -
  5.1915 -      <dt><dfn id='dom-"open"'><code>"open"</code></dfn></dt>
  5.1916 -      <dd>The source has been opened by a media element and is ready for data to be appended to the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects in <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>.</dd>
  5.1917 -
  5.1918 -      <dt><dfn id='dom-"ended"'><code>"ended"</code></dfn></dt>
  5.1919 -      <dd>The source is still attached to a media element, but <code><a href="#dom-endofstream">endOfStream()</a></code> has been called. Appending data to <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects in this state is not allowed.</dd>
  5.1920 -    </dl>
  5.1921 -    <p>When the <code><a href="#dom-mediasource">MediaSource</a></code> is created <code><a href="#dom-readystate">readyState</a></code> must be set to <code><a href="#dom-closed">"closed"</a></code>.
  5.1922 -    </p>
  5.1923 -
  5.1924 -
  5.1925 -    <h5>End of stream error values:</h5>
  5.1926 -    <dl>
  5.1927 -      <dt><dfn id='dom-"network"'><code>"network"</code></dfn></dt>
  5.1928 -      <dd>Terminates playback and signals that a network error has occured.</dd> 
  5.1929 -      <p class="note">Note: If the JavaScript fetching media data encounters a network error it should use this status code to terminate playback.</p>
  5.1930 -
  5.1931 -      <dt><dfn id='dom-"decode"'><code>"decode"</code></dfn></dt>
  5.1932 -      <dd>Terminates playback and signals that a decoding error has occured.</dd>
  5.1933 -      <p class="note">Note: If the JavaScript code fetching media data has problems parsing the data it should use this status code to terminate playback.</p>
  5.1934 -    </dl>
  5.1935 -
  5.1936 -    <p>The <dfn id="dom-endofstream"><code>endOfStream(error)</code></dfn> method must run the following steps:</p>
  5.1937 -    <ol>
  5.1938 -      <li>If the <code><a href="#dom-readystate">readyState</a></code> attribute is not in the <code><a href="#dom-%22open%22">"open"</a></code> state then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.1939 -      <li>Change the <code><a href="#dom-readystate">readyState</a></code> attribute value to <code><a href="#dom-%22ended%22">"ended"</a></code>.</li>
  5.1940 -      <li>
  5.1941 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.1942 -   <code><a href="#dom-evt-sourceended">sourceended</a></code> at the <code><a href="#dom-mediasource">MediaSource</a></code>.</li>
  5.1943 -      <dl class="switch">
  5.1944 -          <dt>If <var title="true">error</var> is not set, null, or an empty string</dt>
  5.1945 -          <dd>
  5.1946 -	    <ol>
  5.1947 -	      <li>Run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var title="true">new duration</var> set to the highest end timestamp across all <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects in <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>.<br>
  5.1948 -		<p class="note">Note: This allows the duration to properly reflect the end of the appended media segments. For example, if the duration was explicitly set to 10 seconds and only media segments for 0 to 5 seconds were appended before endOfStream() was called, then the duration will get updated to 5 seconds.</p>
  5.1949 -	      </li>
  5.1950 -	      <li>Notify the media element that it now has all of the media data. Playback should continue until all the media passed in via <code><a href="#dom-append">append()</a></code> has been played.</li>
  5.1951 -	    </ol>
  5.1952 -	  </dd>
  5.1953 -          <dt>If <var title="true">error</var> is set to <code><a href="#dom-%22network%22">"network"</a></code>
  5.1954 -</dt>
  5.1955 -          <dd>
  5.1956 -	    <dl class="switch">
  5.1957 -	      <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute equals <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>
  5.1958 -</dt>
  5.1959 -	      <dd>Run the 
  5.1960 -    "<i>If the media data cannot be fetched at all, due to network errors, causing the user agent to give up trying to fetch the resource</i>"
  5.1961 -   steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1962 -	      <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is greater than <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>
  5.1963 -</dt>
  5.1964 -	      <dd>Run the "<i>If the connection is interrupted after some media data has been received, causing the user agent to give up trying to fetch the resource</i>" steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1965 -	    </dl>
  5.1966 -	  </dd>
  5.1967 -          <dt>If <var title="true">error</var> is set to <code><a href="#dom-%22decode%22">"decode"</a></code>
  5.1968 -</dt>
  5.1969 -          <dd>
  5.1970 -	    <dl class="switch">
  5.1971 -	      <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute equals <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>
  5.1972 -</dt>
  5.1973 -	      <dd>Run the "<i>If the media data can be fetched but is found by inspection to be in an unsupported format, or can otherwise not be rendered at all</i>" steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1974 -	      <dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is greater than <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>
  5.1975 -</dt>
  5.1976 -	      <dd>Run the <a href="http://dev.w3.org/html5/spec/media-elements.html#fatal-decode-error">media data is corrupted</a> steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.1977 -	    </dl>
  5.1978 -	  </dd>
  5.1979 -          <dt>Otherwise</dt>
  5.1980 -          <dd>Throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception.</dd>
  5.1981 -        </dl>
  5.1982 -    </ol>
  5.1983 -
  5.1984 -
  5.1985 -    <h3 id="mediasource-events">3.2. Event Summary</h3>
  5.1986 -    <table>
  5.1987 -      <thead>
  5.1988 -        <tr>
  5.1989 -          <th>Event name</th>
  5.1990 -          <th>Interface</th>
  5.1991 -          <th>Dispatched when...</th>
  5.1992 -        </tr>
  5.1993 -      </thead>
  5.1994 -      <tbody>
  5.1995 -        <tr>
  5.1996 -          <td><dfn id="dom-evt-sourceopen"><code>sourceopen</code></dfn></td>
  5.1997 -          <td><code>Event</code></td>
  5.1998 -          <td>When <code><a href="#dom-readystate">readyState</a></code> transitions from <code><a href="#dom-closed">"closed"</a></code> to <code><a href="#dom-%22open%22">"open"</a></code> or from <code><a href="#dom-%22ended%22">"ended"</a></code> to <code><a href="#dom-%22open%22">"open"</a></code>.</td>
  5.1999 -        </tr>
  5.2000 -        <tr>
  5.2001 -          <td><dfn id="dom-evt-sourceended"><code>sourceended</code></dfn></td>
  5.2002 -          <td><code>Event</code></td>
  5.2003 -          <td>When <code><a href="#dom-readystate">readyState</a></code> transitions from <code><a href="#dom-%22open%22">"open"</a></code> to <code><a href="#dom-%22ended%22">"ended"</a></code>.</td>
  5.2004 -        </tr>
  5.2005 -        <tr>
  5.2006 -          <td><dfn id="dom-evt-sourceclose"><code>sourceclose</code></dfn></td>
  5.2007 -          <td><code>Event</code></td>
  5.2008 -	  <td>When <code><a href="#dom-readystate">readyState</a></code> transitions from <code><a href="#dom-%22open%22">"open"</a></code> to <code><a href="#dom-closed">"closed"</a></code> or <code><a href="#dom-%22ended%22">"ended"</a></code> to <code><a href="#dom-closed">"closed"</a></code>.</td>
  5.2009 -        </tr>
  5.2010 -      </tbody>
  5.2011 -    </table>
  5.2012 -
  5.2013 -    <h3 id="mediasource-algorithms">3.3. Algorithms</h3>
  5.2014 -    <h4 id="mediasource-attach">3.3.1 Attaching to a media element</h4>
  5.2015 -    <p> A <code><a href="#dom-mediasource">MediaSource</a></code> object can be attached to a media element by assigning a <a href="#mediasource-object-url">MediaSource object URL</a> to the media element <code><a href="http://dev.w3.org/html5/spec/media-elements.html#attr-media-src">src</a></code> attribute or the src attribute of a &lt;source&gt; inside a media element. A <a href="#mediasource-object-url">MediaSource object URL</a> is created by passing a MediaSource object to <code><a href="#dom-createobjecturl">createObjectURL()</a></code>.</p>
  5.2016 -    <p>If the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a> absolute URL matches the MediaSource object URL, run the following steps right before the "Perform a potentially
  5.2017 -CORS-enabled fetch" step in the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</p>
  5.2018 -    <ol>
  5.2019 -      <dl class="switch">
  5.2020 -        <dt>If <code><a href="#dom-readystate">readyState</a></code> is NOT set to <code><a href="#dom-closed">"closed"</a></code>
  5.2021 -</dt>
  5.2022 -        <dd>Run the 
  5.2023 -    "<i>If the media data cannot be fetched at all, due to network errors, causing the user agent to give up trying to fetch the resource</i>"
  5.2024 -   steps of the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a>.</dd>
  5.2025 -        <dt>Otherwise</dt>
  5.2026 -        <dd>
  5.2027 -          <ol>
  5.2028 -            <li>Set the <code><a href="#dom-readystate">readyState</a></code> attribute to <code><a href="#dom-%22open%22">"open"</a></code>.</li>
  5.2029 -            <li>
  5.2030 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2031 -   <code><a href="#dom-evt-sourceopen">sourceopen</a></code> at the <code><a href="#dom-mediasource">MediaSource</a></code>.</li>
  5.2032 -            <li>Allow the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-media-load-resource">resource fetch algorithm</a> to progress based on data passed in via <code><a href="#dom-append">append()</a></code>.</li>
  5.2033 -          </ol>
  5.2034 -        </dd>
  5.2035 -      </dl>
  5.2036 -    </ol>
  5.2037 -
  5.2038 -    <h4 id="mediasource-detach">3.3.2 Detaching from a media element</h4>
  5.2039 -    <p>The following steps are run in any case where the media element is going to transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-network_empty">NETWORK_EMPTY</a></code> and <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2040 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-mediacontroller-emptied">emptied</a></code> at the media element. These steps should be run right before the transition.</p>
  5.2041 -    <ol>
  5.2042 -      <li>Set the <code><a href="#dom-readystate">readyState</a></code> attribute to <code><a href="#dom-closed">"closed"</a></code>.</li>
  5.2043 -      <li>Set the <code><a href="#dom-duration">duration</a></code> attribute to NaN.</li>
  5.2044 -      <li>Remove all the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects from <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2045 -      <li>
  5.2046 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2047 -   <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2048 -      <li>Remove all the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects from <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>.</li>
  5.2049 -      <li>
  5.2050 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2051 -   <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>.</li>
  5.2052 -      <li>
  5.2053 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2054 -   <code><a href="#dom-evt-sourceclose">sourceclose</a></code> at the <code><a href="#dom-mediasource">MediaSource</a></code>.</li>
  5.2055 -    </ol>
  5.2056 -
  5.2057 -    <h4 id="mediasource-seeking">3.3.3 Seeking</h4>
  5.2058 -    <p>Run the following steps as part of the "<i>Wait until the user agent has established whether or not the media data for the new playback position is available, and, if it is, until it has decoded enough data to play back that position"</i> step of the 
  5.2059 -    media element
  5.2060 -    <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-seek">seek algorithm</a>:</p>
  5.2061 -    <ol>
  5.2062 -      <li>The media element looks for <a href="#media-segment">media segments</a> containing the <var title="true">new playback position</var> in each <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> object in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2063 -      <dl class="switch">
  5.2064 -	<dt>If one or more of the objects in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> is missing <a href="#media-segment">media segments</a> for the <var title="true">new playback position</var>
  5.2065 -</dt>
  5.2066 -	<dd>
  5.2067 -	  <ol>
  5.2068 -	    <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>.</li>
  5.2069 -	    <li>The media element waits for the necessary <a href="#media-segment">media segments</a> to be passed to <code><a href="#dom-append">append()</a></code>. The web application can use <code><a href="#dom-buffered">buffered</a></code> to determine what the media element needs to resume playback.</li>
  5.2070 -	  </ol>
  5.2071 -	</dd>
  5.2072 -	<dt>Otherwise</dt>
  5.2073 -	<dd>Continue</dd>
  5.2074 -      </dl>
  5.2075 -      <li>The media element resets all decoders and initializes each one with data from the appropriate <a href="#init-segment">initialization segment</a>.</li>
  5.2076 -      <li>The media element feeds data from the <a href="#media-segment">media segments</a> into the decoders until the <var title="true">new playback position</var> is reached.</li>
  5.2077 -      <li>Resume the 
  5.2078 -    media element
  5.2079 -    <a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-seek">seek algorithm</a> at the "<i>Await a stable state</i>" step.</li>
  5.2080 -    </ol>
  5.2081 -
  5.2082 -
  5.2083 -    <h4 id="buffer-monitoring">3.3.4 SourceBuffer Monitoring</h4>
  5.2084 -    <p>The following steps are periodically run during playback to make sure that all of the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> have enough data to ensure uninterrupted playback. Appending new segments and changes to <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> also cause these steps to run because they affect the conditions that trigger state transitions. The web application can monitor changes in <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> to drive <a href="#media-segment">media segment</a> appending.</p>
  5.2085 -    <dl class="switch">
  5.2086 -      <dt>If <code><a href="#dom-buffered">buffered</a></code> for all objects in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> do not contain <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> for the current playback position:</dt>
  5.2087 -      <dd>
  5.2088 -	<ol>
  5.2089 -	  <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>.</li>
  5.2090 -	  <li>If this is the first transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>, then <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2091 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-loadedmetadata">loadedmetadata</a></code> at the media element.</li>
  5.2092 -	  <li>Abort these steps.</li>
  5.2093 -	</ol>
  5.2094 -      </dd>
  5.2095 -      <dt>If <code><a href="#dom-buffered">buffered</a></code> for all objects in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> contain <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> that include the current playback position and enough data to ensure uninterrupted playback:</dt>
  5.2096 -      <dd>
  5.2097 -	<ol>
  5.2098 -	  <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_enough_data">HAVE_ENOUGH_DATA</a></code>.</li>
  5.2099 -	  <li>
  5.2100 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2101 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-canplaythrough">canplaythrough</a></code> at the media element.</li>
  5.2102 -	  <li>Playback may resume at this point if it was previously suspended by a transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>.</li>
  5.2103 -	  <li>Abort these steps.</li>
  5.2104 -	</ol>
  5.2105 -      </dd>
  5.2106 -      <dt>If <code><a href="#dom-buffered">buffered</a></code> for at least one object in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> contains a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRange</a></code> that includes the current playback position but not enough data to ensure uninterrupted playback:</dt>
  5.2107 -      <dd>
  5.2108 -	<ol>
  5.2109 -	  <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_future_data">HAVE_FUTURE_DATA</a></code>.</li>
  5.2110 -	  <li>If the previous value of <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> was less than <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_future_data">HAVE_FUTURE_DATA</a></code>, then <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2111 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-canplay">canplay</a></code> at the media element.</li>
  5.2112 -	  <li>Playback may resume at this point if it was previously suspended by a transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>.</li>
  5.2113 -	  <li>Abort these steps.</li>
  5.2114 -	</ol>
  5.2115 -      </dd>
  5.2116 -      <dt>If <code><a href="#dom-buffered">buffered</a></code> for at least one object in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> contains a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRange</a></code> that ends at the current playback position and does not have a range covering the time immediately after the current position:</dt>
  5.2117 -      <dd>
  5.2118 -	<ol>
  5.2119 -	  <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>.</li>
  5.2120 -	  <li>If this is the first transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>, then <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2121 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-loadeddata">loadeddata</a></code> at the media element.</li>
  5.2122 -	  <li>Playback is suspended at this point since the media element doesn't have enough data to advance the timeline.</li>
  5.2123 -	  <li>Abort these steps.</li>
  5.2124 -	</ol>
  5.2125 -      </dd>
  5.2126 -    </dl>
  5.2127 -
  5.2128 -    <h4 id="active-source-buffer-changes">3.3.5 Changes to selected/enabled track state</h4>
  5.2129 -    <p>During playback <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> needs to be updated if the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-videotrack-selected">selected video track</a></code>, the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-audiotrack-enabled">enabled audio tracks</a></code>, or a text track <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-mode">mode</a></code> changes. When one or more of these changes occur the following steps need to be followed.</p>
  5.2130 -    <dl class="switch">
  5.2131 -      <dt>If the selected video track changes:</dt>
  5.2132 -      <dd>
  5.2133 -	<ol>
  5.2134 -	  <li>If the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with the previously selected video track is not associated with any other enabled tracks, run the following steps:
  5.2135 -  	  <ol>
  5.2136 -	    <li>Remove the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> from <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2137 -	    <li>
  5.2138 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2139 -   <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2140 -</li>
  5.2141 -	  </ol>
  5.2142 -	  </li>
  5.2143 -	  <li>If the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with the newly selected video track is not already in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>, run the following steps:
  5.2144 -	  <ol>
  5.2145 -	    <li>Add the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> to <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2146 -	    <li>
  5.2147 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2148 -   <code><a href="#dom-evt-addsourcebuffer">addsourcebuffer</a></code> at <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2149 -</li>
  5.2150 -	  </ol>
  5.2151 -	  </li>
  5.2152 -	</ol>
  5.2153 -      </dd>
  5.2154 -      <dt>If an audio track becomes disabled and the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with this track is not associated with any other enabled or selected track</dt>
  5.2155 -      <dd>
  5.2156 -	<ol>
  5.2157 -	  <li>Remove the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with the audio track from <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2158 -</li>
  5.2159 -	  <li>
  5.2160 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2161 -   <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2162 -</li>
  5.2163 -	</ol>
  5.2164 -      </dd>
  5.2165 -      <dt>If an audio track becomes enabled and the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with this track is not already in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2166 -</dt>
  5.2167 -      <dd>
  5.2168 -	<ol>
  5.2169 -	  <li>Add the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with the audio track to <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2170 -</li>
  5.2171 -	  <li>
  5.2172 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2173 -   <code><a href="#dom-evt-addsourcebuffer">addsourcebuffer</a></code> at <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2174 -</li>
  5.2175 -	</ol>
  5.2176 -      </dd>
  5.2177 -      <dt>If a text track <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-mode">mode</a></code> becomes <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-disabled">"disabled"</a></code> and the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with this track is not associated with any other enabled or selected track</dt>
  5.2178 -      <dd>
  5.2179 -	<ol>
  5.2180 -	  <li>Remove the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with the text track from <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2181 -</li>
  5.2182 -	  <li>
  5.2183 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2184 -   <code><a href="#dom-evt-removesourcebuffer">removesourcebuffer</a></code> at <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2185 -</li>
  5.2186 -	</ol>
  5.2187 -      </dd>
  5.2188 -      <dt>If a text track <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-mode">mode</a></code> becomes <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-showing">"showing"</a></code> or <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-hidden">"hidden"</a></code> and the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with this track is not already in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2189 -</dt>
  5.2190 -      <dd>
  5.2191 -	<ol>
  5.2192 -	  <li>Add the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> associated with the text track to <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2193 -</li>
  5.2194 -	  <li>
  5.2195 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2196 -   <code><a href="#dom-evt-addsourcebuffer">addsourcebuffer</a></code> at <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>
  5.2197 -</li>
  5.2198 -	</ol>
  5.2199 -      </dd>
  5.2200 -    </dl>
  5.2201 -
  5.2202 -    <h4 id="duration-change-algorithm">3.3.6 Duration change</h4>
  5.2203 -    <p>Follow these steps when <code><a href="#dom-duration">duration</a></code> needs to change to a <var title="true">new duration</var>.</p>
  5.2204 -    <ol>
  5.2205 -      <li>If the current value of <code><a href="#dom-duration">duration</a></code> is equal to <var title="true">new duration</var>, then abort these steps.</li>
  5.2206 -      <li>Update <code><a href="#dom-duration">duration</a></code> to <var title="true">new duration</var>.</li>
  5.2207 -      <li>Remove all media data with timestamps that are greater than <var title="true">new duration</var> from all <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects in <code><a href="#dom-sourcebuffers">sourceBuffers</a></code>.
  5.2208 -      <p class="note">Note: This preserves audio frames that start before and end after the <code><a href="#dom-duration">duration</a></code>. The user agent must end playback at <code><a href="#dom-duration">duration</a></code> even if the audio frame extends beyond this time.</p>
  5.2209 -      </li>
  5.2210 -      <li>Update the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#media-controller-duration">media controller duration</a></code> to <var title="true">new duration</var> and run the <a href="http://dev.w3.org/html5/spec/media-elements.html#durationChange">HTMLMediaElement duration change algorithm</a>.</li>
  5.2211 -    </ol>
  5.2212 -
  5.2213 -   <h2 id="sourcebuffer">4. SourceBuffer Object</h2>
  5.2214 -   <pre class="idl">
  5.2215 -interface <dfn id="dom-sourcebuffer">SourceBuffer</dfn> : EventTarget {
  5.2216 -  // Returns the time ranges buffered.
  5.2217 -  readonly attribute TimeRanges <a href="#dom-buffered">buffered</a>;
  5.2218 -
  5.2219 -  // Applies an offset to media segment timestamps.
  5.2220 -  attribute double <a href="#dom-timestampoffset">timestampOffset</a>;
  5.2221 -
  5.2222 -  // Append segment data.
  5.2223 -  void <a href="#dom-append">append</a>(Uint8Array data);
  5.2224 -
  5.2225 -  // Abort the current segment append sequence.
  5.2226 -  void <a href="#dom-abort">abort</a>();
  5.2227 -
  5.2228 -  // Remove media for a specific time range.
  5.2229 -  void <a href="#dom-remove">remove</a>(double start, double end);
  5.2230 -};
  5.2231 -   </pre>
  5.2232 -   <h3 id="sourcebuffer-methods">4.1. Methods and Attributes</h3>
  5.2233 -
  5.2234 -   <p>The <dfn id="sourcebuffer-parent-media-source">parent media source</dfn> of a <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> object is the <code><a href="#dom-mediasource">MediaSource</a></code> object that created it.</p>
  5.2235 -
  5.2236 -   <p>The <dfn id="dom-buffered"><code>buffered</code></dfn> attribute indicates what <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> are buffered in the <code><a href="#dom-sourcebuffer">SourceBuffer</a></code>. When the attribute is read the following steps must occur:</p>
  5.2237 -   <ol>
  5.2238 -     <li>If this object has been removed from the <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2239 -     <li>Return a new static <a href="http://dev.w3.org/html5/spec/media-elements.html#normalized-timeranges-object">normalized TimeRanges object</a> for the <a href="#media-segment">media segments</a> buffered.</li>
  5.2240 -   </ol>
  5.2241 -
  5.2242 -   <p>The <dfn id="dom-timestampoffset"><code>timestampOffset</code></dfn> attribute controls the offset applied to timestamps inside subsequent <a href="#media-segment">media segments</a> that are appended to this <code><a href="#dom-sourcebuffer">SourceBuffer</a></code>. The <code><a href="#dom-timestampoffset">timestampOffset</a></code> is initially set to 0 which indicates that no offset is being applied. On getting, the initial value or the last value that was successfully set is returned. On setting, run following steps:</p>
  5.2243 -   <ol>
  5.2244 -     <li>If this object has been removed from the <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a>, then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2245 -     <li>If the <code><a href="#dom-readystate">readyState</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> is not in the <code><a href="#dom-%22open%22">"open"</a></code> state, then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2246 -     <li>If this object is waiting for the end of a <a href="#media-segment">media segment</a> to be appended, then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> and abort these steps.</li>
  5.2247 -     <li>Update the attribute to the new value.</li>
  5.2248 -   </ol>
  5.2249 -
  5.2250 -   <p>The <dfn id="dom-append"><code>append(data)</code></dfn> method must run the following steps:</p>
  5.2251 -   <ol>
  5.2252 -     <li>If <var title="true">data</var> is null then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.2253 -     <li>If this object has been removed from the <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2254 -     <li>If the <code><a href="#dom-readystate">readyState</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> is in the <code><a href="#dom-closed">"closed"</a></code> state then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2255 -     <li>
  5.2256 -       <p>If the <code><a href="#dom-readystate">readyState</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> is in the <code><a href="#dom-%22ended%22">"ended"</a></code> state then run the following steps:</p>
  5.2257 -       <ol>
  5.2258 -	 <li>Set the <code><a href="#dom-readystate">readyState</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> to <code><a href="#dom-%22open%22">"open"</a></code>
  5.2259 -</li>
  5.2260 -	 <li>
  5.2261 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2262 -   <code><a href="#dom-evt-sourceopen">sourceopen</a></code> at the <a href="#sourcebuffer-parent-media-source">parent media source</a> .</li>
  5.2263 -       </ol>
  5.2264 -     </li>
  5.2265 -     <li>If <var title="true">data</var>.byteLength is 0 abort these steps.</li>
  5.2266 -     <li>Add <var title="true">data</var> to the end of the <a href="#sourcebuffer-input-buffer">input buffer</a>
  5.2267 -</li>
  5.2268 -     <li>Run the <a href="#sourcebuffer-segment-parser-loop">segment parser loop</a>.</li>
  5.2269 -   </ol>
  5.2270 -
  5.2271 -    <p>The <dfn id="dom-abort"><code>abort()</code></dfn> method must run the following steps:</p>
  5.2272 -    <ol>
  5.2273 -      <li>If this object has been removed from the <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2274 -      <li>If the <code><a href="#dom-readystate">readyState</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> is not in the <code><a href="#dom-%22open%22">"open"</a></code> state then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2275 -      <li>The media element aborts parsing the current segment.</li>
  5.2276 -      <li>If the <a href="#sourcebuffer-append-state">append state</a> equals <a href="#sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</a> and the <a href="#sourcebuffer-input-buffer">input buffer</a> contains some complete <a href="#coded-frame">coded frames</a>, then run the <a href="#sourcebuffer-coded-frame-processing">coded frame processing algorithm</a> as if the media segment only contained these frames.</li>
  5.2277 -      <li>Remove all bytes from the <a href="#sourcebuffer-input-buffer">input buffer</a>.</li>
  5.2278 -      <li>Set <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a>.</li>
  5.2279 -    </ol>
  5.2280 -
  5.2281 -    <p>The <dfn id="dom-remove"><code>remove(start, end)</code></dfn> method must run the following steps:</p>
  5.2282 -    <ol>
  5.2283 -      <li>If <var title="true">start</var> is negative or greater than <code><a href="#dom-duration">duration</a></code>, then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.2284 -      <li>If <var title="true">end</var> is less than or equal to <var title="true">start</var>, then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_access_err">INVALID_ACCESS_ERR</a></code> exception and abort these steps.</li>
  5.2285 -      <li>If this object has been removed from the <code><a href="#dom-sourcebuffers">sourceBuffers</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2286 -      <li>If the <code><a href="#dom-readystate">readyState</a></code> attribute of the <a href="#sourcebuffer-parent-media-source">parent media source</a> is not in the <code><a href="#dom-%22open%22">"open"</a></code> state then throw an <code><a href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-domexception-invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these steps.</li>
  5.2287 -      <li>
  5.2288 -<p>For each track in this source buffer, run the following steps:</p>
  5.2289 -        <ol>
  5.2290 -	  <li>
  5.2291 -	    <p>Let <var title="true">next random access point timestamp</var> be the timestamp of the next <a href="#random-access-point">random access point</a>, for this track, that is greater than or equal to <var title="true">end</var>.</p>
  5.2292 -	    <p class="note">Note: <var title="true">next random access point timestamp</var> can be different across tracks because the dependencies between <a href="#coded-frame">coded frames</a> within a track are usually different than the dependencies in another track.</p>
  5.2293 -</li>
  5.2294 -	  <li>Remove all media data, for this track, that contain starting timestamps greater than or equal to <var title="true">start</var> and less than the <var title="true">next random access point timestamp</var>.</li>
  5.2295 -	</ol>
  5.2296 -      </li>
  5.2297 -      
  5.2298 -    </ol>
  5.2299 -
  5.2300 -    <h3 id="sourcebuffer-algorithms">4.2. Algorithms</h3>
  5.2301 -
  5.2302 -    <h4 id="sourcebuffer-segment-parser-loop">4.2.1 Segment Parser Loop</h4>
  5.2303 -    <p>All SourceBuffer objects have an internal <dfn id="sourcebuffer-append-state">append state</dfn> variable that keeps track of the high-level segment parsing state. It is initially set to <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a> and can transition to the following states as data is appended.</p>
  5.2304 -    <table>
  5.2305 -      <thead>
  5.2306 -	<tr>
  5.2307 -          <th>Append state name</th>
  5.2308 -          <th>Description</th>
  5.2309 -        </tr>
  5.2310 -      </thead>
  5.2311 -      <tbody>
  5.2312 -        <tr>
  5.2313 -          <td><dfn id="sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</dfn></td>
  5.2314 -          <td>Waiting for the start of an <a href="#init-segment">initialization segment</a> or <a href="#media-segment">media segment</a> to be appended.</td>
  5.2315 -        </tr>
  5.2316 -        <tr>
  5.2317 -          <td><dfn id="sourcebuffer-parsing-init-segment">PARSING_INIT_SEGMENT</dfn></td>
  5.2318 -          <td>Currently parsing an <a href="#init-segment">initialization segment</a>.</td>
  5.2319 -        </tr>
  5.2320 -	<tr>
  5.2321 -	  <td><dfn id="sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</dfn></td>
  5.2322 -          <td>Currently parsing a <a href="#media-segment">media segment</a>.</td>
  5.2323 -        </tr>
  5.2324 -      </tbody>
  5.2325 -    </table>
  5.2326 -    
  5.2327 -    <p>The <dfn id="sourcebuffer-input-buffer">input buffer</dfn> is a byte buffer that is used to hold unparsed bytes across <code><a href="#dom-append">append()</a></code> calls. The buffer is empty when the SourceBuffer object is created.</p>
  5.2328 -
  5.2329 -    <p>While the <a href="#sourcebuffer-input-buffer">input buffer</a> is not empty, run the following steps in a loop:</p>
  5.2330 -    <ol>
  5.2331 -      <li>If the <a href="#sourcebuffer-input-buffer">input buffer</a> starts with bytes that violate the <a href="#byte-stream-formats">byte stream format specifications</a>, then call <code><a href="#dom-endofstream">endOfStream("decode")</a></code>, and abort this algorithm.</li>
  5.2332 -      <li>Remove any bytes that the <a href="#byte-stream-formats">byte stream format specifications</a> say should be ignored from the start of the <a href="#sourcebuffer-input-buffer">input buffer</a>.</li>
  5.2333 -      <li>
  5.2334 -	<p>If the <a href="#sourcebuffer-append-state">append state</a> equals <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a>, then run the following steps:</p>
  5.2335 -	<ol>
  5.2336 -	  <li>If the beginning of the <a href="#sourcebuffer-input-buffer">input buffer</a> indicates the start of an <a href="#init-segment">initialization segment</a>, set the <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-parsing-init-segment">PARSING_INIT_SEGMENT</a>.</li>
  5.2337 -	  <li>If the beginning of the <a href="#sourcebuffer-input-buffer">input buffer</a> indicates the start of an <a href="#media-segment">media segment</a>, set <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</a>.</li>
  5.2338 -	  <li>Return  to the top of the loop.</li>
  5.2339 -	</ol>
  5.2340 -      </li>
  5.2341 -      <li>
  5.2342 -	<p>If the <a href="#sourcebuffer-append-state">append state</a> equals <a href="#sourcebuffer-parsing-init-segment">PARSING_INIT_SEGMENT</a>, then run the following steps:</p>
  5.2343 -	<ol>
  5.2344 -	  <li>If the <a href="#sourcebuffer-input-buffer">input buffer</a> does not contain a complete <a href="#init-segment">initialization segment</a> yet, then exit the loop.</li>
  5.2345 -	  <li>Run the <a href="#sourcebuffer-init-segment-received">initialization segment received algorithm</a>.</li>
  5.2346 -	  <li>Remove the <a href="#init-segment">initialization segment</a> bytes from the beginning of the <a href="#sourcebuffer-input-buffer">input buffer</a>.</li>
  5.2347 -	  <li>Set <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a>.</li>
  5.2348 -	  <li>Return  to the top of the loop.</li>
  5.2349 -	</ol>
  5.2350 -      </li>
  5.2351 -      <li>
  5.2352 -	<p>If the <a href="#sourcebuffer-append-state">append state</a> equals <a href="#sourcebuffer-parsing-media-segment">PARSING_MEDIA_SEGMENT</a>, then run the following steps:</p>
  5.2353 -	<ol>
  5.2354 -	  <li>
  5.2355 -	    <p>If the <a href="#sourcebuffer-input-buffer">input buffer</a> does not contain a complete <a href="#media-segment">media segment</a> header yet, then exit the loop.</p>
  5.2356 -	    <p class="note">Note: Implementations may choose to implement this state as an incremental parser so that it is not necessary to have the entire media segment before running the <a href="#sourcebuffer-coded-frame-processing">coded frame processing algorithm</a>.</p>
  5.2357 -	  </li>
  5.2358 -	  <li>Run the <a href="#sourcebuffer-coded-frame-processing">coded frame processing algorithm</a>.</li>
  5.2359 -	  <li>Remove the <a href="#media-segment">media segment</a> bytes from the beginning of the <a href="#sourcebuffer-input-buffer">input buffer</a>.</li>
  5.2360 -	  <li>
  5.2361 -	    <p>Set <a href="#sourcebuffer-append-state">append state</a> to <a href="#sourcebuffer-waiting-for-segment">WAITING_FOR_SEGMENT</a>.</p>
  5.2362 -	    <p class="note">Note: Incremental parsers should only do this transition after the entire media segment has been received.</p>
  5.2363 -	  </li>
  5.2364 -	  <li>Return  to the top of the loop.</li>
  5.2365 -	</ol>
  5.2366 -      </li>
  5.2367 -    </ol>
  5.2368 -
  5.2369 -    <h4 id="sourcebuffer-init-segment-received">4.2.2 Initialization Segment Received</h4>
  5.2370 -    <p>The following steps are run when the <a href="#sourcebuffer-segment-parser-loop">segment parser loop</a> successfully parses a complete <a href="#init-segment">initialization segment</a>:</p>
  5.2371 -    <ol>
  5.2372 -      <li>Update the <code><a href="#dom-duration">duration</a></code> attribute if it currently equals NaN:</li>
  5.2373 -      <dl class="switch">
  5.2374 -	<dt>If the initialization segment contains a duration:</dt>
  5.2375 -	<dd>Run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var title="true">new duration</var> set to the duration in the initialization segment.</dd>
  5.2376 -	<dt>Otherwise:</dt>
  5.2377 -	<dd>Run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var title="true">new duration</var> set to positive Infinity.</dd>
  5.2378 -      </dl>
  5.2379 -      <li>Handle state transitions:</li>
  5.2380 -      <dl class="switch">
  5.2381 -	<dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_nothing">HAVE_NOTHING</a></code>:</dt>
  5.2382 -	<dd>
  5.2383 -	  <ol>
  5.2384 -	    <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>.</li>
  5.2385 -	    <li>
  5.2386 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2387 -    <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-loadedmetadata">loadedmetadata</a></code> at the media element.</li>
  5.2388 -	  </ol>
  5.2389 -	</dd>
  5.2390 -	<dt>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is greater than <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code> and the <a href="#init-segment">initialization segment</a> contains the first video or first audio track in the presentation:</dt>
  5.2391 -	<dd>
  5.2392 -	  Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code>.
  5.2393 -	</dd>
  5.2394 -	<dt>Otherwise:</dt>
  5.2395 -	<dd>Continue</dd>
  5.2396 -      </dl>
  5.2397 -      <li>Update <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-audiotracks">audioTracks</a></code>
  5.2398 -</li>
  5.2399 -      <dl class="switch">
  5.2400 -	<dt>If <a href="#init-segment">initialization segment</a> contains the first audio track:</dt>
  5.2401 -	<dd>
  5.2402 -	  <ol>
  5.2403 -	    <li>Add an <code><a href="http://dev.w3.org/html5/spec/media-elements.html#audiotrack">AudioTrack</a></code> and mark it as enabled.</li>
  5.2404 -	    <li>Add this <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> to <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2405 -	  </ol>
  5.2406 -	</dd>
  5.2407 -	<dt>If <a href="#init-segment">initialization segment</a> contains audio tracks beyond those already in the presentation:</dt>
  5.2408 -	<dd>Add a disabled <code><a href="http://dev.w3.org/html5/spec/media-elements.html#audiotrack">AudioTrack</a></code> for each audio track in the <a href="#init-segment">initialization segment</a>.</dd>
  5.2409 -      </dl>
  5.2410 -      <li>Update <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-videotracks">videoTracks</a></code>:</li>
  5.2411 -      <dl class="switch">
  5.2412 -	<dt>If <a href="#init-segment">initialization segment</a> contains the first video track:</dt>
  5.2413 -	<dd>
  5.2414 -	  <ol>
  5.2415 -	    <li>Add a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#videotrack">VideoTrack</a></code> and mark it as selected.</li>
  5.2416 -	    <li>Add this <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> to <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2417 -	  </ol>
  5.2418 -	</dd>
  5.2419 -	<dt>If <a href="#init-segment">initialization segment</a> contains the video tracks beyond those already in the presentation:</dt>
  5.2420 -	<dd>Add a disabled <code><a href="http://dev.w3.org/html5/spec/media-elements.html#videotrack">VideoTrack</a></code> for each video track in the <a href="#init-segment">initialization segment</a>.</dd>
  5.2421 -      </dl>
  5.2422 -      <li>Update <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-texttracks">textTracks</a></code>
  5.2423 -</li>
  5.2424 -      <dl class="switch">
  5.2425 -	<dd>
  5.2426 -	  <ol>
  5.2427 -	    <li>Add a <code><a href="http://dev.w3.org/html5/spec/media-elements.html#texttrack">TextTrack</a></code> for each text track in the <a href="#init-segment">initialization segment</a>.</li>
  5.2428 -	    <li>If the text track <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-mode">mode</a></code> is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-showing">"showing"</a></code> or <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-texttrack-hidden">"hidden"</a></code> then add this <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> to <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2429 -	  </ol>
  5.2430 -	</dd>
  5.2431 -      </dl>
  5.2432 -    </ol>
  5.2433 -
  5.2434 -    <h4 id="sourcebuffer-coded-frame-processing">4.2.3 Coded Frame Processing</h4>
  5.2435 -    <p>When a complete <a href="#coded-frame">coded frame</a> has been parsed by the <a href="#sourcebuffer-segment-parser-loop">segment parser loop</a> then the following steps are run:</p>
  5.2436 -    <ol>
  5.2437 -      <li>
  5.2438 -	<p>For each <a href="#coded-frame">coded frame</a> in the <a href="#media-segment">media segment</a> run the following steps:</p>
  5.2439 -	<ol>
  5.2440 -	  <li>Let <var title="true">presentation timestamp</var> be a double precision floating point representation of the coded frame's presentation timestamp.</li>
  5.2441 -	  <li>Let <var title="true">decode timestamp</var> be a double precision floating point representation of the coded frame's decode timestamp.</li>
  5.2442 -	  <li>
  5.2443 -	    <p>If <code><a href="#dom-timestampoffset">timestampOffset</a></code> is not 0, then run the following steps:</p>
  5.2444 -	    <ol>
  5.2445 -	      <li>Add <code><a href="#dom-timestampoffset">timestampOffset</a></code> to the <var title="true">presentation timestamp</var>.</li>
  5.2446 -	      <li>Add <code><a href="#dom-timestampoffset">timestampOffset</a></code> to the <var title="true">decode timestamp</var>.</li>
  5.2447 -	      <li>If the <var title="true">presentation timestamp</var> or <var title="true">decode timestamp</var> is less than the <a href="#presentation-start-time">presentation start time</a>, then call <code><a href="#dom-endofstream">endOfStream("decode")</a></code>, and abort these steps.</li>
  5.2448 -	    </ol>
  5.2449 -	  </li>
  5.2450 -	  <li>Add the <a href="#coded-frame">coded frame</a> with the <var title="true">presentation timestamp</var> and <var title="true">decode timestamp</var>, to the source buffer.</li>
  5.2451 -	</ol>
  5.2452 -      </li>
  5.2453 -      <li>
  5.2454 -<p>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_metadata">HAVE_METADATA</a></code> and the new <a href="#coded-frame">coded frames</a> cause all objects in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> to have media data for the current playback position, then run the following steps:</p>
  5.2455 -	  <ol>
  5.2456 -	    <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>.</li>
  5.2457 -	    <li>If this is the first transition to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code>, then <a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2458 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-loadeddata">loadeddata</a></code> at the media element.</li>
  5.2459 -	  </ol>
  5.2460 -      </li>
  5.2461 -      <li>
  5.2462 -	<p>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_current_data">HAVE_CURRENT_DATA</a></code> and the new <a href="#coded-frame">coded frames</a> cause all objects in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> to have media data beyond the current playback position, then run the following steps:</p>
  5.2463 -	<ol>
  5.2464 -	  <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_future_data">HAVE_FUTURE_DATA</a></code>.</li>
  5.2465 -	  <li>
  5.2466 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2467 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-canplay">canplay</a></code> at the media element.</li>
  5.2468 -	</ol>
  5.2469 -      </li>
  5.2470 -      <li>
  5.2471 -	<p>If the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute is <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_future_data">HAVE_FUTURE_DATA</a></code> and the new <a href="#coded-frame">coded frames</a> cause all objects in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code> to have enough data to start playback, then run the following steps:</p>
  5.2472 -	<ol>
  5.2473 -	  <li>Set the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-readystate">HTMLMediaElement.readyState</a></code> attribute to <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-have_enough_data">HAVE_ENOUGH_DATA</a></code>.</li>
  5.2474 -	  <li>
  5.2475 -<a href="http://dev.w3.org/html5/spec/webappapis.html#queue-a-task">Queue a task</a> to <a href="http://dev.w3.org/html5/spec/webappapis.html#fire-a-simple-event">fire a simple event</a> named
  5.2476 -   <code><a href="http://dev.w3.org/html5/spec/media-elements.html#event-media-canplaythrough">canplaythrough</a></code> at the media element.</li>
  5.2477 -	</ol>
  5.2478 -      </li>
  5.2479 -      <li>If the <a href="#media-segment">media segment</a> contains data beyond the current <code><a href="#dom-duration">duration</a></code>, then run the <a href="#duration-change-algorithm">duration change algorithm</a> with <var title="true">new duration</var> set to the maximum of the current duration and the highest end timestamp reported by <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-buffered">HTMLMediaElement.buffered</a></code>.</li>
  5.2480 -    </ol>
  5.2481 -
  5.2482 -    <h2 id="sourcebufferlist">5. SourceBufferList Object</h2>
  5.2483 -    <p>SourceBufferList is a simple container object for <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects. It provides read-only array access and fires events when the list is modified.</p>
  5.2484 -
  5.2485 -    <pre class="idl">
  5.2486 -interface <dfn id="dom-sourcebufferlist">SourceBufferList</dfn> : EventTarget {
  5.2487 -  readonly attribute unsigned long <a href="#dom-length">length</a>;
  5.2488 -  <a href="#dom-getter">getter</a> <a href="#dom-sourcebuffer">SourceBuffer</a> (unsigned long index);
  5.2489 -};
  5.2490 -    </pre>
  5.2491 -    <h3 id="sourcebufferlist-methods">5.1. Methods and Attributes</h3>
  5.2492 -    <p>The <dfn id="dom-length"><code>length</code></dfn> attribute indicates the number of <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> objects in the list.</p>
  5.2493 -    <p>The <dfn id="dom-getter"><code>getter SourceBuffer (unsigned long <var title="true">index</var>)</code></dfn> method allows the SourceBuffer objects in the list to be accessed with an array operator (i.e. []). This method must run the following steps:</p>
  5.2494 -    <ol>
  5.2495 -      <li>If <var title="true">index</var> is greater than or equal to the <code><a href="#dom-length">length</a></code> attribute then return undefined and abort these steps.</li>
  5.2496 -      <li>Return the <var title="true">index</var>'th <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> object in the list.</li>
  5.2497 -    </ol>
  5.2498 -
  5.2499 -    <h3 id="sourcebufferlist-events">5.2. Event Summary</h3>
  5.2500 -    <table>
  5.2501 -      <thead>
  5.2502 -        <tr>
  5.2503 -          <th>Event name</th>
  5.2504 -          <th>Interface</th>
  5.2505 -          <th>Dispatched when...</th>
  5.2506 -        </tr>
  5.2507 -      </thead>
  5.2508 -      <tbody>
  5.2509 -        <tr>
  5.2510 -          <td><dfn id="dom-evt-addsourcebuffer"><code>addsourcebuffer</code></dfn></td>
  5.2511 -          <td><code>Event</code></td>
  5.2512 -          <td>When a <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> is added to the list.</td>
  5.2513 -        </tr>
  5.2514 -        <tr>
  5.2515 -          <td><dfn id="dom-evt-removesourcebuffer"><code>removesourcebuffer</code></dfn></td>
  5.2516 -          <td><code>Event</code></td>
  5.2517 -          <td>When a <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> is removed from the list.</td>
  5.2518 -        </tr>
  5.2519 -      </tbody>
  5.2520 -    </table>
  5.2521 -
  5.2522 -    <h2 id="url">6. URL Object</h2>
  5.2523 -    <p></p>
  5.2524 -
  5.2525 -    <pre class="idl">
  5.2526 -partial interface <dfn id="dom-url">URL</dfn> {
  5.2527 -  static DOMString <a href="#dom-createobjecturl">createObjectURL</a>(<a href="#dom-mediasource">MediaSource</a> mediaSource);
  5.2528 -};
  5.2529 -    </pre>
  5.2530 -    <h3 id="url-methods">6.1. Methods</h3>
  5.2531 -    <p>The <dfn id="dom-createobjecturl"><code>createObjectURL(mediaSource)</code></dfn> method must run the following steps.</p>
  5.2532 -    <ol>
  5.2533 -      <li>If <var title="true">mediaSource</var> is NULL the return null.</li>
  5.2534 -      <li>Return a unique <a href="#mediasource-object-url">MediaSource object URL</a> that can be used to dereference the <var title="true">mediaSource</var> argument, and run the rest of the algorithm asynchronously.</li>
  5.2535 -      <li><a href="http://dev.w3.org/html5/spec/webappapis.html#provide-a-stable-state">provide a stable state</a></li>
  5.2536 -      <li>Revoke the <a href="#mediasource-object-url">MediaSource object URL</a> by calling <a href="http://www.w3.org/TR/FileAPI/#dfn-revokeObjectURL">revokeObjectURL()</a> on it.</li>
  5.2537 -    </ol>
  5.2538 -    <p class="note">Note: This algorithm is intended to mirror the behavior of the <a href="http://www.w3.org/TR/FileAPI/#">File API</a> <a href="http://www.w3.org/TR/FileAPI/#dfn-createObjectURL">createObjectURL()</a> method with autoRevoke set to true.</p>
  5.2539 -
  5.2540 -    <h2 id="htmlmediaelement-attributes">7. HTMLMediaElement attributes</h2>
  5.2541 -    <p>This section specifies what existing attributes on the <code><a href="http://dev.w3.org/html5/spec/media-elements.html#htmlmediaelement">HTMLMediaElement</a></code> should return when a <code><a href="#dom-mediasource">MediaSource</a></code> is attached to the element.</p>
  5.2542 -
  5.2543 -    <p>The <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-seekable">HTMLMediaElement.seekable</a></code> attribute returns a new static <a href="http://dev.w3.org/html5/spec/media-elements.html#normalized-timeranges-object">normalized TimeRanges object</a> created based on the following steps:</p>
  5.2544 -    <dl class="switch">
  5.2545 -      <dt>If <code><a href="#dom-duration">duration</a></code> equals NaN</dt>
  5.2546 -      <dd>Return an empty <code><a href="http://dev.w3.org/html5/spec/media-elements.html#timeranges">TimeRanges</a></code> object.</dd>
  5.2547 -      <dt>If <code><a href="#dom-duration">duration</a></code> equals positive Infinity</dt>
  5.2548 -      <dd>Return a single range with a start time of 0 and an end time equal to the highest end time reported by the <code><a href="#dom-htmlmediaelement.buffered">HTMLMediaElement.buffered</a></code> attribute.</dd>
  5.2549 -      <dt>Otherwise</dt>
  5.2550 -      <dd>Return a single range with a start time of 0 and an end time equal to <code><a href="#dom-duration">duration</a></code>.</dd>
  5.2551 -    </dl>
  5.2552 -
  5.2553 -    <p id="dom-htmlmediaelement.buffered">The <code><a href="http://dev.w3.org/html5/spec/media-elements.html#dom-media-buffered">HTMLMediaElement.buffered</a></code> attribute returns a new static <a href="http://dev.w3.org/html5/spec/media-elements.html#normalized-timeranges-object">normalized TimeRanges object</a> created based on the following steps:</p>
  5.2554 -    <ol>
  5.2555 -      <li>Let <var title="true">active ranges</var> be the ranges returned by <code><a href="#dom-buffered">buffered</a></code> for each <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> object in <code><a href="#dom-activesourcebuffers">activeSourceBuffers</a></code>.</li>
  5.2556 -      <li>Let <var title="true">intersection range</var> be the intersection of the <var title="true">active ranges</var>.</li>
  5.2557 -      <li>
  5.2558 -<p>If <code><a href="#dom-readystate">readyState</a></code> is <code><a href="#dom-%22ended%22">"ended"</a></code>, then run the following steps:</p>
  5.2559 -        <ol>
  5.2560 -	  <li>Let <var title="true">highest end time</var> be the largest end time in the <var title="true">active ranges</var>.</li>
  5.2561 -	  <li>Let <var title="true">highest intersection end time</var> be the highest end time in the <var title="true">intersection range</var>.</li>
  5.2562 -	  <li>If the <var title="true">highest intersection end time</var> is less than the <var title="true">highest end time</var>, then update the <var title="true">intersection range</var> so that the <var title="true">highest intersection end time</var> equals the <var title="true">highest end time</var>.</li>
  5.2563 -	</ol>
  5.2564 -      </li>
  5.2565 -      <li>Return the <var title="true">intersection range</var>.</li>
  5.2566 -    </ol>
  5.2567 -    
  5.2568 -    <h2 id="byte-stream-formats">8. Byte Stream Formats</h2>
  5.2569 -    <p>The bytes provided through <code><a href="#dom-append">append()</a></code> for a <code><a href="#dom-sourcebuffer">SourceBuffer</a></code> form a logical byte stream. The format of this byte stream depends on the media container format in use and is defined in a byte stream format specification. Byte stream format specifications based on WebM and the ISO Base Media File Format are provided below. If these formats are supported then the byte stream formats described below must be supported.</p>
  5.2570 -    <p>This section provides general requirements for all byte stream formats:</p>
  5.2571 -    <ul>
  5.2572 -      <li>A byte stream format specification may define <a href="#init-segment">initialization segments</a> and must define <a href="#media-segment">media segments</a>.</li>
  5.2573 -      <li>It must be possible to identify segment boundaries and segment type (initialization or media) by examining the byte stream alone.</li>
  5.2574 -      <li>The combination of an Initialization Segment and any contiguous sequence of Media Segments associated with it must:
  5.2575 -	<ol>
  5.2576 -	  <li>Identify the number and type (audio, video, text, etc.) of tracks in the Segments</li>
  5.2577 -	  <li>Identify the decoding capabilities needed to decode each track (i.e. codec and codec parameters)</li>
  5.2578 -	  <li>If a track is encrypted, provide any encryption parameters necessary to decrypt the content (except the encryption key itself)</li>
  5.2579 -	  <li>For each track, provide all information necessary to decode and render the earliest <a href="#random-access-point">random access point</a> in the sequence of Media Segments and all subsequent samples in the sequence (in presentation time). This includes, in particular,
  5.2580 -	    <ul>
  5.2581 -	      <li>Information that determines the <a href="http://dev.w3.org/html5/spec/media-elements.html#concept-video-intrinsic-width">intrinsic width and height</a> of the video (specifically, this requires either the picture or pixel aspect ratio, together with the encoded resolution).</li>
  5.2582 -	      <li>Information necessary to convert the video decoder output to a format suitable for display</li>
  5.2583 -	    </ul>
  5.2584 -	  </li>
  5.2585 -	  <li>Identify the global presentation timestamp of every sample in the sequence of Media Segments</li>
  5.2586 -	  <p>For example, if I1 is associated with M1, M2, M3 then the above must hold for all the combinations I1+M1, I1+M2, I1+M1+M2, I1+M2+M3, etc.</p>
  5.2587 -	</ol>
  5.2588 -      </li>
  5.2589 -    </ul>
  5.2590 -    <p>Byte stream specifications must at a minimum define constraints which ensure that the above requirements hold. Additional constraints may be defined, for example to simplify implementation.</p>
  5.2591 -
  5.2592 -    <p>Initialization segments are an optimization. They allow a byte stream format to avoid duplication of information in Media Segments that is the same for many Media Segments. Byte stream format specifications need not specify Initialization Segment formats, however. They may instead require that such information is duplicated in every Media Segment.</p>
  5.2593 -
  5.2594 -    <h3 id="webm">8.1 WebM Byte Streams</h3>
  5.2595 -    <div class="nonnormative">
  5.2596 -      <p>This section defines segment formats for implementations that choose to support WebM.</p>
  5.2597 -      <h4 id="webm-init-segments">8.1.1. Initialization Segments</h4>
  5.2598 -      <p>A WebM <a href="#init-segment">initialization segment</a> must contain a subset of the elements at the start of a typical WebM file.</p>
  5.2599 -      <p>The following rules apply to WebM initialization segments:</p>
  5.2600 -      <ol>
  5.2601 -	<li>The <a href="#init-segment">initialization segment</a> must start with an <a href="http://www.webmproject.org/code/specs/container/#ebml-basics">EBML Header</a> element, followed by a <a href="http://www.webmproject.org/code/specs/container/#segment">Segment</a> header.</li>
  5.2602 -	<li>The size value in the <a href="http://www.webmproject.org/code/specs/container/#segment">Segment</a> header must signal an "unknown size" or contain a value large enough to include the <a href="http://www.webmproject.org/code/specs/container/#segment-information">Segment Information</a> and <a href="http://www.webmproject.org/code/specs/container/#track">Tracks</a> elements that follow.</li>
  5.2603 -	<li>A <a href="http://www.webmproject.org/code/specs/container/#segment-information">Segment Information</a> element and a <a href="http://www.webmproject.org/code/specs/container/#track">Tracks</a> element must appear, in that order, after the <a href="http://www.webmproject.org/code/specs/container/#segment">Segment</a> header and before any further <a href="http://www.webmproject.org/code/specs/container/#ebml-basics">EBML Header</a> or <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> elements.</li>
  5.2604 -	<li>Any elements other than an <a href="http://www.webmproject.org/code/specs/container/#ebml-basics">EBML Header</a> or a <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> that occur before, in between, or after the <a href="http://www.webmproject.org/code/specs/container/#segment-information">Segment Information</a> and <a href="http://www.webmproject.org/code/specs/container/#track">Tracks</a> elements are ignored.</li>
  5.2605 -      </ol>
  5.2606 -
  5.2607 -      <h4 id="webm-media-segments">8.1.2. Media Segments</h4>
  5.2608 -      <p>A WebM <a href="#media-segment">media segment</a> is a single <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> element.</p>
  5.2609 -      <p>The following rules apply to WebM media segments:</p>
  5.2610 -      <ol>
  5.2611 -	<li>The Timecode element in the <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> contains a presentation timestamp in TimecodeScale units.</li>
  5.2612 -	<li>The TimecodeScale in the <a href="#webm-init-segment">WebM initialization segment</a> most recently appended applies to all timestamps in the <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a>
  5.2613 -</li>
  5.2614 -	<li>The Cluster header may contain an "unknown" size value. If it does then the end of the cluster is reached when another <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> header or an element header that indicates the start of an <a href="#webm-init-segment">WebM initialization segment</a> is encountered.</li>
  5.2615 -	<li>Block &amp; SimpleBlock elements must be in time increasing order consistent with the <a href="http://www.webmproject.org/code/specs/container/#webm-guidelines">WebM spec</a>.</li>
  5.2616 -	<li>If the most recent <a href="#webm-init-segment">WebM initialization segment</a> describes multiple tracks, then blocks from all the tracks must be interleaved in time increasing order. At least one block from all audio and video tracks must be present.</li>
  5.2617 -	<li>
  5.2618 -<a href="http://www.webmproject.org/code/specs/container/#cueing-data">Cues</a> or <a href="http://www.webmproject.org/code/specs/container/#chapters">Chapters</a> elements may follow a <a href="http://www.webmproject.org/code/specs/container/#cluster">Cluster</a> element. These elements must be accepted and ignored by the user agent.</li>
  5.2619 -      </ol>
  5.2620 -
  5.2621 -      <h4 id="webm-random-access-points">8.1.3. Random Access Points</h4>
  5.2622 -      <p>A SimpleBlock element with its Keyframe flag set signals the location of a <a href="#random-access-point">random access point</a> for that track. Media segments containing multiple tracks are only considered a random access point if the first SimpleBlock for each track has its Keyframe flag set. The order of the multiplexed blocks must conform to the <a href="http://www.webmproject.org/code/specs/container/#muxer-guidelines">WebM Muxer Guidelines</a>.</p>
  5.2623 -    </div>
  5.2624 -
  5.2625 -    <h3 id="iso">8.2 ISO Base Media File Format Byte Streams</h3>
  5.2626 -    <div class="nonnormative">
  5.2627 -      <p>This section defines segment formats for implementations that choose to support the ISO Base Media File Format
  5.2628 -	<a href="http://standards.iso.org/ittf/PubliclyAvailableStandards/c061988_ISO_IEC_14496-12_2012.zip">ISO/IEC 14496-12</a> (ISO BMFF).</p> 
  5.2629 -      <h4 id="iso-init-segments">8.2.1. Initialization Segments</h4>
  5.2630 -      <p>An ISO BMFF <a href="#init-segment">initialization segment</a> must contain a single Movie Header Box (<strong>moov</strong>). The tracks in the Movie Header Box must not contain any samples (i.e. the <strong><var>entry_count</var></strong> in the <strong>stts</strong>, <strong>stsc</strong> and <strong>stco</strong> boxes must be set to zero). A Movie Extends (<strong>mvex</strong>) box must be contained in the
  5.2631 -	Movie Header Box to indicate that Movie Fragments are to be expected.</p>
  5.2632 -      <p>The <a href="#init-segment">initialization segment</a> may contain Edit Boxes (<strong>edts</strong>) which provide a mapping of composition times for each track to the global presentation time.</p>
  5.2633 -      <h4 id="iso-media-segments">8.2.2. Media Segments</h4>
  5.2634 -      <p>An ISO BMFF <a href="#media-segment">media segment</a> must contain a single Movie Fragment Box (<strong>moof</strong>) followed by one or more Media Data Boxes (<strong>mdat</strong>).</p>
  5.2635 -      <p>The following rules apply to ISO BMFF media segments:</p>
  5.2636 -      <ol>
  5.2637 -	<li>The Movie Fragment Box must contain at least one Track Fragment Box (<strong>traf</strong>).</li>
  5.2638 -	<li>The Movie Fragment Box must use movie-fragment relative addressing and the flag <strong><var>default-base-is-moof</var></strong> must be set; absolute byte-offsets must not be used.</li>
  5.2639 -	<li>External data references must not be used.</li>
  5.2640 -	<li>If the Movie Fragment contains multiple tracks, the duration by which each track extends should be as close to equal as practical.</li>
  5.2641 -	<li>Each Track Fragment Box must contain a Track Fragment Decode Time Box (<strong>tfdt</strong>)</li>
  5.2642 -	<li>The first sample in each Track Fragment Run Box (<strong>trun</strong>) must indicate that the sample is a <a href="#random-access-point">random access point</a>.</li>
  5.2643 -	<li>The Media Data Boxes must contain all the samples referenced by the Track Fragment Run Boxes (<strong>trun</strong>) of the Movie Fragment Box.</li>
  5.2644 -      </ol>
  5.2645 -
  5.2646 -      <h4 id="iso-random-access-points">8.2.3. Random Access Points</h4>
  5.2647 -      <p>A <a href="#random-access-point">random access point</a> as defined in this specification corresponds to a Stream Access Point of type 1 or 2 as defined in Annex I of <a href="http://standards.iso.org/ittf/PubliclyAvailableStandards/c061988_ISO_IEC_14496-12_2012.zip">ISO/IEC 14496-12</a>.</p>
  5.2648 -    </div>
  5.2649 -
  5.2650 -    <h2 id="examples">9. Examples</h2>
  5.2651 -    <p>Example use of the Media Source Extensions</p>
  5.2652 -    <div class="block">
  5.2653 -      <div class="blockContent">
  5.2654 -        <pre class="code">
  5.2655 -&lt;script&gt;
  5.2656 +    <section id="examples">
  5.2657 +      <!--OddPage--><h2><span class="secno">9. </span>Examples</h2>
  5.2658 +      <p>Example use of the Media Source Extensions</p>
  5.2659 +      <div class="block">
  5.2660 +        <div class="blockContent">
  5.2661 +          <pre class="code">&lt;script&gt;
  5.2662    function onSourceOpen(videoTag, e) {
  5.2663      var mediaSource = e.target;
  5.2664      var sourceBuffer = mediaSource.addSourceBuffer('video/webm; codecs="vorbis,vp8"');
  5.2665 @@ -1184,10 +1584,10 @@
  5.2666      var mediaSegment = GetNextMediaSegment();
  5.2667  
  5.2668      if (!mediaSegment) {
  5.2669 -       // Error fetching the next media segment.
  5.2670 -       mediaSource.endOfStream("network");
  5.2671 -       return;
  5.2672 -    } 
  5.2673 +      // Error fetching the next media segment.
  5.2674 +      mediaSource.endOfStream("network");
  5.2675 +      return;
  5.2676 +    }
  5.2677  
  5.2678      mediaSource.sourceBuffers[0].append(mediaSegment);
  5.2679    }
  5.2680 @@ -1220,111 +1620,119 @@
  5.2681    mediaSource.addEventListener('sourceopen', onSourceOpen.bind(this, video));
  5.2682    video.src = window.URL.createObjectURL(mediaSource);
  5.2683  &lt;/script&gt;
  5.2684 -        </pre>
  5.2685 +          </pre>
  5.2686 +        </div>
  5.2687        </div>
  5.2688 -    </div>
  5.2689 +    </section>
  5.2690  
  5.2691 -    <h2 id="revision-history">10. Revision History</h2>
  5.2692 -    <table>
  5.2693 -      <thead>
  5.2694 -        <tr>
  5.2695 -          <th>Version</th>
  5.2696 -          <th>Comment</th>
  5.2697 -        </tr>
  5.2698 -      </thead>
  5.2699 -      <tbody>
  5.2700 -	<tr>
  5.2701 -	  <td>18 October 2012</td>
  5.2702 -          <td>Refactored SourceBuffer.append() &amp; added SourceBuffer.remove().</td>
  5.2703 -        </tr>
  5.2704 -	<tr>
  5.2705 -	  <td><a href="http://dvcs.w3.org/hg/html-media/rev/6d127e69c9f8">8 October 2012</a></td>
  5.2706 -          <td>
  5.2707 -	    <ul>
  5.2708 -	      <li>Defined what HTMLMediaElement.seekable and HTMLMediaElement.buffered should return.</li>
  5.2709 -	      <li>Updated seeking algorithm to run inside Step 10 of the HTMLMediaElement seeking algorithm.</li>
  5.2710 -	      <li>Removed transition from "ended" to "open" in the seeking algorithm.</li>
  5.2711 -	      <li>Clarified all the event targets.</li>
  5.2712 -	    </ul>
  5.2713 -	  </td>
  5.2714 -        </tr>
  5.2715 -	<tr>
  5.2716 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/7bab66368f2c/media-source/media-source.html">1 October 2012</a></td>
  5.2717 -          <td>Fixed various addsourcebuffer &amp; removesourcebuffer bugs and allow append() in ended state.</td>
  5.2718 -        </tr>
  5.2719 -        <tr>
  5.2720 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/349559debcc3/media-source/media-source.html">13 September 2012</a></td>
  5.2721 -          <td>Updated endOfStream() behavior to change based on the value of HTMLMediaElement.readyState.</td>
  5.2722 -        </tr>
  5.2723 -        <tr>
  5.2724 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/ca093bbbbefb/media-source/media-source.html">24 August 2012</a></td>
  5.2725 -          <td>
  5.2726 -	    <ul>
  5.2727 -	      <li>Added early abort on to duration change algorithm.</li>
  5.2728 -	      <li>Added createObjectURL() IDL &amp; algorithm.</li>
  5.2729 -              <li>Added Track ID &amp; Track description definitions.</li>
  5.2730 -              <li>Rewrote start overlap for audio frames text.</li>
  5.2731 -              <li>Removed rendering silence requirement from section 2.5.</li>
  5.2732 -	    </ul>
  5.2733 -	  </td>
  5.2734 -        </tr>
  5.2735 -	<tr>
  5.2736 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/340786fcae83/media-source/media-source.html">22 August 2012</a></td>
  5.2737 -          <td>
  5.2738 -	    <ul>
  5.2739 -	      <li>Clarified WebM byte stream requirements.</li>
  5.2740 -	      <li>Clarified SourceBuffer.buffered return value.</li>
  5.2741 -	      <li>Clarified addsourcebuffer &amp; removesourcebuffer event targets.</li>
  5.2742 -	      <li>Clarified when media source attaches to the HTMLMediaElement.</li>
  5.2743 -	      <li>Introduced duration change algorithm and update relevant algorithms to use it.</li>
  5.2744 -	    </ul>
  5.2745 -	  </td>
  5.2746 -        </tr>
  5.2747 -        <tr>
  5.2748 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/032f7b8681d1/media-source/media-source.html">17 August 2012</a></td>
  5.2749 -          <td>Minor editorial fixes.</td>
  5.2750 -        </tr>
  5.2751 -        <tr>
  5.2752 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/29687c019735/media-source/media-source.html">09 August 2012</a></td>
  5.2753 -          <td>Change presentation start time to always be 0 instead of using format specific rules about the first media segment appended.</td>
  5.2754 -        </tr>
  5.2755 -	<tr>
  5.2756 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/087ea42f59c8/media-source/media-source.html">30 July 2012</a></td>
  5.2757 -          <td>Added SourceBuffer.timestampOffset and MediaSource.duration.</td>
  5.2758 -        </tr>
  5.2759 -        <tr>
  5.2760 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/ab36e8e882c6/media-source/media-source.html">17 July 2012</a></td>
  5.2761 -          <td>Replaced SourceBufferList.remove() with MediaSource.removeSourceBuffer().</td>
  5.2762 -        </tr>
  5.2763 -	<tr>
  5.2764 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/b499a199e427/media-source/media-source.html">02 July 2012</a></td>
  5.2765 -          <td>Converted to the object-oriented API</td>
  5.2766 -        </tr>
  5.2767 -	<tr>
  5.2768 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/9bbfe09653e4/media-source/media-source.html">26 June 2012</a></td>
  5.2769 -          <td>Converted to Editor's draft.</td>
  5.2770 -        </tr>
  5.2771 -	<tr>
  5.2772 -	  <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/e433598d22a7/media-source/media-source.html">0.5</a></td>
  5.2773 -          <td>Minor updates before proposing to W3C HTML-WG.</td>
  5.2774 -        </tr>
  5.2775 -        <tr>
  5.2776 -          <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.4/draft-spec/mediasource-draft-spec.html">0.4</a></td>
  5.2777 -          <td>Major revision. Adding source IDs, defining buffer model, and clarifying byte stream formats.</td>
  5.2778 -        </tr>
  5.2779 -	<tr>
  5.2780 -          <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.3/draft-spec/mediasource-draft-spec.html">0.3</a></td>
  5.2781 -          <td>Minor text updates.</td>
  5.2782 -        </tr>
  5.2783 -        <tr>
  5.2784 -          <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.2/draft-spec/mediasource-draft-spec.html">0.2</a></td>
  5.2785 -          <td>Updates to reflect initial WebKit implementation.</td>
  5.2786 -        </tr>
  5.2787 -        <tr>
  5.2788 -          <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.1/draft-spec/mediasource-draft-spec.html">0.1</a></td>
  5.2789 -          <td>Initial Proposal</td>
  5.2790 -        </tr>
  5.2791 -      </tbody>
  5.2792 -    </table>
  5.2793 -  </body>
  5.2794 -</html>
  5.2795 +    <section id="revision-history">
  5.2796 +      <!--OddPage--><h2><span class="secno">10. </span>Revision History</h2>
  5.2797 +      <table class="old-table">
  5.2798 +        <thead>
  5.2799 +          <tr>
  5.2800 +            <th>Version</th>
  5.2801 +            <th>Comment</th>
  5.2802 +          </tr>
  5.2803 +        </thead>
  5.2804 +        <tbody>
  5.2805 +          <tr>
  5.2806 +	    <td>09 November 2012</td>
  5.2807 +            <td>Converted document to ReSpec.</td>
  5.2808 +          </tr>
  5.2809 +	  <tr>
  5.2810 +	    <td><a href="http://dvcs.w3.org/hg/html-media/rev/e029f71aafca">18 October 2012</a></td>
  5.2811 +            <td>Refactored SourceBuffer.append() &amp; added SourceBuffer.remove().</td>
  5.2812 +          </tr>
  5.2813 +	  <tr>
  5.2814 +	    <td><a href="http://dvcs.w3.org/hg/html-media/rev/6d127e69c9f8">8 October 2012</a></td>
  5.2815 +            <td>
  5.2816 +	      <ul>
  5.2817 +	        <li>Defined what HTMLMediaElement.seekable and HTMLMediaElement.buffered should return.</li>
  5.2818 +	        <li>Updated seeking algorithm to run inside Step 10 of the HTMLMediaElement seeking algorithm.</li>
  5.2819 +	        <li>Removed transition from "ended" to "open" in the seeking algorithm.</li>
  5.2820 +	        <li>Clarified all the event targets.</li>
  5.2821 +	      </ul>
  5.2822 +	    </td>
  5.2823 +          </tr>
  5.2824 +	  <tr>
  5.2825 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/7bab66368f2c/media-source/media-source.html">1 October 2012</a></td>
  5.2826 +            <td>Fixed various addsourcebuffer &amp; removesourcebuffer bugs and allow append() in ended state.</td>
  5.2827 +          </tr>
  5.2828 +          <tr>
  5.2829 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/349559debcc3/media-source/media-source.html">13 September 2012</a></td>
  5.2830 +            <td>Updated endOfStream() behavior to change based on the value of HTMLMediaElement.readyState.</td>
  5.2831 +          </tr>
  5.2832 +          <tr>
  5.2833 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/ca093bbbbefb/media-source/media-source.html">24 August 2012</a></td>
  5.2834 +            <td>
  5.2835 +	      <ul>
  5.2836 +	        <li>Added early abort on to duration change algorithm.</li>
  5.2837 +	        <li>Added createObjectURL() IDL &amp; algorithm.</li>
  5.2838 +                <li>Added Track ID &amp; Track description definitions.</li>
  5.2839 +                <li>Rewrote start overlap for audio frames text.</li>
  5.2840 +                <li>Removed rendering silence requirement from section 2.5.</li>
  5.2841 +	      </ul>
  5.2842 +	    </td>
  5.2843 +          </tr>
  5.2844 +	  <tr>
  5.2845 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/340786fcae83/media-source/media-source.html">22 August 2012</a></td>
  5.2846 +            <td>
  5.2847 +	      <ul>
  5.2848 +	        <li>Clarified WebM byte stream requirements.</li>
  5.2849 +	        <li>Clarified SourceBuffer.buffered return value.</li>
  5.2850 +	        <li>Clarified addsourcebuffer &amp; removesourcebuffer event targets.</li>
  5.2851 +	        <li>Clarified when media source attaches to the HTMLMediaElement.</li>
  5.2852 +	        <li>Introduced duration change algorithm and update relevant algorithms to use it.</li>
  5.2853 +	      </ul>
  5.2854 +	    </td>
  5.2855 +          </tr>
  5.2856 +          <tr>
  5.2857 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/032f7b8681d1/media-source/media-source.html">17 August 2012</a></td>
  5.2858 +            <td>Minor editorial fixes.</td>
  5.2859 +          </tr>
  5.2860 +          <tr>
  5.2861 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/29687c019735/media-source/media-source.html">09 August 2012</a></td>
  5.2862 +            <td>Change presentation start time to always be 0 instead of using format specific rules about the first media segment appended.</td>
  5.2863 +          </tr>
  5.2864 +	  <tr>
  5.2865 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/087ea42f59c8/media-source/media-source.html">30 July 2012</a></td>
  5.2866 +            <td>Added SourceBuffer.timestampOffset and MediaSource.duration.</td>
  5.2867 +          </tr>
  5.2868 +          <tr>
  5.2869 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/ab36e8e882c6/media-source/media-source.html">17 July 2012</a></td>
  5.2870 +            <td>Replaced SourceBufferList.remove() with MediaSource.removeSourceBuffer().</td>
  5.2871 +          </tr>
  5.2872 +	  <tr>
  5.2873 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/b499a199e427/media-source/media-source.html">02 July 2012</a></td>
  5.2874 +            <td>Converted to the object-oriented API</td>
  5.2875 +          </tr>
  5.2876 +	  <tr>
  5.2877 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/9bbfe09653e4/media-source/media-source.html">26 June 2012</a></td>
  5.2878 +            <td>Converted to Editor's draft.</td>
  5.2879 +          </tr>
  5.2880 +	  <tr>
  5.2881 +	    <td><a href="http://dvcs.w3.org/hg/html-media/raw-file/e433598d22a7/media-source/media-source.html">0.5</a></td>
  5.2882 +            <td>Minor updates before proposing to <abbr title="World Wide Web Consortium">W3C</abbr> HTML-WG.</td>
  5.2883 +          </tr>
  5.2884 +          <tr>
  5.2885 +            <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.4/draft-spec/mediasource-draft-spec.html">0.4</a></td>
  5.2886 +            <td>Major revision. Adding source IDs, defining buffer model, and clarifying byte stream formats.</td>
  5.2887 +          </tr>
  5.2888 +	  <tr>
  5.2889 +            <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.3/draft-spec/mediasource-draft-spec.html">0.3</a></td>
  5.2890 +            <td>Minor text updates.</td>
  5.2891 +          </tr>
  5.2892 +          <tr>
  5.2893 +            <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.2/draft-spec/mediasource-draft-spec.html">0.2</a></td>
  5.2894 +            <td>Updates to reflect initial WebKit implementation.</td>
  5.2895 +          </tr>
  5.2896 +          <tr>
  5.2897 +            <td><a href="http://html5-mediasource-api.googlecode.com/svn/tags/0.1/draft-spec/mediasource-draft-spec.html">0.1</a></td>
  5.2898 +            <td>Initial Proposal</td>
  5.2899 +          </tr>
  5.2900 +        </tbody>
  5.2901 +      </table>
  5.2902 +    </section>
  5.2903 +  
  5.2904 +
  5.2905 +</body></html>
     6.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     6.2 +++ b/media-source/media-source.js	Thu Nov 08 17:13:35 2012 -0800
     6.3 @@ -0,0 +1,244 @@
     6.4 +(function() {
     6.5 +  function eventdfn_helper(doc, df, id, text) {
     6.6 +    df.appendChild($("<dfn/>").attr({id: 'dom-evt-' + text.toLowerCase()}).wrapInner($("<code/>").text(text))[0]);
     6.7 +  }
     6.8 +
     6.9 +  function idlref_helper(doc, df, id, text) {
    6.10 +    df.appendChild($("<code/>").wrapInner($("<a/>").attr({href: "#" + id}).text(text))[0]);
    6.11 +  }
    6.12 +
    6.13 +  function eventref_helper(doc, df, id, text) {
    6.14 +    df.appendChild($("<code/>").wrapInner($("<a/>").attr({href: "#dom-evt-" + id}).text(text))[0]);
    6.15 +  }
    6.16 +
    6.17 +  function videoref_helper(doc, df, id, text) {
    6.18 +    link_helper(doc, df, 'http://dev.w3.org/html5/spec/media-elements.html#' + id, text);
    6.19 +  }
    6.20 +
    6.21 +  function code_videoref_helper(doc, df, id, text) {
    6.22 +    df.appendChild($("<code/>").wrapInner($("<a/>").attr({href: "http://dev.w3.org/html5/spec/media-elements.html#" + id}).text(text))[0]);
    6.23 +  }
    6.24 +
    6.25 +  function fileapi_helper(doc, df, id, text) {
    6.26 +    link_helper(doc, df, 'http://www.w3.org/TR/FileAPI/#' + id, text);
    6.27 +  }
    6.28 +
    6.29 +  function webappapis_helper(doc, df, id, text) {
    6.30 +    link_helper(doc, df, 'http://dev.w3.org/html5/spec/webappapis.html#' + id, text);
    6.31 +  }
    6.32 +
    6.33 +  function term_helper(doc, df, id, text) {
    6.34 +    link_helper(doc, df, '#'+ id, text);
    6.35 +  }
    6.36 +
    6.37 +  function link_helper(doc, df, id, text) {
    6.38 +    df.appendChild($("<a/>").attr({href: id}).text(text)[0]);
    6.39 +  }
    6.40 +
    6.41 +  function exception_helper(doc, df, id, text) {
    6.42 +    df.appendChild($("<code/>").wrapInner($("<a/>").attr({href: 'http://dom.spec.whatwg.org/#dom-domexception-' + id}).text(text))[0]);
    6.43 +  }
    6.44 +
    6.45 +  function webmref_helper(doc, df, id, text) {
    6.46 +    link_helper(doc, df, 'http://www.webmproject.org/code/specs/container/#' + id, text);
    6.47 +  }
    6.48 +
    6.49 +  function queue_and_fire_helper(doc, df, id, text) {
    6.50 +    webappapis_helper(doc, df, 'queue-a-task', text);
    6.51 +    df.appendChild(doc.createTextNode(' to '));
    6.52 +    webappapis_helper(doc, df, 'fire-a-simple-event', 'fire a simple event');
    6.53 +    df.appendChild(doc.createTextNode(' named'));
    6.54 +  }
    6.55 +
    6.56 +  function fragment_helper(doc, df, id, text) {
    6.57 +    var f = doc.createDocumentFragment()
    6.58 +    f.innerHTML = text;
    6.59 +    df.appendChild(f);
    6.60 +  }
    6.61 +
    6.62 +  var rep = {
    6.63 +    'sourceBuffers': { func: idlref_helper, fragment: 'widl-MediaSource-sourceBuffers', link_text: 'sourceBuffers',  },
    6.64 +    'activeSourceBuffers': { func: idlref_helper, fragment: 'widl-MediaSource-activeSourceBuffers', link_text: 'activeSourceBuffers',  },
    6.65 +    'addSourceBuffer': { func: idlref_helper, fragment: 'widl-MediaSource-addSourceBuffer-SourceBuffer-DOMString-type', link_text: 'addSourceBuffer()',  },
    6.66 +    'removeSourceBuffer': { func: idlref_helper, fragment: 'widl-MediaSource-removeSourceBuffer-void-SourceBuffer-sourceBuffer', link_text: 'removeSourceBuffer()',  },
    6.67 +    'endOfStream': { func: idlref_helper, fragment: 'widl-MediaSource-endOfStream-void-EndOfStreamError-error', link_text: 'endOfStream()',  },
    6.68 +    'eos-decode': { func: idlref_helper, fragment: 'widl-MediaSource-endOfStream-void-EndOfStreamError-error', link_text: 'endOfStream("decode")',  },
    6.69 +    'readyState': { func: idlref_helper, fragment: 'widl-MediaSource-readyState', link_text: 'readyState',  },
    6.70 +    'duration': { func: idlref_helper, fragment: 'widl-MediaSource-duration', link_text: 'duration',  },
    6.71 +    'append': { func: idlref_helper, fragment: 'widl-SourceBuffer-append-void-Uint8Array-data', link_text: 'append()',  },
    6.72 +    'abort': { func: idlref_helper, fragment: 'widl-SourceBuffer-abort-void', link_text: 'abort()',  },
    6.73 +    'buffered': { func: idlref_helper, fragment: 'widl-SourceBuffer-buffered', link_text: 'buffered',  },
    6.74 +    'timestampOffset': { func: idlref_helper, fragment: 'widl-SourceBuffer-timestampOffset', link_text: 'timestampOffset',  },
    6.75 +    'length': { func: idlref_helper, fragment: 'widl-SourceBufferList-length', link_text: 'length',  },
    6.76 +    'createObjectURL': { func: idlref_helper, fragment: 'widl-URL-createObjectURL-DOMString-MediaSource-mediaSource', link_text: 'createObjectURL()',  },
    6.77 +    'open': { func: idlref_helper, fragment: 'idl-def-ReadyState', link_text: '"open"',  },
    6.78 +    'closed': { func: idlref_helper, fragment: 'idl-def-ReadyState', link_text: '"closed"',  },
    6.79 +    'ended': { func: idlref_helper, fragment: 'idl-def-ReadyState', link_text: '"ended"',  },
    6.80 +    'network': { func: idlref_helper, fragment: 'idl-def-EndOfStreamError', link_text: '"network"',  },
    6.81 +    'decode': { func: idlref_helper, fragment: 'idl-def-EndOfStreamError', link_text: '"decode"',  },
    6.82 +
    6.83 +    'sourceopen': { func: eventref_helper, fragment: 'sourceopen', link_text: 'sourceopen',  },
    6.84 +    'sourceended': { func: eventref_helper, fragment: 'sourceended', link_text: 'sourceended',  },
    6.85 +    'sourceclose': { func: eventref_helper, fragment: 'sourceclose', link_text: 'sourceclose',  },
    6.86 +    'addsourcebuffer': { func: eventref_helper, fragment: 'addsourcebuffer', link_text: 'addsourcebuffer',  },
    6.87 +    'removesourcebuffer': { func: eventref_helper, fragment: 'removesourcebuffer', link_text: 'removesourcebuffer',  },
    6.88 +
    6.89 +    'active-source-buffers': { func: term_helper, fragment: 'active-source-buffers', link_text: 'active source buffers', },
    6.90 +    'source-buffers': { func: term_helper, fragment: 'source-buffer', link_text: 'source buffers', },
    6.91 +    'source-buffer': { func: term_helper, fragment: 'source-buffer', link_text: 'source buffer', },
    6.92 +    'source-buffers': { func: term_helper, fragment: 'source-buffer', link_text: 'source buffers', },
    6.93 +    'track-buffer': { func: term_helper, fragment: 'track-buffer', link_text: 'track buffer', },
    6.94 +    'track-buffers': { func: term_helper, fragment: 'track-buffer', link_text: 'track buffers', },
    6.95 +    'init-segment': { func: term_helper, fragment: 'init-segment', link_text: 'initialization segment', },
    6.96 +    'init-segments': { func: term_helper, fragment: 'init-segment', link_text: 'initialization segments', },
    6.97 +    'media-segment': { func: term_helper, fragment: 'media-segment', link_text: 'media segment', },
    6.98 +    'media-segments': { func: term_helper, fragment: 'media-segment', link_text: 'media segments', },
    6.99 +    'presentation-start-time': { func: term_helper, fragment: 'presentation-start-time', link_text: 'presentation start time', },
   6.100 +    'random-access-point': { func: term_helper, fragment: 'random-access-point', link_text: 'random access point', },
   6.101 +    'random-access-points': { func: term_helper, fragment: 'random-access-point', link_text: 'random access points', },
   6.102 +    'track-id': { func: term_helper, fragment: 'track-id', link_text: 'Track ID', },
   6.103 +    'track-ids': { func: term_helper, fragment: 'track-id', link_text: 'Track IDs', },
   6.104 +    'track-description': { func: term_helper, fragment: 'track-description', link_text: 'track description', },
   6.105 +    'coded-frame': { func: term_helper, fragment: 'coded-frame', link_text: 'coded frame', },
   6.106 +    'coded-frames': { func: term_helper, fragment: 'coded-frame', link_text: 'coded frames', },
   6.107 +    'parent-media-source': { func: term_helper, fragment: 'parent-media-source', link_text: 'parent media source', },
   6.108 +
   6.109 +    'duration-change-algorithm': { func: link_helper, fragment: '#duration-change-algorithm', link_text: 'duration change algorithm', },
   6.110 +    'segment-parser-loop': { func: link_helper, fragment: '#sourcebuffer-segment-parser-loop', link_text: 'segment parser loop', },
   6.111 +    'append-state': { func: link_helper, fragment: '#sourcebuffer-append-state', link_text: 'append state', },
   6.112 +    'waiting-for-segment': { func: link_helper, fragment: '#sourcebuffer-waiting-for-segment', link_text: 'WAITING_FOR_SEGMENT', },
   6.113 +    'parsing-init-segment': { func: link_helper, fragment: '#sourcebuffer-parsing-init-segment', link_text: 'PARSING_INIT_SEGMENT', },
   6.114 +    'parsing-media-segment': { func: link_helper, fragment: '#sourcebuffer-parsing-media-segment', link_text: 'PARSING_MEDIA_SEGMENT', },
   6.115 +    'byte-stream-format-specs': { func: link_helper, fragment: '#byte-stream-formats', link_text: 'byte stream format specifications', },
   6.116 +    'init-segment-received-algorithm': { func: link_helper, fragment: '#sourcebuffer-init-segment-received', link_text: 'initialization segment received algorithm', },
   6.117 +    'coded-frame-processing-algorithm': { func: link_helper, fragment: '#sourcebuffer-coded-frame-processing', link_text: 'coded frame processing algorithm', },
   6.118 +    'input-buffer': { func: link_helper, fragment: '#sourcebuffer-input-buffer', link_text: 'input buffer', },
   6.119 +    'MediaSource-object-URL': { func: link_helper, fragment: '#mediasource-object-url', link_text: 'MediaSource object URL', },
   6.120 +
   6.121 +    'FileAPI': { func: fileapi_helper, fragment: '', link_text: 'File API',  },
   6.122 +    'blob-uri': { func: fileapi_helper, fragment: 'url', link_text: 'Blob URI',  },
   6.123 +    'File': { func: fileapi_helper, fragment: 'dfn-file', link_text: 'File',  },
   6.124 +    'Blob': { func: fileapi_helper, fragment: 'dfn-blob', link_text: 'Blob',  },
   6.125 +    'file-createObjectURL': { func: fileapi_helper, fragment: 'dfn-createObjectURL', link_text: 'createObjectURL()',  },
   6.126 +    'file-revokeObjectURL': { func: fileapi_helper, fragment: 'dfn-revokeObjectURL', link_text: 'revokeObjectURL()',  },
   6.127 +
   6.128 +    'eventdfn': { func: eventdfn_helper, fragment: '', link_text: '', },
   6.129 +
   6.130 +    'videoref': { func: videoref_helper, fragment: '', link_text: '', },
   6.131 +    'resource-fetch-algorithm': { func: videoref_helper, fragment: 'concept-media-load-resource', link_text: 'resource fetch algorithm',  },
   6.132 +    'intrinsic-width-and-height': { func: videoref_helper, fragment: 'concept-video-intrinsic-width', link_text: 'intrinsic width and height',  },
   6.133 +    'normalized-timeranges-object': { func: videoref_helper, fragment: 'normalized-timeranges-object', link_text: 'normalized TimeRanges object',  },
   6.134 +    'media-data-is-corrupted': { func: videoref_helper, fragment: 'fatal-decode-error', link_text: 'media data is corrupted',  },
   6.135 +    'media-err-decode': { func: code_videoref_helper, fragment: 'dom-mediaerror-media_err_decode', link_text: 'MediaError.MEDIA_ERR_DECODE',  },
   6.136 +    'media-src': { func: code_videoref_helper, fragment: 'attr-media-src', link_text: 'src',  },
   6.137 +    'timerange': { func: code_videoref_helper, fragment: 'timeranges', link_text: 'TimeRange',  },
   6.138 +    'timeranges': { func: code_videoref_helper, fragment: 'timeranges', link_text: 'TimeRanges',  },
   6.139 +    'video-track': { func: code_videoref_helper, fragment: 'videotrack', link_text: 'VideoTrack',  },
   6.140 +    'videotracks': { func: code_videoref_helper, fragment: 'dom-media-videotracks', link_text: 'videoTracks',  },
   6.141 +    'audio-track': { func: code_videoref_helper, fragment: 'audiotrack', link_text: 'AudioTrack',  },
   6.142 +    'audio-tracks': { func: code_videoref_helper, fragment: 'audiotrack', link_text: 'AudioTracks',  },
   6.143 +    'audiotracks': { func: code_videoref_helper, fragment: 'dom-media-audiotracks', link_text: 'audioTracks',  },
   6.144 +    'text-track': { func: code_videoref_helper, fragment: 'texttrack', link_text: 'TextTrack',  },
   6.145 +    'texttracks': { func: code_videoref_helper, fragment: 'dom-media-texttracks', link_text: 'textTracks',  },
   6.146 +    'ready-state': { func: code_videoref_helper, fragment: 'dom-media-readystate', link_text: 'HTMLMediaElement.readyState',  },
   6.147 +    'have-nothing': { func: code_videoref_helper, fragment: 'dom-media-have_nothing', link_text: 'HAVE_NOTHING',  },
   6.148 +    'have-metadata': { func: code_videoref_helper, fragment: 'dom-media-have_metadata', link_text: 'HAVE_METADATA',  },
   6.149 +    'have-current-data': { func: code_videoref_helper, fragment: 'dom-media-have_current_data', link_text: 'HAVE_CURRENT_DATA',  },
   6.150 +    'have-future-data': { func: code_videoref_helper, fragment: 'dom-media-have_future_data', link_text: 'HAVE_FUTURE_DATA',  },
   6.151 +    'have-enough-data': { func: code_videoref_helper, fragment: 'dom-media-have_enough_data', link_text: 'HAVE_ENOUGH_DATA',  },
   6.152 +    'loadedmetadata': { func: code_videoref_helper, fragment: 'event-media-loadedmetadata', link_text: 'loadedmetadata',  },
   6.153 +    'loadeddata': { func: code_videoref_helper, fragment: 'event-media-loadeddata', link_text: 'loadeddata',  },
   6.154 +    'canplay': { func: code_videoref_helper, fragment: 'event-media-canplay', link_text: 'canplay',  },
   6.155 +    'canplaythrough': { func: code_videoref_helper, fragment: 'event-media-canplaythrough', link_text: 'canplaythrough',  },
   6.156 +    'hme-duration': { func: code_videoref_helper, fragment: 'media-controller-duration', link_text: 'media controller duration',  },
   6.157 +    'hme-buffered': { func: code_videoref_helper, fragment: 'dom-media-buffered', link_text: 'HTMLMediaElement.buffered',  },
   6.158 +    'hme-seek-algorithm': { func: videoref_helper, fragment: 'dom-media-seek', link_text: 'seek algorithm',  },
   6.159 +    'hme-duration-change-algorithm': { func: videoref_helper, fragment: 'durationChange', link_text: 'HTMLMediaElement duration change algorithm',  },
   6.160 +
   6.161 +    'invalid-access-err': { func: exception_helper, fragment: 'invalid_access_err', link_text: 'INVALID_ACCESS_ERR',  },
   6.162 +    'invalid-state-err': { func: exception_helper, fragment: 'invalid_state_err', link_text: 'INVALID_STATE_ERR',  },
   6.163 +    'not-found-err': { func: exception_helper, fragment: 'not_found_err', link_text: 'NOT_FOUND_ERR',  },
   6.164 +    'not-supported-err': { func: exception_helper, fragment: 'not_supported_err', link_text: 'NOT_SUPPORTED_ERR',  },
   6.165 +    'quota-exceeded-err': { func: exception_helper, fragment: 'quota_exceeded_err', link_text: 'QUOTA_EXCEEDED_ERR',  },
   6.166 +
   6.167 +    'queue-a-task-to-fire-an-event-named': { func: queue_and_fire_helper, fragment: '', link_text: 'queue a task',  },
   6.168 +    'Queue-a-task-to-fire-an-event-named': { func: queue_and_fire_helper, fragment: '', link_text: 'Queue a task',  },
   6.169 +    'provide-a-stable-state': { func: webappapis_helper, fragment: 'provide-a-stable-state', link_text: 'provide a stable state',  },
   6.170 +
   6.171 +    'webm-spec': { func: webmref_helper, fragment: 'webm-guidelines', link_text: 'WebM spec',  },
   6.172 +    'webm-ebml-header': { func: webmref_helper, fragment: 'ebml-basics', link_text: 'EBML Header',  },
   6.173 +    'webm-segment': { func: webmref_helper, fragment: 'segment', link_text: 'Segment',  },
   6.174 +    'webm-info': { func: webmref_helper, fragment: 'segment-information', link_text: 'Segment Information',  },
   6.175 +    'webm-tracks': { func: webmref_helper, fragment: 'track', link_text: 'Tracks',  },
   6.176 +    'webm-cues': { func: webmref_helper, fragment: 'cueing-data', link_text: 'Cues',  },
   6.177 +    'webm-chapters': { func: webmref_helper, fragment: 'chapters', link_text: 'Chapters',  },
   6.178 +    'webm-cluster': { func: webmref_helper, fragment: 'cluster', link_text: 'Cluster',  },
   6.179 +    'webm-muxer-guidelines': { func: webmref_helper, fragment: 'muxer-guidelines', link_text: 'WebM Muxer Guidelines',  },
   6.180 +    'webm-init-segment': { func: link_helper, fragment: '#webm-init-segments', link_text: 'WebM initialization segment', },
   6.181 +
   6.182 +    'iso-14496-12': { func: link_helper, fragment: 'http://standards.iso.org/ittf/PubliclyAvailableStandards/c061988_ISO_IEC_14496-12_2012.zip', link_text: 'ISO/IEC 14496-12', },
   6.183 +
   6.184 +    'media-data-cannot-be-fetched': { func: fragment_helper, fragment: '', link_text: '&quot;<i>If the media data cannot be fetched at all, due to network errors, causing the user agent to give up trying to fetch the resource</i>&quot;', },
   6.185 +  };
   6.186 +
   6.187 +  function mediaSourcePostProcessor() {
   6.188 +    var doc = document;
   6.189 +    doc.normalize();
   6.190 +
   6.191 +    var usedMap = {};
   6.192 +
   6.193 +    $("a[def-id]").each(function () {
   6.194 +      var $ant = $(this);
   6.195 +      var def_id = $ant.attr('def-id');
   6.196 +      var info = rep[def_id];
   6.197 +      if (info) {
   6.198 +	if (!usedMap[def_id]) {
   6.199 +	  usedMap[def_id] = 1;
   6.200 +	} else {
   6.201 +	  usedMap[def_id]++;
   6.202 +	}
   6.203 +
   6.204 +	var id = info.fragment;
   6.205 +	var text = info.link_text;
   6.206 +
   6.207 +	if ($ant.attr('name')) {
   6.208 +	  id = $ant.attr('name');
   6.209 +	}
   6.210 +
   6.211 +	var element_text = this.innerHTML;
   6.212 +	if (element_text) {
   6.213 +	  text = element_text;
   6.214 +	}
   6.215 +
   6.216 +	var df = doc.createDocumentFragment();
   6.217 +        info.func(doc, df, id, text);
   6.218 +	this.parentNode.replaceChild(df, this);
   6.219 +
   6.220 +      } else {
   6.221 +        console.log("Found def-id '" + def_id + "' but it does not correspond to anything");
   6.222 +      }
   6.223 +    });
   6.224 +
   6.225 +    // Validate that all defined def-ids are actually used.
   6.226 +    for (var k in rep) {
   6.227 +      if (!usedMap[k]) {
   6.228 +	console.log("def-id '" + k + "' never used.");
   6.229 +      }
   6.230 +    }
   6.231 +
   6.232 +    $("a[href]").each(function () {
   6.233 +      var link = $(this);
   6.234 +      var href = link.attr('href');
   6.235 +      var matched = /^#(.+)$/.exec(href);
   6.236 +      if (matched) {
   6.237 +	if (!document.querySelector(href)) {
   6.238 +	  console.log("Internal link to an id '" + matched[1] + "' which does not exist");
   6.239 +	}
   6.240 +      }
   6.241 +    });
   6.242 +
   6.243 +    return;
   6.244 +  }
   6.245 +
   6.246 +  window.mediaSourcePostProcessor = mediaSourcePostProcessor;
   6.247 +})();
   6.248 \ No newline at end of file
     7.1 --- a/media-source/media-source.xml	Wed Oct 31 17:47:58 2012 +0100
     7.2 +++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
     7.3 @@ -1,1241 +0,0 @@
     7.4 -<!DOCTYPE HTML>
     7.5 -<html>
     7.6 -  <head>
     7.7 -    <title>Media Source Extensions</title>
     7.8 -    <link rel="stylesheet" href="video-working-draft.css" />
     7.9 -    <link rel="stylesheet" href="main.css" />
    7.10 -    <link type="text/css" rel="stylesheet" href="http://www.w3.org/StyleSheets/TR/w3c-ed.css" />
    7.11 -    <style type="text/css">
    7.12 -          <!-- For discussion of open issues. -->
    7.13 -          .issue {
    7.14 -          padding:    1em;
    7.15 -          margin: 1em 0em 0em;
    7.16 -          border: 1px solid #f00;
    7.17 -          background: #fcc;
    7.18 -          }
    7.19 -          .issue::before {
    7.20 -          content:    "Issue";
    7.21 -          display:    block;
    7.22 -          width:  150px;
    7.23 -          margin: -1.5em 0 0.5em 0;
    7.24 -          font-weight:    bold;
    7.25 -          border: 1px solid #f00;
    7.26 -          background: #fff;
    7.27 -          padding:    3px 1em;
    7.28 -          }
    7.29 -
    7.30 -	  div.nonnormative { color: green; margin: 2em 0 2em 0em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
    7.31 -	  .nonnormative:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This section is non-normative.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
    7.32 -
    7.33 -	  <!-- Copied from video-working-draft.css .domintro -->
    7.34 -	  .example { color: green; margin: 2em 0 2em 2em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
    7.35 -	  hr + dl.example, div.impl + dl.domintro { margin-top: 2.5em; margin-bottom: 1.5em; }
    7.36 -	  dl.example dt, dl.domintro dt * { color: black; text-decoration: none; }
    7.37 -	  dl.example dd { margin: 0.5em 0 1em 2em; padding: 0; }
    7.38 -	  dl.example dd p { margin: 0.5em 0; }
    7.39 -
    7.40 -	  .example:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This box is non-normative. Implementation requirements are given below this box.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
    7.41 -    </style>
    7.42 -  </head>
    7.43 -  <body>
    7.44 -    <div class="head">
    7.45 -      <p><a href="http://www.w3.org/"><img src="http://www.w3.org/Icons/w3c_home" alt="W3C" width="72" height="48" /></a></p>
    7.46 -      <h1>Media Source Extensions</h1>
    7.47 -      <h2>W3C Editor's Draft 18 October 2012</h2>
    7.48 -      <dl>
    7.49 -	<dt>Latest published version:</dt>
    7.50 -	<dd>Not yet published</dd>
    7.51 -	<dt>Latest editor's draft:</dt>
    7.52 -	<dd><a href="http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html">http://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html</a></dd>
    7.53 -	<dt>Editors:</dt>
    7.54 -	<dd>Aaron Colwell, Google, Inc.</dd>
    7.55 -	<dd>Adrian Bateman, Microsoft Corporation</dd>
    7.56 -	<dd>Mark Watson, Netflix, Inc.</dd>
    7.57 -	<dt>Bug/Issue lists:</dt>
    7.58 -	<dd><a href='http://w3.org/brief/Mjcw'>Bugzilla</a>, <a href='http://www.w3.org/html/wg/tracker/products/20'>Tracker</a></dd>
    7.59 -	<dt>Discussion list:</dt>
    7.60 -	<dd><a href='http://lists.w3.org/Archives/Public/public-html-media/'>public-html-media@w3.org</a></dd>
    7.61 -	<dt>Test Suite:</dt>
    7.62 -	<dd>None yet</dd>
    7.63 -
    7.64 -      </dl>
    7.65 -    </div>
    7.66 -    <p class="copyright"><a href="http://www.w3.org/Consortium/Legal/2002/ipr-notice-20021231#Copyright">Copyright</a> &#169; 2012 <a href="http://www.w3.org/"><abbr title="World Wide Web Consortium">W3C</abbr></a><sup>&#174;</sup> (<a href="http://www.csail.mit.edu/"><abbr title="Massachusetts Institute of Technology">MIT</abbr></a>, <a href="http://www.ercim.eu/"><abbr title="European Research Consortium for Informatics and Mathematics">ERCIM</abbr></a>, <a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a href="http://www.w3.org/Consortium/Legal/2002/ipr-notice-20021231#Legal_Disclaimer">liability</a>, <a href="http://www.w3.org/Consortium/Legal/2002/ipr-notice-20021231#W3C_Trademarks">trademark</a> and <a href="http://www.w3.org/Consortium/Legal/copyright-documents">document use</a> rules apply.</p>
    7.67 -
    7.68 -    <h2>Status of this Document</h2>
    7.69 -      
    7.70 -    <p><em>
    7.71 -      This section describes the status of this document at the time of its publication. Other documents may supersede this document.
    7.72 -      A list of current W3C publications and the latest revision of this technical report can be found in the
    7.73 -      <a href="http://www.w3.org/TR/">W3C technical reports index</a> at http://www.w3.org/TR/.
    7.74 -    </em></p>
    7.75 -
    7.76 -    <p>
    7.77 -      This document was published by the <a href="http://www.w3.org/html/wg/">HTML working group</a> as an Editor's Draft.
    7.78 -      Please submit comments regarding this document by using the W3C's (<a href="https://www.w3.org/Bugs/Public/enter_bug.cgi?product=HTML%20WG&amp;component=Media%20Source%20Extensions">public bug database</a>) with the product set to <kbd>HTML WG</kbd> and the component set to
    7.79 -      <kbd>Media Source Extensions</kbd>.
    7.80 -      If you cannot access the bug database, submit comments to <a href="mailto:public-html-media@w3.org">public-html-media@w3.org</a>
    7.81 -      (<a href="mailto:public-html-media-request@w3.org?subject=subscribe">subscribe</a>,
    7.82 -      <a href="http://lists.w3.org/Archives/Public/public-html-media/">archives</a>) and arrangements will be made to transpose the comments to the bug database.
    7.83 -      All feedback is welcome.
    7.84 -    </p>
    7.85 -
    7.86 -    <p>
    7.87 -      Publication as a Editor's Draft does not imply endorsement by the W3C Membership. This is a draft document and may be updated,
    7.88 -      replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.
    7.89 -    </p>
    7.90 -    <p>
    7.91 -      This document was produced by a group operating under the <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February 2004 W3C Patent Policy</a>.
    7.92 -      W3C maintains a <a href="http://www.w3.org/2004/01/pp-impl/40318/status" rel="disclosure">public list of any patent disclosures</a> made in connection with
    7.93 -      the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which
    7.94 -      the individual believes contains <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential Claim(s)</a> must disclose the
    7.95 -      information in accordance with <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section 6 of the W3C Patent Policy</a>.
    7.96 -    </p>     
    7.97 -
    7.98 -    <h2>Abstract</h2>
    7.99 -    <p>
   7.100 -      This proposal extends HTMLMediaElement to allow 
   7.101 -      JavaScript to generate media streams for playback. 
   7.102 -      Allowing JavaScript to generate streams facilitates a variety of use 
   7.103 -      cases like adaptive streaming and time shifting live streams.
   7.104 -    </p>
   7.105 -
   7.106 -    <h2>Table of Contents</h2>
   7.107 -
   7.108 -    <ul id="toc" class="toc">
   7.109 -      <li><a href="#introduction">1. Introduction</a></li>
   7.110 -      <li>
   7.111 -	<ul>
   7.112 -	  <li><a href="#goals">1.1 Goals</a></li>
   7.113 -	  <li><a href="#definitions">1.2 Definitions</a></li>
   7.114 -	</ul>
   7.115 -      </li>
   7.116 -      <li><a href="#source-buffer-model">2. Source Buffer Model</a></li>
   7.117 -      <li>
   7.118 -	<ul>
   7.119 -	  <li><a href="#source-buffer-create">2.1. Creating Source Buffers</a></li>
   7.120 -	  <li><a href="#source-buffer-remove">2.2. Removing Source Buffers</a></li>
   7.121 -	  <li><a href="#source-buffer-basic-append">2.3. Basic appending model</a></li>
   7.122 -	  <li><a href="#source-buffer-init-segment-constraints">2.4.  Initialization Segment constraints</a></li>
   7.123 -	  <li><a href="#source-buffer-media-segment-constraints">2.5. Media Segment constraints</a></li>
   7.124 -	  <li><a href="#source-buffer-first-init-segment">2.6. Appending the first Initialization Segment</a></li>
   7.125 -	  <li><a href="#source-buffer-media-segment-unbuffered">2.7. Appending a Media Segment to an unbuffered region</a></li>
   7.126 -	  <li><a href="#source-buffer-overlapping-segments">2.8. Appending a Media Segment over a buffered region</a></li>
   7.127 -	  <li><a href="#source-buffer-to-track-buffer">2.9. Source Buffer to Track Buffer transfer</a></li>
   7.128 -	  <li><a href="#source-buffer-segment-eviction">2.10. Media Segment Eviction</a></li>
   7.129 -	  <li><a href="#source-buffer-timestamp-offsets">2.11. Applying Timestamp Offsets</a></li>
   7.130 -	</ul>
   7.131 -      </li>
   7.132 -      <li><a href="#mediasource">3. MediaSource Object</a>
   7.133 -	<ul>
   7.134 -	  <li><a href="#mediasource-methods">3.1. Methods and Attributes</a></li>
   7.135 -	  <li><a href="#mediasource-events">3.2. Event Summary</a></li>
   7.136 -	  <li><a href="#mediasource-algorithms">3.3. Algorithms</a></li>
   7.137 -	</ul>
   7.138 -      </li>
   7.139 -      <li><a href="#sourcebuffer">4. SourceBuffer Object</a>
   7.140 -        <ul>
   7.141 -	  <li><a href="#sourcebuffer-methods">4.1. Methods and Attributes</a></li>
   7.142 -	  <li><a href="#sourcebuffer-algorithms">4.2. Algorithms</a></li>
   7.143 -	</ul>
   7.144 -      </li>
   7.145 -
   7.146 -      <li><a href="#sourcebufferlist">5. SourceBufferList Object</a>
   7.147 -	<ul>
   7.148 -	  <li><a href="#sourcebufferlist-methods">5.1. Methods and Attributes</a></li>
   7.149 -	  <li><a href="#sourcebufferlist-events">5.2. Event Summary</a></li>
   7.150 -	</ul>
   7.151 -      </li>
   7.152 -      <li><a href="#url">6. URL Object</a>
   7.153 -	<ul>
   7.154 -	  <li><a href="#url-methods">6.1. Methods</a></li>
   7.155 -	</ul>
   7.156 -      </li>
   7.157 -      <li><a href="#htmlmediaelement-attributes">7. HTMLMediaElement attributes</a></li>
   7.158 -      <li><a href="#byte-stream-formats">8. Byte Stream Formats</a></li>
   7.159 -      <li>
   7.160 -	<ul>
   7.161 -	  <li><a href="#webm">8.1 WebM</a></li>
   7.162 -	  <li><a href="#iso">8.2 ISO Base Media File Format</a></li>
   7.163 -	</ul>
   7.164 -      </li>
   7.165 -      <li><a href="#examples">9. Examples</a></li>
   7.166 -      <li><a href="#revision-history">10. Revision History</a></li>
   7.167 -    </ul>
   7.168 -
   7.169 -    <h2 id="introduction">1. Introduction</h2>
   7.170 -    <p>This proposal allows JavaScript to dynamically construct media streams for &lt;audio&gt; and &lt;video&gt;. 
   7.171 -       It defines objects that allow JavaScript to pass media segments to an <videoref name="htmlmediaelement">HTMLMediaElement</videoref>.
   7.172 -       A buffering model is also included to describe how the user agent should act when different media segments are 
   7.173 -       appended at different times. Byte stream specifications for WebM &amp; ISO Base Media File Format are given to specify the
   7.174 -       expected format of media segments used with these extensions.</p>
   7.175 -    <img src="pipeline_model.png" />
   7.176 -
   7.177 -    <h3 id="goals">1.1. Goals</h3>
   7.178 -    <p>This proposal was designed with the following goals in mind:</p>
   7.179 -    <ul>
   7.180 -      <li>Allow JavaScript to construct media streams independent of how the media is fetched.</li>
   7.181 -      <li>Define a splicing and buffering model that facilitates use cases like adaptive streaming, ad-insertion, time-shifting, and video editing.</li>
   7.182 -      <li>Minimize the need for media parsing in JavaScript.</li>
   7.183 -      <li>Leverage the browser cache as much as possible.</li>
   7.184 -      <li>Provide byte stream definitions for WebM &amp; the ISO Base Media File Format.</li>
   7.185 -      <li>Not require support for any particular media format or codec.</li>
   7.186 -    </ul>
   7.187 -
   7.188 -    <h3 id="definitions">1.2. Definitions</h3>
   7.189 -
   7.190 -    <h4 id="init-segment">1.2.1. Initialization Segment</h4>
   7.191 -    <p>A sequence of bytes that contains all of the initialization information required to decode a sequence of <media-segments/>. This includes codec initialization data, <track-id/> mappings for multiplexed segments, and timestamp offsets (e.g. edit lists).</p>
   7.192 -
   7.193 -    <dl class="example">
   7.194 -      <p>Container specific examples of initialization segments:</p>
   7.195 -      <dt>ISO Base Media File Format</dt>
   7.196 -      <dd>A <iso-box>moov</iso-box> box.</dd>
   7.197 -      <dt>WebM</dt>
   7.198 -      <dd>The concatenation of the the EBML Header, Segment Header, Info element, and Tracks element.</dd>
   7.199 -    </dl>
   7.200 -
   7.201 -    <h4 id="media-segment">1.2.2. Media Segment</h4>
   7.202 -    <p>A sequence of bytes that contain packetized &amp; timestamped media data for a portion of the presentation timeline. Media segments are always associated with the most recently appended <init-segment/>.</p>
   7.203 -
   7.204 -    <dl class="domintro">
   7.205 -      <p>Container specific examples of media segments:</p>
   7.206 -      <dt>ISO Base Media File Format</dt>
   7.207 -      <dd>A <iso-box>moof</iso-box> box followed by one or more <iso-box>mdat</iso-box> boxes.</dd>
   7.208 -      <dt>WebM</dt>
   7.209 -      <dd>A Cluster element</dd>
   7.210 -    </dl>
   7.211 -
   7.212 -    <h4 id="source-buffer">1.2.3. Source Buffer</h4>
   7.213 -    <p>A hypothetical buffer that contains a distinct sequence of <init-segments/> &amp; <media-segments/>. When <media-segments/> are passed to <append/> they update the state of this buffer. The source buffer only allows a single <media-segment/> to cover a specific point in the presentation timeline of each track. If a <media-segment/> gets appended that contains media data overlapping (in presentation time) with media data from an existing segment, then the new media data will override the old media data. Since <media-segments/> depend on <init-segments/> the source buffer is also responsible for maintaining these associations. During playback, the media element pulls segment data out of the source buffers, demultiplexes it if necessary, and enqueues it into <track-buffers/> so it will get decoded and displayed. <buffered/> describes the time ranges that are covered by <media-segments/> in the source buffer.</p>
   7.214 -
   7.215 -    <h4 id="active-source-buffers">1.2.4. Active Source Buffers</h4>
   7.216 -    <p>The set of <source-buffers/> that are providing the <videoref name="dom-videotrack-selected">selected video track</videoref>, the <videoref name="dom-audiotrack-enabled">enabled audio tracks</videoref>, and the <videoref name="dom-texttrack-showing">&quot;showing&quot;</videoref> or <videoref name="dom-texttrack-hidden">&quot;hidden&quot;</videoref> text tracks. This is a subset of all the source buffers associated with a specific <MediaSource/> object. See <a href="#active-source-buffer-changes">Changes to selected/enabled track state</a> for details.</p>
   7.217 -
   7.218 -
   7.219 -    <h4 id="track-buffer">1.2.5. Track Buffer</h4>
   7.220 -    <p>A hypothetical buffer that represents initialization and media data for a single <audio-track/>, <video-track/>, or <text-track/> that has been queued for playback. This buffer may not exist in actual implementations, but it is intended to represent media data that will be decoded no matter what <media-segments/> are appended to update the <source-buffer/>. This distinction is important when considering appends that happen close to the current playback position. See <a href="#source-buffer-to-track-buffer">Source Buffer to Track Buffer transfer</a> for details.</p>
   7.221 -
   7.222 -
   7.223 -    <h4 id="random-access-point">1.2.6. Random Access Point</h4>
   7.224 -    <p>A position in a <media-segment/> where decoding and continuous playback can begin without relying on any previous data in the segment. For video this tends to be the location of I-frames. In the case of audio, most audio frames can be treated as a random access point. Since video tracks tend to have a more sparse distribution of random access points, the location of these points are usually considered the random access points for multiplexed streams.</p>
   7.225 -
   7.226 -    <h4 id="presentation-start-time">1.2.7. Presentation Start Time</h4>
   7.227 -    <p>The presentation start time is the earliest time point in the presentation and specifies the <videoref name="initial-playback-position">initial playback position</videoref> and <videoref name="earliest-possible-position">earliest possible position</videoref>. All presentations created using this specification have a presentation start time of 0. Appending <media-segments/> with negative timestamps will cause playback to terminate with a <media-err-decode/> error unless <timestampOffset/> is used to make the timestamps greater than or equal to 0.</p>
   7.228 -
   7.229 -    <h4 id="mediasource-object-url">1.2.8. MediaSource object URL</h4>
   7.230 -    <p>A MediaSource object URL is a unique <blob-uri/> created by <createObjectURL/>. It is used to attach a <MediaSource/> object to an HTMLMediaElement.</p>
   7.231 -    <p>These URLs are the same as what the <FileAPI/> specification calls a <blob-uri/>, except that anything in the definition of that feature that refers to <File/> and <Blob/> objects is hereby extended to also apply to <MediaSource/> objects.</p>
   7.232 -
   7.233 -    <h4 id="track-id">1.2.9. Track ID</h4>
   7.234 -    <p>A Track ID is a byte stream format specific identifier that marks sections of the byte stream as being part of a specific track. The Track ID in a <track-description/> identifies which sections of a <media-segment/> belong to that track.</p>
   7.235 -    
   7.236 -   <h4 id="track-description">1.2.10. Track Description</h4>
   7.237 -   <p>A byte stream format specific structure that provides the <track-id/>, codec configuration, and other metadata for a single track. Each track description inside a single <init-segment/> must have a unique <track-id/>.</p>
   7.238 -
   7.239 -   <h4 id="coded-frame">1.2.11. Coded Frame</h4>
   7.240 -   <p>A unit of compressed media data that has a presentation timestamp and  decode timestamp. The presentation timestamp indicates when the frame should be rendered. The decode timestamp indicates when the frame needs to be decoded. If frames can be decoded out of order, then the decode timestamp must be present in the bytestream. If frames cannot be decoded out of order and a decode timestamp is not present in the bytestream, then the decode timestamp is equal to the presentation timestamp.</p>
   7.241 -
   7.242 -
   7.243 -    <h2 id="source-buffer-model">2. Source Buffer Model</h2>
   7.244 -    <p>The subsections below outline the buffering model for this proposal. It describes how to add and remove <source-buffers/> from the presentation and describes the various rules and behaviors associated with appending data to an individual <source-buffer/>. At the highest level, the web application simply creates <source-buffers/> and appends a sequence of <init-segments/> and <media-segments/> to update the buffer's state. The media element pulls media data out of the <source-buffers/>, plays it, and fires events just like it would if a normal URL was passed to the <media-src/> attribute. The web application is expected to monitor media element events to determine when it needs to append more <media-segments/>.</p>
   7.245 -
   7.246 -    <h3 id="source-buffer-create">2.1. Creating Source Buffers</h3>
   7.247 -    <p><SourceBuffer/> objects can be created once a <MediaSource/> object enters the <open/> state. The application calls <addSourceBuffer/> with a type string that indicates the format of the data it intends to append to the new SourceBuffer. If the user agent supports the format and has sufficient resources, a new <SourceBuffer/> object is created, added to <sourceBuffers/>, and returned by the method. If the user agent doesn't support the specified format or can't support another <SourceBuffer/> then it will throw an appropriate exception to signal why the request couldn't be satisfied.</p>
   7.248 -
   7.249 -    <h3 id="source-buffer-remove">2.2. Removing Source Buffers</h3>
   7.250 -    <p>Removing a <SourceBuffer/> with <removeSourceBuffer/> releases all resources associated with the object. This includes destroying the all the segment data, <track-buffers/>, and decoders. The media element will also remove the appropriate tracks from <audiotracks/>, <videotracks/>,  &amp; <texttracks/> and fire the necessary <videoref name="handler-tracklist-onchange">change</videoref> events. Playback may become degraded or stop if the currently selected <video-track/> or the only enabled <audio-tracks/> are removed.</p>
   7.251 -
   7.252 -    <h3 id="source-buffer-basic-append">2.3. Basic appending model</h3>
   7.253 -    <p>Updating the state of a <source-buffer/> requires appending at least one <init-segment/> and one or more <media-segments/> via <append/>. The following list outlines some of the basic rules for appending segments.
   7.254 -      <ul>
   7.255 -	<li>The first segment appended must be an <init-segment/>.</li>
   7.256 -	<li>All <media-segments/> are associated with the most recently appended <init-segment/>.</li>
   7.257 -	<li>A whole segment must be appended before another segment can be started unless <abort/> is called.</li>
   7.258 -	<li>Segments can be appended in pieces. (i.e. A 4096 byte segment can be spread across four 1024 byte calls to <append/>).</li>
   7.259 -	<li>If a <media-segment/> requires different configuration information (e.g. codec parameters, new <track-ids/>, metadata) from what is in the most recently appended <init-segment/>, a new <init-segment/> with the new configuration information must be appended before the <media-segment/> requiring this information is appended.</li>
   7.260 -	<li>A new <media-segment/> can overlap, in presentation time, a segment that was previously appended. The new segment will override the previous data.</li>
   7.261 -	<li>Media segments can be appended in any order.<br/>Note: In practice finite buffer space and maintaining uninterrupted playback will bias appending towards time increasing order near the current playback position. Out of order appends facilitate adaptive streaming, ad insertion, and video editing use cases.</li>
   7.262 -	<li>The media element may start copying data from a <media-segment/> to the <track-buffers/> before the entire segment has been appended. This prevents unnecessary delays for <media-segments/> that cover a large time range.</li>
   7.263 -      </ul>
   7.264 -    </p>
   7.265 -
   7.266 -    <h3 id="source-buffer-init-segment-constraints">2.4. Initialization Segment constraints</h3>
   7.267 -    <p>To simplify the implementation and facilitate interoperability, a few constraints are placed on the <init-segments/> that are appended to a specific <SourceBuffer/>:
   7.268 -      <ul>
   7.269 -	<li>The number and type of tracks must be consistent across all <init-segments/>. <br/>For example, if the first <init-segment/> has 2 audio tracks and 1 video track, then all <init-segments/> that follow, for this <SourceBuffer/> must describe 2 audio tracks and 1 video track.</li>
   7.270 -	<li><track-ids/> do not need to be the same across <init-segments/> only if the segment describes one track of each type.<br/> For example, if an <init-segment/> describes a single audio track and a single video track, the internal <track-ids/> do not need to be the same.</li>
   7.271 -	<li><track-ids/> must be the same across <init-segments/> if multiple tracks for a single type are described. (e.g. 2 audio tracks).</li>
   7.272 -	<li>Codecs changes are not allowed. <br/> For example, you can't have an <init-segment/> that specifies a single AAC track and then follows it with one that contains AMR-WB. Support for multiple codecs is handled with multiple <SourceBuffer/> objects.</li>
   7.273 -	<li>Video frame size changes are allowed and must be supported seamlessly.<br/> Note: This will cause the &lt;video&gt; display region to change size if you don't use CSS or HTML attributes (width/height) to constrain the element size.</li>
   7.274 -	<li>Audio channel count changes are allowed, but they may not be seamless and could trigger downmixing.<br/> Note: This is a quality of implementation issue because changing the channel count may require reinitializing the audio device, resamplers, and channel mixers which tends to be audible.</li>
   7.275 -      </ul>
   7.276 -    </p>
   7.277 -
   7.278 -    <h3 id="source-buffer-media-segment-constraints">2.5. Media Segment constraints</h3>
   7.279 -    <p>To simplify the implementation and facilitate interoperability, a few constraints are placed on the <media-segments/> that are appended to a specific <SourceBuffer/>:
   7.280 -      <ul>
   7.281 -	<li>All timestamps must be mapped to the same presentation timeline.</li>
   7.282 -	<li>Segments must start with a <random-access-point/> to facilitate seamless splicing at the segment boundary.</li>
   7.283 -	<li>Gaps between <media-segments/> that are smaller than the audio frame size are allowed and must not cause playback to stall. Such gaps must not be reflected by <buffered/>.
   7.284 -	  <p class="note">Note: This is intended to simplify switching between audio streams where the frame boundaries don't always line up across encodings (e.g. Vorbis).</p></li>
   7.285 -      </ul>
   7.286 -    </p>
   7.287 -
   7.288 -    <h3 id="source-buffer-first-init-segment">2.6. Appending the first Initialization Segment</h3>
   7.289 -    <p>Once a new <SourceBuffer/> has been created, it expects an <init-segment/> to be appended first. This first segment indicates the number and type of streams contained in the <media-segments/> that follow. This allows the media element to configure the necessary decoders and output devices. This first segment can also cause a <ready-state/> transition to <have-metadata/> if this is the first <SourceBuffer/>, or if it is the first track of a specific type (i.e. first audio, first video track, or first text track). If neither of the conditions hold then the tracks for this new <SourceBuffer/> will just appear as disabled tracks and won't affect the current <ready-state/> until they are selected. The media element will also add the appropriate tracks to the <audiotracks/>, <videotracks/>, &amp; <texttracks/> collections and fire the necessary <videoref name="handler-tracklist-onchange">change</videoref> events. The description for <append/> contains all the details.</p>
   7.290 -    
   7.291 -    <h3 id="source-buffer-media-segment-unbuffered">2.7. Appending a Media Segment to an unbuffered region</h3>
   7.292 -    <p>If a <media-segment/> is appended to a time range that is not covered by existing segments in the <source-buffer/>, then its data is copied directly into the <source-buffer/>. Addition of this data may trigger <ready-state/> transitions depending on what other data is buffered and whether the media element has determined if it can start playback. Calls to <buffered/> will always reflect the current <timeranges/> buffered in the <SourceBuffer/>.</p>
   7.293 -
   7.294 -    <h3 id="source-buffer-overlapping-segments">2.8. Appending a Media Segment over a buffered region</h3>
   7.295 -    <p>There are several ways that <media-segments/> can overlap segments in the <source-buffer/>. Behavior for the different overlap situations are described below. If more than one overlap applies, then the <a href="#source-buffer-overlap-start">start overlap</a> gets resolved first, followed by any <a href="#source-buffer-overlap-complete">complete overlaps</a>, and finally the <a href="#source-buffer-overlap-end">end overlap</a>. If a segment contains multiple tracks then the overlap is resolved independently for each track.</p>
   7.296 -
   7.297 -    <h4 id="source-buffer-overlap-complete">2.8.1 Complete Overlap</h4>
   7.298 -    <img src="complete_overlap.png"/>
   7.299 -    <p>The figure above shows how the <source-buffer/> gets updated when a new <media-segment/> completely overlaps a segment in the buffer. In this case, the new segment completely replaces the old segment.</p>
   7.300 -
   7.301 -    <h4 id="source-buffer-overlap-start">2.8.2 Start Overlap</h4>
   7.302 -    <img src="start_overlap.png"/>
   7.303 -    <p>The figure above shows how the <source-buffer/> gets updated when the beginning of a new <media-segment/> overlaps a segment in the buffer. In this case the new segment replaces all the old media data in the overlapping region. Since <media-segments/> are constrained to starting with <random-access-points/>, this provides a seamless transition between segments.</p>
   7.304 -    <p>When an audio frame in the <source-buffer/> overlaps with the start of the new <media-segment/> special behavior is required. At a minimum implementations must support dropping the old audio frame that overlaps the start of the new segment and insert silence for the small gap that is created. Higher quality implementations may support crossfading or crosslapping between the overlapping audio frames. No matter which strategy is implemented, no gaps are created in the ranges reported by <buffered/> and playback must never stall at the overlap.</p>
   7.305 -
   7.306 -    <h4 id="source-buffer-overlap-end">2.8.3 End Overlap</h4>
   7.307 -    <img src="end_overlap.png"/>
   7.308 -    <p>The figure above shows how the <source-buffer/> gets updated when the end of a new <media-segment/> overlaps a segment in the buffer. In this case, the media element tries to keep as much of the old segment as possible. The amount saved depends on where the closest <random-access-point/>, in the old segment, is to the end of the new segment. In the case of audio, if the gap is smaller than the size of an audio frame, then the media element should insert silence for this gap and not reflect it in <buffered/>.</p>
   7.309 -      <p>An implementation may keep old segment data before the end of the new segment to avoid creating a gap if it wishes. Doing this though can significantly increase implementation complexity and could cause delays at the splice point. The key property that must be preserved is the entirety of the new segment gets added to the <source-buffer/> and it is up to the implementation how much of the old segment data is retained. The web application can use <buffered/> to determine how much of the old segment was preserved.</p>
   7.310 -
   7.311 -    <h4 id="source-buffer-overlap-middle">2.8.4 Middle Overlap</h4>
   7.312 -    <img src="middle_overlap.png"/>
   7.313 -    <p>The figure above shows how the <source-buffer/> gets updated when the new <media-segment/> is in the middle of the old segment. This condition is handled by first resolving the <a href="#source-buffer-overlap-start">start overlap</a> and then resolving the <a href="#source-buffer-overlap-end">end overlap</a>.</p>
   7.314 -
   7.315 -    <h3 id="source-buffer-to-track-buffer">2.9. Source Buffer to Track Buffer transfer</h3>
   7.316 -    <p>The <source-buffer/> represents the media that the web application would like the media element to play. The <track-buffer/> contains the data that will actually get decoded and rendered. In most cases the <track-buffer/> will simply contain a subset of the <source-buffer/> near the current playback position. These two buffers start to diverge though when <media-segments/> that overlap or are very close to the current playback position are appended. Depending on the contents of the new <media-segment/> it may not be possible to switch to the new data immediately because there isn't a <random-access-point/> close enough to the current playback position. The quality of the implementation determines how much data is considered "in the <track-buffer/>". It should transfer data to the <track-buffer/> as late as possible whilst maintaining seamless playback. Some implementations may be able to instantiate multiple decoders or decode the new data significantly faster than real-time to achieve a seamless splice immediately. Other implementations may delay until the next <random-access-point/> before switching to the newly appended data. Notice that this difference in behavior is only observable when appending close to the current playback position. The <track-buffer/> represents a media subsegment, like a group of pictures or something with similar decode dependencies, that the media element commits to playing. This commitment may be influenced by a variety of things like limited decoding resources, hardware decode buffers, a jitter buffer, or the desire to limit implementation complexity.</p>
   7.317 -    
   7.318 -    <p>Here is an example to help clarify the role of the <track-buffer/>. Say the current playback position has a timestamp of 8 and the media element pulled frames with timestamp 9 &amp; 10 into the track buffer. The web application then appends a higher quality <media-segment/> that starts with a <random-access-point/> at timestamp 9. The <source-buffer/> will get updated with the higher quality data, but the media element won't be able to switch to this higher quality data until the next <random-access-point/> at timestamp 20. This is because a frame for timestamp 9 is already in the track buffer. As you can see the track buffer represents the "point of no return." for decoding. If a seek occurs the media element may choose to use the higher quality data since a seek might imply flushing the <track-buffer/> and the user expects a break in playback.</p>
   7.319 -
   7.320 -
   7.321 -    <h3 id="source-buffer-segment-eviction">2.10. Media Segment Eviction</h3>
   7.322 -    <p>When a new <media-segment/> is appended, memory constraints may cause previously appended segments to get evicted from the <source-buffer/>. The eviction algorithm is implementation dependent, but segments that aren't likely to be needed soon are the most likely to get evicted. The <buffered/> attribute allows the web application to monitor what time ranges are currently buffered in the <source-buffer/>.</p>
   7.323 -
   7.324 -    <h3 id="source-buffer-timestamp-offsets">2.11. Applying Timestamp Offsets</h3>
   7.325 -    <p>For some use cases like ad-insertion or seamless playlists, the web application may want to insert a <media-segment/> in the presentation timeline at a location that is different than what the internal timestamps indicate. This can be accomplished by using the <timestampOffset/> attribute on the <SourceBuffer/> object. The value of <timestampOffset/> is added to all timestamps inside a <media-segment/> before the contents of that segment are added to the <source-buffer/>. The <timestampOffset/> applies to an entire media segment. An exception is thrown if the application tries to update the attribute when only part of a media segment has been appended. Both positive or negative offsets can be assigned to <timestampOffset/>. If an offset causes a <media-segment/> timestamp to get converted to a time before the <presentation-start-time/>, playback will terminate with a <media-err-decode/> error.</p>
   7.326 -
   7.327 -    <p>Here is a simple example to clarify how <timestampOffset/> can be used. Say I have two sounds I want to play in sequence. The first sound is 5 seconds long and the second one is 10 seconds. Both sound files have timestamps that start at 0. First append the <init-segment/> and all <media-segments/> for the first sound. Now set <timestampOffset/> to 5 seconds. Finally append the <init-segment/> and <media-segments/> for the second sound. This will result in a 15 second presentation that plays the two sounds in sequence.</p>
   7.328 -
   7.329 -    <h2 id="mediasource">3. MediaSource Object</h2>
   7.330 -    <p>The MediaSource object represents a source of media data for an HTMLMediaElement. It keeps track of the <readyState/> for this source as well as a list of <SourceBuffer/> objects that can be used to add media data to the presentation. MediaSource objects are created by the web application and then attached to an HTMLMediaElement. The application uses the <SourceBuffer/> objects in <sourceBuffers/> to add media data to this source. The HTMLMediaElement fetches this media data from the <MediaSource/> object when it is needed during playback.</p>
   7.331 -
   7.332 -    <pre class="idl">
   7.333 -[Constructor]
   7.334 -interface <dfn id="dom-mediasource">MediaSource</dfn> : EventTarget {
   7.335 -  // All the source buffers created by this object.
   7.336 -  readonly attribute <precoderef>SourceBufferList</precoderef> <precoderef>sourceBuffers</precoderef>;
   7.337 -
   7.338 -  // Subset of sourceBuffers that provide data for the selected/enabled tracks.
   7.339 -  readonly attribute <precoderef>SourceBufferList</precoderef> <precoderef>activeSourceBuffers</precoderef>;
   7.340 -
   7.341 -  attribute unrestricted double <precoderef>duration</precoderef>;
   7.342 -
   7.343 -  <precoderef>SourceBuffer</precoderef> <premethodref>addSourceBuffer</premethodref>(DOMString type);
   7.344 -  void <premethodref>removeSourceBuffer</premethodref>(<precoderef>SourceBuffer</precoderef> sourceBuffer);
   7.345 -
   7.346 -  enum State { "closed", "open", "ended" };
   7.347 -  readonly attribute State <precoderef>readyState</precoderef>;
   7.348 -
   7.349 -  enum EndOfStreamError { "network", "decode" };
   7.350 -  void <premethodref>endOfStream</premethodref>(optional EndOfStreamError error);
   7.351 -};
   7.352 -    </pre>
   7.353 -    <h3 id="mediasource-methods">3.1. Methods and Attributes</h3>
   7.354 -    
   7.355 -    <p>The <codedfn>sourceBuffers</codedfn> attribute contains the list of <SourceBuffer/> objects associated with this <MediaSource/>. When <readyState/> equals <closed/> this list will be empty. Once <readyState/> transitions to <open/> SourceBuffer objects can be added to this list by using <addSourceBuffer/>.</p>
   7.356 -
   7.357 -    <p>The <codedfn>activeSourceBuffers</codedfn> attribute contains the subset of <sourceBuffers/> that represents the <active-source-buffers/>.</p>
   7.358 -
   7.359 -    <p>The <codedfn>duration</codedfn> attribute allows the web application to set the presentation duration. The duration is initially set to NaN when the <MediaSource/> object is created.</p>
   7.360 -    <p>On getting, run the following steps:</p>
   7.361 -    <ol>
   7.362 -      <li>If the <readyState/> attribute is <closed/> then return NaN and abort these steps.</li>
   7.363 -      <li>Return the current value of the attribute.</li>
   7.364 -    </ol>
   7.365 -    <p>On setting, run the following steps:</p>
   7.366 -    <ol>
   7.367 -      <li>If the value being set is negative or NaN then throw an <invalid-access-err/> exception and abort these steps.</li>
   7.368 -      <li>If the <readyState/> attribute is not <open/> then throw an <invalid-state-err/> exception and abort these steps.</li>
   7.369 -      <li>Run the <duration-change-algorithm/> with <new-duration/> set to the value being set.
   7.370 -	<p class="note">Note: <append/> and <endOfStream/> can update the duration under certain circumstances.</p>
   7.371 -      </li>
   7.372 -    </ol>
   7.373 -
   7.374 -    <p>The <methoddfn name="addSourceBuffer">addSourceBuffer(<var title="true">type</var>)</methoddfn> method must run the following steps:</p>
   7.375 -    <ol>
   7.376 -      <li>If <var title="true">type</var> is null or an empty string then throw an <invalid-access-err/> exception and abort these steps.</li>
   7.377 -      <li>If <var title="true">type</var> contains a MIME type that is not supported or contains a MIME type that is not supported with the types specified for the other <SourceBuffer/> objects in <sourceBuffers/>, then throw a <not-supported-err/> exception and abort these steps.</li>
   7.378 -      <li>If the user agent can't handle any more SourceBuffer objects then throw a <quota-exceeded-err/> exception and abort these steps.</li>
   7.379 -      <li>If the <readyState/> attribute is not in the <open/> state then throw an <invalid-state-err/> exception and abort these steps.</li>
   7.380 -      <li>Create a new <SourceBuffer/> object and associated resources.</li>
   7.381 -      <li>Add the new object to <sourceBuffers/> and <queue-a-task-to-fire-an-event-named/> <addsourcebuffer/> at <sourceBuffers/>.</li>
   7.382 -      <li>Return the new object.</li>
   7.383 -    </ol>
   7.384 -    <p>The <methoddfn name="removeSourceBuffer">removeSourceBuffer(<var title="true">sourceBuffer</var>)</methoddfn> method must run the following steps:</p>
   7.385 -    <ol>
   7.386 -      <li>If <var title="true">sourceBuffer</var> is null then throw an <invalid-access-err/> exception and abort these steps.</li>
   7.387 -      <li>If <var title="true">sourceBuffer</var> specifies an object that is not in <sourceBuffers/> then throw a <not-found-err/> exception and abort these steps.</li>
   7.388 -      <li>Remove track information from <audiotracks/>, <videotracks/>, and <texttracks/> for all tracks associated with <var title="true">sourceBuffer</var> and <queue-a-task-to-fire-an-event-named/> <videoref name="handler-tracklist-onchange">change</videoref> at the modified lists.</li>
   7.389 -      <li>If <var title="true">sourceBuffer</var> is in <activeSourceBuffers/>, then remove it from <activeSourceBuffers/> and <queue-a-task-to-fire-an-event-named/> <removesourcebuffer/> at <activeSourceBuffers/>.</li>
   7.390 -      <li>Remove <var title="true">sourceBuffer</var> from <sourceBuffers/> and <queue-a-task-to-fire-an-event-named/> <removesourcebuffer/> at <sourceBuffers/>.</li>
   7.391 -      <li>Destroy all resources for <var title="true">sourceBuffer</var>.</li>