Composer drag and drop with custom uploader

Development

AI-generated summary

The discussion focuses on extending the drag and drop functionality on the Composer to allow for custom JavaScript uploads. Sören_Geier wants to integrate their existing uploader with the onebox functionality, enabling features like uploading large video files to Google Drive and inserting specific iframe code into the Composer.

Falco provides a relevant example, pointing to the Client side image optimization enabled by default feature, which uses a hook to achieve similar functionality. The hook can be found in the register-media-optimization-upload-processor.js file. However, it’s noted that the implementation might be affected by the transition from jQuery.FileUpload to Uppy.

1

Hi,
I would like to extend the drag and drop functionality on the composer to allow for a more sophisticated process to kick off. so for example if ppl drag a large video file there I want custom Javascript to fire in order to upload that file to Google drive. On completion i want to insert specific iframe code into the composer.

now i have all this working already except that it currently only works via a toolbar icon and a modal that pops up. i want to bring both worlds together now by extending the existing onebox funtionality.

can anyone point me to documentation how I can hook into those events?

thanks

2

Sounds cool!

I can’t tell you exactly where to look, but where I’d look is that code the auto-detects code blocks. There has been some discussion of that somewhat recently, but my quick search doesn’t yield anything.

3

This is exactly what the recent Client side image optimization enabled by default does. You can see the hook here:

https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/initializers/register-media-optimization-upload-processor.js

One big warning, is that we are moving from jQuery.FileUpload to Uppy in this release, so there are currently two ways of doing everything regarding this.