I'm currently deep into developing a game using sprites in JavaScript. I've been trying to incorporate an event listener that verifies whether the sprite images have loaded before beginning the game. Employing object-oriented programming, I've encountered a few challenges... Let me present an illustrative example:
function Sprite() {
this.img = new Image();
// Attempt 1:
this.img.onload = function() {
// Code for when image loads
}
// Attempt 2:
this.img.addEventListener("load", function() {
// Logic following successful load
// However, implementation details still elude me
});
this.img.src = "res/image.png";
this.draw = function() {
context.drawImage(// parameters);
}
this.move = function() {
// Functionality for sprite movement
}
}
Regardless of the approach I take, it seems like nothing is working as expected. The sprites refuse to appear without any evident errors. What could be causing this issue?