diff --git a/.epub/example/OEBPS/scripts/ipub.js b/.epub/example/OEBPS/scripts/ipub.js index 947e891..0d1184e 100644 --- a/.epub/example/OEBPS/scripts/ipub.js +++ b/.epub/example/OEBPS/scripts/ipub.js @@ -144,10 +144,38 @@ class IPUBBackground extends IPUBElement { } } -class IPUBContent extends IPUBElement { - static elementName = "ipub-content"; +class IPUBBody extends IPUBElement { + static elementName = "ipub-body"; + + static defineContentElements() { + for (const e of [ + IPUBBackground, + IPUBImage, + IPUBInteraction, + ]) { + console.info(`IPUBBody: Defining custom element <${e.elementName}>`); + globalThis.customElements.define(e.elementName, e); + } + } + + connectedCallback() { + super.connectedCallback(); + + this.setAttribute("aria-busy", "true"); + + IPUBBody.defineContentElements(); + + this.setAttribute("aria-busy", "false"); + } } +globalThis.addEventListener("load", () => { + console.info("IPUB: Starting IPUB elements"); + + console.log("IPUB: Defining custom element "); + globalThis.customElements.define(IPUBBody.elementName, IPUBBody); +}); + class IPUBImage extends IPUBElement { static elementName = "ipub-image"; } @@ -156,34 +184,8 @@ class IPUBInteraction extends IPUBElement { static elementName = "ipub-interaction"; } -globalThis.addEventListener("load", () => { - console.info("IPUB: STARTING DEFINITIONS"); - - [IPUBBackground, IPUBContent, IPUBImage, IPUBInteraction].forEach((e) => { - console.info(`IPUB: Defining custom element <${e.elementName}>`); - globalThis.customElements.define(e.elementName, e); - }); - - console.info("IPUB: FINISHED DEFINITIONS"); - - /** @type {Map} */ - const onScreenMap = new Map(); - - const observer = new IntersectionObserver((entries) => { - entries.forEach((e) => { - if (e.intersectionRatio > 0) { - // console.debug( - // `IntersectionObserver: adding element #${e.target.id} to onScreenMap`, - // ); - onScreenMap.set(e.target.id, e.target); - } else { - // console.debug( - // `IntersectionObserver: removing element #${e.target.id} to onScreenMap`, - // ); - onScreenMap.delete(e.target.id); } }); - });