Drag to Rotate Sprite with Anchor

[gsko]

I am new to Phaser and I am trying to get a sprite to be dragged and rotated with an anchor point set. I found some code that will follow the pointer but I need the sprite to be grabbed and dragged. I'm a little stumped and think I might be overthinking this.

var game = new Phaser.Game(950, 350, Phaser.CANVAS, 'phaser-test', { preload: preload, create: create, update: update});function preload() {  game.load.image('handle', 'images/handle.png');  game.load.image('button', 'images/tether_button2.png');}var button;var dragging;function create() {  game.physics.startSystem(Phaser.Physics.P2JS);  scale = 0.35;  handle = game.add.sprite(90, 200, 'handle');  handle.scale.x = scale;  handle.scale.y = scale;  button = game.add.sprite(831, 240, 'button');  button.scale.x = scale;  button.scale.y = scale;  button.inputEnabled = true;  button.anchor.setTo(0.536, 0.307);  button.angle = 37;}function update() {  var targetAngle = (360 / (2 * Math.PI)) * game.math.angleBetween(  button.x, button.y,  this.game.input.activePointer.x, this.game.input.activePointer.y) - 90;     if(targetAngle < 0) {      targetAngle += 360;  }  if(game.input.activePointer.isDown && !dragging) {      dragging = true;  }  if(!game.input.activePointer.isDown && dragging) {      dragging = false;  }     if(dragging) {      button.angle = targetAngle;  }}

I've attached a screen shot of what I am trying to accomplish if my description didn't make sense. Any help is greatly appreciated.

 

Thanks.

 

[stauzs]

hi,

 

If I understood correctly - you need to make some kind of switch

 

can you try this:

var down = false;function create() {  //......  // catch down  button.inputEnabled = true;  button.events.onInputDown.add(function(){down = true;});}function update() {  var p = game.input.activePointer;  if(!p.isDown){     down = false;  }  else if(down){     var angle = Phaser.Math.angleBetween(p.x, p.y, button.x, button.y);     button.rotation = angle;// - Math.PI*0.5 (-90 degrees if your button by default looks up ( not right ) )  }}

basically - you need to catch an event when user "touches" the button:

button.inputEnabled = true;button.events.onInputDown.add(function(){down = true;});

as alternate you could check button bounds vs pointer coords

[gsko]

Thank you! That was exactly what I needed! I ended up with this:

    var p = game.input.activePointer;    if(!p.isDown){        down = false;    } else if(down) {        var angle = (Math.PI*0.5) * Phaser.Math.angleBetween(p.x, p.y, button.x, button.y)+90;        button.rotation = angle;    }

Had to add 90 instead of subtract. Thanks again for your help!