Confused where to put "beforeDestroy" method of "beforedestroy" event.

[srkngrt]

Hello community,

I'm trying to explore the example Desktop. I wanted to add a msg box to ask the user if they are sure to close for example the window notepad or not. My first idea was to add the code in the notepad.js

I've put it between layout and items:



...
// IE has a bug where it will keep the iframe's background visible when the window
// is set to visibility:hidden. Hiding the window via position offsets instead gets
// around this bug.
hideMode: 'offsets',
layout: 'fit',
beforeDestroy: function() {
alert('Hehe');
},
items: [{
xtype: 'htmleditor',
id: 'notepad-editor',
value: [...


When I close the Notepad window in the desktop it will close and after it is closed my alert popup is shown. I get the same result when I work with adding listeners.

Then I tried to move this to the /js/Desktop.js file where the window creation is coded. But also here my alert will show after the notepad window is already closed. I've added the code in the first win.on() right under the beforeshow rule.

Can someone point me the correct way here please? I found several post on this issue, but I think this desktop example is probably an other case than the single examples in the other posts? I assume that making an autosave function while closing the window will have the same problem and seems to me as I didn't get the clue yet where to put things...

[mitchellsimoens]

Are you sure you don't want to use 'beforeclose' event to stop the closing of the Window?

[srkngrt]

I also tried that event trigger, but I get the same result, window first closes and afterwards the function is fired. It feels like I'm placing the trigger in a wrong place...

[mitchellsimoens]

You have to return false because things will be async. Then when your user chooses yes, close the window. You should make your beforeclose event listener fire only once by using the single listener config. That way when you close the window the second time, the listener won't be fired.

[srkngrt]

Ok, I changed it to a single listener after the win.show(); I think you meant this:



win.show();
win.addListener('beforedestroy', function(){
Ext.MessageBox.confirm('Notepad Closing', 'Are you sure', this.onSavenotepad)
});


When I hit the close icon, window closes immediately and then the message box is showing.
When I answer with cancel the window is closed, it doesn't appear back or so.

So, visual there is no change in that, however I thank you pointing out this feature :D

[srkngrt]

That way when you close the window the second time, the listener won't be fired.

Closing a window the second time ? Not sure what you mean by that Mitchell, is it simply open window, close window, re-open window and close it the second time ? Sorry if this sounds silly...

[mitchellsimoens]

Like I said, use beforeclose. beforedestroy is too late. Didn't want to do it for you but here you go:


var beforeclose = function(w) {
Ext.Msg.confirm('Confirmation', 'Are you sure you want to close without saving?', function(btn) {
if (btn === 'yes') {
w.close();
} else {
w.on('beforeclose', beforeclose, w, { single : true });
}
});

return false;
};

var win = Ext.create('Ext.window.Window', {
title : 'Test',
width : 400,
height : 400,
html : 'Close Me',
listeners : {
beforeclose : {
single : true,
fn : beforeclose
}
}
});

win.show();

[srkngrt]

Ok Mitchell, thnx, this rises other questions but I have enough to learn from this example. I'll come back once I've figured it out :-) Now I'm having errors which give me something to look after...

[srkngrt]

Ok, couldn't goto bed before trying, have it working in the desktop example. Thnx again for the help !!!



createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('notepad');
if(!win){
win = desktop.createWindow({
id: 'notepad',
title:'<?php echo lang('general_notepad'); ?>',
width:600,
height:400,
iconCls: 'notepad',
animCollapse:false,
border: false,
//defaultFocus: 'notepad-editor', EXTJSIV-1300


// IE has a bug where it will keep the iframe's background visible when the window
// is set to visibility:hidden. Hiding the window via position offsets instead gets
// around this bug.
hideMode: 'offsets',


layout: 'fit',
items: [
{
xtype: 'htmleditor',
id: 'notepad-editor',
value: ['Give it a try!'].join('')
}
],
listeners : {
beforeclose : {
single : true,
fn : this.onsavenotepad
}
}
});
}
win.show();
return win;
},
onsavenotepad: function (w) {
Ext.MessageBox.confirm('<?php echo lang('general_closing'); ?>'+' '+'<?php echo lang('general_notepad'); ?>', '<?php echo lang('general_areyousure'); ?>', function(btn) {
if (btn == 'yes') {
w.close();
//window.location.href = "/logout";
} else {
w.on('beforeclose', this.onsavenotepad, w, { single : true });
Ext.messenger.msg('<?php echo lang('general_opcancelled'); ?>', '<?php echo lang('general_cancelnotepad'); ?>');
}
});
return false;
}