Abra a imagem local com HTML 5

Digamos que você queira abrir uma imagem e brincar com a tela, mas não deseja carregar a imagem. Bem, você pode usar a API FileSystem HTML 5.

function draw() {
  var img = new Image(),
    ctx = document.getElementById('canvas').getContext('2d'),
    f = document.getElementById("uploadimage").files[0],
    url = window.URL || window.webkitURL,
    src = url.createObjectURL(f);

  img.src = src;
  img.onload = function() {
    ctx.drawImage(img,0,0);
    url.revokeObjectURL(src);
  }
}

<input type = ‘arquivo’ name = ‘img’ size = ’65 ‘id =’ uploadimage ‘/>