TrackEvent object

Object returned from the onaddtrack event that represents the track that was loaded.

HTML5 A vocabulary and associated APIs for HTML and XHTML

Syntax


videoOjbect.addEventListener("addtrack", function (trackEvent) {eventhandler}, false);

DOM Information

Inheritance Hierarchy

 event
   TrackEvent

Members

The TrackEvent object has these types of members:

Properties

The TrackEvent object has these properties.

PropertyAccess typeDescription

track

Read-only

Returns the track that is loaded by the onaddtrack event.

 

Standards information

Remarks

Note  If you are developing locally or on an intranet and have rendering issues for HTML5, you can add a "meta http-equiv-'X-UA-Compatible' content= " meta command, followed by "IE=edge" to the <head> block of a webpage to force a Windows Store app using JavaScript to use the latest standards. For more information about document compatibility, see Defining Document Compatibility.

The onaddtrack event listener must be added to the video object before the video source content is loaded.

The following example uses the TrackEvent object and the track property to get the language of each audio track in a multi-track video file. Note that the video src property is set (content is loaded) after the onaddtrack event has been specified.

Examples


    <script type="text/javascript">
      // wait until the video element has loaded
      document.addEventListener("DOMContentLoaded", function () {  // don't run this until all DOM content is loaded 
        var oVideo = document.getElementById("video1");
        //  get the audioTracks object to attach an event listener
        var audioTracks = oVideo.audioTracks;
        audioTracks.addEventListener("addtrack", function (oTrackEvent) {
          getLangTracks(oTrackEvent.track);
        }, false);
        oVideo.src = "multi-lang-movie.mp4";  // set source after addtrack in place
      }, false);

      function getLangTracks(myTrack) {           
        document.getElementById("display").innerHTML += "<br/>" + myTrack.language;
      }    
    </script>
  </head>
  <body>
    <video id="video1" controls>
      HTML5 video not supported 
    </video>
    <div id="display"></div>
  </body>
</html>


See also

Make your videos accessible with Timed Text Tracks

 

 

Show:
© 2014 Microsoft