FX

package pathanimation;

import javafx.animation.*;
import javafx.animation.transition.*;
import javafx.scene.*;
import javafx.scene.image.*;
import javafx.scene.paint.Color;
import javafx.scene.shape.*;
import javafx.scene.transform.Rotate;
import javafx.stage.Stage;

package class CarScenario extends Scenario {

    public-read override var image = Image { url: "{__DIR__}resources/car.png" };
        
    def car = ImageView {
        smooth: true
        image: image
        translateX: 245
        translateY: 420
        rotate: 180
    };

    def path = [
        MoveTo       {         x: 280         y: 440 },
        HLineTo      {         x: 130                },
        QuadCurveTo  {  controlX: 110  controlY: 440
        x: 110         y: 420 },
        VLineTo      {                        y: 390 },
        CubicCurveTo { controlX1: 110 controlY1: 350
            controlX2: 330 controlY2: 420
        x: 330         y: 280 },
        VLineTo      {                        y: 220 },
        CubicCurveTo { controlX1: 330 controlY1: 168
            controlX2: 370 controlY2: 186
        x: 370         y: 240 },
        VLineTo      {                        y: 350 },
        QuadCurveTo  {  controlX: 370  controlY: 440
        x: 330         y: 440 },
        HLineTo      {         x: 280                },
        ClosePath {},
    ];

    def track = Path {
        stroke: Color.GRAY
        strokeWidth: 30
        elements: path
    };

    def line = Path {
        stroke: Color.WHITE
        strokeWidth: 4
        strokeDashArray: [ 30, 40 ]
        elements: path
    };

    def anim = PathTransition {
        node: car
        path: AnimationPath.createFromPath(track)
        orientation: OrientationType.ORTHOGONAL_TO_TANGENT
        interpolate: Interpolator.LINEAR
        duration: 6s
        repeatCount: Timeline.INDEFINITE
    };

    public-read override var node = bind Group {
        content: [
            ImageView {
                smooth: true
                image: Image { url: "{__DIR__}resources/{Scenario.PLATFORM}/car-bg.png" };
            },
            Group {
                content: [ track, line, car ]
                transforms: Rotate { angle: 40 pivotX: 220 pivotY: 280 }
            }
        ]
    };

    public override function play() {
        anim.play();
    }

    public override function pause() {
        anim.pause();
    }

    public-read override var running = bind (anim.running and not anim.paused);
}