How to show dialogbox for saving before closing browser window

35 views Asked by At

I'm trying to create a notepad clone with electron js and electron forge for template and wanted the app to display a dialog box whenever the user tries to quit the browser window.

I wrote below code, ran the app and tried closing the app without saving the file, but apparently it closes the app before it properly saves it.

Although the newly created file does show up in recent file in windows file explorer, however opening it in notepad shows "cannot find the <file_location>" and asks to create new file .

i think, the app closes before it can properly save it in the directory. Because of which i used sync version of read write file function, but it still didn't worked.

the code here within the if-block after the showMessageBox function is the same code i used to save the file from the menu and it works well, but not here, while closing the app.

FYI - I am only using plain html css for frontend

main.js

// let currentfilename = null //initially
// let currentfiletext = null //initially
// this changes whenever we save or open new file

app.on('ready', () => {
    electron.ipcMain.on('error',(event, val) => dialog.showErrorBox('oops', 'somethings wrong'));
    let wind = createWindow();
    wind.on('close', (event) => {
        let focwind = BrowserWindow.getFocusedWindow();
        let opt ;
        if (!currentfilename) {
            try {
                opt = dialog.showMessageBoxSync(focwind,{
                    message: 'Do you want to save changes to Untitled?',
                    title: 'NotepadV2',
                    buttons: ['Save', 'Don\'t Save', 'Cancel'], 
                    defaultId: 0,
                    noLink: true,
                    
                });
                console.log(opt);
                // event.preventDefault();
                if (opt === 0) 
                {
                    currentfilename = dialog.showSaveDialogSync(focwind, {properties: ['showOverwriteConfirmation', 'createDirectory']});
                    // console.log(currentfilename);
                    if(currentfilename !== undefined || currentfilename !== null){          // incase user cancels
                        focwind.webContents.send('saved', 'sav');
                        electron.ipcMain.once('savedata', (event, value) => {
                            currentfiletext = value;
                            console.log('text - '+value);
                            fs.writeFileSync(currentfilename, currentfiletext);
                            console.log('saved');
                            
                            // focwind.close();
                        }); 
                    }
                }
                    
                else if (opt === 2 || opt === 1) event.preventDefault();
                    
                

            }       
            
            catch(e){ console.log(e);}
        }

        else{
            try{
                opt = dialog.showMessageBoxSync(focwind,{
                    message: `Do you want to save changes to ${currentfilename}?`,
                    title: 'NotepadV2',
                    buttons: ['Save', 'Don\'t Save', 'Cancel'], 
                    defaultId: 0,
                    noLink: true,
        
                });
                console.log(opt);
                // event.preventDefault();
                if (opt === 0) {
                    focwind.webContents.send('saved', 'sav');
                    electron.ipcMain.once('savedata', (event, value) => {
                        currentfiletext = value;
                        console.log('text - '+value);
                        fs.writeFileSync(currentfilename, currentfiletext)      // add delay
                        console.log('saved')
                        // focwind.close();
                    }); 
                
                }
                else if (opt === 2) event.preventDefault();
            }
            catch(e) {
                console.log(e);
            }
        }
    })
    

});

preload.js

const { contextBridge, ipcRenderer } = require('electron')

contextBridge.exposeInMainWorld( 'menuops',
    {

        savas  : () => ipcRenderer.on('saved', (event, value) => {
            if (value === 'sav') {
                let d = document.getElementById('text').value;           
                ipcRenderer.send('savedata', d);
                // console.log('send')
            }
            
        }),
0

There are 0 answers