From a56628b68cd03f6a0bee25b6195e9f404677327d Mon Sep 17 00:00:00 2001
From: Ray <sympatheticfire@gmail.com>
Date: Sat, 4 Nov 2023 02:46:04 +0000
Subject: [PATCH] Added support and option for close-on-click-away Refactor to
 remove arrays in Find

---
 bs4-test.html    |   1 +
 bsdialog4.js     | 197 ++++++++++++++++++++++++-----------------------
 bsdialog4.min.js |   4 +-
 3 files changed, 103 insertions(+), 99 deletions(-)

diff --git a/bs4-test.html b/bs4-test.html
index 4f3b256..4bd7a36 100644
--- a/bs4-test.html
+++ b/bs4-test.html
@@ -14,6 +14,7 @@
   <link href="http://cdn.hiimray.co.uk/8206c600-707c-469e-8d49-a76ae35782af/bootstrap/4.6.2/dist/css/bootstrap.min.css" rel="stylesheet" />
 
   <script src="bsdialog4.js"></script>
+  <!-- <script src="bsdialog4.min.js"></script> -->
   <title></title>
 
   <style>
diff --git a/bsdialog4.js b/bsdialog4.js
index 9e71406..318943e 100644
--- a/bsdialog4.js
+++ b/bsdialog4.js
@@ -1,18 +1,18 @@
 /**
  * BSDialog4
- * @version v0.1.3.017 (2023/08/30 00:17)
+ * @version v0.1.4.031 (2023/11/03 22:42)
  */
 var BSDialog = {
 	Show: async function (options) {
 		const a = this;
-		const _options = Object.assign(a.Default().ShowOptions, options);
+		const _options = Object.assign(a.Options.ShowModal, options);
 
 		a.id = _options.ID;
 		a.pfx = "bsdia4_";
 		a.body = document.getElementsByTagName("body")[0];
 
 		a.addBackdrop();
-		a.addModal(_options.ID, _options.Title, _options.Size, true, _options.Colour);
+		a.addModal(_options.ID, _options.Title, _options.Size, _options.ShowFooter, _options.EasyClose, _options.Colour);
 
 		if (_options.URL == null) {
 			await a.Update({ ID: _options.ID, Body: _options.Message });
@@ -34,7 +34,7 @@ var BSDialog = {
 		const a = this;
 		let id = Math.floor(Math.random() * 10000) + 1000;
 
-		const _options = Object.assign(a.Default().PromptOptions, options);
+		const _options = Object.assign(a.Options.ShowPrompt, options);
 
 		switch (_options.Type) {
 			case "textbox":
@@ -57,9 +57,7 @@ var BSDialog = {
 		 	return;
 		}
 
-		modal.Modal.forEach(function(e) {
-			e.parentNode.removeChild(e);
-		});
+		modal.Modal.parentNode.removeChild(modal.Modal);
 
 		modal = this.Find(id);
 		if (modal !== null) {
@@ -70,7 +68,7 @@ var BSDialog = {
 	},
 	Update: async function (options) {
 		const a = this;
-		let _options = Object.assign(a.Default().UpdateOptions, options);
+		let _options = Object.assign(a.Options.UpdateModal, options);
 
 		const modal = a.Find(_options.ID);
 		if (modal === null) {
@@ -78,15 +76,11 @@ var BSDialog = {
 		}
 
 		if (!this.isNullOrWhitespace(_options.Title)) {
-			modal.Title.forEach(function(e) {
-				e.innerHTML = _options.Title;
-			});
+			modal.Title.innerHTML = _options.Title;
 		}
 
 		if (!this.isNullOrWhitespace(_options.Body)) {
-			modal.Body.forEach(function(e) {
-				a.html(e, _options.Body);
-			});
+			a.html(modal.Body, _options.Body);
 		}
 
 		if (!this.isNullOrWhitespace(_options.BodyURL)) {
@@ -104,13 +98,11 @@ var BSDialog = {
 		}
 
 		if (!this.isNullOrWhitespace(_options.Footer)) {
-			modal.Footer.forEach(function(e) {
-				a.html(e, _options.Footer);
-			});
+			a.html(modal.Footer, _options.Footer);
 		}
 
 		if (!this.isNullOrWhitespace(_options.Size)) {
-			modal.Modal[0].querySelectorAll(".modal-dialog").forEach(function(e) {
+			modal.Modal.querySelectorAll(".modal-dialog").forEach(function(e) {
 
 				e.classList.forEach(function(e2) {
 					if (e2 == "modal-dialog") {
@@ -142,60 +134,61 @@ var BSDialog = {
 		}
 
 		return {
-			Title: modal[0].querySelectorAll(".modal-title"),
-			Body: modal[0].querySelectorAll(".modal-body"),
-			Footer: modal[0].querySelectorAll(".modal-footer"),
+			Title: modal[0].querySelectorAll(".modal-title")[0],
+			Header: modal[0].querySelectorAll(".modal-header")[0],
+			Body: modal[0].querySelectorAll(".modal-body")[0],
+			Footer: modal[0].querySelectorAll(".modal-footer")[0],
 			Close: modal[0].querySelectorAll("[data-dismiss='modal']"),
-			Modal: modal
+			Modal: modal[0]
 		};
 	},
-	Default: function() {
-		return {
-			ShowOptions: {
-				ID: null,
-				Title: "",
-				Message: "",
-				URL: null,
-				Size: "md",
-				Colour: "secondary",
-				ShowFooter: true
-			},
-			PromptOptions: {
-				Type: "button",
-				Title: "",
-				Message: "",
-				Size: "md",
-				Buttons: [
-					{ Label: "Yes", Value: "Yes", Colour: "primary" },
-					{ Label: "No", Value: "No", Colour: "secondary" },
-					{ Label: "Cancel", Value: "Cancel", Colour: "secondary" }
-				],
-				Textbox: {
-					Label: "",
-					LabelSize: 4,
-					Placeholder: "",
-					Value: "",
-					BoxSize: 8
-				}
-			},
-			ToastOptions: {
-				ID: null,
-				Title: "",
-				Message: "",
-				Size: "md"
-			},
-			UpdateOptions: {
-				ID: null,
-				Title: null,
-				Body: null,
-				BodyURL: null,
-				Footer: null,
-				Size: null
+	Options: {
+		ShowModal: {
+			ID: null,
+			Title: "",
+			Message: "",
+			URL: null,
+			Size: "md",
+			Colour: "secondary",
+			ShowFooter: true,
+			EasyClose: true
+		},
+		ShowPrompt: {
+			Type: "button",
+			Title: "",
+			Message: "",
+			Size: "md",
+			EasyClose: true,
+			Buttons: [
+				{ Label: "Yes", Value: "Yes", Colour: "primary" },
+				{ Label: "No", Value: "No", Colour: "secondary" },
+				{ Label: "Cancel", Value: "Cancel", Colour: "secondary" }
+			],
+			Textbox: {
+				Label: "",
+				LabelSize: 4,
+				Placeholder: "",
+				Value: "",
+				BoxSize: 8
 			}
-		};
+		},
+		UpdateModal: {
+			ID: null,
+			Title: null,
+			Body: null,
+			BodyURL: null,
+			Footer: null,
+			Size: null
+		},
+		ShowToast: {
+			ID: null,
+			Title: "",
+			Message: "",
+			Size: "md"
+		}
 	},
 	addBackdrop: function () {
-		let a = this;
+		const a = this;
 
 		// don't allow duplicates
 		if (a.body.querySelectorAll(".modal-backdrop").length > 0) {
@@ -207,18 +200,9 @@ var BSDialog = {
 		// lock background
 		a.body.classList.add("modal-open");
 		a.body.style.overflow = "hidden";
-
-		// close
-		let backdrop = a.body.querySelectorAll(".modal-backdrop")[0];
-		backdrop.addEventListener("click", function(e){
-			e.stopPropagation();
-			e.preventDefault();
-
-			a.Clear();
-		});
 	},
-	addModal: function (id, title, size, showFooter, closeColour) {
-		var a = this;
+	addModal: function (id, title, size, showFooter, easyClose, closeColour) {
+		const a = this;
 
 		// don't allow duplicates
 		let modal = a.Find(id);
@@ -231,8 +215,8 @@ var BSDialog = {
 		html += '  <div class="modal-dialog modal-' + size + '">';
 		html += '    <div class="modal-content">';
 		html += '      <div class="modal-header">';
-		html += '        <span class="modal-title font-weight-bold">' + title + '</span>';
-		html += '        <button type="button" class="close" data-dismiss="modal" aria-label="Close">';
+		html += '        <span class="modal-title font-weight-bold" style="cursor: default; user-select: none;" aria-label="Title">' + title + '</span>';
+		html += '        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="user-select: none;">';
 		html += '          <span aria-hidden="true">&times;</span>';
 		html += '        </button>';
 		html += '      </div>';
@@ -265,6 +249,22 @@ var BSDialog = {
 			return;
 	 	}
 
+		// Close on backdrp
+		if (easyClose === true) {
+			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();
@@ -272,17 +272,15 @@ var BSDialog = {
 
 		 		a.Close(id);
 		 	});
-
-			 e.addEventListener("auxclick", function(e){
-				e.stopPropagation();
-				e.preventDefault();
-
-				if (e.button === 1) {
-					a.toggleSize();
-				}
-		 	});
-
 		});
+
+		modal.Title.addEventListener("dblclick", function(e){
+			e.stopPropagation();
+			e.preventDefault();
+
+			a.toggleSize();
+		});
+
 	},
 	showButtonPrompt: async function (id, options) {
 		const a = this;
@@ -292,7 +290,8 @@ var BSDialog = {
 				ID: id,
 				Title: options.Title,
 				Message: options.Message,
-				Size: options.Size
+				Size: options.Size,
+				EasyClose: options.EasyClose
 			});
 
 			let html = '';
@@ -303,7 +302,7 @@ var BSDialog = {
 			a.Update({ ID: id, Footer: html });
 
 			const modal = a.Find(id);
-			modal.Footer[0].querySelectorAll("button").forEach(function(button) {
+			modal.Footer.querySelectorAll("button").forEach(function(button) {
 				button.addEventListener("click", function(e){
 					e.stopPropagation();
 					e.preventDefault();
@@ -342,7 +341,8 @@ var BSDialog = {
 				ID: id,
 				Title: options.Title,
 				Message: options.Message,
-				Size: options.Size
+				Size: options.Size,
+				EasyClose: options.EasyClose
 			});
 
 			let body = '';
@@ -378,13 +378,13 @@ var BSDialog = {
 			});
 
 			const modal = a.Find(id);
-			const buttons = modal.Footer[0].querySelectorAll("button");
+			const buttons = modal.Footer.querySelectorAll("button");
 
 			buttons[0].addEventListener("click", function(e){
 				e.stopPropagation();
 				e.preventDefault();
 
-				const value = modal.Body[0].querySelectorAll("input")[0].value;
+				const value = modal.Body.querySelectorAll("input")[0].value;
 
 				a.Close(id);
 
@@ -473,14 +473,14 @@ var BSDialog = {
 		});
 	},
 	toggleSize: function () {
-		var a = this;
+		const a = this;
 
 		let modal = a.Find(a.id);
 		if (modal === null) {
 		 	return;
 		}
 
-		let modalDialog = modal.Modal[0].querySelectorAll(".modal-dialog")[0];
+		let modalDialog = modal.Modal.querySelectorAll(".modal-dialog")[0];
 		if (modalDialog.classList.contains('modal-sm')) {
 			a.Update({ ID: a.id, Size: "md" });
 		} else if (modalDialog.classList.contains('modal-md')) {
@@ -488,12 +488,15 @@ var BSDialog = {
 		} else if (modalDialog.classList.contains('modal-lg')) {
 			a.Update({ ID: a.id, Size: "xl" });
 		} else if (modalDialog.classList.contains('modal-xl')) {
+			a.Update({ ID: a.id, Size: "xxl" });
+		} else if (modalDialog.classList.contains('modal-xxl')) {
 			a.Update({ ID: a.id, Size: "sm" });
 		} else {
 			a.Update({ ID: a.id, Size: "md" });
 		}
 	},
 	//
+	//
 	// deprecated/legacy-support
 	Create: async function (id, title, url, size) {
 		await this.Show({
@@ -519,7 +522,7 @@ var BSDialog = {
 	},
 	Toast: async function (options) {
 		const a = this;
-		const _options = Object.assign(a.Default().ToastOptions, options);
+		const _options = Object.assign(a.Options.ShowToast, options);
 
 		await this.Show({
 			ID: _options.ID,
diff --git a/bsdialog4.min.js b/bsdialog4.min.js
index 32eb0e3..a0f344c 100644
--- a/bsdialog4.min.js
+++ b/bsdialog4.min.js
@@ -1,5 +1,5 @@
 /**
  * BSDialog4
- * @version v0.1.3.017 (2023/08/30 00:17)
+ * @version v0.1.4.031 (2023/11/03 22:42)
  */
-var BSDialog={Show:async function(t){const e=this,o=Object.assign(e.Default().ShowOptions,t);if(e.id=o.ID,e.pfx="bsdia4_",e.body=document.getElementsByTagName("body")[0],e.addBackdrop(),e.addModal(o.ID,o.Title,o.Size,!0,o.Colour),null==o.URL)await e.Update({ID:o.ID,Body:o.Message});else if(e.isNullOrWhitespace(o.URL))await e.Update({ID:o.ID,Body:o.URL});else if(o.URL.startsWith("http://")||o.URL.startsWith("https://")||o.URL.startsWith("/")){let t=await e.retrieveURL(o.URL);await e.Update({ID:o.ID,Body:t})}else await e.Update({ID:o.ID,Body:o.URL})},Prompt:async function(t){const e=this;let o=Math.floor(1e4*Math.random())+1e3;const l=Object.assign(e.Default().PromptOptions,t);return"textbox"===l.Type?await e.showTextboxPrompt(o,l):await e.showButtonPrompt(o,l)},Clear:function(){this.body.querySelectorAll(".modal").forEach((function(t){t.parentNode.removeChild(t)})),this.removeBackdrop()},Close:function(t){let e=this.Find(t);null!==e&&(e.Modal.forEach((function(t){t.parentNode.removeChild(t)})),e=this.Find(t),null===e&&this.removeBackdrop())},Update:async function(t){const e=this;let o=Object.assign(e.Default().UpdateOptions,t);const l=e.Find(o.ID);if(null!==l){if(this.isNullOrWhitespace(o.Title)||l.Title.forEach((function(t){t.innerHTML=o.Title})),this.isNullOrWhitespace(o.Body)||l.Body.forEach((function(t){e.html(t,o.Body)})),this.isNullOrWhitespace(o.BodyURL)||o.BodyURL.startsWith("http://")||o.BodyURL.startsWith("https://")||o.BodyURL.startsWith("/")||(o.BodyURL=null),!this.isNullOrWhitespace(o.BodyURL)){let t=await e.retrieveURL(o.BodyURL);await e.Update({ID:o.ID,Body:t})}this.isNullOrWhitespace(o.Footer)||l.Footer.forEach((function(t){e.html(t,o.Footer)})),this.isNullOrWhitespace(o.Size)||l.Modal[0].querySelectorAll(".modal-dialog").forEach((function(t){t.classList.forEach((function(e){"modal-dialog"!=e&&e.startsWith("modal-")&&t.classList.remove(e)})),t.classList.add("modal-"+o.Size)}))}},Exists:function(t){return null!==this.Find(t)},Find:function(t){const e=this.body.querySelectorAll("#"+this.pfx+t+".modal");return e?e.length<=0?null:{Title:e[0].querySelectorAll(".modal-title"),Body:e[0].querySelectorAll(".modal-body"),Footer:e[0].querySelectorAll(".modal-footer"),Close:e[0].querySelectorAll("[data-dismiss='modal']"),Modal:e}:null},Default:function(){return{ShowOptions:{ID:null,Title:"",Message:"",URL:null,Size:"md",Colour:"secondary",ShowFooter:!0},PromptOptions:{Type:"button",Title:"",Message:"",Size:"md",Buttons:[{Label:"Yes",Value:"Yes",Colour:"primary"},{Label:"No",Value:"No",Colour:"secondary"},{Label:"Cancel",Value:"Cancel",Colour:"secondary"}],Textbox:{Label:"",LabelSize:4,Placeholder:"",Value:"",BoxSize:8}},ToastOptions:{ID:null,Title:"",Message:"",Size:"md"},UpdateOptions:{ID:null,Title:null,Body:null,BodyURL:null,Footer:null,Size:null}}},addBackdrop:function(){let t=this;t.body.querySelectorAll(".modal-backdrop").length>0||(t.appendHtml(t.body,'<div class="modal-backdrop fade show"></div>'),t.body.classList.add("modal-open"),t.body.style.overflow="hidden",t.body.querySelectorAll(".modal-backdrop")[0].addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),t.Clear()})))},addModal:function(t,e,o,l,a){var i=this;let n=i.Find(t);if(null!==n)return;let s="";s+='<div class="modal fade show d-block" id="'+i.pfx+t+'" tabindex="-1">',s+='  <div class="modal-dialog modal-'+o+'">',s+='    <div class="modal-content">',s+='      <div class="modal-header">',s+='        <span class="modal-title font-weight-bold">'+e+"</span>",s+='        <button type="button" class="close" data-dismiss="modal" aria-label="Close">',s+='          <span aria-hidden="true">&times;</span>',s+="        </button>",s+="      </div>",s+='      <div class="modal-body">',s+='<div class="row mt-3 pb-3">',s+='  <div class="col-12 text-center">',s+='    <div class="spinner-border" role="status">',s+='\t     <span class="sr-only">Loading...</span>',s+="    </div>",s+="  </div>",s+="</div>",s+="      </div>",!0===l&&(s+='      <div class="modal-footer">',s+='        <button type="button" class="btn btn-'+a+'" data-dismiss="modal">Close</button>',s+="      </div>"),s+="    </div>",s+="  </div>",s+="</div>",i.appendHtml(i.body,s),n=i.Find(t),null!==n&&n.Close.forEach((function(e){e.addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),i.Close(t)})),e.addEventListener("auxclick",(function(t){t.stopPropagation(),t.preventDefault(),1===t.button&&i.toggleSize()}))}))},showButtonPrompt:async function(t,e){const o=this;return await new Promise((async(l,a)=>{await o.Show({ID:t,Title:e.Title,Message:e.Message,Size:e.Size});let i="";e.Buttons.forEach((function(t){i+='<button type="button" class="btn btn-'+t.Colour+'" data-prompt-value="'+t.Value+'">'+t.Label+"</button>"})),o.Update({ID:t,Footer:i});const n=o.Find(t);n.Footer[0].querySelectorAll("button").forEach((function(e){e.addEventListener("click",(function(a){a.stopPropagation(),a.preventDefault();const i=e.getAttribute("data-prompt-value");o.Close(t),l(i)}))})),n.Close.forEach((function(e){e.addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),o.Close(t),l("")}))}))}))},showTextboxPrompt:async function(t,e){const o=this;return await new Promise((async(l,a)=>{e.Buttons=[{Label:"OK",Value:"",Colour:"primary"},{Label:"Cancel",Value:"",Colour:"secondary"}],await o.Show({ID:t,Title:e.Title,Message:e.Message,Size:e.Size});let i="";o.isNullOrWhitespace(e.Message)||(i+="<p>"+e.Message+"</p>"),i+='<div class="form-group row">',o.isNullOrWhitespace(e.Textbox.Label)||e.Textbox.LabelSize<=0?(i+='<div class="col-sm-12">',i+='<input type="text" class="form-control" id="textbox'+t+'" placeholder="'+e.Textbox.Placeholder+'" value="'+e.Textbox.Value+'">',i+="</div>"):(i+='<label for="textbox'+t+'" class="col-sm-'+e.Textbox.LabelSize+' col-form-label">'+e.Textbox.Label+"</label>",i+='<div class="col-sm-'+e.Textbox.BoxSize+'">',i+='<input type="text" class="form-control" id="textbox'+t+'" placeholder="'+e.Textbox.Placeholder+'" value="'+e.Textbox.Value+'">',i+="</div>"),i+="</div>";let n="";e.Buttons.forEach((function(t){n+='<button type="button" class="btn btn-'+t.Colour+'" data-prompt-value="'+t.Value+'">'+t.Label+"</button>"})),o.Update({ID:t,Body:i,Footer:n});const s=o.Find(t),d=s.Footer[0].querySelectorAll("button");d[0].addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault();const a=s.Body[0].querySelectorAll("input")[0].value;o.Close(t),l(a)})),d[1].addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),o.Close(t),l("")})),s.Close.forEach((function(e){e.addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),o.Close(t),l("")}))}))}))},appendHtml:function(t,e){let o=document.createElement("template");o.innerHTML=e,o=o.content.firstChild,t.appendChild(o)},html:function(t,e){jQuery?jQuery(t).html(e):t.innerHTML=e},isNullOrWhitespace:function(t){return void 0===t||(null==t||(0==t||t.trim().length<=0))},removeBackdrop:function(){if(this.body.querySelectorAll(".modal-backdrop").length<=0)return;if(this.body.querySelectorAll(".modal").length>0)return;let t=this.body.querySelectorAll(".modal-backdrop")[0];t.parentNode.removeChild(t),this.body.classList.remove("modal-open"),this.body.style.overflow=null},retrieveURL:async function(t){return await new Promise((async e=>{await fetch(t,{cache:"no-cache",credentials:"same-origin"}).then((t=>t.text())).then((t=>{e(t)})).catch((t=>{e("Error: "+t)}))}))},toggleSize:function(){var t=this;let e=t.Find(t.id);if(null===e)return;let o=e.Modal[0].querySelectorAll(".modal-dialog")[0];o.classList.contains("modal-sm")?t.Update({ID:t.id,Size:"md"}):o.classList.contains("modal-md")?t.Update({ID:t.id,Size:"lg"}):o.classList.contains("modal-lg")?t.Update({ID:t.id,Size:"xl"}):o.classList.contains("modal-xl")?t.Update({ID:t.id,Size:"sm"}):t.Update({ID:t.id,Size:"md"})},Create:async function(t,e,o,l){await this.Show({ID:t,Title:e,Message:o,URL:o,Size:l,Colour:"secondary"})},UpdateTitle:function(t,e){this.Update({ID:t,Title:e})},UpdateSize:function(t,e){this.Update({ID:t,Size:e})},UpdateBody:function(t,e){this.Update({ID:t,Body:e})},UpdateFooter:function(t,e){this.Update({ID:t,Footer:e})},Toast:async function(t){const e=Object.assign(this.Default().ToastOptions,t);await this.Show({ID:e.ID,Title:e.Title,Message:e.Message,URL:null,Size:e.Size,Colour:"secondary",ShowFooter:!1})},ShowToast:function(t,e,o,l){this.Toast({ID:t,Title:e,Message:o,Size:l})}};
\ No newline at end of file
+var BSDialog={Show:async function(options){const a=this,_options=Object.assign(a.Options.ShowModal,options);if(a.id=_options.ID,a.pfx="bsdia4_",a.body=document.getElementsByTagName("body")[0],a.addBackdrop(),a.addModal(_options.ID,_options.Title,_options.Size,_options.ShowFooter,_options.EasyClose,_options.Colour),null==_options.URL)await a.Update({ID:_options.ID,Body:_options.Message});else if(a.isNullOrWhitespace(_options.URL))await a.Update({ID:_options.ID,Body:_options.URL});else if(_options.URL.startsWith("http://")||_options.URL.startsWith("https://")||_options.URL.startsWith("/")){let response=await a.retrieveURL(_options.URL);await a.Update({ID:_options.ID,Body:response})}else await a.Update({ID:_options.ID,Body:_options.URL})},Prompt:async function(options){const a=this;let id=Math.floor(1e4*Math.random())+1e3;const _options=Object.assign(a.Options.ShowPrompt,options);switch(_options.Type){case"textbox":return await a.showTextboxPrompt(id,_options);case"button":default:return await a.showButtonPrompt(id,_options)}},Clear:function(){this.body.querySelectorAll(".modal").forEach((function(e){e.parentNode.removeChild(e)})),this.removeBackdrop()},Close:function(id){let modal=this.Find(id);null!==modal&&(modal.Modal.parentNode.removeChild(modal.Modal),modal=this.Find(id),null===modal&&this.removeBackdrop())},Update:async function(options){const a=this;let _options=Object.assign(a.Options.UpdateModal,options);const modal=a.Find(_options.ID);if(null!==modal){if(this.isNullOrWhitespace(_options.Title)||(modal.Title.innerHTML=_options.Title),this.isNullOrWhitespace(_options.Body)||a.html(modal.Body,_options.Body),this.isNullOrWhitespace(_options.BodyURL)||_options.BodyURL.startsWith("http://")||_options.BodyURL.startsWith("https://")||_options.BodyURL.startsWith("/")||(_options.BodyURL=null),!this.isNullOrWhitespace(_options.BodyURL)){let response=await a.retrieveURL(_options.BodyURL);await a.Update({ID:_options.ID,Body:response})}this.isNullOrWhitespace(_options.Footer)||a.html(modal.Footer,_options.Footer),this.isNullOrWhitespace(_options.Size)||modal.Modal.querySelectorAll(".modal-dialog").forEach((function(e){e.classList.forEach((function(e2){"modal-dialog"!=e2&&e2.startsWith("modal-")&&e.classList.remove(e2)})),e.classList.add("modal-"+_options.Size)}))}},Exists:function(id){return null!==this.Find(id)},Find:function(id){const a=this,modal=a.body.querySelectorAll("#"+a.pfx+id+".modal");return modal?modal.length<=0?null:{Title:modal[0].querySelectorAll(".modal-title")[0],Header:modal[0].querySelectorAll(".modal-header")[0],Body:modal[0].querySelectorAll(".modal-body")[0],Footer:modal[0].querySelectorAll(".modal-footer")[0],Close:modal[0].querySelectorAll("[data-dismiss='modal']"),Modal:modal[0]}:null},Options:{ShowModal:{ID:null,Title:"",Message:"",URL:null,Size:"md",Colour:"secondary",ShowFooter:!0,EasyClose:!0},ShowPrompt:{Type:"button",Title:"",Message:"",Size:"md",EasyClose:!0,Buttons:[{Label:"Yes",Value:"Yes",Colour:"primary"},{Label:"No",Value:"No",Colour:"secondary"},{Label:"Cancel",Value:"Cancel",Colour:"secondary"}],Textbox:{Label:"",LabelSize:4,Placeholder:"",Value:"",BoxSize:8}},UpdateModal:{ID:null,Title:null,Body:null,BodyURL:null,Footer:null,Size:null},ShowToast:{ID:null,Title:"",Message:"",Size:"md"}},addBackdrop:function(){const a=this;a.body.querySelectorAll(".modal-backdrop").length>0||(a.appendHtml(a.body,'<div class="modal-backdrop fade show"></div>'),a.body.classList.add("modal-open"),a.body.style.overflow="hidden")},addModal:function(id,title,size,showFooter,easyClose,closeColour){const a=this;let modal=a.Find(id);if(null!==modal)return;let html="";if(html+='<div class="modal fade show d-block" id="'+a.pfx+id+'" tabindex="-1">',html+='  <div class="modal-dialog modal-'+size+'">',html+='    <div class="modal-content">',html+='      <div class="modal-header">',html+='        <span class="modal-title font-weight-bold" style="cursor: default; user-select: none;" aria-label="Title">'+title+"</span>",html+='        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="user-select: none;">',html+='          <span aria-hidden="true">&times;</span>',html+="        </button>",html+="      </div>",html+='      <div class="modal-body">',html+='<div class="row mt-3 pb-3">',html+='  <div class="col-12 text-center">',html+='    <div class="spinner-border" role="status">',html+='\t     <span class="sr-only">Loading...</span>',html+="    </div>",html+="  </div>",html+="</div>",html+="      </div>",!0===showFooter&&(html+='      <div class="modal-footer">',html+='        <button type="button" class="btn btn-'+closeColour+'" data-dismiss="modal">Close</button>',html+="      </div>"),html+="    </div>",html+="  </div>",html+="</div>",a.appendHtml(a.body,html),modal=a.Find(id),null!==modal){if(!0===easyClose){modal.Modal.addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),a.Close(id)}));const modalContent=undefined;modal.Modal.querySelectorAll(".modal-content")[0].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){e.stopPropagation(),e.preventDefault(),a.toggleSize()}))}},showButtonPrompt:async function(id,options){const a=this;return await new Promise(async(resolve,reject)=>{await a.Show({ID:id,Title:options.Title,Message:options.Message,Size:options.Size,EasyClose:options.EasyClose});let html="";options.Buttons.forEach((function(e){html+='<button type="button" class="btn btn-'+e.Colour+'" data-prompt-value="'+e.Value+'">'+e.Label+"</button>"})),a.Update({ID:id,Footer:html});const modal=a.Find(id);modal.Footer.querySelectorAll("button").forEach((function(button){button.addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault();const value=button.getAttribute("data-prompt-value");a.Close(id),resolve(value)}))})),modal.Close.forEach((function(sender){sender.addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),a.Close(id),resolve("")}))}))})},showTextboxPrompt:async function(id,options){const a=this;return await new Promise(async(resolve,reject)=>{options.Buttons=[{Label:"OK",Value:"",Colour:"primary"},{Label:"Cancel",Value:"",Colour:"secondary"}],await a.Show({ID:id,Title:options.Title,Message:options.Message,Size:options.Size,EasyClose:options.EasyClose});let body="";a.isNullOrWhitespace(options.Message)||(body+="<p>"+options.Message+"</p>"),body+='<div class="form-group row">',a.isNullOrWhitespace(options.Textbox.Label)||options.Textbox.LabelSize<=0?(body+='<div class="col-sm-12">',body+='<input type="text" class="form-control" id="textbox'+id+'" placeholder="'+options.Textbox.Placeholder+'" value="'+options.Textbox.Value+'">',body+="</div>"):(body+='<label for="textbox'+id+'" class="col-sm-'+options.Textbox.LabelSize+' col-form-label">'+options.Textbox.Label+"</label>",body+='<div class="col-sm-'+options.Textbox.BoxSize+'">',body+='<input type="text" class="form-control" id="textbox'+id+'" placeholder="'+options.Textbox.Placeholder+'" value="'+options.Textbox.Value+'">',body+="</div>"),body+="</div>";let footer="";options.Buttons.forEach((function(e){footer+='<button type="button" class="btn btn-'+e.Colour+'" data-prompt-value="'+e.Value+'">'+e.Label+"</button>"})),a.Update({ID:id,Body:body,Footer:footer});const modal=a.Find(id),buttons=modal.Footer.querySelectorAll("button");buttons[0].addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault();const value=modal.Body.querySelectorAll("input")[0].value;a.Close(id),resolve(value)})),buttons[1].addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),a.Close(id),resolve("")})),modal.Close.forEach((function(sender){sender.addEventListener("click",(function(e){e.stopPropagation(),e.preventDefault(),a.Close(id),resolve("")}))}))})},appendHtml:function(el,html){let node=document.createElement("template");node.innerHTML=html,node=node.content.firstChild,el.appendChild(node)},html:function(el,newHtml){jQuery?jQuery(el).html(newHtml):el.innerHTML=newHtml},isNullOrWhitespace:function(e){return void 0===e||(null==e||(0==e||e.trim().length<=0))},removeBackdrop:function(){if(this.body.querySelectorAll(".modal-backdrop").length<=0)return;if(this.body.querySelectorAll(".modal").length>0)return;let backdrop=this.body.querySelectorAll(".modal-backdrop")[0];backdrop.parentNode.removeChild(backdrop),this.body.classList.remove("modal-open"),this.body.style.overflow=null},retrieveURL:async function(url){return await new Promise(async resolve=>{await fetch(url,{cache:"no-cache",credentials:"same-origin"}).then(data=>data.text()).then(data=>{resolve(data)}).catch(error=>{resolve("Error: "+error)})})},toggleSize:function(){const a=this;let modal=a.Find(a.id);if(null===modal)return;let modalDialog=modal.Modal.querySelectorAll(".modal-dialog")[0];modalDialog.classList.contains("modal-sm")?a.Update({ID:a.id,Size:"md"}):modalDialog.classList.contains("modal-md")?a.Update({ID:a.id,Size:"lg"}):modalDialog.classList.contains("modal-lg")?a.Update({ID:a.id,Size:"xl"}):modalDialog.classList.contains("modal-xl")?a.Update({ID:a.id,Size:"xxl"}):modalDialog.classList.contains("modal-xxl")?a.Update({ID:a.id,Size:"sm"}):a.Update({ID:a.id,Size:"md"})},Create:async function(id,title,url,size){await this.Show({ID:id,Title:title,Message:url,URL:url,Size:size,Colour:"secondary"})},UpdateTitle:function(id,title){this.Update({ID:id,Title:title})},UpdateSize:function(id,size){this.Update({ID:id,Size:size})},UpdateBody:function(id,content){this.Update({ID:id,Body:content})},UpdateFooter:function(id,content){this.Update({ID:id,Footer:content})},Toast:async function(options){const a=this,_options=Object.assign(a.Options.ShowToast,options);await this.Show({ID:_options.ID,Title:_options.Title,Message:_options.Message,URL:null,Size:_options.Size,Colour:"secondary",ShowFooter:!1})},ShowToast:function(id,title,message,size){this.Toast({ID:id,Title:title,Message:message,Size:size})}};
\ No newline at end of file