Drag Source Position

Problem: I’m trying to set the left and top position of some drag source shapes with slide load javascript, however the shapes always return to orignial positions on revert or if revert is unchecked they jump to the translated position from their original position on first drop. Is there a way to set the position of a drag source shape so that it will be treated as the original position?

ActivePresenter Version: 7.5.13

OS: Windows 10

Notes:

Hi,

You should use translation tranformation instead of position for drag sources. For example:

// move object 200px to the right, 300px down
prez.object('drag source name').translate(200, 300);

Regards

That’s great, thanks for your help.

Hi,
I think I have a related problem.
I have a slide with some drag-and-drops (NOT as part of a Drag-n-Drop question). I want to give users the option to redo the slide after they have sucessfully completed it. However, the drag sources seem to stay with their drop targets. I tried to ‘Clear User Input’ and position the drag sources through JS but this does not seem to work.
Is there any way to ‘undo’ the drop so that the drag sources will go back to their initial position?

Thanks, Rolf

Hi Rolf,

“Clear User Input” action will not work for hidden interactions.
If your drop targets appear at the beginning of the slide, you can add “Clear User Input” action to the slide On Load event to move drag sources to their original positions.
Otherwise, you can use an Animated Timer to clear user input at the time when the drop targets appear.

Regards

1 Like

Hi Toan,

I assume the fact that translate should be used for drag sources, explains why this code does not work, right? The dragged object does not go to the upper left corner after it was dropped in the correct area. ‘this’ is a drag source; ‘Drop’ is just a normal shape, no drop target.

var Objekt = this;
var ObjektLeft = Objekt.left();
var ObjektTop = Objekt.top();

var DropSite = prez.object('Drop');
var DropLeft = DropSite.left();
var DropRight = DropSite.left() + DropSite.width();
var DropTop = DropSite.top();
var DropBottom = DropSite.top() + DropSite.height();

ObjektLeft = ObjektLeft + Objekt.translate().translateX;
ObjektTop = ObjektTop + Objekt.translate().translateY;

if (ObjektLeft > DropLeft && ObjektLeft < DropRight && ObjektTop > DropTop && ObjektTop <      DropBottom){
    alert("Correct");
    Objekt.top(50);
    Objekt.left(50);
    }else{
          alert("Try again");
          } ;

The way to get the drag source to its original position would then by translating in the opposite direction, right?

Thanks, Rolf

Hi Rolf,

To move the drag source back to its original position, just reset the translation:

object.translate(0, 0);

You should also reset the translation when setting a new position for the drag source:

object.translate(0, 0);
object.top(50);
object.left(50);

Regards

Hi Toan,

as always: excellent, thanks a lot!!

Best, Rolf