Skip to main content
Participant
September 6, 2022
Answered

InDesign: Unable to drag and drop images

  • September 6, 2022
  • 2 replies
  • 1419 views

Hi to everybody, I'm new on this forum.

I need drag and drop image from my plugin to working area of InDesign.

I found out that html links with certain configuration are possible to drag from plugin to working area as a text.

 

What I basically tried to remove TextFrame after dropping it and placing image instead.
It works, but it is not looking good, because while dragging it, it is showing text instead of a picture.

Does anybody know is it possible (and how) to D/D an image from plugin, like you would normally do from File Explorer to Adobe InDesign?


Result of dragging text is a Text within TextFrame.

 

 

 

If somebody is interested in my work around, it is below.
`1. In plugin html, set attribute to a href:
<a [myRouterLink]>draggable text

Angular MyRouterLink should set routerLink property, like this.routerLink = "draggable text"

Now the link is draggable from plugin to Adobe Indesign as a plain text and would create TextFrame.

  1. Listening 'afterSelectionChanged' event, removing TextFrame and placing picture.

    app.addEventListener(
    'afterSelectionChanged',
    event => {
    const selection = event.target.selection[0];
    if (selection instanceof TextFrame ) {
    event.target.selection[0].remove();
    app.activeDocument.place(fileRef, false, null); // placing picture instead
    },
    false,
    );
    `

    But what should I do to drag and drop picture without this nasty workaround?

 

This topic has been closed for replies.
Correct answer Loic.Aigon

Dragging and dropping can be achieved with CEP plugins with at least the use of the ID DOM PlaceGun object. But it requires :

1) download file locally on drop event

2) load file to placeGun through the csInterface object

3) Let InDesign User click on the page to place Image as he would do with manually loaded files.

This method works yet requires that you download the file and you cannot rely on the x/y mouse position on drop (user needs to click).

But if you need more advanced features like web based linked files or placed files directly on the drop event, then you may need to use a C++ plugin (at least for those requirements). Unless there would be some CEP advanced techniques I don't know of.

Loic

2 replies

Loic.Aigon
Loic.AigonCorrect answer
Legend
September 6, 2022

Dragging and dropping can be achieved with CEP plugins with at least the use of the ID DOM PlaceGun object. But it requires :

1) download file locally on drop event

2) load file to placeGun through the csInterface object

3) Let InDesign User click on the page to place Image as he would do with manually loaded files.

This method works yet requires that you download the file and you cannot rely on the x/y mouse position on drop (user needs to click).

But if you need more advanced features like web based linked files or placed files directly on the drop event, then you may need to use a C++ plugin (at least for those requirements). Unless there would be some CEP advanced techniques I don't know of.

Loic

Participant
September 6, 2022

Thanks for quick reply!
I will investigate PlaceGun Object. Let's see how it could be done with it.

Peter Kahrel
Community Expert
Community Expert
September 6, 2022

You say 'my plug-in' -- which plug-in? A third-party one? Is it scriptable?

 

As to your event listener, there's a line there 'event => {', which is V8 JavaScript, which is not compatible with ExtendScript. Where did you get that from?

Participant
September 6, 2022

Hi, thanks for replay, yes it is thrid-party plugin.

It is diffiucult for me to say why this line works if you say it should not: 'event => {' V8, but it does, may be it is transpalied to correct version after. I found 'afterSelectionChanged' from doc and simply listening to that event.


Peter Kahrel
Community Expert
Community Expert
September 6, 2022

>  'event => {' V8, but it does

Well, over here it doesn't work.