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-element>
>
>     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 Saturday, 1 July 2017 20:14:51 UTC