FX

/* 
 * DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER
 * Copyright 2010 Sun Microsystems, Inc. All rights reserved.
 * Use is subject to license terms.
 * 
 * This file is available and licensed under the following license:
 * 
 * Redistribution and use in source and binary forms, with or without 
 * modification, are permitted provided that the following conditions are met:
 *
 *   * Redistributions of source code must retain the above copyright notice, 
 *     this list of conditions and the following disclaimer.
 *
 *   * Redistributions in binary form must reproduce the above copyright notice,
 *     this list of conditions and the following disclaimer in the documentation
 *     and/or other materials provided with the distribution.
 *
 *   * Neither the name of Sun Microsystems nor the names of its contributors 
 *     may be used to endorse or promote products derived from this software 
 *     without specific prior written permission.
 * 
 * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
 * ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
 * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
 * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR
 * ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
 * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
 * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON
 * ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
 * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 */
 

package basicanimation;

import javafx.animation.Interpolator;
//import javafx.animation.KeyFrame; //required for alternate timeline
import javafx.animation.Timeline;
import javafx.scene.paint.Color;
import javafx.scene.Scene;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Line;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.scene.control.Button;

/**
 * @author nancyhildebrandt
 */


var slider1: Number = 20.0;
var slider2: Number = 120.0;
var slider3: Number = 110.0;


var t1 =
Timeline {
    repeatCount: 1
    keyFrames: [
        at (5s) {slider1 => 100.0 tween Interpolator.LINEAR}
        at (5s) {slider2 => 200.0 tween Interpolator.LINEAR}
        at (6s) {slider3 => 110.0 tween Interpolator.LINEAR} //start point for slider3
        at (11s) {slider3 => 10.0 tween Interpolator.LINEAR} //end point for slider3
    ]
};
t1.play();

/* Alernate notation with KeyFrame instances
var t1 = Timeline {
    repeatCount: 1
    keyFrames: [
        KeyFrame {
            time: 5s //Defines the state at 10 seconds of animation
            canSkip: true
            values: [
                slider1 => 100 tween Interpolator.LINEAR
            ] //close values

        } // close KeyFrame
        KeyFrame {
            time: 5s
            canSkip: true
            values: [
                slider2 => 200.0 tween Interpolator.LINEAR
            ] //close values

        } // close KeyFrame
        KeyFrame {
            time: 6s
            canSkip: true
            values: [
                slider3 => 110.0
            ] //close values

        } //close KeyFrame
        KeyFrame {
            time: 11s
            canSkip: true
            values: [
                slider3 => 10.0 tween Interpolator.LINEAR
            ] //close values

        } //close KeyFrame
    ] //close keyFrames

};
t1.play(); */

Stage {
    title: "Horizontal Animation"
    width: 240
    height: 200
    scene: Scene {
        content: [
            // Draw the vertical lines
            for(num in [0..9]) {
                Line {
                    startX: 30+num*20,
                    startY: 60
                    endX: 30+num*20,
                    endY: 80  
                    strokeWidth: 1
                    stroke: Color.BLACK
                }
            }
            Rectangle {    // Orange rectangle
                translateX: bind slider1  //Value derived from the keyframes
                y: 60   //Vertical value is constant
                width: 20,
                height: 20
                fill: Color.web("#FD8500")
            }
            Rectangle {    // Black rectangle
                translateX: bind slider2
                y: 60
                width: 20,
                height: 20
                fill: Color.BLACK
            }
            Circle {  //Turquoise circle
                translateX: bind slider3
                centerY: 70
                radius: 10
                fill: Color.web("#0A8CEC")
            }

            /* Reload button 1.2 */
            Button {
                translateX: 80,
                translateY: 135
                text: "Reload"
                action: function() {
                    t1.playFromStart();
                }
            }
        ] 
    }
}