FFmpegKit for React Native

https://github.com/yspreen/ffmpeg-kit-react-native
Admin
FFmpegKit for React Native is a library that integrates FFmpeg and FFprobe into React Native...
Tokens:7,906
Snippets:41
Trust Score:8.4
Update:10 months ago
Show doc for...
Tokens:
Raw
### Get Media Information using FFprobeKit

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

Retrieves detailed media information for a given file or URL using FFprobeKit. Handles potential errors by checking the session state and return code.

```javascript
FFprobeKit.getMediaInformation(testUrl).then(async (session) => {
  const information = await session.getMediaInformation();

  if (information === undefined) {
    const state = FFmpegKitConfig.sessionStateToString(await session.getState());
    const returnCode = await session.getReturnCode();
    const failStackTrace = await session.getFailStackTrace();
    const duration = await session.getDuration();
    const output = await session.getOutput();
  }
});
```

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

### Query Environment and Build Information with FFmpegKit React Native

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

This snippet demonstrates how to retrieve various environment and build-related information using the FFmpegKitConfig and related modules. It covers fetching FFmpegKit and FFmpeg versions, checking for LTS builds, obtaining build dates, platform and architecture details, package names, enabled external libraries, and setting environment variables. Ensure the '@spreen/ffmpeg-kit-react-native' package is installed.

```javascript
import { FFmpegKitConfig, Packages, ArchDetect } from '@spreen/ffmpeg-kit-react-native';

// Get FFmpegKit version
FFmpegKitConfig.getVersion().then((version) => {
  console.log('FFmpegKit version:', version);
});

// Get FFmpeg version
FFmpegKitConfig.getFFmpegVersion().then((version) => {
  console.log('FFmpeg version:', version);
});

// Check if LTS build
FFmpegKitConfig.isLTSBuild().then((isLTS) => {
  console.log('Is LTS build:', isLTS);
});

// Get build date
FFmpegKitConfig.getBuildDate().then((buildDate) => {
  console.log('Build date:', buildDate);
});

// Get platform
FFmpegKitConfig.getPlatform().then((platform) => {
  console.log('Platform:', platform); // 'ios' or 'android'
});

// Get architecture
ArchDetect.getArch().then((arch) => {
  console.log('Architecture:', arch); // e.g., 'arm64-v8a', 'x86_64'
});

// Get package name
Packages.getPackageName().then((packageName) => {
  console.log('Package name:', packageName); // e.g., 'full-gpl', 'min', 'https'
});

// Get enabled external libraries
Packages.getExternalLibraries().then((libraries) => {
  console.log('External libraries:', libraries);
  // e.g., ['x264', 'x265', 'libvpx', 'lame', 'opus', ...]
});

// Set environment variable
FFmpegKitConfig.setEnvironmentVariable('MY_VAR', 'value').then(() => {
  console.log('Environment variable set');
});
```

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

### Enable FFmpegKit Package on iOS

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

This code snippet shows how to enable a specific FFmpegKit package on iOS by updating the `ios/Podfile`. It requires adding the package name as a subspec to the `@spreen/ffmpeg-kit-react-native` pod definition and then running `pod install`. Be mindful of potential conflicts if `use_native_modules!` is already present.

```ruby
pod '@spreen/ffmpeg-kit-react-native', :subspecs => ['<package name>'], :podspec => '../node_modules/@spreen/ffmpeg-kit-react-native/@spreen/ffmpeg-kit-react-native.podspec'

```

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

### Enable Log Callback in JavaScript

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

This callback is triggered whenever a session generates log messages during its operation. It allows you to capture and process these logs, for example, by retrieving the message content.

```javascript
FFmpegKitConfig.enableLogCallback(log => {
  const message = log.getMessage();
});
```

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

### Execute FFprobe Commands with FFprobeKit

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Allows running custom FFprobe commands for specialized media analysis. It provides options for synchronous execution, execution with argument arrays, and asynchronous execution with callbacks for logs and completion. The output can be controlled via FFprobe's formatting options.

```javascript
import { FFprobeKit } from '@spreen/ffmpeg-kit-react-native';

// Execute synchronous FFprobe command
FFprobeKit.execute('-v error -show_format -show_streams video.mp4').then(async (session) => {
  const returnCode = await session.getReturnCode();
  const output = await session.getOutput();

  console.log('FFprobe output:', output);
});

// Execute with custom arguments
const probeArgs = ['-v', 'error', '-select_streams', 'v:0', '-show_entries', 'stream=width,height,codec_name', '-of', 'json', 'video.mp4'];
FFprobeKit.executeWithArguments(probeArgs).then(async (session) => {
  const logs = await session.getLogs();
  logs.forEach((log) => {
    console.log(log.getMessage());
  });
});

// Asynchronous execution with callbacks
FFprobeKit.executeAsync(
  '-v error -count_frames -show_format video.mp4',
  async (session) => {
    console.log('FFprobe completed');
    const output = await session.getOutput();
    console.log('Results:', output);
  },
  (log) => {
    console.log(`Log: ${log.getMessage()}`);
  }
);
```

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

### Enable FFmpegKit Package on Android

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

This code snippet demonstrates how to enable a specific FFmpegKit package on Android by modifying the `android/build.gradle` file. It involves setting the `ffmpegKitPackage` variable within the `ext` block. Ensure the package name is correctly specified.

```gradle
ext {
    ffmpegKitPackage = "<package name>"
}

```

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

### Execute FFprobe Commands

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

Executes FFprobe commands to retrieve information about media files. It returns a session object that can be used to access the execution details.

```javascript
FFprobeKit.execute(ffprobeCommand).then(async (session) => {
  // CALLED WHEN SESSION IS EXECUTED
});
```

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

### Configure Global Callbacks for FFmpegKit Sessions

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Set up global callbacks to handle logs, statistics, and completion events for all FFmpeg and FFprobe sessions. This allows for centralized monitoring and handling of session lifecycles. Dependencies include `@spreen/ffmpeg-kit-react-native`.

```javascript
import { FFmpegKitConfig, Level } from '@spreen/ffmpeg-kit-react-native';

// Set global log callback for all sessions
FFmpegKitConfig.enableLogCallback((log) => {
  const levelStr = Level.levelToString(log.getLevel());
  const message = log.getMessage();
  console.log(`[${levelStr}] Session ${log.getSessionId()}: ${message}`);
});

// Set global statistics callback for FFmpeg sessions
FFmpegKitConfig.enableStatisticsCallback((statistics) => {
  const progress = {
    sessionId: statistics.getSessionId(),
    frame: statistics.getVideoFrameNumber(),
    fps: statistics.getVideoFps(),
    quality: statistics.getVideoQuality(),
    size: statistics.getSize(),
    time: statistics.getTime(),
    bitrate: statistics.getBitrate(),
    speed: statistics.getSpeed()
  };
  console.log('Encoding progress:', progress);
});

// Set global FFmpeg session complete callback
FFmpegKitConfig.enableFFmpegSessionCompleteCallback(async (session) => {
  const sessionId = session.getSessionId();
  const returnCode = await session.getReturnCode();
  const duration = await session.getDuration();

  console.log(`FFmpeg session ${sessionId} completed in ${duration}ms with code ${returnCode.getValue()}`);
});

// Set global FFprobe session complete callback
FFmpegKitConfig.enableFFprobeSessionCompleteCallback(async (session) => {
  console.log(`FFprobe session ${session.getSessionId()} completed`);
});

// Set global MediaInformation session complete callback
FFmpegKitConfig.enableMediaInformationSessionCompleteCallback(async (session) => {
  const mediaInfo = session.getMediaInformation();
  if (mediaInfo) {
    console.log(`Media info retrieved: ${mediaInfo.getFormat()} - ${mediaInfo.getDuration()}s`);
  }
});

// Configure log level
FFmpegKitConfig.setLogLevel(Level.AV_LOG_INFO);
```

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

### Execute FFmpeg Commands and Handle Sessions

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

Executes FFmpeg commands and provides access to session details like return code, command, state, and logs. It's essential for understanding the outcome of FFmpeg operations.

```javascript
import { FFmpegKit, ReturnCode } from '@spreen/ffmpeg-kit-react-native';

FFmpegKit.execute('-i file1.mp4 -c:v mpeg4 file2.mp4').then(async (session) => {
  const returnCode = await session.getReturnCode();

  if (ReturnCode.isSuccess(returnCode)) {
    // SUCCESS
  } else if (ReturnCode.isCancel(returnCode)) {
    // CANCEL
  } else {
    // ERROR
  }
});
```

```javascript
FFmpegKit.execute('-i file1.mp4 -c:v mpeg4 file2.mp4').then(async (session) => {
  const sessionId = session.getSessionId();
  const command = session.getCommand();
  const commandArguments = session.getArguments();
  const state = await session.getState();
  const returnCode = await session.getReturnCode();
  const startTime = session.getStartTime();
  const endTime = await session.getEndTime();
  const duration = await session.getDuration();
  const output = await session.getOutput();
  const failStackTrace = await session.getFailStackTrace();
  const logs = await session.getLogs();
  const statistics = await session.getStatistics();
});
```

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

### Enable Global Session Complete Callbacks

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

Enables global callbacks that are triggered when FFmpeg or FFprobe asynchronous sessions complete. This allows for centralized handling of session completion events.

```javascript
FFmpegKitConfig.enableFFmpegSessionCompleteCallback(session => {
  const sessionId = session.getSessionId();
});
```

```javascript
FFmpegKitConfig.enableFFprobeSessionCompleteCallback(session => {
  const sessionId = session.getSessionId();
});
```

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

### Named Pipes for Media Streaming

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Demonstrates the creation and management of named pipes for advanced media streaming and real-time processing workflows. This allows FFmpegKit to read from or write to pipes, facilitating complex data transfer scenarios.

```javascript
import { FFmpegKitConfig, FFmpegKit } from '@spreen/ffmpeg-kit-react-native';

// Register a new FFmpeg pipe
FFmpegKitConfig.registerNewFFmpegPipe().then((pipePath) => {
  console.log('Created pipe:', pipePath);

  // Write data to pipe in background
  FFmpegKitConfig.writeToPipe('/path/to/input.mp4', pipePath).then((result) => {
    if (result === 0) {
      console.log('Data written to pipe successfully');
    } else {
      console.error('Failed to write to pipe');
    }
  });

  // Use pipe as input in FFmpeg command
  FFmpegKit.executeAsync(`-i ${pipePath} -c:v libx264 -preset fast output.mp4`, async (session) => {
    const returnCode = await session.getReturnCode();

    if (returnCode.isValueSuccess()) {
      console.log('Processed stream from pipe successfully');
    }

    // Close the pipe when done
    await FFmpegKitConfig.closeFFmpegPipe(pipePath);
    console.log('Pipe closed');
  });
});
```

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

### Advanced Configuration for FFmpegKit React Native

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

This snippet covers advanced configuration options for FFmpegKit React Native, including log redirection strategies, enabling/disabling logs and statistics, signal handling, and utilities for parsing command strings to arguments arrays and vice-versa. It requires the '@spreen/ffmpeg-kit-react-native' package. Use these configurations to fine-tune FFmpeg execution and logging behavior.

```javascript
import { FFmpegKitConfig, LogRedirectionStrategy, Signal } from '@spreen/ffmpeg-kit-react-native';

// Set log redirection strategy
FFmpegKitConfig.setLogRedirectionStrategy(LogRedirectionStrategy.PRINT_LOGS_WHEN_NO_CALLBACKS_DEFINED);

// Enable/disable logs
FFmpegKitConfig.enableLogs();
FFmpegKitConfig.disableLogs();

// Enable/disable statistics
FFmpegKitConfig.enableStatistics();
FFmpegKitConfig.disableStatistics();

// Enable/disable redirection
FFmpegKitConfig.enableRedirection();
FFmpegKitConfig.disableRedirection();

// Ignore specific signals
FFmpegKitConfig.ignoreSignal(Signal.SIGXCPU).then(() => {
  console.log('SIGXCPU signal ignored');
});

// Parse command string to arguments array
const command = '-i "file with spaces.mp4" -c:v libx264 -preset fast output.mp4';
const args = FFmpegKitConfig.parseArguments(command);
console.log('Parsed arguments:', args);
// ['i', 'file with spaces.mp4', '-c:v', 'libx264', '-preset', 'fast', 'output.mp4']

// Convert arguments array to string
const argsArray = ['-i', 'input.mp4', '-c:v', 'copy', 'output.mp4'];
const commandString = FFmpegKitConfig.argumentsToString(argsArray);
console.log('Command string:', commandString);
// '-i input.mp4 -c:v copy output.mp4'
```

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

### Execute FFmpeg Commands Asynchronously with Callbacks

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

Executes FFmpeg commands asynchronously, allowing for real-time updates on session execution, logs, and statistics through provided callbacks. This is useful for displaying progress or handling intermediate data.

```javascript
FFmpegKit.executeAsync('-i file1.mp4 -c:v mpeg4 file2.mp4', session => {
  // CALLED WHEN SESSION IS EXECUTED
}, log => {
  // CALLED WHEN SESSION PRINTS LOGS
}, statistics => {
  // CALLED WHEN SESSION GENERATES STATISTICS
});
```

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

### Set Font Directory List in JavaScript

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

This configuration allows you to register system fonts and custom font directories for FFmpegKit to utilize. It takes an array of paths to font directories.

```javascript
FFmpegKitConfig.setFontDirectoryList(["/system/fonts", "/System/Library/Fonts", "<folder with fonts>"]);
```

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

### Extract Media Information using FFprobeKit

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Retrieves detailed metadata about media files (video/audio), including format, codec, duration, bitrate, streams, and chapters. This function requires a valid file path as input and returns an object containing extracted media information.

```javascript
import { FFprobeKit } from '@spreen/ffmpeg-kit-react-native';

// Get media information from file path
FFprobeKit.getMediaInformation('video.mp4').then(async (session) => {
  const information = await session.getMediaInformation();

  if (information === undefined) {
    // Handle error case
    const state = await session.getState();
    const returnCode = await session.getReturnCode();
    const output = await session.getOutput();
    console.error(`Failed to get media information. State: ${state}, ReturnCode: ${returnCode}`);
    return;
  }

  // Access media properties
  console.log('Filename:', information.getFilename());
  console.log('Format:', information.getFormat());
  console.log('Long Format:', information.getLongFormat());
  console.log('Duration:', information.getDuration(), 'seconds');
  console.log('Start Time:', information.getStartTime());
  console.log('Size:', information.getSize(), 'bytes');
  console.log('Bitrate:', information.getBitrate(), 'kb/s');

  // Get metadata tags
  const tags = information.getTags();
  console.log('Title:', tags?.title);
  console.log('Artist:', tags?.artist);

  // Analyze streams
  const streams = information.getStreams();
  streams.forEach((stream) => {
    console.log(`Stream #${stream.getIndex()}: ${stream.getType()}`);
    console.log(`  Codec: ${stream.getCodec()} (${stream.getCodecLong()})`);

    if (stream.getType() === 'video') {
      console.log(`  Resolution: ${stream.getWidth()}x${stream.getHeight()}`);
      console.log(`  Frame Rate: ${stream.getAverageFrameRate()}`);
      console.log(`  Format: ${stream.getFormat()}`);
    } else if (stream.getType() === 'audio') {
      console.log(`  Sample Rate: ${stream.getSampleRate()} Hz`);
      console.log(`  Channels: ${stream.getChannelLayout()}`);
      console.log(`  Sample Format: ${stream.getSampleFormat()}`);
    }
  });

  // Get chapters
  const chapters = information.getChapters();
  chapters.forEach((chapter) => {
    console.log(`Chapter ${chapter.getId()}: ${chapter.getStartTime()} - ${chapter.getEndTime()}`);
  });
});
```

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

### Execute FFmpeg Commands Synchronously

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Allows synchronous execution of FFmpeg commands for video and audio processing. It accepts commands as a string or an array of arguments and returns a session object containing execution details like return code, duration, and output. Error handling for success, cancellation, and failure is provided.

```javascript
import { FFmpegKit, ReturnCode } from '@spreen/ffmpeg-kit-react-native';

// Convert video to MP4 with H264 codec
FFmpegKit.execute('-i input.mp4 -c:v mpeg4 output.mp4').then(async (session) => {
  const returnCode = await session.getReturnCode();

  if (ReturnCode.isSuccess(returnCode)) {
    console.log('Video conversion completed successfully');

    // Get execution details
    const duration = await session.getDuration();
    const output = await session.getOutput();
    console.log(`Completed in ${duration}ms`);
  } else if (ReturnCode.isCancel(returnCode)) {
    console.log('Video conversion was cancelled');
  } else {
    console.log('Video conversion failed');
    const failStackTrace = await session.getFailStackTrace();
    console.error('Error:', failStackTrace);
  }
});

// Execute with arguments array
const args = ['-i', 'input.mp4', '-vf', 'scale=1280:720', '-c:v', 'libx264', '-preset', 'fast', 'output.mp4'];
FFmpegKit.executeWithArguments(args).then(async (session) => {
  const state = await session.getState();
  const returnCode = await session.getReturnCode();
  console.log(`Session ${session.getSessionId()} completed with return code ${returnCode.getValue()}`);
});
```

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

### Execute FFmpeg Operations Asynchronously

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Enables asynchronous execution of FFmpeg commands with callbacks for real-time feedback. It supports callbacks for log messages, statistics (progress monitoring), and completion events, providing a more interactive multimedia processing experience.

```javascript
import { FFmpegKit } from '@spreen/ffmpeg-kit-react-native';

FFmpegKit.executeAsync(
  '-i input.mp4 -c:v libx264 -crf 23 -preset medium output.mp4',
  async (session) => {
    // Complete callback - called when execution finishes
    const returnCode = await session.getReturnCode();
    const duration = await session.getDuration();

    console.log(`Execution completed in ${duration}ms`);
    console.log(`Return code: ${returnCode.getValue()}`);

    if (returnCode.isValueSuccess()) {
      console.log('Encoding successful!');
    }
  },
  (log) => {
    // Log callback - receives real-time log messages
    console.log(`[${log.getLevel()}] ${log.getMessage()}`);
  },
  (statistics) => {
    // Statistics callback - receives encoding progress
    const timeInMilliseconds = statistics.getTime();
    const speed = statistics.getSpeed();
    const bitrate = statistics.getBitrate();
    const videoFrameNumber = statistics.getVideoFrameNumber();
    const videoFps = statistics.getVideoFps();
    const size = statistics.getSize();

    console.log(`Progress: frame=${videoFrameNumber} fps=${videoFps} size=${size}KB time=${timeInMilliseconds}ms bitrate=${bitrate}kbps speed=${speed}x`);
  }
);
```

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

### Retrieve Session History

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

Fetches lists of past FFmpeg, FFprobe, and MediaInformation sessions from the session history. Useful for reviewing previous operations or debugging.

```javascript
FFmpegKit.listSessions().then(sessionList => {
  sessionList.forEach(async session => {
    const sessionId = session.getSessionId();
  });
});
```

```javascript
FFprobeKit.listFFprobeSessions().then(sessionList => {
  sessionList.forEach(async session => {
    const sessionId = session.getSessionId();
  });
});
```

```javascript
FFprobeKit.listMediaInformationSessions().then(sessionList => {
  sessionList.forEach(async session => {
    const sessionId = session.getSessionId();
  });
});
```

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

### Android SAF URI Handling for FFmpegKit

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

Converts Android Storage Access Framework (SAF) URIs into usable paths for FFmpegKit and FFprobeKit. Supports both reading from and writing to SAF-managed storage locations.

```javascript
FFmpegKitConfig.selectDocumentForRead('*/*').then(uri => {
    FFmpegKitConfig.getSafParameterForRead(uri).then(safUrl => {
        FFmpegKit.executeAsync(`-i ${safUrl} -c:v mpeg4 file2.mp4`);
    });
});
```

```javascript
FFmpegKitConfig.selectDocumentForWrite('video.mp4', 'video/*').then(uri => {
    FFmpegKitConfig.getSafParameterForWrite(uri).then(safUrl => {
        FFmpegKit.executeAsync(`-i file1.mp4 -c:v mpeg4 ${safUrl}`);
    });
});
```

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

### Manage FFmpegKit Sessions: Cancel, List, and Monitor State

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Control the execution of FFmpeg and FFprobe sessions, including canceling specific or all active sessions, retrieving a list of all sessions with their status, and monitoring session states. This functionality is crucial for dynamic control and debugging. Dependencies include `@spreen/ffmpeg-kit-react-native`.

```javascript
import { FFmpegKit, FFprobeKit, FFmpegKitConfig, SessionState } from '@spreen/ffmpeg-kit-react-native';

// Cancel specific session
FFmpegKit.execute('-i input.mp4 -c:v libx264 output.mp4').then(async (session) => {
  const sessionId = session.getSessionId();

  // Cancel after 5 seconds
  setTimeout(() => {
    FFmpegKit.cancel(sessionId);
  }, 5000);
});

// Cancel all sessions
FFmpegKit.cancel();

// List all FFmpeg sessions
FFmpegKit.listSessions().then((sessions) => {
  sessions.forEach(async (session) => {
    const id = session.getSessionId();
    const command = session.getCommand();
    const state = await session.getState();
    const stateStr = FFmpegKitConfig.sessionStateToString(state);

    console.log(`Session ${id}: ${command} [${stateStr}]`);
  });
});

// Get last completed session
FFmpegKitConfig.getLastCompletedSession().then(async (session) => {
  if (session) {
    const returnCode = await session.getReturnCode();
    console.log(`Last completed session returned: ${returnCode.getValue()}`);
  }
});

// Get sessions by state
FFmpegKitConfig.getSessionsByState(SessionState.RUNNING).then((sessions) => {
  console.log(`Currently running sessions: ${sessions.length}`);
});

// Configure session history size
FFmpegKitConfig.setSessionHistorySize(50);

// Clear all sessions
FFmpegKitConfig.clearSessions();
```

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

### Enable Statistics Callback in JavaScript

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

This callback is called when a session produces statistics during its execution. It provides real-time information about the ongoing process, such as the current size.

```javascript
FFmpegKitConfig.enableStatisticsCallback(statistics => {
  const size = statistics.getSize();
});
```

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

### Font Configuration for Subtitle Rendering

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Registers custom font directories and mappings, allowing FFmpegKit to use specific fonts for rendering subtitles and text overlays in video processing. This enables customization of subtitle appearance.

```javascript
import { FFmpegKitConfig, FFmpegKit } from '@spreen/ffmpeg-kit-react-native';

// Set single font directory
FFmpegKitConfig.setFontDirectory('/path/to/fonts', {
  'Arial': 'arial.ttf',
  'Helvetica': 'helvetica.ttf',
  'CustomFont': 'custom.otf'
}).then(() => {
  console.log('Font directory registered');
});

// Set multiple font directories
const fontDirs = [
  '/system/fonts',
  '/sdcard/custom_fonts',
  '/data/local/fonts'
];

const fontMapping = {
  'MyCustomFont': 'custom_font.ttf',
  'BrandFont': 'brand.otf'
};

FFmpegKitConfig.setFontDirectoryList(fontDirs, fontMapping).then(() => {
  console.log('Multiple font directories registered');

  // Use fonts in FFmpeg command for subtitle rendering
  FFmpegKit.execute(
    "-i video.mp4 -vf \"subtitles=subtitles.srt:force_style='FontName=Arial,FontSize=24'\" output.mp4"
  ).then(async (session) => {
    const returnCode = await session.getReturnCode();
    if (returnCode.isValueSuccess()) {
      console.log('Subtitles rendered successfully');
    }
  });
});

// Set fontconfig configuration path
FFmpegKitConfig.setFontconfigConfigurationPath('/path/to/fontconfig').then(() => {
  console.log('Fontconfig path set');
});
```

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

### Enable Session Completion Callback in JavaScript

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

This callback is invoked when an FFmpeg session completes its execution. It provides access to session details, such as the session ID.

```javascript
FFmpegKitConfig.enableMediaInformationSessionCompleteCallback(session => {
  const sessionId = session.getSessionId();
});
```

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

### Android SAF URI Conversion for FFmpeg

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

Converts Android Storage Access Framework (SAF) URIs to FFmpeg-compatible paths, enabling read and write access to media files with proper permissions. This is crucial for handling user-selected files in Android applications.

```javascript
import { FFmpegKitConfig, FFmpegKit } from '@spreen/ffmpeg-kit-react-native';

// Select and read a file using SAF
FFmpegKitConfig.selectDocumentForRead('*/*').then((uri) => {
  if (uri) {
    console.log('Selected URI:', uri);

    FFmpegKitConfig.getSafParameterForRead(uri).then((safUrl) => {
      console.log('SAF URL for reading:', safUrl);

      // Use the SAF URL in FFmpeg command
      FFmpegKit.executeAsync(`-i ${safUrl} -c:v mpeg4 /sdcard/output.mp4`, async (session) => {
        const returnCode = await session.getReturnCode();
        if (returnCode.isValueSuccess()) {
          console.log('Video processed from SAF URI successfully');
        }
      });
    });
  }
});

// Select and write to a file using SAF
FFmpegKitConfig.selectDocumentForWrite('output.mp4', 'video/*').then((uri) => {
  if (uri) {
    console.log('Selected output URI:', uri);

    FFmpegKitConfig.getSafParameterForWrite(uri).then((safUrl) => {
      console.log('SAF URL for writing:', safUrl);

      // Use the SAF URL as output in FFmpeg command
      FFmpegKit.executeAsync(`-i /sdcard/input.mp4 -c:v libx264 ${safUrl}`, async (session) => {
        const returnCode = await session.getReturnCode();
        if (returnCode.isValueSuccess()) {
          console.log('Video written to SAF URI successfully');
        }
      });
    });
  }
});

// Convert SAF URI with custom open mode
FFmpegKitConfig.getSafParameter('content://com.android.providers.media.documents/document/video:12345', 'rw').then((safUrl) => {
  console.log('SAF URL with read-write mode:', safUrl);
});
```

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

### Parse FFprobe JSON Output with FFmpegKit React Native

Source: https://context7.com/yspreen/ffmpeg-kit-react-native/llms.txt

This snippet shows how to parse FFprobe JSON output directly into a MediaInformation object using the MediaInformationJsonParser from '@spreen/ffmpeg-kit-react-native'. This allows extraction of media details without executing FFprobe commands. It includes methods for parsing with and without error handling, and demonstrates accessing format, duration, size, and stream information.

```javascript
import { MediaInformationJsonParser } from '@spreen/ffmpeg-kit-react-native';

const ffprobeJsonOutput = `{
  "format": {
    "filename": "video.mp4",
    "format_name": "mov,mp4,m4a,3gp,3g2,mj2",
    "format_long_name": "QuickTime / MOV",
    "duration": "120.500000",
    "size": "15728640",
    "bit_rate": "1044915"
  },
  "streams": [
    {
      "index": 0,
      "codec_type": "video",
      "codec_name": "h264",
      "width": 1920,
      "height": 1080,
      "avg_frame_rate": "30/1"
    }
  ]
}`;

// Parse JSON to MediaInformation object
MediaInformationJsonParser.from(ffprobeJsonOutput).then((mediaInfo) => {
  console.log('Format:', mediaInfo.getFormat());
  console.log('Duration:', mediaInfo.getDuration());
  console.log('Size:', mediaInfo.getSize());

  const streams = mediaInfo.getStreams();
  streams.forEach((stream) => {
    console.log(`Stream: ${stream.getType()} - ${stream.getCodec()}`);
  });
});

// Parse with error handling
MediaInformationJsonParser.fromWithError(ffprobeJsonOutput).then((mediaInfo) => {
  console.log('Parsed successfully');
}).catch((error) => {
  console.error('Parse error:', error);
});
```

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

### Cancel FFmpeg Operations

Source: https://github.com/yspreen/ffmpeg-kit-react-native/blob/main/README.md

Allows for stopping ongoing FFmpeg operations. It can cancel all active sessions or a specific session identified by its ID.

```javascript
FFmpegKit.cancel();
```

```javascript
FFmpegKit.cancel(sessionId);
```
Tokens:
Raw