WebVTT: support styled cues and voice spans #218
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR adds support for advanced WebVTT features such as text formatting, CSS styling, voice spans, and Ruby characters.
To do so, I had to switch VTT parsing from
node-webvtt
tovtt.js
.vtt.js
is older, but neither of them has seen significant development in years, so I'm going with the theory that the lack of activity means more "stable" and less "abandoned."The main advantage of this approach is access to the
WebVTT.convertCueToDOMTree()
method, which converts each WebVTT cue to a DOMDocumentFragment
according to the guidelines laid out in Section 6.5 of the WebVTT W3C recommendation. This allows the consuming application to style cues according to class or voice in addition to stripping out any other tags that shouldn't be there.Behavior for untagged cues is unchanged.
Example
Cue
Before
After (with styling applied to the resulting
.webvtt-cue [title="..."]
selectors)