I have a puzzle in my game where there is a painting on a wall. The painting is broken up into a 4x6 grid of cubes (only one face of each is visible), and each cube is rotated on the x axis so that the image is scrambled.

The goal of the puzzle is to rotate each of the pieces until the picture is properly formed.

I know how to make the puzzle work, but not exactly the way I wanted to.

I was trying to make it so that each time a cube was clicked, it rotated 90° a second and stopped at each 90° increment.

Of course, Euler angles are all funky so I was having a hard time getting it to work properly, so I just have them instantly rotating 90° each click.

The code I *was* using while trying to make a smooth rotation is as follows:

```
var rotationState: boolean = false;
function OnMouseDown(){
rotationState = true;
}
function Update () {
if (rotationState == true && transform.eulerAngles.x >=0 && transform.eulerAngles.x < 90){
transform.Rotate(90 * Time.deltaTime, 0, 0);
if (transform.eulerAngles.x >= 90){
rotationState = false;
}
} else if (rotationState == true && transform.eulerAngles.x >=90 && transform.eulerAngles.x < 180){
transform.Rotate(90 * Time.deltaTime, 0, 0);
if (transform.eulerAngles.x >= 180){
rotationState = false;
}
} else if (rotationState == true && transform.eulerAngles.x >= 180 && transform.eulerAngles.x < 270){
transform.Rotate(90 * Time.deltaTime, 0, 0);
if (transform.eulerAngles.x >= 270){
rotationState = false;
}
} else if (rotationState == true && transform.eulerAngles.x >=270 && transform.eulerAngles.x < 360){
transform.Rotate(90 * Time.deltaTime, 0, 0);
if (transform.eulerAngles.x >= 360){
rotationState = false;
}
}
}
```

The code worked for the first two clicks, and then the rotations started to get strange.

Does anyone have any idea how I can achieve the desired effect?