Word (IWord)

A timed lyrics word with part-of-speech tagging and character children.

IWord represents a single word within a phrase. It extends ITextUnit → IRenderingUnit, and carries part-of-speech information useful for language-aware styling.

Inheritance chain: IWord → ITextUnit → IRenderingUnit → TimedObject

export declare interface IWord extends ITextUnit {
  readonly parent: IPhrase;
  readonly children: IChar[];
  readonly previous: IWord;
  readonly next: IWord;
  readonly pos: string;
  readonly rawPos: string;
  readonly language: string;
  readonly charCount: number;
  readonly firstChar: IChar;
  readonly lastChar: IChar;
  findIndex(unit: IChar): number;
}

IWord properties

parent · IPhrase

The phrase that contains this word.

children · IChar[]

The characters that make up this word, in order.

previous · IWord

The word immediately before this one within the video, or null if this is the first word.

next · IWord

The word immediately after this one within the video, or null if this is the last word.

pos · string

Normalized part-of-speech abbreviation.

Show POS codes

Code	Part of speech
N	Noun
PN	Pronoun
V	Verb
R	Adverb
J	Adjective
A	Adnominal adjective
P	Particle
M	Modal
W	Wh-word
D	Determiner
I	Conjunction
U	Interjection
F	Prefix
S	Symbol
X	Other

rawPos · string

The raw part-of-speech tag as returned by the underlying NLP library — NLTK for English, MeCab for Japanese.

language · string

The language of this word. Either "en" (English) or "ja" (Japanese).

charCount · number

Number of characters in this word.

firstChar · IChar

The first character in this word.

lastChar · IChar

The last character in this word.

IWord methods

findIndex

Returns the index of a character within this word.

unit · IChar · required

The character whose index you want.

Returns number

---

Inherited from ITextUnit

text · string

The plain text of this word.

---

Inherited from IRenderingUnit

startTime · number

Start time of this word in milliseconds.

endTime · number

End time of this word in milliseconds.

duration · number

Duration of this word in milliseconds.

animate · RenderingUnitFunction

Assign a function here to override the default template animation for this word.

progress

time · number · required

Position in the song [ms].

Returns number — [0, 1] position within this word’s time span.

getType

Returns number — always 2 (UnitTypes.WORD) for words.

---

WordData

WordData is the serialization format used when building video data from JSON.

export declare interface WordData extends UnitData {
  characters: CharData[];
  pos?: string;
  rawPoS?: string;
  language?: string;
}

export declare interface UnitData {
  startTime?: number;
  endTime?: number;
}

Show WordData properties

characters · CharData[]

The character data objects that make up this word.

pos · string

Optional normalized POS tag.

rawPoS · string

Optional raw POS tag from NLTK or MeCab.

language · string

Optional language code ("en" or "ja").

startTime · number

Optional override for word start time [ms].

endTime · number

Optional override for word end time [ms].

---

Examples

Check POS and apply different styles to nouns

player.addListener({
  onTimeUpdate(position: number) {
    const word = player.video.findWord(position);
    if (!word) return;

    const el = document.getElementById('word-display')!;
    el.textContent = word.text;

    if (word.pos === 'N') {
      // Highlight nouns in a distinct colour
      el.style.color = '#ff6b6b';
    } else if (word.pos === 'V') {
      // Style verbs differently
      el.style.color = '#4ecdc4';
    } else {
      el.style.color = '#ffffff';
    }
  }
});

Iterate word.children to animate individual characters

player.addListener({
  onVideoReady(v: IVideo) {
    // Attach a per-character animate function via each word
    for (const phrase of v.phrases) {
      for (const word of phrase.children) {
        for (const char of word.children) {
          char.animate = (now: number, u: IRenderingUnit) => {
            const p = char.progress(now); // [0, 1]
            animateCharacter(char, p);
          };
        }
      }
    }
  }
});

function animateCharacter(char: IChar, progress: number) {
  // Example: fade in during the first 20% of the character's duration
  const opacity = Math.min(progress / 0.2, 1);
  // Apply to your canvas or DOM element...
}

word.children and word.charCount give you direct access to the characters within a word without traversing the full video character list.