Files
liceo-ariosto/media/system/js/joomla-dialog.min.js
2025-06-17 11:53:18 +02:00

1 line
8.1 KiB
JavaScript

const popupTemplate='<div class="joomla-dialog-container">\n <header class="joomla-dialog-header"></header>\n <section class="joomla-dialog-body"></section>\n <footer class="joomla-dialog-footer"></footer>\n</div>';class JoomlaDialog extends HTMLElement{constructor(t){super(),this.popupType=this.getAttribute("type")||"inline",this.textHeader=this.getAttribute("text-header")||"",this.iconHeader="",this.textClose="Close",this.popupContent="",this.src=this.getAttribute("src")||"",this.popupButtons=[],this.cancelable=!this.hasAttribute("not-cancelable"),this.width=this.getAttribute("width")||"",this.height=this.getAttribute("height")||"",this.popupTemplate=popupTemplate,this.preferredParent=null,this.popupContentSrcLocation=null,t&&(["popupType","textHeader","textClose","popupContent","src","popupButtons","cancelable","width","height","popupTemplate","iconHeader","id","preferredParent"].forEach((e=>{void 0!==t[e]&&(this[e]=t[e])})),t.className&&this.classList.add(...t.className.split(" ")))}connectedCallback(){this.renderLayout()}renderLayout(){if(this.dialog)return this;const t=()=>{this.dispatchEvent(new CustomEvent("joomla-dialog:close",{bubbles:!0}))},e=t=>{this.cancelable||t.preventDefault()};if(this.firstElementChild&&"DIALOG"===this.firstElementChild.nodeName)return this.dialog=this.firstElementChild,this.dialog.addEventListener("cancel",e),this.dialog.addEventListener("close",t),this.popupTmplB=this.querySelector(".joomla-dialog-body")||this.dialog,this.popupContentElement=this.popupTmplB,this;let o;if(this.popupTemplate.tagName&&"TEMPLATE"===this.popupTemplate.tagName)o=this.popupTemplate.content.cloneNode(!0);else{const t=document.createElement("template");t.innerHTML=this.popupTemplate,o=t.content}if(this.dialog=document.createElement("dialog"),this.dialog.appendChild(o),this.dialog.addEventListener("cancel",e),this.dialog.addEventListener("close",t),this.appendChild(this.dialog),this.popupTmplH=this.dialog.querySelector(".joomla-dialog-header"),this.popupTmplB=this.dialog.querySelector(".joomla-dialog-body"),this.popupTmplF=this.dialog.querySelector(".joomla-dialog-footer"),this.popupContentElement=null,!this.popupTmplB)throw new Error("The popup body not found in the template.");if(this.popupTmplH&&this.textHeader){const t=document.createElement("h3");if(t.insertAdjacentHTML("afterbegin",this.textHeader),this.popupTmplH.insertAdjacentElement("afterbegin",t),this.iconHeader){const t=document.createElement("span");t.ariaHidden=!0,t.classList.add("header-icon"),t.classList.add(...this.iconHeader.split(" ")),this.popupTmplH.insertAdjacentElement("afterbegin",t)}}this.renderBodyContent(),this.setAttribute("type",this.popupType);const i=this.popupButtons||[];i.length||i.push({label:"",ariaLabel:this.textClose,className:"button-close btn-close",data:{buttonClose:""},onClick:()=>this.close(),location:"header"});const s=document.createElement("div"),n=document.createElement("div");return s.classList.add("buttons-holder"),n.classList.add("buttons-holder"),this.popupButtons.forEach((t=>{const e=document.createElement("button");e.type="button",e.textContent=t.label||"",e.ariaLabel=t.ariaLabel||null,t.className?e.classList.add(...t.className.split(" ")):e.classList.add("button","button-primary","btn","btn-primary"),t.data&&(Object.entries(t.data).forEach((([t,o])=>{e.dataset[t]=o})),void 0!==t.data.dialogClose&&(t.onClick=()=>this.close()),void 0!==t.data.dialogDestroy&&(t.onClick=()=>this.destroy())),t.onClick&&e.addEventListener("click",t.onClick),"header"===t.location?s.appendChild(e):n.appendChild(e)})),s.children.length&&(("image"!==this.popupType||this.textHeader)&&this.popupTmplH?this.popupTmplH.insertAdjacentElement("beforeend",s):this.popupTmplB.insertAdjacentElement("afterbegin",s)),n.children.length&&(this.popupTmplF||this.popupTmplB).insertAdjacentElement("beforeend",n),this.width&&(this.dialog.style.width="100%",this.dialog.style.maxWidth=this.width),this.height&&(this.dialog.style.height=this.height),this.popupTmplH&&!this.popupTmplH.children.length&&this.popupTmplH.classList.add("empty"),this.popupTmplF&&!this.popupTmplF.children.length&&this.popupTmplF.classList.add("empty"),this}renderBodyContent(){if(!this.popupTmplB||this.popupContentElement)return this;const t=()=>{this.classList.add("loaded"),this.classList.remove("loading"),this.popupContentElement.removeEventListener("load",t),this.dispatchEvent(new CustomEvent("joomla-dialog:load")),"inline"!==this.popupType&&"ajax"!==this.popupType||this.popupContentElement.dispatchEvent(new CustomEvent("joomla:updated",{bubbles:!0,cancelable:!0}))};switch(this.classList.add("loading"),this.popupType){case"inline":{let e=this.popupContent;e||!this.src||"."!==this.src[0]&&"#"!==this.src[0]||(e=document.querySelector(this.src),this.popupContent=e),e instanceof HTMLElement?"TEMPLATE"===e.nodeName?this.popupTmplB.appendChild(e.content.cloneNode(!0)):(this.popupContentSrcLocation={parent:e.parentElement,nextSibling:e.nextSibling},this.popupTmplB.appendChild(e)):this.popupTmplB.insertAdjacentHTML("afterbegin",Joomla.sanitizeHtml(e)),this.popupContentElement=this.popupTmplB,t();break}case"iframe":{const e=document.createElement("iframe");e.addEventListener("load",t),e.src=this.src,e.width="100%",e.height="720",this.width||(e.style.maxWidth="100%",e.width="1024"),e.classList.add("iframe-content"),this.popupContentElement=e,this.popupTmplB.appendChild(e);break}case"image":{const e=document.createElement("img");e.addEventListener("load",t),e.src=this.src,this.popupContentElement=e,this.popupTmplB.appendChild(e);break}case"ajax":fetch(this.src).then((t=>{if(200!==t.status)throw new Error(t.statusText);return t.text()})).then((e=>{this.popupTmplB.insertAdjacentHTML("afterbegin",Joomla.sanitizeHtml(e)),this.popupContentElement=this.popupTmplB,t()})).catch((t=>{throw t}));break;default:throw new Error("Unknown popup type requested")}return this}findPreferredParent(){let t;if(this.preferredParent instanceof HTMLElement)t=this.preferredParent;else if(this.preferredParent)t=document.querySelector(this.preferredParent);else if("inline"===this.popupType){let e=this.popupContent;e||!this.src||"."!==this.src[0]&&"#"!==this.src[0]||(e=document.querySelector(this.src),t=!!e&&e.parentElement)}return t||!1}getHeader(){return this.renderLayout(),this.popupTmplH||!1}getBody(){return this.renderLayout(),this.popupTmplB}getBodyContent(){return this.renderLayout(),this.popupContentElement||this.popupTmplB}getFooter(){return this.renderLayout(),this.popupTmplF||!1}show(){if(!this.parentElement){(this.findPreferredParent()||document.body).appendChild(this)}return this.dialog.showModal(),this.dispatchEvent(new CustomEvent("joomla-dialog:open",{bubbles:!0})),this}open(){return this.show()}close(){if(!this.dialog)throw new Error("Calling close for non opened dialog is discouraged.");return this.dialog.close(),this}hide(){return this.close()}destroy(){if(this.dialog){if(this.dialog.close(),this.removeChild(this.dialog),this.parentElement.removeChild(this),this.popupContentSrcLocation&&this.popupContent){const{parent:t,nextSibling:e}=this.popupContentSrcLocation;t.insertBefore(this.popupContent,e)}this.dialog=null,this.popupTmplH=null,this.popupTmplB=null,this.popupTmplF=null,this.popupContentElement=null,this.popupContentSrcLocation=null}}static alert(t,e){return new Promise((o=>{const i=new this;i.popupType="inline",i.popupContent=t,i.textHeader=e||Joomla.Text._("INFO","Info"),i.popupButtons=[{label:Joomla.Text._("JOK","Okay"),data:{buttonOk:""},onClick:()=>i.close()}],i.classList.add("joomla-dialog-alert"),i.addEventListener("joomla-dialog:close",(()=>{i.destroy(),o()})),i.show()}))}static confirm(t,e){return new Promise((o=>{let i=!1;const s=new this;s.popupType="inline",s.popupContent=t,s.textHeader=e||Joomla.Text._("INFO","Info"),s.popupButtons=[{label:Joomla.Text._("JYES","Yes"),data:{buttonOk:""},onClick:()=>{i=!0,s.destroy()}},{label:Joomla.Text._("JNO","No"),data:{buttonCancel:""},onClick:()=>{i=!1,s.destroy()},className:"button button-secondary btn btn-outline-secondary"}],s.cancelable=!1,s.classList.add("joomla-dialog-confirm"),s.addEventListener("joomla-dialog:close",(()=>o(i))),s.show()}))}}customElements.define("joomla-dialog",JoomlaDialog);export{JoomlaDialog as default};