.stopAnimate() and callback

My situation is that I have a promise waiting for an object to finish animating, but there are times when the animation needs to be stopped, and the promise fulfilled. For example...

    const p = new Promise(resolve => {
      s.animate({
        ...
        call: () => {
          console.log("s.animate done");
          resolve();
        }
      })
    });

This works as long as the animation completes normally. But, I need to also have the promise resolve (or reject) if the animation ends abnormally, such as through a .stopAnimate(). It seems there is no callback upon stopAnimate()?

The code that never completes is...

await Promise.allSettled([animations]);

...where animations is an array of stuff like in the first block.

Question. How are you triggering the stopAnimate()? Can you not fulfill the promise then? Tested with the code below and it does work.

// Given F, S, W, H or frame, stage, stageW, stageH
const circle = new Circle(50, red)
   .center()
   .alp(0)
   .sca(0);


let myPromise = new Promise(function(resolve, reject) {
// "Producing Code" (May take some time)
    circle.tap(e => {
        circle.stopAnimate();
        reject();
    });
    circle.animate({alpha:1, scale:1}, 5, null, resolve); // when successful
  //reject();  // when error
});

// "Consuming Code" (Must wait for a fulfilled Promise)
myPromise.then(
  function(value) { zog('resolved'); },
  function(error) { zog('rejected'); }
);
1 Like

Hi @pettis thanks for the reply. My architecture doesn't have the stopAnimate within the promise. The need to stopAnimate/resolve/reject is externally driven. Also, it's not just that I want the promise to return, but also that I want to put clean-up code in case stopAnimate is called, similar to the call: FN property, but something like stopCall: FN.

So not unlike what you've provided, which I very much appreciate, and notwithstanding an actual stopCall property on animate, I think I may need to do something more like this...

disp.deferred = Promise.withResolvers();
disp.animate({call: () => disp.deferred.resolve()});

...and elsewhere...

for (const dispToStop of arrayOfDisps) {
    dispToStop.stopAnimate();
    dispToStop.deferred.reject();
}

I was hoping to avoid tooling the object or creating a management structure, but it is what it is for the moment. Thanks for your help!

In general, we do not put events on methods as we assume whatever you wanted to do in the event you can just do the line after the method call. It also helps us not trigger an event twice which historically happened once or twice. Callbacks may be a little different... and I don't think it would hurt to provide a stopped callback... would we need a paused callback and an unpaused callback... so that then adds to the parameters. Let's all give it some thought and see if some other way works or if we should do the callback.

1 Like

Thanks for the consideration, Dr.! I'll write my thoughts after I've finished this section of the project and put it through its paces.

Cheers!

1 Like