I want to upload photos to static picture frames of different sizes and add some features to edit the images inside the frames. There are following features:
- Zoom in and zoom out of the picture inside the static frame
- Rotation from 0 to 180 degree (0-pi) inside the static frame
- Image positioning with cursor. Freedom of movement is dependent on the size of the image and changes if the image will be zoomed.
The challenge: The image should always cover the entire area within the picture frame, but there are different size frame sizes. I’m looking for a solution for any size for picture frame.
The problems:
a) If the image has been rotated then the picture size is to resize so that no space within the picture frame is uncovered. I have found a solution with triangle trigonometry. But I’m looking for a more simpler solution without triangle trigonometry.
b) If the image has been zoomed or moved by cursor before a rotation then the rotation point in the centre of the frame moves away. The following resize in relation with the rotation is correct, but the image rotation point isn’t anymore in the centre of the picture frame. The image doesn’t cover the whole space inside the picture frame, because part of the image is outside of the frame. The new rotation point has to move back to the centre of the frame. Is there a solution for any size of frame?
How can I solve this tasks?
