I’m using the https://editor.p5js.org/Josef37/sketches/RGDv9lHkK for convert to p5.js and I’m still don’t know how to convert 100% correct, the picture won’t show up when i convert myCode from the khanAcademy Original code to p5.js and can you also help me put the sound clack.wave when Block fall down in my code as well?
myCode
function preload() {
blockImg = loadImage('block.png');
}
var Block = function(x, y) {
this.x = x;
this.y = y;
this.img = loadImage("block.png");
this.sticks = 0;
};
function setup() {
createCanvas(windowWidth, windowHeight);
Block.prototype.draw = function() {
image(this.img, this.x, this.y, 40, 40);
};
Block.prototype.hop = function() {
this.img = getImage("block.png");
this.y -= -44;
};
Block.prototype.fall = function() {
this.img = getImage("block.png");
this.y += 5;
};
}
function draw() {
background(200);
var block = new Block(10, 300);
block.draw();
}I’m using P5.js on this website >https://editor.p5js.org/Josef37/sketches/RGDv9lHkK<
https://www.khanacademy.org/computing/computer-programming/programming-games-visualizations/side-scroller/a/beaver-character
Original Code from KhanAcademy
var Beaver = function(x, y) {
this.x = x;
this.y = y;
this.img = getImage("creatures/Hopper-Happy");
this.sticks = 0;
};
Beaver.prototype.draw = function() {
image(this.img, this.x, this.y, 40, 40);
};
Beaver.prototype.hop = function() {
this.img = getImage("creatures/Hopper-Jumping");
this.y -= -44;
};
Beaver.prototype.fall = function() {
this.img = getImage("creatures/Hopper-Happy");
this.y += 5;//Down Gavity
};
var beaver = new Beaver(10, 300);
beaver.draw();
