So, Currently if i drag an image from my website or any other website which contains images and drag and drop it to a word or an excel, it would paste the image as it is or paste the link on the application on drop.
But what i actually want is that when i do a drop of the image on word/excle file, i want to basically run a function ondrop/ondragleave that would store some data in my clipboard and finally paste it on the word/excel file.
Below code is my current implementation, which helps me know that i have dropped the element outside the browser, but i want to paste data of my clipboard instead of the image which i have actually dragged and dropped onto the word file.
element.addEventListener("dragend", (e) => {
e.preventDefault();
console.log("Ended " + (outside ? "Outside" : "Inside"));
});
element.addEventListener("dragstart", (e) => {
outside = false;
});
window.addEventListener("dragleave", (e) => {
window.setTimeout(() => {
if (
(e.target === document.documentElement || e.target === document.body) &&
e.relatedTarget == null &&
e.buttons != 0
) {
outside = true;
}
});
});
window.addEventListener("dragenter", (e) => {
if (
(e.target === document.documentElement || e.target === document.body) &&
e.relatedTarget == null
) {
outside = false;
}
});