JSFiddle - React, Tailwind, and code Playground

by Vasilii Chugunov

HTML

<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>
<canvas id="demoCanvas" width="500" height="200"></canvas>

JavaScript

var stage, output;
		
function init() {
  stage = new createjs.Stage("demoCanvas");

  // this lets our drag continue to track the mouse even when it leaves the canvas:
  // play with commenting this out to see the difference.
  stage.mouseMoveOutside = true; 

  var circle = new createjs.Shape();
  circle.graphics.beginFill("red").drawCircle(0, 0, 50);

  var label = new createjs.Text("drag me", "bold 14px Arial", "#FFFFFF");
  label.textAlign = "center";
  label.y = -7;

  var dragger = new createjs.Container();
  dragger.x = dragger.y = 100;
  dragger.addChild(circle, label);
  stage.addChild(dragger);

  dragger.on("pressmove",function(evt) {
    // currentTarget will be the container that the event listener was added to:
    evt.currentTarget.x = evt.stageX;
    evt.currentTarget.y = evt.stageY;
    // make sure to redraw the stage to show the change:
    stage.update();   
  });

  stage.update();
}
init();