Rotation sprite or group

[NePo]

I have a board. For simplicity lets say I have one, but I can have a lot.

Player click on the board, board rotates. Rotation is always 90 degrees. 

I attached image. First is starting position. Second is after two click. How I could achieve this?

I want to turn all board including all figures, but at the same time I want figures to point correctly. I want to make pretty animation.

At first I though to add everything to the group. But group does not have anchor, so turning around gets really awkward.

Any suggestions are welcome.

[samme]

I can think of two ways.

1. Rotate the board and move the pieces so they revolve around the board center (use Phaser.Point#rotate).
2. Make the pieces children of the board (Sprite). Rotate the board and simultaneously rotate the children in the opposite direction.

[NePo]

Thank you for your answer.

1. Maybe I don't understand something, but rotate works only with points, not with sprites http://phaser.io/examples/v2/geometry/rotate-point#gv

2. I made figures children of my board.

Code from my game:

for(j=yy;j<yy+3;j++){
            for(i=xx;i<xx+3;i++){
                if(plaza[j][i]>0){
                    figures[plaza[j][i]]['sprite'].visible=false;
                    figures[plaza[j][i]]['child']=pavement[id]['sprite'].addChild(game.add.sprite(sizeS/2*(i-xx-1)-placeFig/2*(i-xx)+placeFig/2, sizeS/2*(j-yy-1)-placeFig/2*(j-yy)+placeFig/2, 'keeper'));
                    figures[plaza[j][i]]['child'].anchor.setTo(0.5, 0.5);
                    game.add.tween(figures[plaza[j][i]]['child']).to( { angle: -90 }, 500, Phaser.Easing.Linear.None, true);
                }
            }
        }
        
        tween = game.add.tween(pavement[id]['sprite']).to( { angle: 90 }, 500, Phaser.Easing.Linear.None, true);

 

[samme]

1. You would do it like

   Phaser.Point.rotate(piece.position, x, y, board.rotation);

   but it's kind of a hassle: http://codepen.io/anon/pen/GjbGjp?editors=0010

2. With child sprites you would do

   // @update
   piece.rotation = -board.rotation;

   Simpler since you don't have to keep track of pieces' positions. http://codepen.io/anon/pen/WGqyzX?editors=0010

[NePo]

WoW! Super, thank you very much.