Rotating the screen in online experiments

I want to be able to rotate the whole screen, as a single mass, by an arbitrary amount (though most commonly by 45 degrees).

Ideally this would grab all the components on the screen, rotate them all together and then resize so that they all still fit on the screen. The grey background should remain covering the whole monitor.

In principle I could apply a rotation matrix to the location coordinates of every element, and I have tried that, but for some reason that does different stuff to different objects, I’m guessing because the anchors are different for some of the objects? In addition, it does not resize all the objects proportionally so that they still fit to the screen, and I’m not really sure how I would go about doing this. I would have thought there is some clever javascript way of doing this, but I haven’t found one yet!

Thanks,

Peter