Chaining events

As i have a Lectora project with quite some actions setup, mostly controlled by users clicking or selecting something... i now run into the issue that i need to chain these events/functions for users that got disconnected and login later.

I figured out a workaround that saves me a lot of recoding parts of the project.

I can call the separate button events by using a bit of Javascript like this.

 let iframe = window.frames[1];//A02
 let drawButton =   iframe.document.querySelector("#tobj172967inner > button");
 let selectButton =  iframe.document.querySelector("#tobj172971inner > button");
drawButton.click();
selectButton.click();

However here occurs my problem. The draw function rotates a card, so it shows properly. The select function then positions it to its proper position.

However when running it like this...only the select function gets executed and the card shows on the proper position but not rotated properly.

When i comment out the selectButton.click it rotates nicely, but doesnot go to its proper position.

If anyone knows of a proper solution to chain this events, so that first the draw gets triggered and then the select...


Kind regards,

Math


Discussion (1)

First attempt was using Promises. That failed due to the fact i use GSAP a lot in my animations. And as GSAP internally uses Promises they fail somehow. Next attempt is using a simple GSAP timeline to chain the events.


Well that worked flawless :-)


 let iframe = window.frames[1];//A02
 let drawButton =   iframe.document.querySelector("#tobj172967inner > button");
 let selectButton =  iframe.document.querySelector("#tobj172971inner > button");

drawButton.click();

let chainedTL = gsap.timeline();
chainedTL.to(drawButton,{duration:1,autoAlpha:1,onComplete: drawMe});
chainedTL.to(selectButton,{duration:1,autoAlpha:1,onComplete: selectMe});

function drawMe(){
  console.log("drawMe");
   drawButton.click();
}

function selectMe(){
    console.log("selectMe");
  selectButton.click();
}


If you check the code above you notice that i have drawButton.click twice in the code.

Don't ask me why, but adding it once it doesnot work. Now i can easily chain all code on reconnect of a user.