How to upload image in p5.js mode

asdf

I would like to upload an image file named "dillustration-01.png" (dimension: 1995 × 1667pixels) in p5.js mode. But if I use the following code, I get a blank screen with no image. I double checked that I have added the file "dillustration-01.png" in my sketch and I don't know why it's not working. Is there anything wrong with what I'm doing?

var img;  // Declare variable 'img'.

function setup() {
  createCanvas(1000, 1000);
  img = loadImage("dillustration-01.png");  // Load the image
}

function draw() {
  // Displays the image at its actual size at point (0,0)
  image(img, 0, 0);
  // Displays the image at point (0, height/2) at half size
  //image(img, 0, height/2, img.width/2, img.height/2);
}

GoToLoop

https://p5js.org/reference/#/p5/preload

asdf

Thank you. I've tried that one too but it keeps saying "loading..." even when I try with files that are small sized (less than 200kb). Do i need to write anything else in the index.html tab apart from writing the following code in the main tab?

var img;
var c;
function preload() {  // preload() runs once
  img = loadImage('logo.png');
}

function setup() {  // setup() waits until preload() is done
  img.loadPixels();
  // get color of middle pixel
  c = img.get(img.width/2, img.height/2);
}

function draw() {
  background(c);
  image(img, 25, 25, 50, 50);
}

GoToLoop

Seems to be alright to me. No idea why it isn't working for ya. :-??
Anyways, I've got this online example too: B-)

1. https://ThimbleProjects.org/gotoloop/97931/
2. https://ThimbleProjects.org/gotoloop/97931/sketch.js
3. https://ThimbleProjects.org/gotoloop/97931/assets/moonwalk.jpg
4. https://ThimbleProjects.org/gotoloop/97931/assets/mask.png