How do I make confirm modal dialog close?

Hello,
how do I make a confirm asking if somebody is sure to close a modal dialog by clicking on X at top right?
This is very important standard functionality and Photoshop itself also has got confirm by closing its main window like any other application.
Thank you!

I believe you can listen to the "cancel" event on the dialog itself, whereas you can link the emission of a "close" event to, say, the OK and Cancel, passing different values.

But can you actually prevent from closing if corner [x] is clicked? :thinking:

In our situation many layers of data are processed in a web view inside a modal. So this could be megabytes of data. The only workaround I see here is to make an “autosave” function like sending that data as base64 (conversion needed wich takes some time) every few minutes automatically via events to plugin. And after close the plugin directly open a new modal asking if that closing was correct and if data have to be restored (which also means several minutes of work lost). A confirmation dialog would make things more easier here.

AFAIK there is no way to prevent closing a modal window if the user is clicking on the OS specific X button. At least nothing worked if I tried it.

You could implement a (strange) workaround:
If the modal window is closed with the OS specific X or by pressing Esc the value reasonCanceled will be returned (it’s a strange value and it smells like a bug but currently that’s the way it is).
So you could catch this value and if this one is returned, reopen your modal again (all user inputs should be there as it seems it only hides the window but not really closes it) and ask the user for closing it with a button.

Another thing I noticed is that if a sp-textfield is focused and Enter will be pressed the dialog hides the same way as Esc will be pressed or a click on X. This can be prevented if we listen for the Enter key pressed and e.preventDefault().

yes I know this already. But all data is immediately lost because the user input runs only in web view. Like hours of work or so.

Are you sure that all user input is lost? If it only hides the window it shouldn’t be the case. Haven’t tested it with web view.

What about hiding the title bar? Although I’ve no idea how to do it, or if it’s possible in the first place.

Hide OS specific title bar? Needs to be implemented by the Adobe team. But I don’t think that will ever happen :wink:

1 Like

<sp-dialog> could do it, like:


But it’s been long time since I tried this so things might be different now :slightly_smiling_face:

He is using Webview and I think these are currently only available in modal dialogs. But this a good reminder to try sp-dialog :slight_smile:

1 Like

I’ve run into this recently for other reasons, so I’ve thought to report here.

With <dialog>, you can use the showModal() passing an object with a titleVisibility prop set to "hide" and provided that the dialog isn’t resizable, there’s no title bar.

image

It still automatically reacts to the Escape key though.

4 Likes

interesting and it works! Thank you.
But I need resizable dialog - so it does not help for me.
As a workaround I am using ReOpen Modal after closing and transfer all data once a minute to Photoshop (all layers in base64 - not so nice). It is a bit strange user experience as well.

WebViews are also available in plugin panels. We recently updated the docs.

1 Like

it had been some time - is there a solution out in the meantime? Thank you!