video_editor icon indicating copy to clipboard operation
video_editor copied to clipboard

Enable web platform

Open maRci002 opened this issue 1 year ago • 4 comments

First of all, congratulations on this package.

The video editor feature is very powerful, however, the convert / export functionality could be decoupled from the package. For instance, I could let the user choose the aspect ratio / duration, but I want to do the conversion on the server side since:

  • I might want to generate multiple resolutions with the same execute command
  • I can rewrite export parameters at any time without publishing a new app
  • Client devices won't struggle to do the exportation
  • FFmpeg won't increase APK / IPA sizes
  • The package can support the web

My proposal is to create a new package for the export, let's say video_editor_export (it can be unlisted on pub.dev), which could use a federating plugin system so Android / iOS could import ffmpeg_kit_flutter, and web could import ffmpeg_wasm (currently, the ffmpeg_wasm package is not working properly. For instance, the corePath is ignored, the progress handler does nothing, but I have my own patches locally). This way, we could define our interface for the export functionality, and developers can import the video_editor_export package to do the export.

I know that the web has some limitations:

This library is written in Dart only but uses external packages such as ffmpeg_kit_flutter and video_thumbnail, which makes it available only on iOS and Android plaforms for now.

video_thumbnail support for web is on the way. See justsoft/video_thumbnail#135

I have made a demonstration video showing that the thumbnail generator and video export can also work on the web. Note that Path.combine might not work with the HTML renderer, but we can manually union and calculate the difference for two rects via Rect.intersect / Rect.expandToInclude and CropGridPainter._drawBackground sometimes paints over the video. For instance, when I switch back to trim:

https://user-images.githubusercontent.com/8436039/229935809-2f146b7e-fe0a-4b50-99bc-a78ee63266a0.mp4

maRci002 avatar Apr 04 '23 22:04 maRci002