RE: WebVTT for HTML5 Audio

Have a look at www.oz-player.com - you may find that easier to us.

-----Original Message-----
From: Michael A. Peters [mailto:mpeters@domblogger.net] 
Sent: Saturday, 1 July 2017 4:14 PM
To: w3c-wai-ig@w3.org
Subject: Re: WebVTT for HTML5 Audio

I wasn't able to use ableplayer. It's a good solution but ability to modify/customize it was too complicated, involving npm and other tools for an entire JavaScript build system.

I ended up coding something myself, seems browsers have a long way to go.

Things like the oncuechange event - in some browsers I could only get it to trigger with video where I don't need it, it wouldn't work with audios, so I had to cheat and use the ontimechange event - which isn't really nice to mobile batteries because it fires more frequently.

Also I couldn't find an event handler for when the status of the captions button changes. I had to use a timer to fire every so often and check the current status of whether a textTrack was enabled. I don't understand why there isn't a standard JS event that fires when someone changes the status of the captions. I guess that's one of the arguments for building your own media interface, you can trigger off of onclick - but there may be other ways to change caption status that onclick doesn't trigger from.

Chrome doesn't offer a caption button even when there are tracks for audio (but they do for video) and FireFox for OS X - clicking the caption button doesn't cause the same change of state it does in FireFox for Linux where my code works beautifully.

I have no clue about Internet Explorer or Edge - but anyway, what I came with works fine if captions are turned on by default (what I do), it's just some browsers don't then have a way to trigger turning them off that works.

I'm still looking for a solution to trigger on change of status on whether captions are enabled and what track is enabled, I don't like firing every .500 seconds to check.

So I did get what I need, sort of, but the textTracks and related APIs for building captions myself really sucks are not consistent between browsers.

I wish browsers would just build it in to their players like they do with html5 video, but I guess most devs watch Anime with subtitles and don't listen to Anime audios, so they don't have a personal need.

On 06/27/2017 09:50 AM, Terrill Thompson wrote:
> Able Player (free open source HTML5 media player) supports <track> on 
> <audio>.
> http://ableplayer.github.io/ableplayer/

> <http://ableplayer.github.io/ableplayer/>
>
> For track kind="captions" or kind="subtitles" it displays the text in 
> an interactive transcript. There are several options as to how that is 
> rendered, defined on the Able Player home page. Here's an example, 
> with the transcript rendered as a pop-up, triggered by the "Show Transcript"
> button on the controller (the default rendering):
> http://ableplayer.github.io/ableplayer/demos/audio4.html
>
> If multiple tracks are included in different languages, a select field 
> will appears at the top of the transcript that enables users to select 
> the language.
>
> Here's another example, which uses track kind="metadata" to display 
> supplemental text in sync with the audio:
> http://ableplayer.github.io/ableplayer/demos/audio5.html

>
> Hope that helps!
>
> Cheers,
> Terrill
>
>
>
>
> ---
> Terrill Thompson
> Technology Accessibility Specialist
> DO-IT, Accessible Technology Services
> UW Information Technology
> University of Washington
> tft@uw.edu <mailto:tft@uw.edu>
>
> On Mon, Jun 26, 2017 at 10:52 AM, Jim Allan <jimallan@tsbvi.edu 
> <mailto:jimallan@tsbvi.edu>> wrote:
>
>     http://caniuse.com/#feat=webvtt <http://caniuse.com/#feat=webvtt>
>     http://w3c.github.io/html/semantics-embedded-content.html#the-track-element

>     
> <http://w3c.github.io/html/semantics-embedded-content.html#the-track-e

> lement>
>
>     On Sat, Jun 24, 2017 at 9:36 PM, Michael A. Peters
>     <mpeters@domblogger.net <mailto:mpeters@domblogger.net>> wrote:
>
>         According to
>         https://www.iandevlin.com/blog/2015/12/html5/webvtt-and-audio

>         <https://www.iandevlin.com/blog/2015/12/html5/webvtt-and-audio>
>         the html5 audio element does not support the track element.
>
>         Using the video element instead sometimes works with audios, but
>         not always.
>
>         Are they any plans to add proper support for the track element,
>         or another way of adding WebVTT subtitles to html5 audio?
>
>
>
>
>     --
>     Jim Allan, Accessibility Coordinator
>     Texas School for the Blind and Visually Impaired
>     1100 W. 45th St., Austin, Texas 78756
>     voice 512.206.9315 <tel:(512)%20206-9315>    fax: 512.206.9264
>     <tel:(512)%20206-9264>  http://www.tsbvi.edu/

>     "We shape our tools and thereafter our tools shape us." McLuhan, 
> 1964
>
>

Received on Sunday, 2 July 2017 16:47:29 UTC