Skip to content

What is a subtitle style store?

ISubtitleStyleStore is a contract for persisting and restoring the user’s subtitle style preferences across page reloads. The player does not wire one in: player.subtitleStyle() keeps the style in memory and emits the subtitleStyle event, and persistence is left to the consumer. StorageBackedSubtitleStyleStore is an exported reference implementation that uses the core’s IStorage adapter (so the storage backend is swappable); you call it from your own code.

ISubtitleStyleStore interface

TypeScript
import type { ISubtitleStyleStore } from '@nomercy-entertainment/nomercy-video-player';
MethodSignatureDescription
load()() => Promise<Partial<SubtitleStyle> | null>Load the persisted style. Returns null when no preference has been saved
save(style)(style: SubtitleStyle) => Promise<void>Persist the full merged style. Call this from your own subtitleStyle event listener
clear()() => Promise<void>Clear persisted preferences (e.g. “reset to defaults”)

How to wire it

The player never calls these methods for you, so wire the store yourself:

  • load(): call once after ready() and apply the result with player.subtitleStyle(style).
  • save(style): call from a subtitleStyle event listener so each change is persisted.
  • clear(): call from a “Reset subtitle preferences” control in your settings screen.

SubtitleStyle

SubtitleStyle is defined in @nomercy-entertainment/nomercy-player-core and covers all user-facing subtitle appearance options:

FieldTypeDescription
fontFamilystringCSS font-family string
fontSizenumberScale percentage (100 = default size)
textColorstringCSS color string for subtitle text
textOpacitynumber0–100 opacity for text
backgroundColorstringCSS color string for text background
backgroundOpacitynumber0–100 opacity for text background
edgeStylestringText shadow style: 'none', 'dropShadow', 'raised', 'depressed', 'uniform', 'textShadow'
areaColorstringCSS color string for the subtitle area background
windowOpacitynumber0–100 opacity for the area background

Reading and writing style

TypeScript
// Read current style
const style = player.subtitleStyle();

// Merge a partial update; emits the 'subtitleStyle' event
player.subtitleStyle({
  fontSize: 120,
  textColor: 'yellow',
});

The 'subtitleStyle' event fires after each update, carrying the new full style. The SubtitleOverlayPlugin subscribes to this event to repaint active cue areas immediately.

See also