Reputation: 605
I have this piece of code rotating an image and then moving it - which works fine unless the image does not rotate - meaning the current angle of the image is equal to the angle it should rotate to - in this case the callback function is not called, so there is no animation. The rotate function comes from a plugin.
$("#Ship" + shipID).rotate({
duration: 500,
angle: $(this).getRotateAngle(),
animateTo: parseInt(rotate),
callback: function () {
$("#" + shipID).animate({
left: parseInt(moveX),
top: parseInt(moveY)
}, 500, function () {
});
}
})
If the animate function is written after the rotate - then the rotate and animation happen at the same time.
I don't think I can force the callback as I would have to edit the plugin (but im not sure about that). Is there a way to write the animate after the rotate, but wait for rotate to finish? I guess one way would be is to use delay, but is there a more proper way?
Upvotes: 0
Views: 718
Reputation: 2928
You have to check the rotation before you try to execute anything with the plugin. I'm not exactly sure how you'll check the current rotation, but:
var currentRotation = $("#Ship" + shipID).getRotateAngle();
if(currentRotation != rotate) {
$("#Ship" + shipID).rotate({
duration: 500,
angle: $(this).getRotateAngle(),
animateTo: parseInt(rotate),
callback: function () {
$(this).rotate({
animateTo: rotate
});
$("#" + shipID).animate({
left: parseInt(moveX),
top: parseInt(moveY)
}, 500);
}
});
}
Depending on your exact setup and how the plugin works, you may need to check your currentRotation
inside of the plugin method. Or, you may need to set up some events to execute the if
statement. Again, this would depend on how you're brinding this all together (how do you know when you want something to rotate?)
Upvotes: 1