My canvas stop showing anything when I want to display a tile 25 times. No errors. Here is the code:
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
var StyleSheet = function(image, width, height) {
this.image = image;
this.width = width;
this.height = height;
this.draw = function(image, sx, sy, swidth, sheight, x, y, width, height) {
image.onload = function() {
context.drawImage(image, sx, sy, swidth, sheight,x, y, width, height);
}
}
}
var Loader = function(src) {
this.image = new Image();
this.image.src = src;
this.image.onload=function(){
var sprite = new StyleSheet(background, 16, 16);
for (i = 0; i < 25; i++) {
for (j = 0; j < 25; j++) {
sprite.draw(background, 30, 30, 36, 36, i * 36, j * 36, 36, 36);
}
}
}
return this.image;
}
var background = new Loader("https://opengameart.org/sites/default/files/PathAndObjects.png");
console.log(background);