Changed to using modal methods to launch modal

This commit is contained in:
Ray 2023-11-14 20:47:57 +00:00
parent 22194c91ad
commit a0263843ae
2 changed files with 12 additions and 44 deletions

View File

@ -1,6 +1,6 @@
/** /**
* BSDialog5 * BSDialog5
* @version v0.2.0.055 (2023/11/12 1428) * @version v0.2.1.005 (2023/11/14 2028)
*/ */
var BSDialog5 = { var BSDialog5 = {
Default: function() { Default: function() {
@ -51,8 +51,11 @@ var BSDialog5 = {
a.id = _options.ID; a.id = _options.ID;
a.pfx = "bsdia5_"; a.pfx = "bsdia5_";
a.addBackdrop(); a.addModal(_options.ID, _options.Title, _options.Size, _options.ShowFooter, _options.Colour);
a.addModal(_options.ID, _options.Title, _options.Size, _options.ShowFooter, _options.EasyClose, _options.Colour);
(new bootstrap.Modal(document.getElementById(a.pfx + _options.ID), {
backdrop: _options.EasyClose
})).show();
if (_options.URL == null) { if (_options.URL == null) {
await a.Update({ ID: _options.ID, Body: _options.Message }); await a.Update({ ID: _options.ID, Body: _options.Message });
@ -180,21 +183,7 @@ var BSDialog5 = {
GetBody: function() { GetBody: function() {
return document.getElementsByTagName("body")[0]; return document.getElementsByTagName("body")[0];
}, },
addBackdrop: function () { addModal: function (id, title, size, showFooter, closeColour) {
const a = this;
// don't allow duplicates
if (a.GetBody().querySelectorAll(".modal-backdrop").length > 0) {
return;
}
a.appendHtml(a.GetBody(), '<div class="modal-backdrop fade show"></div>');
// lock background
a.GetBody().classList.add("modal-open");
a.GetBody().style.overflow = "hidden";
},
addModal: function (id, title, size, showFooter, easyClose, closeColour) {
const a = this; const a = this;
// don't allow duplicates // don't allow duplicates
@ -204,7 +193,7 @@ var BSDialog5 = {
} }
let html = ""; let html = "";
html += '<div class="modal modal-' + size + ' fade show d-block" id="' + a.pfx + id + '" tabindex="-1" aria-modal="true" role="dialog">'; html += '<div class="modal modal-' + size + ' fade" id="' + a.pfx + id + '" tabindex="-1" aria-labelledby="' + a.pfx + id + '" aria-hidden="true" style="display:none;">';
html += ' <div class="modal-dialog">'; html += ' <div class="modal-dialog">';
html += ' <div class="modal-content">'; html += ' <div class="modal-content">';
html += ' <div class="modal-header">'; html += ' <div class="modal-header">';
@ -240,29 +229,8 @@ var BSDialog5 = {
return; return;
} }
// Close on backdrp document.getElementById(a.pfx + id).addEventListener('hidden.bs.modal', function (event) {
if (easyClose === true) { a.Close(id);
modal.Modal.addEventListener("click", function(e){
e.stopPropagation();
e.preventDefault();
a.Close(id);
});
const modalContent = modal.Modal.querySelectorAll(".modal-content")[0];
modalContent.addEventListener("click", function(e){
e.stopPropagation();
e.preventDefault();
});
}
modal.Close.forEach(function(e){
e.addEventListener("click", function(e){
e.stopPropagation();
e.preventDefault();
a.Close(id);
});
}); });
modal.Title.addEventListener("dblclick", function(e){ modal.Title.addEventListener("dblclick", function(e){

4
bsdialog5.min.js vendored

File diff suppressed because one or more lines are too long