My first JavaFX program

So for my first JFX program, I decided to animate my friend Carlos. He just starts from the left corner and when you click him goes all the way to the right. Nothing to fancy. The main purpose of this little program is just to get my head around the syntax, which is quite different from what I’m used to, and to learn a bit about how animation works.

What I’d like to do now is do a more complicated animation sequence, when the character goes to the right, I’d like to have him bounce a bit and then pause, then go back to the original position.

Also, if anybody knows how to cancel an animation let me know. If he’s animating and you click on the character a couple of times, he starts getting seizures.

import javafx.ui.canvas.*;
import javafx.ui.*;

class AnimationTest extends CompositeNode{
    attribute x: Number;
}
attribute AnimationTest.x = 10;
function AnimationTest.composeNode() =
Group {
    content: ImageView {
        transform: bind [translate(x,0)]
        image: Image { url: "http://sellmic.com/images/carlos.gif"}
        onMouseClicked: operation(e:CanvasMouseEvent) {
            x = [10..250] dur 1000;
        }
      }
    };

    Canvas {
        content: AnimationTest
    }

Chris Oliver sent some code to cancel the animation on a mouse click, it seemed to work at first but I still get some weird side effects if I click on the image as it’s moving. You can see it shake back and forth.

        image: Image { url: "http://sellmic.com/images/carlos.gif"}
        var animCount = 0
        onMouseClicked: operation(e:CanvasMouseEvent) {
            var count = ++animCount;
            x = [10..350] dur 6000 while animCount == count;