@readium/navigator 2.4.0-alpha.6 → 2.4.0-alpha.8

package/dist/index.js

@@ -3622,7 +3622,7 @@ const _t = class _t extends ft {
     ), Reflect.defineProperty(t.navigator, "epubReadingSystem", {
       value: {
         name: "readium-ts-toolkit",
-        version: "2.4.0-alpha.6",
+        version: "2.4.0-alpha.8",
         hasFeature: (n, r = "") => {
           switch (n) {
             case "dom-manipulation":
@@ -6412,17 +6412,14 @@ class on {
   }
   async buildHtmlFrame(t = !1) {
     if (!this.currentResource) throw new Error("No resource loaded");
-    const e = await this.currentResource.link(), i = await this.currentResource.readAsString();
+    const e = await this.currentResource.link(), i = await this.currentResource.readAsXML();
     if (!i) throw new Error(`Failed reading item ${e.href}`);
-    const n = new DOMParser().parseFromString(
-      i,
-      e.mediaType.string
-    ), r = n.querySelector("parsererror");
-    if (r) {
-      const o = r.querySelector("div");
-      throw new Error(`Failed parsing item ${e.href}: ${o?.textContent || r.textContent}`);
+    const n = i.querySelector("parsererror");
+    if (n) {
+      const r = n.querySelector("div");
+      throw new Error(`Failed parsing item ${e.href}: ${r?.textContent || n.textContent}`);
     }
-    return this.injector && await this.injector.injectForDocument(n, e), this.finalizeDOM(n, this.pub.baseURL, e.toURL(this.baseURL) || "", e.mediaType, t, this.cssProperties);
+    return this.injector && await this.injector.injectForDocument(i, e), this.finalizeDOM(i, this.pub.baseURL, e.toURL(this.baseURL) || "", e.mediaType, t, this.cssProperties);
   }
   async buildImageFrame() {
     if (!this.currentResource) throw new Error("No resource loaded");
@@ -6687,7 +6684,7 @@ class Dr {
 }
 class Ir {
   constructor(t, e, i, n = {}, r = []) {
-    this.frameIsAppended = !1, this.currModules = [], this.cachedPage = void 0, this.peripherals = t, this.debugHref = i, this.contentProtectionConfig = { ...n }, this.keyboardPeripheralsConfig = [...r], this.frame = document.createElement("iframe"), this.frame.sandbox.value = "allow-same-origin allow-scripts", this.frame.classList.add("readium-navigator-iframe"), this.frame.classList.add("blank"), this.frame.scrolling = "no", this.frame.style.visibility = "hidden", this.frame.style.setProperty("aria-hidden", "true"), this.frame.style.display = "none", this.frame.style.position = "absolute", this.frame.style.pointerEvents = "none", this.frame.style.transformOrigin = "0 0", this.frame.style.transform = "scale(1)", this.frame.style.background = "#fff", this.frame.style.touchAction = "none", this.frame.dataset.originalHref = i, this.source = "about:blank", this.wrapper = document.createElement("div"), this.wrapper.style.position = "relative", this.wrapper.style.float = this.wrapper.style.cssFloat = e === F.rtl ? "right" : "left";
+    this.frameIsAppended = !1, this.currModules = [], this.viewportSize = void 0, this.cachedPage = void 0, this.peripherals = t, this.debugHref = i, this.contentProtectionConfig = { ...n }, this.keyboardPeripheralsConfig = [...r], this.frame = document.createElement("iframe"), this.frame.sandbox.value = "allow-same-origin allow-scripts", this.frame.classList.add("readium-navigator-iframe"), this.frame.classList.add("blank"), this.frame.scrolling = "no", this.frame.style.visibility = "hidden", this.frame.style.setProperty("aria-hidden", "true"), this.frame.style.display = "none", this.frame.style.position = "absolute", this.frame.style.pointerEvents = "none", this.frame.style.transformOrigin = "0 0", this.frame.style.transform = "scale(1)", this.frame.style.background = "#fff", this.frame.style.touchAction = "none", this.frame.dataset.originalHref = i, this.source = "about:blank", this.wrapper = document.createElement("div"), this.wrapper.style.position = "relative", this.wrapper.style.float = this.wrapper.style.cssFloat = e === F.rtl ? "right" : "left";
   }
   async load(t, e) {
     return this.frameIsAppended || (this.wrapper.appendChild(this.frame), this.frameIsAppended = !0), this.source === e && this.loadPromise && [...this.currModules].sort().join("|") === [...t].sort().join("|") ? this.loadPromise : (this.loaded && this.source !== e && this.window.stop(), this.source = e, this.loadPromise = new Promise((i, n) => {
@@ -6724,6 +6721,7 @@ class Ir {
   }
   // Parses the page size from the viewport meta tag of the loaded resource.
   loadPageSize() {
+    if (this.viewportSize) return this.viewportSize;
     const t = this.frame.contentWindow, e = t.document.head.querySelector(
       "meta[name=viewport]"
     );
@@ -6733,7 +6731,7 @@ class Ir {
       for (; n = i.exec(e.content); )
         n[1] === "width" ? r = Number.parseFloat(n[2]) : n[1] === "height" && (o = Number.parseFloat(n[2]));
       if (r > 0 && o > 0)
-        return { width: r, height: o };
+        return this.viewportSize = { width: r, height: o }, this.viewportSize;
     }
     return {
       width: t.document.body.scrollWidth,
@@ -7211,12 +7209,14 @@ class Zr {
    */
   resizeHandler(t = !0, e = !0) {
     this.currentSlide + this.perPage > this.length && (this.currentSlide = this.length <= this.perPage ? 0 : this.length - 1), this.containerHeightCached = this.container.clientHeight, this.orientationInternal = -1, this.updateSpineStyle(!0), t && (this.currentSlide = this.reAlign(), this.slideToCurrent(!e, e)), clearTimeout(this.resizeTimeout), this.resizeTimeout = window.setTimeout(() => {
-      this.pool.forEach((i, n) => {
-        let r = this.pub.readingOrder.items.findIndex((l) => l.href === n);
-        const o = this.pub.readingOrder.items[r];
-        if (i.width = 100 / this.length * (o.properties?.otherProperties.orientation === Pe.landscape || o.properties?.otherProperties.addBlank ? this.perPage : 1), i.height = this.height, !i.loaded) return;
-        const a = this.spreader.findByLink(o);
-        i.update(this.spreadPosition(a, o));
+      const i = 100 / this.length, n = new Map(this.pub.readingOrder.items.map((r) => [r.href, r]));
+      this.pool.forEach((r, o) => {
+        const a = n.get(o);
+        a && requestAnimationFrame(() => {
+          if (r.width = i * (a.properties?.otherProperties.orientation === Pe.landscape || a.properties?.otherProperties.addBlank ? this.perPage : 1), r.height = this.height, !r.loaded) return;
+          const l = this.spreader.findByLink(a);
+          r.update(this.spreadPosition(l, a));
+        });
       });
     }, Yr);
   }