I would like my GWT widget to be notified when its CSS animation is over.
In plain HTML/Javascript this is easily done by registering an event handler like so:
I expanded a bit on the solution from Darthenius. This code also includes a mechanism to remove the event handler when it is finished. This is what I needed for my application but may not be what you want in all contexts. YMMV!
My final code looks like this:
import com.google.gwt.dom.client.Element;
import com.google.gwt.user.client.rpc.AsyncCallback;
public class CssAnimation {
public static native void registerCssCallback(Element elem, AsyncCallback callback) /*-{
var eventListener = function () {
$entry(@CssAnimation::cssCallback(Lcom/google/gwt/user/client/rpc/AsyncCallback;)(callback));
elem.removeEventListener("webkitAnimationEnd", eventListener);
};
elem.addEventListener("webkitAnimationEnd", eventListener, false);
}-*/;
protected static void cssCallback(AsyncCallback callback) {
callback.onSuccess(null);
}
}