Resource Audio

In several locations in Immersive, an audio player icon is displayed next to a Resource (Sentence, Word, Conjugation, Lemma, Verbal), the user can click the audio icon to hear a machine-produced pronouncation of that audio.

Immersive creates and attaches audio files for Resources, using a Just-in-time approach, using the correct voice for the language code associated with the Resource. The audio is stored in S3 via ActiveStorage. The audio player icon is always displayed, and when it is clicked there can be three possible states:

1. There is audio attached: the audio is played with a small JS snippet.
2. There is no audio attached: a synchronous call is made to create and attach the audio and then it is immediately displayed
3. There is audio attached but playing it causes an error (perhaps the audio file is lost), a synchronous call is made to recreate it as in state 2.

Background Audio Preparation

For verb resources, when a verb lemma is accessed via the show view, a background job (Resources::Verbs::PrepareAudioJob) is triggered to assess and create audio for all subordinate Resources in the target language, including:

• All conjugations for the verb lemma in the target language
• All example sentences related to those conjugations in the target language

This background preparation ensures that audio is available when users interact with the verb conjugations, improving the user experience by reducing wait times for audio generation.

Audio Player Implementation

The audio_player_for helper method is used to display audio players for resources. It:

• Always displays a clickable audio icon, even when audio is not yet attached
• Includes data attributes (resource type, resource ID, text field) to enable on-demand audio creation
• Handles errors gracefully by attempting to recreate audio when playback fails
• Only displays audio players for resources in the target language (for verb conjugations)

The JavaScript playAudio function handles audio playback and automatically creates audio when needed via an API call to /api/resources/audio.