Cannot access window close function in Desktop Application using node js

Question

I am developing a windows desktop application using node.js and backbone.js. I want to perform an action when the user closes the app by clicking on the close button on the title bar or right clicking on the application from windows taskbar.

My app.js looks like this,

 var app = module.exports = require('appjs');


app.serveFilesFrom(__dirname + '/content/assets/');

var menubar = app.createMenu([ {
label : '&File',
submenu : [ {
    label : 'E&xit',
    action : function() {
        window.close();
    }
},{
    label : 'New',
    action : function() {
        window.test();
    }
} ]
}, {
label : '&Window',
submenu : [ {
    label : 'Fullscreen',
    action : function(item) {
        window.frame.fullscreen();
        console.log(item.label + " called.");
    }
}, {
    label : 'Minimize',
    action : function() {
            console.log("df");
        window.frame.minimize();
    }
}, {
    label : 'Maximize',
    action : function() {
        console.log("nnnnnnlaaaaaaaaaaaaaaa");
        window.frame.maximize();
    }
}, {
    label : ''// separator
}, {
    label : 'Restore',
    action : function() {
        window.frame.restore();
    }
} ]
} ]);

menubar.on('select', function(item) {
console.log("menu item " + item.label + " clicked");
});

var trayMenu = app.createMenu([ {
label : 'Show',
action : function() {
    window.frame.show();
},
}, {
label : 'Minimize',
action : function() {
    window.frame.hide();
}
}, {
label : 'Exit',
action : function() {
    window.close();
}
} ]);

var statusIcon = app.createStatusIcon({
icon : './data/content/icons/32.png',
tooltip : 'AppJS Hello World',
menu : trayMenu
});



 var window = app.createWindow({
 width : 1024,// 640
height : 768,
showChrome: true,
icons : __dirname + '/content/icons'
});
window.on('create', function() {
console.log("Window Created");
window.frame.show();
window.frame.center();
window.frame.maximize();
window.frame.setMenuBar(menubar);
});

window.on('ready', function() {
console.log("Window Ready");    
window.require = require;
window.process = process;
window.module = module;
//window.frame.openDevTools();
window.fileAssoc = process.mainModule.filename;
//window.readMyFile();
function F12(e) {
    return e.keyIdentifier === 'F12'
}
function Command_Option_J(e) {
    return e.keyCode === 74 && e.metaKey && e.altKey
}


        });*/


window.addEventListener('keydown', function(e) {
console.log("hi");      
    if (F12(e) || Command_Option_J(e)) {            
        window.frame.openDevTools();
    }
   });
   });

Please find the attached screenshot. I am able to perform actions on custom added functionalities inside "File" & "Windows".

But i don't know how to capture the event when the default app close button in the title bar is clicked or closed by right clicking on the application from windows task bar. Please help.

Thanks in Advance

Is it this event you are looking for: https://msdn.microsoft.com/en-us/library/system.windows.forms.form.closing(v=vs.110).aspx — Asons, Sep 13 '15 at 08:33
Yes, the first one is similar to what i am looking for. But i don't know how to get the window close event using JavaScript(Node JS). — Akhil Suresh, Sep 13 '15 at 08:54

Asons · Answer 1 · 2015-09-20T12:10:50.373

5

UPDATED (added a few more code lines to show proper way for event to fire)

You should do like this:

var gui = require("nw.gui");

var win_main = gui.Window.get();
win_main.on('close', function () {
    this.hide(); // Pretend to be closed already
    alert("Closing...");

    // here you detect if data is saved, and if not, ask user if they want to save

    this.close(true);   // if this line executes the app closes, if not,
                        // app stays opened
});

I tried the above and it works perfect. It catches both "Close button" clicks and key shortcuts like "Ctrl+F4" in Windows.

For further reading (moved from comments):

http://tutorialzine.com/2015/01/your-first-node-webkit-app/

https://nodesource.com/blog/node-desktop-applications

https://gist.github.com/LeCoupa/80eca2716a2b13c37cce

https://github.com/nwjs/nw.js/

https://github.com/nwjs/nw.js/wiki/window

edited Sep 20 '15 at 12:10

answered Sep 13 '15 at 09:04

Asons

84,923
12
110
165

I have tried the same in my above app.js But the close event is not entering this method. window.on('close', function() { console.log("Window close"); }); Is this the window object same as that i have used to create window?? or some thing like this. var window = gui.Window.get(); – Akhil Suresh Sep 13 '15 at 09:41
Can't answer that as I don't have the necessary tools to test it. It do say though, that you need node-webkit, do you? – Asons Sep 13 '15 at 09:49
1

After reading [this](https://gist.github.com/LeCoupa/80eca2716a2b13c37cce) it might be when the title bar close button is clicked, that event doesn't get fired (check the App section). I had a similar issue years ago and solved that by hiding the main window, create a new sub window, which acts as "the main" and when that one got closed, the hidden main captured the sub window's close event. Hope this help or another way is to open a frameless window and create that functionality within the DOM itself. – Asons Sep 13 '15 at 10:21
Thank you very much for the help. I will try out what you said and will update by tommorow :) ... – Akhil Suresh Sep 13 '15 at 10:30
I am sorry that my project currently is an appjs project. Is it necessary to use NW.js to implement this? – Akhil Suresh Sep 14 '15 at 07:53
Yes, you need NW.js. What is it you need to do when the whole app closes? I mean a desktop app can close for many reasons so the best approach is to code accordingly, and what was need at close might be able to do at next start. – Asons Sep 14 '15 at 08:30
Shall we continue in chat. – Akhil Suresh Sep 14 '15 at 08:43
Please let me know if our chat gave any positive result – Asons Sep 14 '15 at 13:07
I updated my answer ... I downloaded and tried the above and it should be very easy to add to existing app and make it all work as you first intended. – Asons Sep 20 '15 at 12:07

score 0 · Answer 2 · answered Sep 20 '15 at 09:32

0

Finally I have done this by hiding the default title bar and adding a custom one.

For that, I set "showChrome" attribute in appJs to false during the window creation, which is by default true.

The code change is

  var window = app.createWindow({
  width : 1024,// 640
  height : 768,
  **showChrome: false**,
  icons : __dirname + '/content/icons'
   });

But when the 'showChrome' attribute is set to false task bar also will be hidden until we minimise or restore the app.

answered Sep 20 '15 at 09:32

Akhil Suresh

376
3
15

One thing that happened to me was that one can close a window using "Ctrl+F4" on Windows OS, which still give the user no chance to save their data ... does the same happens for you or you can catch that event? – Asons Sep 20 '15 at 09:59
No. It only handles when the app is closed from title bar. – Akhil Suresh Sep 20 '15 at 10:40
Ah, so if a user close the app in any other way than through your custom "close/exit" buttons you aren't able to catch that event and user get no warning to save content? – Asons Sep 20 '15 at 10:43
Yeahh.. Exactly.. Didn't get any way to handle that. That's why i ended up with a partial fix. – Akhil Suresh Sep 20 '15 at 11:13
Ok, did you try the "nw.js" approach or it gave you too much work right now? – Asons Sep 20 '15 at 11:23
Updating to node webkit now will give me a lot of un-necessary works. – Akhil Suresh Sep 21 '15 at 05:32
As you told me you use "nw.exe" already, all it takes is to add the nw.js file and the few lines in my answer, and then, when that event fires, you just pass that to your existing function/class and return true/false to the "this.close(true/false)" method to either close the app or abort and stay running. – Asons Sep 21 '15 at 09:17

Cannot access window close function in Desktop Application using node js

2 Answers2