capacitor-plugin-video-editor

Capacitor plugin to edit videos

Install (Capacitor 7.x)

``bash
npm install @whiteguru/capacitor-plugin-video-editor
npx cap sync
`

Install (Capacitor 6.x)

`bash
npm install @whiteguru/capacitor-plugin-video-editor@^6.1.2
npx cap sync
`

$3

`bash
npm install @whiteguru/capacitor-plugin-video-editor@^5.0.6
npx cap sync
`

$3

`bash
npm install @whiteguru/capacitor-plugin-video-editor@^4.0.4
npx cap sync
`

$3

`bash
npm install @whiteguru/capacitor-plugin-video-editor@^3.0.1
npx cap sync
`

Android

This API requires the following permissions be added to your AndroidManifest.xml:

`xml

`

You can also specify those permissions only for the Android versions where they will be requested:

`xml

`

The storage permissions are for reading video files.

Read about Setting Permissions in the Android Guide for more information on setting Android permissions.

Example

`typescript
import { VideoEditor, MediaFileResult } from '@whiteguru/capacitor-plugin-video-editor';

const sourceVideoPath = 'file:///var/mobile/Containers/Data/...../sourceVideo.mp4';

// Transcode with progress
const progressListener = await VideoEditor.addListener('transcodeProgress', (info) => console.log('info', info));

VideoEditor.edit({
path: sourceVideoPath,
transcode: {
width: 720,
height: 480,
keepAspectRatio: true,
fps: 30,
},
trim: {
startsAt: 3 * 1000, // from 00:03
endsAt: 10 * 1000, // to 00:10
},
}).then(
(mediaFileResult: MediaFileResult) => {
progressListener.remove();

console.log('mediaPath', mediaFileResult.file.path);
},
(error) => {
console.error('error', error);
},
);

// Thumbnail
VideoEditor.thumbnail({
path: sourceVideoPath,
width: 150,
height: 150,
at: 4 * 1000, // at 00:04
}).then(
(thumbMediaFileResult: MediaFileResult) => {
console.log('thumbPath', thumbMediaFileResult.file.path);
},
(error) => {
console.error('error', error);
},
);
`

API

* edit(...)
* thumbnail(...)
* addListener('transcodeProgress', ...)
* Interfaces

$3

`typescript
edit(options: EditOptions) => Promise
`

| Param | Type |
| ------------- | --------------------------------------------------- |
| options | EditOptions |

Returns: Promise<MediaFileResult>

--------------------

$3

`typescript
thumbnail(options: ThumbnailOptions) => Promise
`

| Param | Type |
| ------------- | ------------------------------------------------------------- |
| options | ThumbnailOptions |

Returns: Promise<MediaFileResult>

--------------------

$3

`typescript
addListener(eventName: 'transcodeProgress', listenerFunc: (info: ProgressInfo) => void) => Promise & PluginListenerHandle
`

| Param | Type |
| ------------------ | ------------------------------------------------------------------------ |
| eventName | 'transcodeProgress' |
| listenerFunc | (info: ProgressInfo) => void |

Returns: Promise<PluginListenerHandle> & PluginListenerHandle

--------------------

$3


#### MediaFileResult

| Prop | Type |
| ---------- | ----------------------------------------------- |
| file | MediaFile |


#### MediaFile

| Prop | Type | Description |
| ---------- | ------------------- | ----------------------------------------------- |
| name | string | The name of the file, without path information. |
| path | string | The full path of the file, including the name. |
| type | string | The file's mime type |
| size | number | The size of the file, in bytes. |


#### EditOptions

| Prop | Type |
| --------------- | ------------------------------------------------------------- |
| path | string |
| trim | TrimOptions |
| transcode | TranscodeOptions |


#### TrimOptions

| Prop | Type | Description |
| -------------- | ------------------- | ------------------------ |
| startsAt | number | StartsAt in milliseconds |
| endsAt | number | EndsAt in milliseconds |


#### TranscodeOptions

| Prop | Type | Description |
| --------------------- | -------------------- | --------------------------------- |
| height | number | |
| width | number | |
| keepAspectRatio | boolean | Keep Aspect Ratio, default true |
| fps | number | Frames per second, default 30 |


#### ThumbnailOptions

| Prop | Type | Description |
| ------------ | ------------------- | -------------------------------------------------------------------- |
| path | string | |
| at | number | The time position where the frame will be retrieved in milliseconds. |
| width | number | |
| height | number | |


#### PluginListenerHandle

| Prop | Type |
| ------------ | ----------------------------------------- |
| remove | () => Promise<void> |


#### ProgressInfo

| Prop | Type |
| -------------- | ------------------- |
| progress` | number |