He revisado el código y buscado algunas respuestas, pero ninguna refleja el problema que tengo. No me sale ningún error, solo que la “pág...

He revisado el código y buscado algunas respuestas, pero ninguna refleja el problema que tengo. No me sale ningún error, solo que la “página” no se carga y al final sale un error y me indica que no ha podido cargarse. Les dejo mi código aquí:

var vp = document.getElementById('villaplatzi');
var papel = vp.getContext("2d");

var fondo = {
  url: "tile.png",
  cargaOK: false
};

var vaca = {
  url: "vaca.png", //dentro de un objeto literal se separan con , no ;//
  cargaOK: false
};

var pollo = {
  url: "pollo.png",
  cargaOK: false
};

var cerdo = {
  url: "cerdo.png",
  cargaOK: false
};

var cantidad = aleatorio(0,5);

fondo.imagen = new Image(); //crear un atributo nuevo, para colocar la imagen //
fondo.imagen.src = fondo.url; //se trae el png //
fondo.imagen.addEventListener("load", cargarFondo); //para cuando la imagen esté cargada, la integre //

vaca.imagen = new Image(); //no se puede meter el objeto image dentro del objeto literal //
vaca.imagen.src = vaca.url;
vaca.imagen.addEventListener("load", cargarVacas);

pollo.imagen = new Image();
pollo.imagen.src = pollo.url;
pollo.imagen.addEventListener("load", cargarPollo);

cerdo.imagen = new Image();
cerdo.imagen.src = cerdo.url;
cerdo.imagen.addEventListener("load", cargarCerdo);

function cargarFondo()
{
  fondo.cargaOK = true;
  dibujar();
}

function cargarVacas()
{
  vaca.cargaOK = true;
  dibujar();
}

function cargarPollo()
{
  pollo.cargaOK = true;
  dibujar();
}

function cargarCerdo()
{
  cerdo.cargaOK = true;
  dibujar();
}

function dibujar()
{
  if (fondo.cargaOK)
  {
    papel.drawImage(fondo.imagen, 0, 0);
  }
  if (vaca.cargaOK)
  {
    for(v=0; v<cantidad; v++)
    {
      var x = aleatorio(0, 7)
      var y = aleatorio(0, 7)
      var x = x * 60
      var y = y * 60
      papel.drawImage(vaca.imagen, x, y);
    }
  }
  if (pollo.cargaOK)
  {
    for(p=0; p<cantidad; p++)
    {
      var x = aleatorio(0, 7)
      var y = aleatorio(0, 7)
      var x = x * 60
      var y = y * 60
      papel.drawImage(pollo.imagen, x, y);
    }
  }
  if (cerdo.cargaOK)
  {
    for (c=0; c=cantidad; c++)
    {
      var x = aleatorio(0, 7)
      var y = aleatorio(0, 7)
      var x = x * 60
      var y = y * 60
      papel.drawImage(cerdo.imagen, x, y);
    }
  }
}

function aleatorio(min, max) //parametros a considerar//
{
  var resultado; //guardar el resultado de la función //
  resultado = Math.floor(Math.random() * (max - min + 1)) + min;
  return resultado; //devulve lo que pongamos aquí//
}