33 lines
No EOL
999 B
JavaScript
33 lines
No EOL
999 B
JavaScript
// a popover dialog NOT WORKING
|
|
class PopupInfo extends HTMLElement {
|
|
constructor() {
|
|
// Always call super first in constructor
|
|
super();
|
|
}
|
|
|
|
connectedCallback() {
|
|
// Create a shadow root
|
|
const shadow = this.attachShadow({ mode: "open" });
|
|
|
|
// Create spans
|
|
const dialog = document.createElement("dialog");
|
|
dialog.setAttribute("id", this.getAttribute("id"));
|
|
dialog.setAttribute("popover","popover");
|
|
const header = document.createElement("header");
|
|
header.innerText="HEADE"
|
|
const main = document.createElement("main");
|
|
main.innerText="MAIN"
|
|
const footer = document.createElement("footer");
|
|
footer.innerText="WWW"
|
|
dialog.appendChild(header);
|
|
dialog.appendChild(main);
|
|
dialog.appendChild(footer)
|
|
// Attach the created elements to the shadow dom
|
|
shadow.appendChild(dialog);
|
|
|
|
}
|
|
}
|
|
|
|
// Define the new element
|
|
customElements.define("popup-info", PopupInfo);
|
|
|