​

let img;

​

function setup() {

  var canvas = createCanvas(400, 400);

//  input = createFileInput(readImageURL); //_ creates a browse button on canvas top

//  input.position(0, 0);

  select('canvas').position(0, 40); //________ move down

}

​

function draw() {

  background(255);

  if (img) image(img, 0, 0);

}

​

function readImageURL(file) {

  print(file);

  //  in html use:

  //<!--   Upload image: <input type="file" name="image"  id="myimage" onchange="readImageURL(image)" >    -->

  var htmlinput = document.getElementById('myimage'); //___ link

  print('.value: ',htmlinput.value);

  var thefile = new p5.File(htmlinput.value); //_____________________ input

  if (thefile.type === 'image') {

    img = createImg(thefile.data, ' ');

    img.hide(); //_______________________ not show in HTML area

  } else img = null; //__________________ no picture

}