Audio Clip
This guide will walk you through the steps of splitting an audio file into multiple clips, offsetting the start time of each clip, and trimming them.
Manual Approach
Setup
First, let’s fetch an MP3 file of a piano recording and create an audio clip from it:
import * as core from '@diffusionstudio/core';
const source = await core.Source.from<core.AudioSource>('https://diffusion-studio-public.s3.eu-central-1.amazonaws.com/audio/piano.mp3');
const clip0 = await composition.add(new core.AudioClip(source));
Hint: The MP3 file contains 16 seconds of audio.
Splitting the AudioClip
Splitting a clip creates a new copy of the clip that starts 1 millisecond after the specified split time (in frames). The original clip is shortened to end at the split time.
const clip1 = await clip0.split('8s');
In this example, 8s
represents the midpoint of the audio clip.
Manipulating the Clips
We can then manipulate each clip individually:
clip0.subclip(15, 80).offset(-15);
This code trims the first clip from frame 15 to frame 80 and offsets it by -15 frames, moving it to the start of the composition.
clip1
.subclip(420)
.offset(-420 + clip0.stop.frames);
clip1.volume = 0.5;
For the second clip:
- It is trimmed from frame 420 (14 seconds) to the end of the clip (16 seconds).
- It is offset by
-420
frames to align it with the start of the composition. Since the first clip (clip0
) already occupies the start position, we adjust the offset by adding the stop frame of the first clip. - The volume is reduced to 50% for demonstration purposes.
Automated Approach
To achieve the same result more efficiently, we can use a sequential layer:
const layer = composition.createLayer().sequential();
await layer.add(
new core.AudioClip('https://diffusion-studio-public.s3.eu-central-1.amazonaws.com/audio/piano.mp3')
);
In this approach:
- A new layer is created and converted to a sequential layer using
.sequential()
. - An audio clip is appended to the layer using the loaded audio source.
Manipulating the Clips
Using the track reference, we can manipulate the clips without needing to manage individual clip references:
await track.clips[0].split(240); // Split the first clip
track.clips[0].subclip(15, 80); // Trim the first clip
track.clips[1].subclip(420); // Trim the second clip
With the stacked track approach, the offsets are automatically handled, making it easier to manage clip positions within the composition.
Captions
The AudioClip
(and VideoClip
) also makes it easy to add captions to your composition. Let’s see this in action:
clip0.transcript = new core.Transcript(); // Assume this is populated with data
await composition.createCaptions(clip0);