Add version 2.16.0

Author: leontobias

CHANGELOG.md

@@ -1,3 +1,10 @@
+## [2.16.0]
+
+### Added
+
+* [react-native-videoeditorsdk] Added duration action for text and stickers.
+* [react-native-videoeditorsdk] Added `VideoEditorResult.segments`, `VideoEditorResult.videoSize`, and `VideoEditorResult.release()` which enable serialization of the individual video composition components if `configuration.export.video.segments` is enabled.
+
 ## [2.15.0]
 
 ### Changed

README.md

@@ -32,6 +32,7 @@ Check out our [video tutorial](https://img.ly/blog/a-photo-and-video-editor-for-
 With version `2.13.0`, we recommend using `compileSdkVersion` not lower than `31` for Android. However, this might interfere with your application's Android Gradle Plugin version if this is set to `4.x`.
 
 If you don't use a newer Android Gradle Plugin version, e.g., by updating at least to RN 0.68.0, you'll most likely encounter a build error similar to:
+
 ```
 FAILURE: Build failed with an exception.
 
@@ -44,9 +45,11 @@ Run with --stacktrace option to get the stack trace. Run with --info or --debug
 
 * Get more help at https://help.gradle.org
 ```
+
 As a workaround you can create the following symlinks:
-  1. Inside `/Users/YOUR-USERNAME/Library/Android/sdk/build-tools/31.0.0/`: Create a `dx` symlink for the `d8` file with `ln -s d8 dx`.
-  2. From there, go to `./lib/` and create a `dx.jar` symlink for the `d8.jar` file with `ln -s d8.jar dx.jar`. 
+
+1. Inside `/Users/YOUR-USERNAME/Library/Android/sdk/build-tools/31.0.0/`: Create a `dx` symlink for the `d8` file with `ln -s d8 dx`.
+2. From there, go to `./lib/` and create a `dx.jar` symlink for the `d8.jar` file with `ln -s d8.jar dx.jar`.
 
 ### Expo CLI
 
@@ -63,7 +66,7 @@ In order to use this module with the Expo CLI you can make use of our integrated
    ```sh
    expo install react-native-videoeditorsdk
    ```
-   
+
    This will automatically install [`react-native-imglysdk`](https://npmjs.org/package/react-native-imglysdk) which you can use to configure your application with our Expo config plugin.
 
 2. Inside your app's `app.json` or `app.config.js` add our config plugin:
@@ -83,7 +86,7 @@ In order to use this module with the Expo CLI you can make use of our integrated
          "react-native-imglysdk",
          {
            "android": {
-             "version": "10.1.1",
+             "version": "10.4.0",
              "modules": [
                "ui:core",
                "ui:transform",
@@ -103,7 +106,7 @@ In order to use this module with the Expo CLI you can make use of our integrated
    ```
 
    For further information on the available modules, please refer to step 4 of the React Native CLI [Android](#android) guide below.
-   
+
    **Please note that the `react-native-imglysdk` module manages both VideoEditor SDK as well as PhotoEditor SDK so you only need to add the Expo config plugin once even when using both SDKs.**
 
 3. From version `2.15.0` the iOS deployment target needs to be set to at least iOS 13. You can use the `expo-build-properties` config plugin for this. Please refer to the [official Expo docs](https://docs.expo.dev/versions/v45.0.0/sdk/build-properties/).
@@ -149,6 +152,7 @@ For older React Native versions autolinking is not available and VideoEditor SDK
 #### Android
 
 1. Add the img.ly repository and plugin by opening the `android/build.gradle` file (**not** `android/app/build.gradle`) and adding these lines at the top:
+
    ```groovy
    buildscript {
        repositories {
@@ -157,11 +161,12 @@ For older React Native versions autolinking is not available and VideoEditor SDK
        }
        dependencies {
            classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:1.5.32"
-           classpath 'ly.img.android.sdk:plugin:10.1.1'
+           classpath 'ly.img.android.sdk:plugin:10.4.0'
        }
    }
    ```
-   In order to update VideoEditor SDK for Android replace the version string `10.1.1` with a [newer release](https://github.com/imgly/vesdk-android-demo/releases).
+
+   In order to update VideoEditor SDK for Android replace the version string `10.4.0` with a [newer release](https://github.com/imgly/vesdk-android-demo/releases).
 
 2. Still in the `android/build.gradle` file (**not** `android/app/build.gradle`), add these lines at the bottom:
 
@@ -189,7 +194,8 @@ For older React Native versions autolinking is not available and VideoEditor SDK
    }
    ```
 
-4. Configure VideoEditor SDK for Android by opening the `android/app/build.gradle` file  (**not** `android/build.gradle`) and adding the following lines under `apply plugin: "com.android.application"`:
+4. Configure VideoEditor SDK for Android by opening the `android/app/build.gradle` file (**not** `android/build.gradle`) and adding the following lines under `apply plugin: "com.android.application"`:
+
    ```groovy
    apply plugin: 'ly.img.android.sdk'
    apply plugin: 'kotlin-android'
@@ -237,25 +243,29 @@ For older React Native versions autolinking is not available and VideoEditor SDK
 Import the module in your `App.js`:
 
 ```js
-import {VESDK, VideoEditorModal, Configuration} from 'react-native-videoeditorsdk';
+import {
+  VESDK,
+  VideoEditorModal,
+  Configuration,
+} from "react-native-videoeditorsdk";
 ```
 
 Each platform requires a separate license file. [Unlock VideoEditor SDK](./index.d.ts#L41-L53) automatically for both platforms with a single line of code via [platform-specific file extensions](https://reactnative.dev/docs/platform-specific-code#platform-specific-extensions):
 
 ```js
-VESDK.unlockWithLicense(require('./vesdk_license'));
+VESDK.unlockWithLicense(require("./vesdk_license"));
 ```
 
 Open the editor with a video:
 
 ```js
-VESDK.openEditor(require('./video.mp4'));
+VESDK.openEditor(require("./video.mp4"));
 ```
 
 Or use the component to open the editor:
 
 ```jsx
-<VideoEditorModal visible={true} video={require('./video.mp4')}/>
+<VideoEditorModal visible={true} video={require("./video.mp4")} />
 ```
 
 Please see the [code documentation](./index.d.ts) for more details and additional [customization and configuration options](./configuration.ts).

RNVideoEditorSDK.podspec

@@ -18,5 +18,5 @@ Pod::Spec.new do |s|
 
   s.dependency 'React'
   s.dependency 'React-RCTImage'
-  s.dependency 'VideoEditorSDK', '~> 11.1'
+  s.dependency 'VideoEditorSDK', '~> 11.3'
 end

android/build.gradle

@@ -20,7 +20,7 @@ imglyConfig {
     }
 }
 
-def MIN_LY_IMG_ANDROID_SDK_PLUGIN_VERSION = "10.1.1"
+def MIN_LY_IMG_ANDROID_SDK_PLUGIN_VERSION = "10.4.0"
 
 task checkVersion {
     if (imglyConfig.convertToVersionNumber(imglyConfig.getVersion()) < imglyConfig.convertToVersionNumber(MIN_LY_IMG_ANDROID_SDK_PLUGIN_VERSION)) {

android/src/main/java/ly/img/react_native/vesdk/RNVideoEditorSDKModule.kt

@@ -22,6 +22,8 @@ import org.json.JSONObject
 import java.io.File
 import ly.img.android.pesdk.backend.encoder.Encoder
 import ly.img.android.pesdk.backend.model.EditorSDKResult
+import ly.img.android.pesdk.backend.model.VideoPart
+import ly.img.android.pesdk.backend.model.state.LoadState
 import ly.img.android.pesdk.backend.model.state.VideoCompositionSettings
 import ly.img.android.serializer._3.IMGLYFileReader
 import ly.img.android.serializer._3.IMGLYFileWriter
@@ -39,13 +41,25 @@ class RNVideoEditorSDKModule(reactContext: ReactApplicationContext) : ReactConte
 
     private var currentPromise: Promise? = null
     private var currentConfig: Configuration? = null
+    private var resolveManually: Boolean = false
+    private var currentEditorUID: String = UUID.randomUUID().toString()
+    private var settingsLists: MutableMap<String, SettingsList> = mutableMapOf()
 
     @ReactMethod
     fun unlockWithLicense(license: String) {
         VESDK.initSDKWithLicenseData(license)
         IMGLY.authorize()
     }
 
+    @ReactMethod
+    fun releaseTemporaryData(identifier: String) {
+        val settingsList = settingsLists[identifier]
+        if (settingsList != null) {
+            settingsList.release()
+            settingsLists.remove(identifier)
+        }
+    }
+
     override fun onActivityResult(activity: Activity, requestCode: Int, resultCode: Int, intent: Intent?) {
         val data = try {
           intent?.let { EditorSDKResult(it) }
@@ -67,60 +81,96 @@ class RNVideoEditorSDKModule(reactContext: ReactApplicationContext) : ReactConte
                             val serializationConfig = currentConfig?.export?.serialization
 
                             var serialization: Any? = null
+                            val settingsList = data.settingsList
+
                             if (serializationConfig?.enabled == true) {
-                                val settingsList = data.settingsList
                                 skipIfNotExists {
                                     settingsList.let { settingsList ->
                                         if (serializationConfig.embedSourceImage == true) {
-                                            Log.i("ImgLySdk", "EmbedSourceImage is currently not supported by the Android SDK")
+                                            Log.i(
+                                                "ImgLySdk",
+                                                "EmbedSourceImage is currently not supported by the Android SDK"
+                                            )
                                         }
                                         serialization = when (serializationConfig.exportType) {
                                             SerializationExportType.FILE_URL -> {
                                                 val uri = serializationConfig.filename?.let {
                                                     Uri.parse("$it.json")
-                                                } ?: Uri.fromFile(File.createTempFile("serialization-" + UUID.randomUUID().toString(), ".json"))
-                                                Encoder.createOutputStream(uri).use { outputStream -> 
-                                                    IMGLYFileWriter(settingsList).writeJson(outputStream)
-                                                }
+                                                } ?: Uri.fromFile(
+                                                    File.createTempFile(
+                                                        "serialization-" + UUID.randomUUID()
+                                                            .toString(), ".json"
+                                                    )
+                                                )
+                                                Encoder.createOutputStream(uri)
+                                                    .use { outputStream ->
+                                                        IMGLYFileWriter(settingsList).writeJson(
+                                                            outputStream
+                                                        )
+                                                    }
                                                 uri.toString()
                                             }
                                             SerializationExportType.OBJECT -> {
                                                 ReactJSON.convertJsonToMap(
-                                                  JSONObject(
-                                                          IMGLYFileWriter(settingsList).writeJsonAsString()
-                                                  )
+                                                    JSONObject(
+                                                        IMGLYFileWriter(settingsList).writeJsonAsString()
+                                                    )
                                                 )
                                             }
                                         }
                                     }
-                                    settingsList.release()
                                 } ?: run {
-                                    Log.i("ImgLySdk", "You need to include 'backend:serializer' Module, to use serialisation!")
+                                    Log.i(
+                                        "ImgLySdk",
+                                        "You need to include 'backend:serializer' Module, to use serialisation!"
+                                    )
                                 }
                             }
 
+                            var segments: ReadableArray? = null
+                            val canvasSize = settingsList[LoadState::class].sourceSize
+                            val serializedSize = reactMap(
+                                "height" to canvasSize.height,
+                                "width" to canvasSize.width
+                            )
+
+                            if (resolveManually) {
+                                settingsLists[currentEditorUID] = settingsList
+                                segments = serializeVideoSegments(settingsList)
+                            }
+
                             currentPromise?.resolve(
-                              reactMap(
-                                "video" to resultPath?.toString(),
-                                "hasChanges" to (sourcePath?.path != resultPath?.path),
-                                "serialization" to serialization
-                              )
+                                reactMap(
+                                    "video" to resultPath?.toString(),
+                                    "hasChanges" to (sourcePath?.path != resultPath?.path),
+                                    "serialization" to serialization,
+                                    "segments" to segments,
+                                    "identifier" to currentEditorUID,
+                                    "videoSize" to serializedSize
+                                )
                             )
+                            if (!resolveManually) {
+                                settingsList.release()
+                            }
+                            resolveManually = false
                         }()
                     }
                 }
             }
         }
     }
 
-
     override fun onNewIntent(intent: Intent?) {
     }
 
     @ReactMethod
     fun present(video: String, config: ReadableMap?, serialization: String?, promise: Promise) {
         val configuration = ConfigLoader.readFrom(config?.toHashMap() ?: mapOf())
-        val settingsList = VideoEditorSettingsList(configuration.export?.serialization?.enabled == true)
+        val exportVideoSegments = config?.getMap("export")?.getMap("video")?.getBoolean("segments") == true
+        val createTemporaryFiles = configuration.export?.serialization?.enabled == true || exportVideoSegments
+        resolveManually = exportVideoSegments
+
+        val settingsList = VideoEditorSettingsList(createTemporaryFiles)
         configuration.applyOn(settingsList)
         currentConfig = configuration
         currentPromise = promise
@@ -135,30 +185,33 @@ class RNVideoEditorSDKModule(reactContext: ReactApplicationContext) : ReactConte
 
     @ReactMethod
     fun presentComposition(videos: ReadableArray, config: ReadableMap?, serialization: String?, size: ReadableMap?, promise: Promise) {
-        val array = videos.toArrayList()
-        val videoArray = array.filterIsInstance<String>().takeIf { it.size == array.size } ?: arrayListOf()
+        val videoArray = deserializeVideoParts(videos)
         var source = resolveSize(size)
 
         val configuration = ConfigLoader.readFrom(config?.toHashMap() ?: mapOf())
-        val settingsList = VideoEditorSettingsList(configuration.export?.serialization?.enabled == true)
+
+        val exportVideoSegments = config?.getMap("export")?.getMap("video")?.getBoolean("segments") == true
+        val createTemporaryFiles = configuration.export?.serialization?.enabled == true || exportVideoSegments
+        resolveManually = exportVideoSegments
+
+        val settingsList = VideoEditorSettingsList(createTemporaryFiles)
         configuration.applyOn(settingsList)
         currentConfig = configuration
         currentPromise = promise
 
-        if (videoArray.count() > 0) {
+        if (videoArray.isNotEmpty()) {
             if (source == null) {
                 if (size != null) {
                     promise.reject("VESDK", "Invalid video size: width and height must be greater than zero.")
                     return
                 }
                 val video = videoArray.first()
-                source = retrieveURI(video)
+                source = video.videoSource.getSourceAsUri()
             }
 
             settingsList.configure<VideoCompositionSettings> { loadSettings ->
                 videoArray.forEach {
-                    val resolvedSource = retrieveURI(it)
-                    loadSettings.addCompositionPart(VideoCompositionSettings.VideoPart(resolvedSource))
+                    loadSettings.addCompositionPart(it)
                 }
             }
         } else {
@@ -176,6 +229,50 @@ class RNVideoEditorSDKModule(reactContext: ReactApplicationContext) : ReactConte
         startEditor(settingsList)
     }
 
+    private fun serializeVideoSegments(settingsList: SettingsList): ReadableArray {
+        val compositionParts = WritableNativeArray()
+        settingsList[VideoCompositionSettings::class].videos.forEach {
+            val source = it.videoSource.getSourceAsUri().toString()
+            val trimStart = it.trimStartInNano / 1000000000.0f
+            val trimEnd = it.trimEndInNano / 1000000000.0f
+
+            val videoPart = reactMap(
+                "videoURI" to source,
+                "startTime" to trimStart.toDouble(),
+                "endTime" to trimEnd.toDouble()
+            )
+            compositionParts.pushMap(videoPart)
+        }
+        return compositionParts
+    }
+
+    private fun deserializeVideoParts(videos: ReadableArray) : List<VideoPart> {
+        val parts = emptyList<VideoPart>().toMutableList()
+
+        videos.toArrayList().forEach {
+            if (it is String) {
+                val videoPart = VideoPart(retrieveURI(it))
+                parts.add(videoPart)
+            } else if (it is Map<*, *>) {
+                val uri = it["videoURI"] as String?
+                val trimStart = it["startTime"] as Double?
+                val trimEnd = it["endTime"] as Double?
+
+                if (uri != null) {
+                    val videoPart = VideoPart(retrieveURI(uri))
+                    if (trimStart != null) {
+                        videoPart.trimStartInNanoseconds = (trimStart * 1000000000.0f).toLong()
+                    }
+                    if (trimEnd != null) {
+                        videoPart.trimEndInNanoseconds = (trimEnd * 1000000000.0f).toLong()
+                    }
+                    parts.add(videoPart)
+                }
+            }
+        }
+        return parts
+    }
+
     private fun retrieveURI(source: String) : Uri {
         return if (source.startsWith("data:")) {
             UriHelper.createFromBase64String(source.substringAfter("base64,"))
@@ -211,6 +308,7 @@ class RNVideoEditorSDKModule(reactContext: ReactApplicationContext) : ReactConte
 
     private fun startEditor(settingsList: VideoEditorSettingsList?) {
         val currentActivity = this.currentActivity ?: throw RuntimeException("Can't start the Editor because there is no current activity")
+        currentEditorUID = UUID.randomUUID().toString()
         if (settingsList != null) {
             MainThreadRunnable {
                 VideoEditorBuilder(currentActivity)