<head>
	<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser-ce/2.13.2/phaser.js"></script>
	<title>Ξ L Ξ C T R I C - W Δ ∨ Ξ S</title>
</head>
<body>
	<div class="main_out">
		<div class="main_in">
		</div>
	</div>
</body>
document.addEventListener('DOMContentLoaded', getSize);
window.addEventListener('resize', getSize);

var winW = 0;
var winH = 0;

function getSize() {
    winW = window.innerWidth;
    winH = window.innerHeight;
};
var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });

function preload() {
    game.load.image('car', 'https://examples.phaser.io/assets/sprites/car90.png');
    game.scale.setGameSize(winW, winH);
};

var sprite;
var speed;
var r_speed;
var r_degree;
var tol;
var angleToPointer;
var angleDelta;

function create() {
    game.physics.startSystem(Phaser.Physics.ARCADE);
    game.stage.backgroundColor = '#0072bc';
    sprite = game.add.sprite(400, 300, 'car');
    sprite.anchor.setTo(0.5, 0.5);
    game.physics.enable(sprite, Phaser.Physics.ARCADE);
    sprite.body.collideWorldBounds = true;
    sprite.body.bounce.set(0.3);

    speed = 100;
    r_speed = 1 * Math.PI;
    r_degree = r_speed*180/Math.PI;
    tol = 0.02 * r_speed;
};

function update() {
    pointerMove(game.input.activePointer);
    game.physics.arcade.velocityFromRotation(sprite.rotation, speed, sprite.body.velocity);                 
};
function pointerMove (pointer) {
  angleToPointer = game.physics.arcade.angleBetween(sprite, pointer);
  angleDelta = game.math.wrapAngle(angleToPointer - sprite.rotation, true);
    
  if (game.math.within(angleDelta, 0, tol)) {
    sprite.rotation = angleToPointer;
    sprite.angularVelocity = 0;
  } else {
    sprite.body.angularVelocity = (game.math.sign(angleDelta) * r_degree);
  };
};

function render() {
    game.debug.spriteInfo(sprite, 32, 32);
     game.debug.text("angle between: " + game.physics.arcade.angleBetween(sprite, game.input.activePointer), 32, 208);
    game.debug.text("angle: " + sprite.angle, 32, 224);
    game.debug.text("Distance to pointer: " + Math.round(game.physics.arcade.distanceToPointer(sprite)), 32, 256);
    game.debug.text("pointer x: " + game.input.activePointer.x, 32, 288);
};
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.