Fixing image stretching when rotating [LWJGL]

So its been a long time since ive handled rotation code. I have never done it within GLSL before but ive given it a shot , the rotation calculates as it should , for a square viewpoint that is. When I rotate it stretches to fit the 1 by 1 image , how do I fix this?
Vertex shader code:


attribute vec2 position;
attribute vec2 texin;
uniform vec2 transform;
uniform float zoom;
varying vec2 vecdata;
uniform vec2 rotpos;
uniform float rotation;
void main(){
   if(zoom <= 0){//if its negative then its not fun :(
         zoom = 1;
   }
   vec4 offset = vec4((position.x+transform.x) * zoom,(position.y+transform.y) *zoom,1,1);
   rotation = 60 * (3.1415926535897936264/180);
   rotpos = vec2(0
   ,0);
   offset = vec4((offset.x - rotpos.x),offset.y - rotpos.y,1,1);
   mat4 RotationMatrix = mat4( cos( rotation ), -sin( rotation ), 0.0, 0.0,
             sin( rotation ),  cos( rotation ), 0.0, 0.0,
                      0.0,           0.0, 1.0, 0.0,
                 0.0,           0.0, 0.0, 1.0 );
                
   offset *= RotationMatrix;
   offset = vec4((offset.x + rotpos.x) ,offset.y + rotpos.y,1,1);

   gl_Position = offset;
   vecdata = texin;


}

No stretching
at 0 degrees

total stretching at 90 degrees

Two solutions to this, I convert the coordinates back to pixel coordinates before rotation then convert them back afterward.
I switch the entire code to handle pixel coordinates and only convert them at the last second in the shader. Latter seems more difficult to achieve.

Hmm I don’t really understand what you’re trying to do. I might just be crazy.

But here’s a tip: Don’t branch in GLSL unless you REALLY have to. For the “zoom” uniform validate it in your Java code updating the shader.

Do as much computational stuff as you can outside of the shader (such as matrix math), then just pass in all the uniforms you need to draw the final scene.

You have to transpose the matrix. The [icode]mat4[/icode] constructor takes arguments in the column major order. Just reverse the negative signs on the sine functions.

What I mean is nothing to do with issue with rotation , the issue is with the image afterward it is stretched to the width of the screen how can I solve this?

The problem is your rotation matrix is in row-major format:


mat4 RotationMatrix = mat4
(
    cos( rotation ), -sin( rotation ), 0.0, 0.0,  // Row 1
    sin( rotation ),  cos( rotation ), 0.0, 0.0,  // Row 2
    0.0,              0.0,             1.0, 0.0,  // Row 3
    0.0,              0.0,             0.0, 1.0   // Row 4
);

But the [icode]mat4[/icode] constructor in GLSL expects the values in column major format. Instead of passing rows, you have to pass columns, so you have to transpose the matrix you are using. That can be simply achieved by reversing the minus sign on the [icode]sin[/icode] terms, like this.


mat4 RotationMatrix = mat4
(
     cos( rotation ), sin( rotation ), 0.0, 0.0,  // Column 1
    -sin( rotation ), cos( rotation ), 0.0, 0.0,  // Column 2
     0.0,             0.0,             1.0, 0.0,  // Column 3
     0.0,             0.0,             0.0, 1.0   // Column 4
);

Hope this clears up what I’ve said before.