Copy/Paste clipboard images

[kanishk619]

Having a hook for the paste event would be really helpful in order to upload images directly from clipboard. I created a view in my project and added the below function for the paste event

function uploadClipboardImage(event, martorUploadUrl) {
    if (event.clipboardData.files.length >= 1) {
        let targetField = event.target.parentElement;
        if (targetField.id.startsWith('martor-')
            && targetField.classList.contains('martor-field')
            && targetField.classList.contains('ace_editor')
        ) {
            let aceEditor = ace.edit(targetField.id);
            for (const f of event.clipboardData.files) {
                const formData = new FormData();
                formData.append('martor-image-upload', f);
                fetch(martorUploadUrl, {
                    method: 'POST',
                    headers: {
                        'X-CSRFToken': '{{ csrf_token }}',
                    },
                    body: formData
                }).then(response => {
                    if (response.ok) {
                        response.json().then(
                            data => aceEditor.insert(`\n${data.link}\n`)
                        )
                    } else {
                        console.log(response.status)
                    }
                })
            }
        }
    }
}

data-upload-url attribute can also be used for getting the url from the event's target element. Official implementation would be highly appreciated.

[agusmakmun]

thank you @kanishk619, we will look into it 👍