Optionally allow click outside to close modals (#7072)

* feat: option to allow click on modalBackdrop to close modal

* feat: allow switcher modals closable

* feat: allow use caption field as modal title

* refactor: make maskClosable a variable

* fix: use "true"

* fix: code style

* docs: add description about maskClosable

* fix: convention is to have double quotes for strings in the TW core

* refactor: using a "mask-closable" field on the modal tiddlers instead of as a message parameter

* docs: move to modal tid

* Update WidgetMessage_ tm-modal.tid
This commit is contained in:
lin onetwo
2022-12-03 17:26:44 +00:00
committed by GitHub
parent 45a7eb1c03
commit 451a3454b5
4 changed files with 14 additions and 2 deletions
+6
View File
@@ -26,6 +26,8 @@ Display a modal dialogue
options: see below
Options include:
downloadLink: Text of a big download link to include
event: widget event
variables: from event.paramObject
*/
Modal.prototype.display = function(title,options) {
options = options || {};
@@ -209,6 +211,10 @@ Modal.prototype.display = function(title,options) {
headerWidgetNode.addEventListener("tm-close-tiddler",closeHandler,false);
bodyWidgetNode.addEventListener("tm-close-tiddler",closeHandler,false);
footerWidgetNode.addEventListener("tm-close-tiddler",closeHandler,false);
// Whether to close the modal dialog when the mask (area outside the modal) is clicked
if(tiddler.fields && (tiddler.fields["mask-closable"] === "yes" || tiddler.fields["mask-closable"] === "true")) {
modalBackdrop.addEventListener("click",closeHandler,false);
}
// Set the initial styles for the message
$tw.utils.setStyle(modalBackdrop,[
{opacity: "0"}