Texture scale in GLSL using pixi-js

I want to scale the textures so they can be centered and scaled so they cover the space without distorting the image. I tried some things but I don't seem to get it to work with the uniforms provided by pixi-js. I'm still a noob at GLSL /pixi.

Here is a codepen link with the problem: https://codepen.io/sergiulucutar/pen/JjKXKKw?editors=0010

    const app = new PIXI.Application({
      width: window.innerWidth,
      height: window.innerHeight,
      antialias: true,
      resizeTo: window,
      transparent: true
    });
    
    document.body.appendChild(app.view);
    
    //Image
    const vertexShader = `
      precision mediump float;
    
      attribute vec2 aVertexPosition;
      attribute vec2 aSize;
    
      uniform mat3 translationMatrix;
      uniform mat3 projectionMatrix;
    
      varying vec2 vUvs;
    
      uniform vec2 uSize;
    
      void main() {
        vUvs = vec2(aVertexPosition.x / uSize.x, aVertexPosition.y / uSize.y);
        gl_Position = vec4((projectionMatrix * translationMatrix * vec3(aVertexPosition, 1.0)).xy, 0.0, 1.0);
      }
    `;

    const fragmentShader = `
      precision mediump float;
    
      varying vec2 vUvs;
    
      uniform sampler2D uTexture;
    
      void main() {
        gl_FragColor = texture2D(uTexture, vUvs);
       }
      `;
    
    const width = 1400;
    const height = 300;
    
    const uniforms = {
      uTexture: PIXI.Texture.from(imageUrl),
      uSize: [width, height],
      uTime: 0
    };
    const shader = PIXI.Shader.from(vertexShader, fragmentShader, uniforms);
    const mesh = new PIXI.Mesh(new PIXI.PlaneGeometry(width, height, 32, 32), shader);
    mesh.position.y = 100;
    
    app.stage.addChild(mesh);