Skip to main content
A
albertom31422095
Participant
September 3, 2018
Answered

Drag & drop from host app to extension

  • September 3, 2018
  • 2 replies
  • 663 views

I've seen there are demos about how to D&D from within the extension and from extension to host app, but not about how to do it from the host app. Is it possible to do? I'm using ondragover, ondragend and ondrop on the body and it only fires ondragover when I'm dragging something from the host. It is not even working with onmouseup.

Using CEP8 with Illustrator.

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

Did you prevent default event management on dragover ?

$("html").on("dragover", function(event) {
        event.preventDefault();  
        event.stopPropagation();
    });
    $("html").on("dragleave", function(event) {
        event.preventDefault();  
        event.stopPropagation();
    });
    $("html").on("drop", function(event) {
        event.preventDefault();  
        event.stopPropagation();
        //The jsx script to be run…
    });

Otherwise the event is managed by the html engine thus ignoring your jsx call.

2 replies

Loic.Aigon
Loic.Aigon
Legend
September 5, 2018

Well there are the SDK documentation (probably some D&D démos). But as CEP rely on HTML, most html "tricks" can find answers while googling them. There will be only little area where answers can only be found in the sdk docs.

Loic.Aigon
Loic.Aigon
Legend
September 3, 2018

When the drop event is fired, it generally means you have selected something inside the UI. Once that said, it should be all about getting html compliant data from the current selection. It may be SVG export or whatever that once exported is loaded inside the panel.

1. catch drop event

2. export current selection to HTML compliant format

3. Load data into HTML

One hiccup though, while exportFile is synchronous, file system operation may differ thus leading to out of date or missing ressources.

A
albertom31422095Author
Participant
September 5, 2018

Thank you for your answer.

That's not what's happening. The problem is that the drop event is not being fired when I select something in Illustrator and drop it in my extension.

Loic.Aigon
Loic.AigonCorrect answer
Legend
September 5, 2018

Did you prevent default event management on dragover ?

$("html").on("dragover", function(event) {
        event.preventDefault();  
        event.stopPropagation();
    });
    $("html").on("dragleave", function(event) {
        event.preventDefault();  
        event.stopPropagation();
    });
    $("html").on("drop", function(event) {
        event.preventDefault();  
        event.stopPropagation();
        //The jsx script to be run…
    });

Otherwise the event is managed by the html engine thus ignoring your jsx call.

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices