load() API
Load media elements (videos, images, audio, text) into your project.
example.js
await project.load([
{
type: 'video',
url: './assets/video.mp4',
position: 0,
end: 10,
cutFrom: 2,
},
{
type: 'audio',
url: 'https://example.com/audio.mp3',
position: 0,
end: 15
},
{
type: 'text',
text: 'Hello World',
position: 5,
end: 10,
fontSize: 48,
fontColor: 'white'
}
]);
Media options
Video options
Option |
Type |
Default |
Description |
type |
string |
required |
Must be 'video' |
url |
string |
required |
Path or URL to the video file |
position |
number |
required |
Start position in seconds in the output video |
end |
number |
required |
End position in seconds in the output video |
cutFrom |
number |
0 |
Optional: Start cutting from
this position in the source video
|
volume |
number |
1.0 |
Optional: Volume level (1.0 is
normal)
|
Audio options
Option |
Type |
Default |
Description |
type |
string |
required |
Must be 'audio' |
url |
string |
required |
Path or URL to the audio file |
position |
number |
required |
Start position in seconds in the output video |
end |
number |
required |
End position in seconds in the output video |
volume |
number |
1.0 |
Optional: Volume level (1.0 is
normal)
|
Text options
Option |
Type |
Default |
Description |
type |
string |
required |
Must be 'text' |
text |
string |
required |
The text to display |
position |
number |
required |
Start position in seconds in the output video |
end |
number |
required |
End position in seconds in the output video |
fontSize |
number |
48 |
Optional: Font size in pixels |
fontColor |
string |
'white' |
Optional: Font color (CSS color name or hex) |
centerX |
number |
0 |
Optional:Center X position (default:
centered)
|
centerY |
number |
0 |
Optional:Center Y position (default:
centered)
|
x |
number |
null |
Optional:Top left X position (default:
null)
|
y |
number |
null |
Optional:Top left Y position (default:
null)
|
fontFile |
string |
Arial |
Optional: Path to a custom font file (.ttf)
|
borderColor |
string |
null |
Optional: Color of the text border (CSS color name or hex)
|
borderWidth |
number |
0 |
Optional: Width of the text border in pixels
|
shadowColor |
string |
null |
Optional: Color of the text shadow (CSS color name or hex)
|
shadowX |
number |
0 |
Optional: Horizontal offset of the shadow in pixels
|
shadowY |
number |
0 |
Optional: Vertical offset of the shadow in pixels
|
backgroundColor |
string |
null |
Optional: Background color for the text (CSS color name or hex)
|
padding |
number |
0 |
Optional: Padding around the text in pixels
|
Examples
Concatenate multiple videos
example.js
await project.load([
{ type: 'video', url: 'video1.mp4', position: 0, end: 5 },
{ type: 'video', url: 'video2.mp4', position: 5, end: 10 },
{ type: 'video', url: 'video3.mp4', position: 10, end: 15 }
]);
await project.export({ outputPath: 'concatenated.mp4' });
Add text overlay
example.js
await project.load([
{ type: 'video', url: 'background.mp4', position: 0, end: 10 },
{
type: 'text',
text: 'Hello World',
position: 2,
end: 8,
fontSize: 64,
fontColor: 'white'
}
]);
await project.export({ outputPath: 'text_overlay.mp4' });
Add background music
example.js
await project.load([
{
type: 'video',
url: 'video.mp4',
position: 0,
end: 30,
// Lower the original video volume
volume: 0.3
},
{
type: 'audio',
url: 'music.mp3',
position: 0,
end: 30,
// Set the background music volume
volume: 0.8
}
]);
await project.export({ outputPath: 'video_with_music.mp4' });
Use custom font for text
example.js
await project.load([
{ type: 'video', url: 'background.mp4', position: 0, end: 10 },
{
type: 'text',
text: 'Custom Font Example',
position: 2,
end: 8,
fontSize: 64,
fontColor: 'white',
fontFile: './assets/fonts/Montserrat-Bold.ttf'
}
]);
await project.export({ outputPath: 'custom_font.mp4' });
Text with stroke
example.js
await project.load([
{ type: 'video', url: 'background.mp4', position: 0, end: 10 },
{
type: 'text',
text: 'Stroke Text',
position: 2,
end: 8,
fontSize: 72,
fontColor: 'white',
// Add a black stroke
borderColor: 'black',
borderWidth: 3,
}
]);
await project.export({ outputPath: 'text_with_stroke.mp4' });
Text with shadow
example.js
await project.load([
{ type: 'video', url: 'background.mp4', position: 0, end: 10 },
{
type: 'text',
text: 'Shadow Text',
position: 2,
end: 8,
fontSize: 72,
fontColor: 'white',
// Add a black shadow
shadowColor: '#000000',
shadowX: 4,
shadowY: 4,
}
]);
await project.export({ outputPath: 'text_with_shadow.mp4' });