<div id="phaser-example"></div>

class RotatingObject extends Phaser.Scene {
  constructor(){
    super('rotatingObject');
  }

  preload ()
  {
      this.load.image('eye', 'assets/pics/lance-overdose-loader-eye.png');
  }// End preload

  create ()
  {
      let image = this.add.sprite(150, 150, 'eye').setInteractive();
      console.log(image.width);
      image.setScale(1.5,1.5);

      // By default Phaser only have two pointers: mousePointer and pointer1. So we need one more (pointer2).
      this.input.addPointer(1);
      const p1 = this.input.pointer1;
      const p2 = this.input.pointer2;

      this.input.setDraggable(image);

      image.on('drag', (pointer) => {
          let touch2 = (pointer.id == 1) ? p2 : p1;
          if(!touch2.noButtonDown()){
            // previus angle between pointers (in radians)
            let prevAngle = Phaser.Math.Angle.Between(p1.prevPosition.x, p1.prevPosition.y, p2.prevPosition.x, p2.prevPosition.y);
            // current angle
            let currentAngle = Phaser.Math.Angle.Between(p1.position.x, p1.position.y, p2.position.x, p2.position.y);
            // rotation delta
            let delta = currentAngle - prevAngle;
            // Smooth values (hardcoded 0.15 radians)
            delta = Math.min(Math.max(delta, -0.15), 0.15);
            // Transform object
            image.setRotation(image.rotation + delta);
          }
      });
    
  }//End create

}// End class

var config = {
    type: Phaser.WEBGL,
    width: 300,
    height: 300,
    parent: 'phaser-example',
    scene: [RotatingObject],
    loader: {
    baseURL: "https://labs.phaser.io",
    crossOrigin: "anonymous"
  }
};

var game = new Phaser.Game(config);