CODEWITHSUNDEEP
javascripthtmllinuxbashelectron
LinuxSquare
LinuxSquare

Reputation: 37

HTML Button to call app.quit() function using electron

I recently discovered electron as a GUI "maker". I asked my programming-teacher, if it's possible to run a bash script with electron.

He gave me a link to a GitHub (sadly bought by Microsoft) and it worked with a bash-script

I recently wrote a script, which installs the Origin Launcher using wine and it workd perfectly. But now, I wanted to try to cover it with a GUI, so people who aren't familiar with the Linux Terminal have a nice-looking GUI.

Now, I watched a video on how to create an electron app. I followed it step by step, and it worked.

In my index.html document, I made two buttons, one to start the Installation, and the second one to cancel it.

I included the main.js in the head part of the html File

<head>
    <title>LoriginSetup</title>
    <link href="assets/css/main.css" rel="stylesheet">
    <script src="main.js"></script>
</head>

And inside the Body, I used the onclick to call the function inside the main.js.

The Function is called quitApplication()

<div class="btns">
  <button class="btn btnstart" id="startinstall">Start Installation</button>
  <button class="btn btncancel" id="cancelinstall" onclick="quitApplication()">Cancel Installation</button>
</div>

I tested the Function using an alert('').

The alert is working fine, but as I replaced the alert with app.quit(); It didn't work anymore.

app.on('ready', function(){
  //Create new window
  mainWindow = new BrowserWindow({});
  //Load html into window
  mainWindow.loadURL(url.format({
    pathname: path.join(__dirname, 'index.html'),
    protocol: 'file',
    slashes: true
  }));

  //Build Menu from MenuTemplate
  const mainMenu = Menu.buildFromTemplate(mainMenuTemplate);
  //Insert Menu
  Menu.setApplicationMenu(mainMenu);
});

function quitApplication(){
    alert('This Button is Working');
}

I don't know what I made wrong, but I appreciate every help I could get.

Upvotes: 1

Views: 2740

Answers (1)

JeffProd
JeffProd

Reputation: 3148

Remove quitApplication() from the main Electron JS and add this in your main.js :

const electron = require('electron');
const remote = electron.remote;

function quitApplication(){
    if (process.platform !== 'darwin') { remote.app.exit(); }
}

Another way, if you want to keep this code in the main Electon JS file, is to use IPC : https://electronjs.org/docs/api/ipc-main . The renderer can call a method in the main process which quits.

Upvotes: 2

Related Questions