Resetting an animation after it has looped

Questions
1

Hi there,

I have trouble knowing how to reset an animation once it is completed.

In the code below, there is a puzzle. When the puzzle is correcty completed, the boat (bero) rocks, and the puzzle is scrambled.

However, after the scramble, the animation won't run again when the puzzle is completed. I think there is a way to reset this, but I am not sure how.

Here is the code, followed by the image of the "bero" that is animated.

puzzle1.on("complete", ()=>{
	loos_pic1.vis(true);
	bero_pic
		.animate({
			props:{rotation:30},
			rewind:true,
			loop:1
		})
	timeout(2, ()=>{loos_pic1.vis(false);});
	puzzle1.scramble(1,2,3);//take 1 sec to scramble it 3 times but wait 2 seconds
})

image
image1088×504 32.2 KB

Thankyou.
Rod

2

Looks like it is a bug in ZIM or CreateJS where the loop count is set and then the animation run again, the loop count is not being cleared. Will look into it tomorrow - it should be an easy fix.

But until then you can try wiggle() which is better for what you are doing anyway.

// might want to make sure the boat is reg(CENTER)
bero_pic.wiggle("rotation", 0, 10,30, .5,1, 2);

Or replayTween() might work - when we tested, it did - but it is a little awkward.

let completed = false;
puzzle1.on("complete", ()=>{
	loos_pic1.vis(true);
	if (completed) bero_pic.replayTween();
	else {
	    bero_pic.animate({
			props:{rotation:30},
			rewind:true,
			loop:1
		});
	    completed = true;
	}
	timeout(2, ()=>{loos_pic1.vis(false);});
	puzzle1.scramble(1,2,3);//take 1 sec to scramble it 3 times but wait 2 seconds
})
3

Thanks Dr.

I have used wiggle on the boat and it works really well.

I do have a motorbike that I would like to do a wheelstand with when a students gets the correct order for the spelling, so it would be good to have the fix wehen you get a chance, unless you have an alternative for the wheelstand.

This is what I have at the moment - the motorbike is called a "motor" in Tetun (Timor Leste)

Here is the code - that works but does not refresh - virtually identical to my first code for rocking the boat before I used wiggle.

puzzle2.on("complete", ()=>{
	loos_pic2.vis(false);
	motor_pic
		.animate({
			props:{rotation:-60},
			rewind:true,
			loop:1
		})
	/*motor_pic
		.reg(CENTER)
		.wiggle("rotation", 0,30,60,.5,1,2);*/
	timeout(2, ()=>{loos_pic2.vis(false);})
	puzzle2.scramble(1,2,3);//take 1 sec to scramble it 3 times but wait 2 seconds
})

Here is the pic I am using just for your information.

image
image720×478 75.5 KB