react-native-video-trim 2.1.0 → 2.2.1

package/android/src/main/java/com/videotrim/widgets/VideoTrimmerView.java

@@ -1,7 +1,6 @@
 package com.videotrim.widgets;
 
 import static com.facebook.react.bridge.UiThreadUtil.runOnUiThread;
-import static com.videotrim.utils.VideoTrimmerUtil.DEFAULT_AUDIO_EXTENSION;
 import static com.videotrim.utils.VideoTrimmerUtil.RECYCLER_VIEW_PADDING;
 import static com.videotrim.utils.VideoTrimmerUtil.VIDEO_FRAMES_WIDTH;
 
@@ -9,8 +8,6 @@ import android.content.Context;
 import android.content.pm.ActivityInfo;
 import android.content.res.Configuration;
 import android.graphics.Bitmap;
-import android.graphics.Color;
-import android.graphics.drawable.Drawable;
 import android.graphics.drawable.GradientDrawable;
 import android.media.MediaMetadataRetriever;
 import android.media.MediaPlayer;
@@ -21,10 +18,10 @@ import android.os.VibrationEffect;
 import android.os.Vibrator;
 import android.util.AttributeSet;
 import android.util.Log;
+import android.util.TypedValue;
 import android.view.LayoutInflater;
 import android.view.MotionEvent;
 import android.view.View;
-import android.view.ViewGroup;
 import android.widget.FrameLayout;
 import android.widget.ImageView;
 import android.widget.LinearLayout;
@@ -33,9 +30,9 @@ import android.widget.RelativeLayout;
 import android.widget.TextView;
 import android.widget.VideoView;
 
-import androidx.core.content.ContextCompat;
-import androidx.core.content.res.ResourcesCompat;
+import androidx.appcompat.app.AlertDialog;
 
+import com.arthenica.ffmpegkit.FFmpegSession;
 import com.facebook.react.bridge.ReactApplicationContext;
 import com.facebook.react.bridge.ReadableMap;
 import com.videotrim.R;
@@ -64,7 +61,6 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
   private Uri mSourceUri;
   private VideoTrimListener mOnTrimVideoListener;
   private int mDuration = 0;
-  private Boolean mIsPrepared = false;
   private long mMaxDuration = (long) Double.POSITIVE_INFINITY;
   private long mMinDuration = VideoTrimmerUtil.MIN_SHOOT_DURATION;
 
@@ -105,6 +101,15 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
 
   private String mOutputExt = "mp4";
   private boolean enableHapticFeedback = true;
+  private boolean autoplay = false;
+  private long jumpToPositionOnLoad = 0;
+  private FrameLayout headerView;
+  private TextView headerText;
+  private FFmpegSession ffmpegSession;
+  private boolean alertOnFailToLoad = true;
+  private String alertOnFailTitle = "Error";
+  private String alertOnFailMessage = "Fail to load media. Possibly invalid file or no network connection";
+  private String alertOnFailCloseText = "Close";
 
   public VideoTrimmerView(ReactApplicationContext context, ReadableMap config, AttributeSet attrs) {
     this(context, attrs, 0, config);
@@ -152,6 +157,9 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
     cancelBtn = findViewById(R.id.cancelBtn);
     audioBannerView = findViewById(R.id.audioBannerView);
     failToLoadBtn = findViewById(R.id.failToLoadBtn);
+
+    headerView = findViewById(R.id.headerView);
+    headerText = findViewById(R.id.headerText);
   }
 
   public void initByURI(final Uri videoURI) {
@@ -162,18 +170,11 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
       mVideoView.requestFocus();
 
       mVideoView.setOnPreparedListener(mp -> {
-        if (!mIsPrepared) {
-          mp.setVideoScalingMode(MediaPlayer.VIDEO_SCALING_MODE_SCALE_TO_FIT);
-          videoPrepared();
-          mIsPrepared = true;
-        }
+        mp.setVideoScalingMode(MediaPlayer.VIDEO_SCALING_MODE_SCALE_TO_FIT);
+        mediaPrepared();
       });
 
-      mVideoView.setOnErrorListener((mp, what, extra) -> {
-        mediaFailed();
-        mOnTrimVideoListener.onError("Error loading video file. Please try again.", ErrorCode.FAIL_TO_LOAD_VIDEO);
-        return true;
-      });
+      mVideoView.setOnErrorListener(this::onFailToLoadMedia);
 
       mVideoView.setOnCompletionListener(mp -> mediaCompleted());
     } else {
@@ -186,17 +187,10 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
       try {
         audioPlayer.setDataSource(videoURI.toString());
         audioPlayer.setOnPreparedListener(mp -> {
-          if (!mIsPrepared) {
-            audioPrepared();
-            mIsPrepared = true;
-          }
+          mediaPrepared();
         });
         audioPlayer.setOnCompletionListener(mp -> mediaCompleted());
-        audioPlayer.setOnErrorListener((mp, what, extra) -> {
-          mediaFailed();
-          mOnTrimVideoListener.onError("Error loading audio file. Please try again.", ErrorCode.FAIL_TO_LOAD_AUDIO);
-          return true;
-        });
+        audioPlayer.setOnErrorListener(this::onFailToLoadMedia);
 
         audioPlayer.prepareAsync(); // use prepareAsync to avoid blocking the main thread
       } catch (IOException e) {
@@ -207,6 +201,25 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
     }
   }
 
+  private boolean onFailToLoadMedia(MediaPlayer mp, int what, int extra) {
+    mediaFailed();
+    mOnTrimVideoListener.onError("Error loading media file. Please try again.", ErrorCode.FAIL_TO_LOAD_MEDIA);
+    if (alertOnFailToLoad) {
+      AlertDialog.Builder builder = new AlertDialog.Builder(mContext.getCurrentActivity());
+      builder.setMessage(alertOnFailMessage);
+      builder.setTitle(alertOnFailTitle);
+      builder.setCancelable(false);
+      builder.setPositiveButton(alertOnFailCloseText, (dialog, which) -> {
+        dialog.cancel();
+      });
+
+      AlertDialog alertDialog = builder.create();
+      alertDialog.show();
+    }
+
+    return true;
+  }
+
   private void startShootVideoThumbs(final Context context, int totalThumbsCount, long startPosition, long endPosition) {
     mThumbnailContainer.removeAllViews();
     VideoTrimmerUtil.shootVideoThumbInBackground(mediaMetadataRetriever, totalThumbsCount, startPosition, endPosition,
@@ -225,28 +238,32 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
       });
   }
 
-  private void videoPrepared() {
-    mDuration = mVideoView.getDuration();
+  private void mediaPrepared() {
+    mDuration = isVideoType ? mVideoView.getDuration() : audioPlayer.getDuration();
     mMaxDuration = Math.min(mMaxDuration, mDuration);
-    mediaMetadataRetriever = MediaMetadataUtil.getMediaMetadataRetriever(mSourceUri.toString());
 
-    if (mediaMetadataRetriever == null) {
-      mOnTrimVideoListener.onError("Error when retrieving video info. Please try again.", ErrorCode.FAIL_TO_GET_VIDEO_INFO);
-      return;
-    }
+    if (isVideoType) {
+      mediaMetadataRetriever = MediaMetadataUtil.getMediaMetadataRetriever(mSourceUri.toString());
+      if (mediaMetadataRetriever == null) {
+        mOnTrimVideoListener.onError("Error when retrieving video info. Please try again.", ErrorCode.FAIL_TO_GET_VIDEO_INFO);
+        return;
+      }
 
-    // take first frame
-    Bitmap bitmap = mediaMetadataRetriever.getFrameAtTime(0, MediaMetadataRetriever.OPTION_CLOSEST_SYNC);
+      // take first frame
+      Bitmap bitmap = mediaMetadataRetriever.getFrameAtTime(0, MediaMetadataRetriever.OPTION_CLOSEST_SYNC);
 
-    if (bitmap != null) {
-      VideoTrimmerUtil.mThumbWidth = VideoTrimmerUtil.THUMB_HEIGHT * bitmap.getWidth() / bitmap.getHeight();
-    }
+      if (bitmap != null) {
+        VideoTrimmerUtil.mThumbWidth = VideoTrimmerUtil.THUMB_HEIGHT * bitmap.getWidth() / bitmap.getHeight();
+      }
 
-    VideoTrimmerUtil.SCREEN_WIDTH_FULL = this.getScreenWidthInPortraitMode();
-    VideoTrimmerUtil.VIDEO_FRAMES_WIDTH = VideoTrimmerUtil.SCREEN_WIDTH_FULL - RECYCLER_VIEW_PADDING * 2;
-    VideoTrimmerUtil.MAX_COUNT_RANGE = Math.max((VIDEO_FRAMES_WIDTH / VideoTrimmerUtil.mThumbWidth), VideoTrimmerUtil.MAX_COUNT_RANGE);
+      VideoTrimmerUtil.SCREEN_WIDTH_FULL = this.getScreenWidthInPortraitMode();
+      VideoTrimmerUtil.VIDEO_FRAMES_WIDTH = VideoTrimmerUtil.SCREEN_WIDTH_FULL - RECYCLER_VIEW_PADDING * 2;
+      VideoTrimmerUtil.MAX_COUNT_RANGE = Math.max((VIDEO_FRAMES_WIDTH / VideoTrimmerUtil.mThumbWidth), VideoTrimmerUtil.MAX_COUNT_RANGE);
 
-    startShootVideoThumbs(mContext, VideoTrimmerUtil.MAX_COUNT_RANGE, 0, mDuration);
+      startShootVideoThumbs(mContext, VideoTrimmerUtil.MAX_COUNT_RANGE, 0, mDuration);
+    } else {
+
+    }
 
     // Set initial handle positions if mMaxDuration < video duration
     if (mMaxDuration < mDuration) {
@@ -259,24 +276,16 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
     loadingIndicator.setVisibility(View.GONE);
     mPlayView.setVisibility(View.VISIBLE);
     saveBtn.setVisibility(View.VISIBLE);
-  }
 
-  private void audioPrepared() {
-    mDuration = audioPlayer.getDuration();
-    mMaxDuration = Math.min(mMaxDuration, mDuration);
+    if (jumpToPositionOnLoad > 0) {
+      seekTo(jumpToPositionOnLoad > mDuration ? mDuration : jumpToPositionOnLoad, true);
+    }
 
-    // Set initial handle positions if mMaxDuration < video duration
-    if (mMaxDuration < mDuration) {
-      endTime = mMaxDuration;
-    } else {
-      endTime = mDuration;
+    if (autoplay) {
+      playOrPause();
     }
 
-    updateHandlePositions();
-    loadingIndicator.setVisibility(View.GONE);
-    mPlayView.setVisibility(View.VISIBLE);
-    saveBtn.setVisibility(View.VISIBLE);
-//    mThumbnailContainer.animate().alpha(1f).setDuration(250).start();
+    mOnTrimVideoListener.onLoad(mDuration);
   }
 
   private void updateGradientColors(int startColor, int endColor) {
@@ -375,8 +384,8 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
 
   public void onSaveClicked() {
     onMediaPause();
-    VideoTrimmerUtil.trim(
-      isVideoType ? mSourceUri.getPath() : mSourceUri.toString(),
+    ffmpegSession = VideoTrimmerUtil.trim(
+      mSourceUri.toString(),
       StorageUtil.getOutputPath(mContext, mOutputExt),
       mDuration,
       startTime,
@@ -384,6 +393,14 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
       mOnTrimVideoListener);
   }
 
+  public void onCancelTrimClicked() {
+    if (ffmpegSession != null) {
+      ffmpegSession.cancel();
+    } else {
+      mOnTrimVideoListener.onCancelTrim();
+    }
+  }
+
   private void seekTo(long msec, boolean needUpdateProgress) {
     if (isVideoType) {
       mVideoView.seekTo((int) msec);
@@ -462,11 +479,54 @@ public class VideoTrimmerView extends FrameLayout implements IVideoTrimmerView {
 
     if (config.hasKey("outputExt")) {
       mOutputExt = config.getString("outputExt");
+    } else if (!isVideoType) {
+      mOutputExt = "wav";
     }
 
     if (config.hasKey("enableHapticFeedback")) {
       enableHapticFeedback = config.getBoolean("enableHapticFeedback");
     }
+
+    if (config.hasKey("autoplay")) {
+      autoplay = config.getBoolean("autoplay");
+    }
+
+    if (config.hasKey("jumpToPositionOnLoad")) {
+      jumpToPositionOnLoad = config.getInt("jumpToPositionOnLoad");
+    }
+    // check if config.getString("headerText") is not empty
+
+    if (config.hasKey("headerText") && !config.getString("headerText").isEmpty()){
+      headerText.setText(config.getString("headerText"));
+
+      if (config.hasKey("headerTextSize")) {
+        int textSize = config.getInt("headerTextSize");
+        if (textSize < 0) {
+          textSize = 16;
+        }
+        headerText.setTextSize(TypedValue.COMPLEX_UNIT_DIP, textSize);
+      }
+
+      if (config.hasKey("headerTextColor")) {
+        headerText.setTextColor(config.getInt("headerTextColor"));
+      }
+
+      headerView.setVisibility(View.VISIBLE);
+    }
+
+    alertOnFailToLoad = !config.hasKey("alertOnFailToLoad") || config.getBoolean("alertOnFailToLoad");
+
+    if (config.hasKey("alertOnFailTitle")) {
+      alertOnFailTitle = config.getString("alertOnFailTitle");
+    }
+
+    if (config.hasKey("alertOnFailMessage")) {
+      alertOnFailMessage = config.getString("alertOnFailMessage");
+    }
+
+    if (config.hasKey("alertOnFailCloseText")) {
+      alertOnFailCloseText = config.getString("alertOnFailCloseText");
+    }
   }
 
   private void startTimingRunnable() {

package/android/src/main/res/layout/video_trimmer_view.xml

@@ -3,11 +3,31 @@
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:orientation="vertical">
+  <FrameLayout
+    android:id="@+id/headerView"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:minHeight="50dp"
+    android:background="@android:color/black"
+    android:visibility="gone"
+    >
+    <TextView
+      android:id="@+id/headerText"
+      android:layout_width="wrap_content"
+      android:layout_height="match_parent"
+      android:layout_gravity="center"
+      android:clickable="true"
+      android:focusable="true"
+      android:text="Header text"
+      android:textColor="@android:color/white"
+      android:textSize="16dp" />
+  </FrameLayout>
 
   <RelativeLayout
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:layout_above="@+id/layout"
+    android:layout_below="@+id/headerView"
     android:background="@android:color/black"
     android:gravity="center">
 

package/ios/AssetLoader.swift

@@ -2,7 +2,7 @@
 //  AssetLoader.swift
 //  react-native-video-trim
 //
-//  Created by ByteDance on 7/27/24.
+//  Created by Duc Trung Mai on 7/27/24.
 //
 
 import AVFoundation

package/ios/ErrorCode.swift

@@ -9,7 +9,7 @@ import Foundation
 
 enum ErrorCode: String {
     case trimmingFailed = "TRIMMING_FAILED"
-    case failToLoadVideo = "FAIL_TO_LOAD_VIDEO"
+    case failToLoadMedia = "FAIL_TO_LOAD_MEDIA"
     case failToSaveToPhoto = "FAIL_TO_SAVE_TO_PHOTO"
     case failToShare = "FAIL_TO_SHARE"
     case noPhotoPermission = "NO_PHOTO_PERMISSION"

package/ios/ProgressAlertController.swift

@@ -0,0 +1,100 @@
+//
+//  ProgressAlertController.swift
+//  react-native-video-trim
+//
+//  Created by Duc Trung Mai on 8/18/24.
+//
+
+import UIKit
+
+class ProgressAlertController: UIViewController {
+    var onDismiss: (() -> Void)?
+    
+    private let titleLabel = UILabel()
+    private let progressBar = UIProgressView(progressViewStyle: .default)
+    private let actionButton = UIButton(type: .system)
+    
+    override func viewDidLoad() {
+        super.viewDidLoad()
+        
+        setupBackground()
+        setupAlertView()
+    }
+    
+    private func setupBackground() {
+        view.backgroundColor = UIColor.black.withAlphaComponent(0.4)
+    }
+    
+    private func setupAlertView() {
+        let alertView = UIView()
+        alertView.backgroundColor = UIColor(red: 28/255, green: 28/255, blue: 30/255, alpha: 1.0)
+        alertView.layer.cornerRadius = 12
+        alertView.translatesAutoresizingMaskIntoConstraints = false
+        view.addSubview(alertView)
+        
+        // AlertView Constraints
+        NSLayoutConstraint.activate([
+            alertView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
+            alertView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
+            alertView.widthAnchor.constraint(equalToConstant: 270)
+        ])
+        
+        // Title Label
+        titleLabel.translatesAutoresizingMaskIntoConstraints = false
+        titleLabel.textAlignment = .center
+        titleLabel.font = UIFont.systemFont(ofSize: 18)
+        titleLabel.numberOfLines = 0
+        titleLabel.textColor = .white
+        alertView.addSubview(titleLabel)
+        
+        // Progress Bar
+        progressBar.translatesAutoresizingMaskIntoConstraints = false
+        alertView.addSubview(progressBar)
+        
+        // Action Button
+        actionButton.setTitle("Cancel", for: .normal)
+        actionButton.setTitleColor(.systemPink, for: .normal)
+        actionButton.titleLabel?.font = UIFont.systemFont(ofSize: 16)
+        actionButton.addTarget(self, action: #selector(dismissAlert), for: .touchUpInside)
+        actionButton.translatesAutoresizingMaskIntoConstraints = false
+        actionButton.isHidden = true
+        alertView.addSubview(actionButton)
+        
+        // Constraints for titleLabel, progressBar, and actionButton
+        NSLayoutConstraint.activate([
+            titleLabel.topAnchor.constraint(equalTo: alertView.topAnchor, constant: 16),
+            titleLabel.leadingAnchor.constraint(equalTo: alertView.leadingAnchor, constant: 16),
+            titleLabel.trailingAnchor.constraint(equalTo: alertView.trailingAnchor, constant: -16),
+            
+            progressBar.topAnchor.constraint(equalTo: titleLabel.bottomAnchor, constant: 16),
+            progressBar.leadingAnchor.constraint(equalTo: alertView.leadingAnchor, constant: 16),
+            progressBar.trailingAnchor.constraint(equalTo: alertView.trailingAnchor, constant: -16),
+            
+            actionButton.topAnchor.constraint(equalTo: progressBar.bottomAnchor, constant: 16),
+            actionButton.bottomAnchor.constraint(equalTo: alertView.bottomAnchor, constant: -16),
+            actionButton.centerXAnchor.constraint(equalTo: alertView.centerXAnchor)
+        ])
+    }
+    
+    @objc private func dismissAlert() {
+        self.onDismiss?()
+    }
+    
+    func setTitle(_ text: String) {
+        titleLabel.text = text
+    }
+    
+    func setCancelTitle(_ text: String) {
+        actionButton.setTitle(text, for: .normal)
+    }
+    
+    func setProgress(_ progress: Float) {
+        progressBar.setProgress(progress, animated: true)
+    }
+    
+    func showCancelBtn() {
+        // Ensure that the button is properly added to the view hierarchy and that the layout has been updated before hiding the button
+        view.layoutIfNeeded()
+        actionButton.isHidden = false
+    }
+}