When I call image() from p5.js library, it gives me the type error 'e is undefined', despite giving it the image. I am fairly new to javascript, and completely new to p5.js. The idea is that I would get the following images to fall on the screen from a random x and y coordinate.
var yVal;
var accel;
var velocity;
var mass;
var pieces = []
function preload () {
images = ["/images/L.png", "/images/LL.png", "/images/T.png"]
img_amount = getRandomInt(21);
for (var i = 1; i <= img_amount; i++) {
var img = loadImage(images[getRandomInt(3)]);
pieces[i-1] = img;
}
}
function setup() {
createCanvas(window.innerWidth, 700);
yVal = [];
velocity = [];
mass = 10;
accel = mass * 0.1;
for (var i = 0; i <= img_amount; i++) {
var randX = getRandomInt(window.innerWidth);
var randY = getRandomInt(700);
image(pieces[i], randX, randY, mass, mass);
}
}
function draw() {
background(25);
fill(255,0,0);
for (var i = 0; i <= img_amount; i++) {
velocity[i] += accel;
yVal[i] += velocity[i];
image(pieces[i], pieces[i].xvalue, yVal[i], mass, mass);
if (yVal[i] > height - mass/2) {
// A little dampening when hitting the bottom
velocity[i] *= -0.6;
yVal[i] = height - mass/2;
}
}
}
function getRandomInt(max) {
return Math.floor(Math.random() * max);
}