En p5.js, estoy creando una animación usando imágenes. ¿Cómo puedo encuadrar las imágenes de manera que después de hacer clic en el botón deban ejecutar el código? Quiero ejecutar un código donde después de hacer clic en el botón, las imágenes deben moverse hacia p5.png. Aquí he usado 6 imágenes para la simulación. ¿Cómo podría animar esas imágenes para que después de hacer clic en el botón deban ejecutar o ejecutar el código?

 var pic1; var pic2; var pic3; var pic4; var pic5; var pic6; let button; let posX=0 let posY=0 const rightwall=350; const height=450; function preload(){ pic1=loadImage("5.png") pic2=loadImage("Iron ore.jpg") pic4=loadImage("blastfurnace.jpg") pic5=loadImage("coal2.jpg") pic6=loadImage("limestone.jpg") pic3=loadImage("slag.jpg") } function setup(){ createCanvas(600,600); background("blue"); button=createButton("CLICK TO LOAD INTO FURNACE") button.position(150,330); button.mousePressed(changeBG); noLoop(); } function changeBG() { let val = random(65); background(val); loop(); playAnim=true; draw(); posX=0; posY=0; // background will be overwritten with 220 } function draw() { background(220); // text(mouseX + "," + mouseY, 20, 20); // If the 'a' key is pressed, draw the following text in the canvas if (key === 'a'){ textSize(22); text('a key was pressed!', width / 2, height / 2); } let s='BLAST FURNACE'; textSize(32); fill(0,102,153); text(s,50, 10,300, 400); img1=image(pic1, 320, 30, 170,210) img2=image(pic2, posX, 70, 70, 70) img4=image(pic4,100,350,250,250) img5=image(pic5,posX,10,50,50) img6=image(pic6,posX,150,70,70) img3=image(pic3,posX, posY-300,150, 200) if (playAnim) { posX=constrain(posX+1,0,rightwall-30) posY=constrain(posX-1,posY,height-50) } }