WebVTT

WebVTT (Web Video Text Track Format) is supported by many internet browsers and video players, but every one of them seems to interpret it differently. Subtitles are always displayed somehow, but their position, size and styling can vary.

Rendering

Underword allows editing all the subtitle and region attributes defined by WebVTT, but the resulting rendering may be different from other video players.

Custom CSS styling is not supported.

  • Subtitle
    • Writing direction: how the text grows.
      • Horizontal: horizontally, from left to right or right to left.
      • Vertical growing left/right: vertically, from left to right or right to left.
    • Line: the vertical text position in the viewport (or horizontal text position for vertical writing direction).
      • Line number: a positive line number from the top of the viewport (or right/left for vertical writing direction), or a negative line number from the bottom of the viewport (or left/right for vertical writing direction).
      • Viewport percentage: a percentage of the viewport height (or viewport width for vertical writing direction).
      • Auto: equivalent to Line number: -1, line alignment: end.
    • Line alignment: the part of the text that the viewport position given by Line is aligned to.
      • Start: the top edge (or right/left edge for vertical writing direction).
      • Center: the vertical center (or horizontal center for vertical writing direction).
      • End: the bottom edge (or left/right edge for vertical writing direction).
    • Position: the horizontal text position in the viewport (or vertical text position for vertical writing direction).
      • Viewport percentage: a percentage of the viewport width (or height for vertical writing direction).
      • Auto: if Text alignment: left, equivalent to Viewport percentage: 0%, if Text alignment: right, equivalent to Viewport percentage: 100%, otherwise Viewport percentage: 50%.
    • Position alignment: the part of the text that the viewport position given by Position is aligned to.
      • Left: the left edge (or top edge for vertical writing direction).
      • Center: the horizontal center.
      • Right: the right edge (or bottom edge for vertical writing direction).
      • Auto: if Text alignment: start, equivalent to left (for left to right text) or right (for right to left text), if Text alignment: end, equivalent to right (for left to right text) or left (for right to left text), otherwise equivalent to Text alignment.
    • Text alignment: how the text is aligned within its bounding box.
      • Start: equivalent to Text alignment: left (for left to right text) or Text alignment: right (for right to left text).
      • Center: the text is aligned to the center.
      • End: equivalent to Text alignment: right (for left to right text) or Text alignment: left (for right to left text).
      • Left: the text is aligned to the left edge (or top edge for vertical writing direction).
      • Right: the text is aligned to the right edge (or bottom edge for vertical writing direction).

Subtitles have an implicit width (or height for vertical writing direction): for Position alignment: center, the text can expand in both directions at the same pace until either edge touches the viewport bounds. Otherwise, one edge of the text is fixed at Position alignment and the other edge can expand until it touches the viewport bounds. Each newline or soft wrap (in case the text doesn’t fit on a single line) causes the text to expand vertically (or horizontally for vertical writing direction) without bounds.

  • Region
    • Width: the horizontal size, a percentage of the viewport width.
    • Lines: the vertical size, expressed in a positive number of lines.
    • Anchor point: the point in region bounding box coordinates used to position the region.
    • Viewport anchor point: the point in viewport coordinates where the region anchor point is pinned to.
    • Scroll value: the behaviour of new text added to the region.
      • None: if the region already displays some text, new text is placed as close as possible to the bottom edge of the region.
      • Up: new text always appears at the bottom edge of the region and pushes existing text up.

Underword interprets regions as boxes that cannot overflow on the sides, but can overflow on the top or bottom (depending on the alignment). If a subtitle is positioned via the Line and Position attributes relative to the viewport, those attributes are calculated relative to the region bounding box instead.

File saving

To make the editor as intuitive as possible, Underword makes some assumptions and produces an output file that may be slightly different from the input file. This is only relevant if you’re also working with the source text of the .vtt file.

  • Note blocks: Notes are always associated with a subtitle (they can be edited in the corresponding settings). When loading a document, all note blocks that appear before the first subtitle are merged and attached to the first subtitle. Notes after the last subtitle are discarded. When saving a document, if a subtitle has an associated note, the note block is output directly before the subtitle block.
  • Style blocks: Style blocks are written to the output file in the same order they appear in the input file, but are not supported by the subtitle preview and cannot be edited in Underword.