Texture scale in GLSL using pixi-js - glsl

Question

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);