react-native-video-compression

Getting started

$ npm install react-native-sili-video-compression --save

Mostly automatic installation

$ react-native link react-native-sili-video-compression

Manual installation

1. Open the package.json file and under dependencies ➜ Add "react-native-sili-video-compression" : 1.0.6

2. You should add a comma before the line to keep the JSON format of it.

3. Open the terminal in the project ➜ Type npm install.

iOS

1. In XCode, in the project navigator, right click Libraries ➜ Add Files to [your project's name]
2. Go to node_modules ➜ react-native-video-compression and add RNVideoCompression.xcodeproj
3. In XCode, in the project navigator, select your project. Add libRNVideoCompression.a to your project's Build Phases ➜ Link Binary With Libraries
4. Run your project (Cmd+R)<

Android

Usage

Import Library

import CompressModule from 'react-native-sili-video-compression';

Add External File read write permission into your Manifest.xml.

Add xmlns:tools="http://schemas.android.com/tools" to your <Manifest/> tag in your Manifest.xml.

Manifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  ...
  ...>

Add these 2 line to your <application/> tag.

<application
      android:name=".MainApplication"
      android:label="@string/app_name"
      ...
      android:requestLegacyExternalStorage="true"   //Add this
      tools:replace="android:allowBackup"           //Add this
      />

Add Event Emitter for progress update

const EVENT_NAME = new NativeEventEmitter(NativeModules.CompressModule);
    this.subscription = EVENT_NAME.addListener(
                             CompressModule.VIDEO_COMPRESS_PROGRESS_EMITTER,
                             (value)=> console.log(value));

Add success listener

var successCall = (fileName, size, path, message) => {
      // Do your work
      console.log(message);
    };

Success method properties

| Property | Type | Description | | --------------------------------------- | :--------------------------------------: | :--------------------------------------- | | fileName | String | File name with absolute path : '/storage/emulated/0/Download/20201003_095653.mp4'| | size | Long | Size in Bytes | | path | String | Absolute file path of compressed file : '/storage/emulated/0/Download/20201003_095653.mp4'| | message | String | Compress comprete message |

Add Failure listener

var errorCall = (errorMessage) => { 
      // Do your work
      console.log(errorMessage);
    };

Failure method properties

| Property | Type | Description | | --------------------------------------- | :--------------------------------------: | :--------------------------------------- | | errorMessage | String | Error message with reason |

Compression methode for predefined levels

//Check for External file access permission before video conversion
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
      CompressModule.compressVideo('/storage/emulated/0/Download/20201003_095653.mp4', CompressModule.LOW,
      errorCall, successCall);
      // console.log(CompressModule.LOW);
    }

compressVideo() request Params

| Property | Type | Description | | --------------------------------------- | :--------------------------------------: | :--------------------------------------- | | inputFilePath | String | Absolute path for input file : '/storage/emulated/0/Download/20201003_095653.mp4' | | compressLevel | Constant | LOW/MEDIUM/HIGH | | errorCallback | CallBack | ErrorCallback object to handle error events | | successCallback | CallBack | SuccessCallback object to handle error events |

Predefined 3 level of compress can be done.

| Constant | Description | | ------------------------------|---------------------------------------| | CompressModule.LOW | compress level 10% and reduce Height and Width to 50% | | CompressModule.MEDIUM | compress level 50% and reduce Height and Width to 50% | | CompressModule.HIGH | compress level 100% and reduce Height and Width to 50% |

Compression methode by using percentage

//Check for External file access permission before video conversion
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
      CompressModule.compressVideoWithQuality('/storage/emulated/0/Download/20201003_095653.mp4', reduceVideoQualityToPercent, reduceHeightWidthToPercent, 
      errorCall, successCall);
      // console.log(CompressModule.LOW);
    }

compressVideoWithQuality() request Params

| Property | Type | Description | | --------------------------------------- | :--------------------------------------: | :--------------------------------------- | | inputFilePath | String | Absolute path for input file : '/storage/emulated/0/Download/20201003_095653.mp4' | | reduceVideoQualityToPercent | Float | value should be in between 0 to 1, default value is 0.5 | | reduceHeightWidthToPercent | Float | value should be in between 0 to 1, default value is 0.5 | | errorCallback | CallBack | ErrorCallback object to handle error events | | successCallback | CallBack | SuccessCallback object to handle error events |

VERY IMPORTANT FOR ANDROID Close the Emitter subscription if not using it or in task completion or task failed

this.subscription.remove();

License

MIT