JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.snorkl.tv/dev/libs/greensock/TweenMax.min.js"></script>
<script src="http://code.createjs.com/easeljs-0.4.2.min.js"></script>
<canvas id="testCanvas" width="500" height="400"></canvas>

JavaScript

//EaselJS with TweenMax

var canvas;
        var stage;

 
            
            canvas = document.getElementById("testCanvas");
            stage = new Stage(canvas);
            stage.autoClear = true;

            var ball = new Shape();
            ball.graphics.setStrokeStyle(5, 'round', 'round');
            ball.graphics.beginStroke(('#000000'));
            ball.graphics.beginFill("#FF0000").drawCircle(0,0,50);
            ball.graphics.endStroke();
            ball.graphics.endFill();
            ball.graphics.setStrokeStyle(1, 'round', 'round');
            ball.graphics.beginStroke(('#000000'));
            ball.graphics.moveTo(0,0);
            ball.graphics.lineTo(0,50);

            ball.graphics.endStroke();
            ball.x = 0;
            ball.y = 100;

            console.log(ball);

            stage.addChild(ball);
            stage.update();


TweenLite.ticker.fps(30);
var tl = new TimelineLite({onUpdate:tick});
        tl.to(ball, 2, {x:300, rotation:360})
          .to(ball, 1, {y:0, rotation:-360})
            .to(ball, 1, {rotationX: 90, scaleX:0, scaleY:0}, -.5);
             
            

        function tick() {
            stage.update();
        }