Форма загрузки фото в приложение electron?

Question

[Igogogor]

Откопал на форуме отличный обработчик и загрузчик, но недоумеваю как прописать форму
Также данный код выдает уйму ошибку при запуске приложения, хотя у автора он работал

ipcMain.on('openFile', (event, path) => {
      const {dialog} = require('electron')
      const fs = require('fs')
      dialog.showOpenDialog(function (fileNames) {
            // fileNames is an array that contains all the selected
          if(fileNames === undefined){
                  console.log("No file selected");
          }else{
                  readFile(fileNames[0]);
          }
      });

      function readFile(filepath){
         fs.readFile(filepath, 'utf-8', (err, data) => {
            if(err){
               alert("An error ocurred reading the file :" + err.message);
               return
            }
            // handle the file content
            event.sender.send('fileData', filepath);
      });
      }
});

Answer 1

[Igogogor]

<label>Image File:</label><br/>
    <input type="file" id="imageLoader" name="imageLoader"/>
    <canvas id="imageCanvas"></canvas>

    var imageLoader = document.getElementById('imageLoader');
    imageLoader.addEventListener('change', handleImage, false);
    var canvas = document.getElementById('imageCanvas');
    var ctx = canvas.getContext('2d');

    function handleImage(e){
    var reader = new FileReader();
    reader.onload = function(event){
        var img = new Image();
        img.onload = function(){
            canvas.width = img.width;
            canvas.height = img.height;
            ctx.drawImage(img,0,0);
        }
        img.src = event.target.result;
    }
    reader.readAsDataURL(e.target.files[0]);     
    }