在Summernote文本编辑器中拖放图像

Question

I want to understand if I can do Drag&Drop image in my text editor plugin . I'm using angularjs v1.5.0 with it. When image was uploaded I want to have possible dragging it.

There are a lot of solution for dragging, but I did not find how can I do this when there is the text inside. For example: There is some text and image in the editor " < img src='lala.jpg'> Some Text Here " and after dragging I need that " Some Text < img src='lala.jpg'> Here ". I included drag&drop plugin and image became with styling position: relative, top|left. Yes, its dragging, but without text floating. What can I do with it?

Thanks for any help or ideas

Answer 1

set image tag do draggable and when you fire the 'Drop' event, you will get x and y position for the image. Calculate your string width and height and break the text where image should be placed. Then, put the tag exactly where it should be...

Calculate text width with JavaScript