LWJGL - Shader for a 'manually loaded' NPOT texture

Question

I am trying to display an npot texture in my lwjgl window. The result is this:

The texture is repeated 4 times, upside down as well as distorted by horizontal lines. Obviously this is not the intended result. Here is what I feel to be relevant source code:

Utility method that loads a texture:

// load the image
BufferedImage image = null;
try {
    image = ImageIO.read(new File(path));
} 
// exit on error
catch (IOException exception) {
    Utility.errorExit(exception);
}
// add the image's data to a bytebuffer
ByteBuffer buffer = BufferUtils.createByteBuffer(image.getWidth() * image.getHeight() * 4);
for(int x = 0; x < image.getWidth(); x++) {
    for(int y = 0; y < image.getHeight(); y++) {
        int pixel = image.getRGB(x, y);
        buffer.put((byte) ((pixel >> 16) & 0xFF));  // red
        buffer.put((byte) ((pixel >> 8) & 0xFF));   // green
        buffer.put((byte) (pixel & 0xFF));          // blue
        buffer.put((byte) 0xFF);                    // alpha
    }
}
// flip the buffer
buffer.flip();
// generate and bind the texture
int handle = GL11.glGenTextures();
GL11.glBindTexture(GL31.GL_TEXTURE_RECTANGLE, handle);
//Setup wrap mode
GL11.glTexParameteri(GL31.GL_TEXTURE_RECTANGLE, GL11.GL_TEXTURE_WRAP_S, GL12.GL_CLAMP_TO_EDGE);
GL11.glTexParameteri(GL31.GL_TEXTURE_RECTANGLE, GL11.GL_TEXTURE_WRAP_T, GL12.GL_CLAMP_TO_EDGE);

//Setup texture scaling filtering
GL11.glTexParameteri(GL31.GL_TEXTURE_RECTANGLE, GL11.GL_TEXTURE_MIN_FILTER, GL11.GL_LINEAR);
GL11.glTexParameteri(GL31.GL_TEXTURE_RECTANGLE, GL11.GL_TEXTURE_MAG_FILTER, GL11.GL_LINEAR);
// set the texture data
GL11.glTexImage2D(GL31.GL_TEXTURE_RECTANGLE, 0, GL11.GL_RGBA8, image.getWidth(), image.getHeight(), 0, 
        GL11.GL_RGBA, GL11.GL_UNSIGNED_BYTE, buffer);
// return the handle
return handle;

Utility method to bind the texture to the sampler:

// set the sampler's texture unit
GL20.glUniform1i(samplerLocation, GL13.GL_TEXTURE0 + textureUnit);
// bind the texture to the texture unit
GL13.glActiveTexture(GL13.GL_TEXTURE0 + textureUnit);
GL11.glBindTexture(GL31.GL_TEXTURE_RECTANGLE, textureID);

Fragment shader:

#version 150
#extension GL_ARB_texture_rectangle : enable

uniform sampler2DRect sampler;

in vec2 vTexture;
out vec4 color;

void main()
{
    color = texture2DRect(sampler, vTexture);
}

The last piece of information that I feel would be relevant is what my texture coordinates are:

• Bottom Left Point: (0, 0)
• Top Left Point: (0, 600)
• Top Right Point: (800, 600)
• Bottom Right Point (800, 0)

I am guessing I am doing multiple things wrong. Post in comments section if you feel there is more information that I could provide. Thanks!

P.S. The reason I say the texture is manually loaded is because I am used to using Slick-Util for loading textures, but I was not able to use it for this certain texture as I hear Slick-Util does not support npot textures.

Answer 1

You're pushing texels to the buffer in the wrong order.

ByteBuffer buffer = BufferUtils.createByteBuffer(image.getWidth() * image.getHeight() * 4);
for(int x = 0; x < image.getWidth(); x++) {
    for(int y = 0; y < image.getHeight(); y++) {
        int pixel = image.getRGB(x, y);
        buffer.put((byte) ((pixel >> 16) & 0xFF));  // red
        buffer.put((byte) ((pixel >> 8) & 0xFF));   // green
        buffer.put((byte) (pixel & 0xFF));          // blue
        buffer.put((byte) 0xFF);                    // alpha
    }
}

You are iterating over the height in the inner loop. glTexImage2D expects the data to be scanline based, not column based. So try to swap your x and y loops.