@foxycape/core 1.1.5 → 1.1.7

package/dist/mediaTypes/html/renderer/documents/HtmlDocumentsPreloader.mjs

@@ -1,77 +1,151 @@
-import { BrowserCapabilities as e } from "../../../../kernal/web/BrowserCapabilities.mjs";
-import { EventNames as t } from "../../../../kernal/EventNames.mjs";
-import { asyncDebounce as n } from "../../../../kernal/Debounce.mjs";
+import { EventNames as e } from "../../../../kernal/EventNames.mjs";
+import { yieldToMain as t } from "../../../../kernal/web/scheduler.mjs";
+import { asyncDebounce as n } from "../../../../kernal/web/debounce.mjs";
+import { HtmlSettings as r } from "../../HtmlSettings.mjs";
+import { pickVisibleCompensationDocument as i } from "../layout/geometry/restoreLayoutState.mjs";
+import { getLayoutGeometry as a } from "../layout/resolveLayoutRoute.mjs";
+import { isProgrammaticScroll as o, isUserScrollSettling as s, markUserScroll as c, releaseAbsoluteLocate as l } from "../location/scrollActivity.mjs";
+import { collectPreloadNeighbors as u } from "./preloadNeighbors.mjs";
+import { isSubstantialWrapperRect as d, rectsIntersect as f } from "./wrapperVisibility.mjs";
 //#region mediaTypes/html/renderer/documents/HtmlDocumentsPreloader.ts
-var r = class {
-	constructor(e, t, r, i) {
-		this.events = e, this.documentsProvider = t, this.getLoadingDocument = r, this.htmlOptions = i, this.onDocumentVisibleChange = async (e, t) => {
-			await this.delayPreloadDocuments();
-		}, this.delayPreloadDocuments = n(this.preloadDocuments, 500), this.checkContainFullscreenElement = (e) => !!e?.getContentContainer()?.ownerDocument?.fullscreenElement, this.bindEvents();
+var p = 160, m = (e, t) => e === t.scrollingElement || e === t.documentElement || e === t.body, h = class {
+	constructor(e, t, i, u) {
+		this.events = e, this.documentsProvider = t, this.getLoadingDocument = i, this.htmlOptions = u, this.preloadToken = 0, this.onDocumentVisibleChange = () => {
+			o() || this.schedulePreload();
+		}, this.onReaderScroll = (e, t) => {
+			o() || t && !t.isTrusted || (c(), l(), this.schedulePreload());
+		}, this.onPageChange = () => {
+			this.schedulePreload();
+		}, this.preloadDocuments = async () => {
+			if (this.isPageMoving()) {
+				this.preloadToken++, this.delayPreloadAfterMove();
+				return;
+			}
+			let e = ++this.preloadToken;
+			try {
+				let t = this.resolveVisibleDocuments(), n = a(this.htmlOptions).preloadRangeMode == "visual-edge", r = n ? this.resolvePreloadAnchor(t) : t[0], i = n ? r : t[t.length - 1];
+				if (!r || !i) return;
+				let o = t.length > 0 ? t : [r];
+				for (let t of o) {
+					if (this.shouldAbortPreload(e)) return;
+					await t.load();
+				}
+				if (this.shouldAbortPreload(e)) return;
+				await this.preloadRelatedDocuments(r, i, e);
+			} catch {}
+		}, this.delayPreloadDocuments = n(() => this.preloadDocuments(), 500), this.delayPreloadAfterMove = n(() => this.preloadDocuments(), 80), this.schedulePreload = () => {
+			if (this.abortPreloadIfPageMoving(), this.isPageMoving()) {
+				this.delayPreloadAfterMove();
+				return;
+			}
+			this.delayPreloadDocuments();
+		}, this.shouldPreloadPreviousFirst = () => {
+			let e = this.documentsProvider.owner?.context?.currentLocation?.direction;
+			return a(this.htmlOptions).preloadRangeMode == "page-fill" ? e != "next" : e == "previous";
+		}, this.isPageMoving = () => !!(this.documentsProvider.getRendererContainer()?.querySelector?.(`.${r.TransformContainerCssName}`))?.hasAttribute(r.PageMovingAttributeName), this.isScrollSettling = () => a(this.htmlOptions).flipMode == "scroll" && s(), this.abortPreloadIfPageMoving = () => {
+			this.isPageMoving() && this.preloadToken++;
+		}, this.shouldAbortPreload = (e) => e === this.preloadToken ? this.isPageMoving() ? (this.preloadToken++, !0) : !1 : !0, this.checkContainFullscreenElement = (e) => !!e?.getContentContainer()?.ownerDocument?.fullscreenElement, this.bindEvents();
 	}
 	bindEvents() {
-		this.events.on(t.DocumentVisibleChange, this.onDocumentVisibleChange);
+		this.events.on(e.DocumentVisibleChange, this.onDocumentVisibleChange), this.events.on(e.ReaderDebounceScroll, this.onReaderScroll), this.events.on(e.PageChange, this.onPageChange);
 	}
 	unbindEvents() {
-		this.events.off(t.DocumentVisibleChange, this.onDocumentVisibleChange);
+		this.events.off(e.DocumentVisibleChange, this.onDocumentVisibleChange), this.events.off(e.ReaderDebounceScroll, this.onReaderScroll), this.events.off(e.PageChange, this.onPageChange);
 	}
 	async dispose() {
-		this.unbindEvents();
+		this.preloadToken++, this.unbindEvents();
+	}
+	resolveVisibleDocuments() {
+		let e = a(this.htmlOptions);
+		return e.preloadRangeMode == "visible-span" ? this.resolveIntersectingDocuments(!1) : e.rewritesWrapperVisibility ? this.resolveIntersectingDocuments(!0) : this.documentsProvider.getVisibleDocuments();
+	}
+	resolveIntersectingDocuments(e) {
+		let t = this.getViewportRect();
+		if (!t) {
+			let t = this.documentsProvider.getVisibleDocuments();
+			return e ? t.filter((e) => d(e.getWrapperContainer()?.getBoundingClientRect())) : t;
+		}
+		let n = [];
+		for (let r of this.documentsProvider.getDocuments()) {
+			let i = r.getWrapperContainer();
+			if (!i) continue;
+			let a = i.getBoundingClientRect(), o = f(a, t) && (!e || d(a));
+			i.isVisible = o, o && n.push(r);
+		}
+		return n;
 	}
-	async preloadDocuments() {
-		try {
-			let e = this.documentsProvider.getVisibleDocuments();
-			if (!e || e.length == 0) return;
-			for (let t of e) await t.load();
-			await this.preloadRelatedDocuments(e[0], e[e.length - 1]);
-		} catch {}
+	resolvePreloadAnchor(e) {
+		let t = a(this.htmlOptions);
+		return i(e, t.compensationAnchorEdge, (e) => {
+			let n = e.getWrapperContainer()?.getBoundingClientRect();
+			if (!(!n || !d(n))) return t.getCompensationRect(n);
+		}) ?? this.documentsProvider.getDocuments()[0];
 	}
-	async preloadRelatedDocuments(t, n) {
-		let r = this.documentsProvider.getDocuments(), i = r.indexOf(t), a = r.indexOf(n), o = r.length, s = [];
-		for (let e = i; e <= a; e++) {
-			let t = r[e];
-			t && !s.includes(t) && s.push(t);
+	getViewportRect() {
+		let e = this.documentsProvider.getScrollElement(), t = this.documentsProvider.getRendererContainer(), n = (e ?? t)?.ownerDocument;
+		if (e && n && m(e, n)) {
+			let e = n.defaultView;
+			return e ? {
+				left: 0,
+				top: 0,
+				right: e.innerWidth,
+				bottom: e.innerHeight
+			} : void 0;
 		}
-		let c = [], l = this.htmlOptions.preloadFileCount;
-		l > 10 && (l = 10), l < 1 && (l = 1);
-		for (let e = 1; e <= l; e++) {
-			let t = a + e;
-			t > 0 && t <= o - 1 && c.push(r[t]);
-			let n = i - e;
-			n >= 0 && c.push(r[n]);
+		return (e ?? t)?.getBoundingClientRect();
+	}
+	async preloadRelatedDocuments(e, n, r) {
+		let i = this.documentsProvider.getDocuments(), o = i.indexOf(e), s = i.indexOf(n), c = i.length, l = [];
+		for (let e = o; e <= s; e++) {
+			let t = i[e];
+			t && !l.includes(t) && l.push(t);
 		}
-		for (let t = 0; t < c.length; t++) {
-			let n = c[t];
-			await n.load(), n && !s.includes(n) && s.push(n), await e.yieldToMain();
+		let f = u(i, o, s, this.htmlOptions.preloadFileCount, this.shouldPreloadPreviousFirst());
+		for (let e = 0; e < f.length; e++) {
+			if (this.shouldAbortPreload(r)) return;
+			let n = f[e];
+			await n.load(), n && !l.includes(n) && l.push(n), await t();
 		}
-		let u = this.documentsProvider.getRendererContainer().clientWidth;
-		if (this.htmlOptions.flipMode == "page") {
-			let t = 0;
-			for (let n = i - 1; n >= 0; n--) {
-				let i = r[n];
-				if (await i.load(), i && !s.includes(i) && s.push(i), t += i.getWrapperContainer().clientWidth, t >= u) break;
-				await e.yieldToMain();
+		let p = this.documentsProvider.getRendererContainer().clientWidth;
+		if (a(this.htmlOptions).preloadRangeMode == "page-fill") {
+			let e = 0;
+			for (let n = o - 1; n >= 0; n--) {
+				if (this.shouldAbortPreload(r)) return;
+				let a = i[n];
+				if (await a.load(), a && !l.includes(a) && l.push(a), e += a.getWrapperContainer().clientWidth, e >= p) break;
+				await t();
 			}
 			let n = 0;
-			for (let t = a + 1; t < o - 1; t++) {
-				let i = r[t];
-				if (await i.load(), i && !s.includes(i) && s.push(i), n += i.getWrapperContainer().clientWidth, n >= u) break;
-				await e.yieldToMain();
+			for (let e = s + 1; e < c; e++) {
+				if (this.shouldAbortPreload(r)) return;
+				let a = i[e];
+				if (await a.load(), a && !l.includes(a) && l.push(a), n += a.getWrapperContainer().clientWidth, n >= p) break;
+				await t();
 			}
 		}
-		let d = this.getLoadingDocument();
-		d && !s.includes(d) && s.push(d);
-		let f = this.documentsProvider.getVisibleDocuments();
-		for (let e of f) s.includes(e) || s.push(e);
-		await this.removeUnnecessaryDocuments(s), s.splice(0);
+		let m = this.getLoadingDocument();
+		m && !l.includes(m) && l.push(m), l.includes(e) || l.push(e);
+		let h = a(this.htmlOptions).preloadRangeMode == "visual-edge" ? this.documentsProvider.getVisibleDocuments().filter((e) => d(e.getWrapperContainer()?.getBoundingClientRect())) : this.documentsProvider.getVisibleDocuments();
+		for (let e of h) l.includes(e) || l.push(e);
+		if (!this.shouldAbortPreload(r)) {
+			if (this.isScrollSettling()) {
+				this.delayPreloadAfterMove();
+				return;
+			}
+			await this.removeUnnecessaryDocuments(l, r), l.splice(0);
+		}
 	}
-	async removeUnnecessaryDocuments(t) {
-		if (!t) return;
-		let n = this.documentsProvider.getLoadedDocuments();
-		for (let r of n) t.includes(r) || (await this.disposeDocument(r), await e.yieldToMain());
+	async removeUnnecessaryDocuments(e, n) {
+		if (!e) return;
+		let r = this.documentsProvider.getLoadedDocuments();
+		for (let i of r) {
+			if (this.shouldAbortPreload(n)) return;
+			e.includes(i) || (await this.disposeDocument(i), await t());
+		}
 	}
 	async disposeDocument(e) {
 		this.checkContainFullscreenElement(e) || await e.dispose();
 	}
 };
 //#endregion
-export { r as HtmlDocumentsPreloader };
+export { h as HtmlDocumentsPreloader, p as SCROLL_PRELOAD_SETTLE_MS };

package/dist/mediaTypes/html/renderer/documents/HtmlDocumentsProvider.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../../kernal/web/BrowserCapabilities.cjs"),t=require("../../../../kernal/common/text.cjs"),n=require("../../../../kernal/progress/Progress.cjs");require("../../../../kernal/Constants.cjs");const r=require("../../../../kernal/common/number.cjs"),i=require("../../../../kernal/html/finder.cjs"),a=require("../../../../kernal/html/dom.cjs"),o=require("../../../../kernal/html/style.cjs"),s=require("../../../../kernal/html/manipulator.cjs"),c=require("../../HtmlSettings.cjs"),l=require("../../../base/renderer/BaseDocumentsProvider.cjs"),u=require("../document/HtmlDocument.cjs"),d=require("./HtmlDocumentsPreloader.cjs"),f=require("./HtmlDocumentsIntersectionObserver.cjs"),p=require("../location/HtmlElementLocator.cjs"),m=require("../layout/HtmlRendererViewport.cjs");let h=require("perfect-debounce");var g=class extends l.BaseDocumentsProvider{constructor(e,n,r,i){super(e,n),this.readerContainer=r,this.htmlOptions=i,this.isInit=!1,this.isFirstLoad=!0,this.hangTasks=[],this.resetTransformContainer=()=>{let e=this.getTransformContainer();e&&(e.style.removeProperty(`transition`),e.style.transform=`translate3d(0px,0,0)`,e.setAttribute(`data-target-transform`,`0`),e.offsetWidth)},this.removeElementTransitionEvent=async e=>{let t=e.target;for(t.style.removeProperty(`transition`),t.style.removeProperty(`will-change`),t.removeAttribute(c.HtmlSettings.PageMovingAttributeName),t.removeEventListener(`transitionend`,this.removeElementTransitionEvent);this.hangTasks.length>0;)await this.hangTasks.shift()()},this.scrollWrapperIntoView=(e,t)=>{let n=e.getWrapperContainer();if(this.htmlOptions.flipMode==`page`){let e=n.offsetLeft,t=this.getTransformContainer();t.style.transform=`translateX(`+-e+`px)`}else(!n.isVisible||t)&&o.scrollElementIntoView(n,void 0,void 0,this.owner.getRootContainer()?.ownerDocument);this.setDocumentVisible(n,!0)},this.setDocumentVisible=(e,t)=>{e.isVisible=t},this.reload=async()=>{let e=this.owner.context.currentLocation;t.isNullOrWhiteSpace(e?.url)||(e.scrollBehavior=`smooth`,await this.load(e,!0),e.scrollBehavior=void 0)},this.delayReloadTime=300,this.delayReload=(0,h.debounce)(this.reload,this.delayReloadTime),this.logger=this.owner.loggerFactory.getLogger(this.constructor.name),this.elementLocator=new p.HtmlElementLocator(this),this.rendererViewport=new m.HtmlRendererViewport(e,this.readerContainer,this.owner.optionsProvider,i),this.documentsIntersectionObserver=new f.HtmlDocumentsIntersectionObserver(this),this.documentPreloader=new d.HtmlDocumentsPreloader(this.owner.events,this,()=>this.loadingDoc,i)}getTransformContainer(){return this.getRendererContainer().querySelector(`.`+c.HtmlSettings.TransformContainerCssName)}getRendererContainer(){return this.rendererViewport.getRendererContainer()}getScrollElement(){return this.rendererViewport.getScrollElement()}getLoadingDocument(){return this.loadingDoc}async createDocument(e,t,n){return new u.HtmlDocument(this.owner,this.rendererViewport,this.fileParser,e,t,this.htmlOptions)}async initialize(e){this.rendererViewport.applyCssVariables(),await super.initialize(e);let t=this.getDocuments();for(let e of t)e.getWrapperContainer().classList.add(c.HtmlSettings.FileContentContainerClassName,c.HtmlSettings.FileContentContainerHeightClassName)}async load(e,t){this.isInit||=(await this.initialize(this.getTransformContainer()),this.documentsIntersectionObserver.register(),!0),e?.storeCurrent&&await this.owner.onBeforeRedirect?.(this),t??=!1;let r=e?.url,i=this.getDocument(r);if(!i){let t=this.getDocuments();i=t[0],(t.length>1||!e)&&(e=new n.FileLocation(i.url,1,`ratio`),e.current=0)}this.htmlOptions.flipMode==`page`?this.appendPageStyles():this.removePageStyles(),this.loadingDoc=i,this.owner.context.redirectingDocUrl=i.url;try{this.delayHideLoadingLayerTimer=setTimeout(async()=>{await this.owner.loading?.hide()},2e3),this.owner.context.setUserChangedProgress(!t,e?.from),await this.gotoDoc(i,e,t),this.isFirstLoad&&!t&&(this.isFirstLoad=!1),await this.documentPreloader.preloadDocuments()}finally{setTimeout(()=>{this.loadingDoc=null,this.owner.context.redirectingDocUrl=void 0},166)}}async gotoDoc(e,n,r){if(!n||(await e.load(),!e.getContentContainer()))return;r??=!1;let a=this.htmlOptions.flipMode,o,c;try{let l=await this.findTarget(e,n);c=l?.target;let u=l?.pageNumber,d=l?.isDocumentStart;if(!c&&!u)return;if(c&&n?.textOffset>=0){let e=c.textContent;if(n?.textOffset<e.length&&e.length<3e3){s.wrapperCharacters(c,`m`);let e=c.querySelectorAll(`m`);o=i.compareTagName(c.firstElementChild?.tagName,`ST`)&&c.firstElementChild.getBoundingClientRect().width==0?e.item(c.firstElementChild.textContent.length):e.item(n.textOffset)}}if(o??=c,a==`scroll`)await this.gotoScroll(e,n,o,d);else{if(r&&o&&!t.isNullOrWhiteSpace(n.tagName))this.resetTransformContainer(),u=await e.getPageNumber(o);else if(n.unit===`page`&&n.current!=null&&n.current>0){u=n.current;let t=await e.getNumberOfPages();n.total>1&&n.total!=t&&(u=Math.ceil(t*(n.current/n.total)))}else u||=await e.getPageNumber(o);await this.transformPage(e,u,r?void 0:n.direction)}}finally{c&&s.recoverWrapperCharacters(c)}}async gotoScroll(t,n,r,i){let a=r.getBoundingClientRect(),s=0;n?.ignoreOverlayHeader||(s=this.owner.optionsProvider.getHeaderHeight()+this.owner.options.redirectPositionOffset,r.clientHeight==0&&a.height==0&&(s+=50)),n.offsetTop&&(s+=n.offsetTop);let c=this.getScrollElement(),l=a.y,u=t.getContentContainer().ownerDocument.defaultView?.frameElement,d=u?.getBoundingClientRect()?.y??0,f=l+d,p=c.scrollTop;if(n.useAbsoluteScrollTop){let e=p+f-s;c.scrollTo(0,e)}else if(i)this.scrollWrapperIntoView(t,!0);else{if(e.BrowserCapabilities.isSafari()){o.scrollElementIntoView(t.getWrapperContainer(),void 0,void 0,this.owner.getRootContainer()?.ownerDocument),p=c.scrollTop;let e=u?.offsetTop??0;if(Math.abs(e+l-p)>5){let e=p+t.getWrapperContainer().getBoundingClientRect().y+l;c.scrollTo(0,e)}d=u?.getBoundingClientRect()?.y??0,f=l+d}else s=f-s-c.getBoundingClientRect().top;s>0?c.scrollHeight-c.scrollTop-c.clientHeight>0?c.scrollBy(0,s):o.scrollElementIntoView(r,void 0,n?.scrollIntoViewIfNeeded,this.owner.getRootContainer()?.ownerDocument):c.scrollBy(0,s),this.setDocumentVisible(t.getWrapperContainer(),!0)}}async findTarget(e,t){return this.elementLocator.locateElement(e,t,this.htmlOptions)}async transformPage(e,t,n){let i=this.getTransformContainer(),a=i.getAttribute(`data-target-transform`),s=0;s=a?r.parseNumber(a,0,`parseFloat`):o.getTransformLength(i,`x`);let c=this.rendererViewport.getLayoutMetrics(),l=c.columnWidth+c.columnGap,u=e.getWrapperContainer().offsetLeft,d=Math.abs(u-s),f=d==0?0:d%l,p=s;f>0&&(p=n==`previous`?s-f:s+l-f);let m=p;try{if(n==`previous`){let e=p-c.pageMoveLength>=0,n=u+(t-1)*c.pageMoveLength;m=e?p-c.pageMoveLength:p<=c.pageMoveLength?0:n}else if(n==`next`){m=p+c.pageMoveLength;let e=this.getDocuments(),t=e[e.length-1];if(t.getWrapperContainer().offsetLeft+t.getWrapperContainer().scrollWidth-m<=0)return}else m=u+(t-1)*c.pageMoveLength;m<0&&(m=0);let r=this.htmlOptions.writingMode??`horizontal-tb`;if((this.isVerticalWriting(r)?`y`:`x`)==`x`)!i.style.transition&&this.htmlOptions.flipPageStyle==`slide`&&(n==`next`||n==`previous`)&&(i.style.transition=`transform 0.2s ease`),i.style.transition&&i.addEventListener(`transitionend`,this.removeElementTransitionEvent),i.setAttribute(`data-target-transform`,`${m}`),i.style.transform=`translate3d(-`+parseFloat(m.toFixed(10))+`px,0,0)`;else{i.style.transform=`translateX(`+-u+`px)`;let n=e.getContentContainer().ownerDocument.documentElement,r=o.getTransformLength(n,`y`)+(t-1)*c.columnWidth;n.style.transform=`translateY(-`+parseFloat(r.toFixed(10))+`px)`}this.setCurrentPageNumber(e,t)}finally{}}setCurrentPageNumber(e,t){let n=e.getContentContainer()?.ownerDocument?.documentElement;n&&n.setAttribute(c.HtmlSettings.HtmlDocumentCurrentPagePropertyName,t.toFixed(0))}getCurrentPageNumber(e){let t=e.getContentContainer()?.ownerDocument?.documentElement;if(!t)return 1;let n=t.getAttribute(c.HtmlSettings.HtmlDocumentCurrentPagePropertyName);return r.parseNumber(n,1,`parseInt`)}isVerticalWriting(e){return e==`vertical-lr`||e==`vertical-rl`}appendPageStyles(){this.getRendererContainer().classList.add(c.HtmlSettings.TransformPagesClassName)}removePageStyles(){this.getRendererContainer().classList.remove(c.HtmlSettings.TransformPagesClassName);let e=this.getTransformContainer();e&&e.style.removeProperty(`transform`)}async dispose(){this.delayHideLoadingLayerTimer&&=(clearTimeout(this.delayHideLoadingLayerTimer),null),await this.documentsIntersectionObserver.dispose(),await this.documentPreloader.dispose(),await super.dispose(),this.readerContainer&&a.emptyElement(this.readerContainer),this.isInit=!1}};exports.HtmlDocumentsProvider=g;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../../kernal/web/BrowserCapabilities.cjs"),t=require("../../../../kernal/common/text.cjs"),n=require("../../../../kernal/progress/Progress.cjs");require("../../../../kernal/Constants.cjs");const r=require("../../../../kernal/common/number.cjs"),i=require("../../../../kernal/html/finder.cjs"),a=require("../../../../kernal/html/dom.cjs"),o=require("../../../../kernal/web/scheduler.cjs"),s=require("../../../../kernal/html/style.cjs"),c=require("../../../../kernal/html/selection.cjs"),l=require("../../../../kernal/html/geometry.cjs"),u=require("../../../base/renderer/BaseDocumentsProvider.cjs"),d=require("../../HtmlSettings.cjs"),f=require("../layout/resolveLayoutRoute.cjs"),p=require("../location/scrollActivity.cjs"),m=require("../location/remapStoredPageNumber.cjs"),h=require("../document/HtmlDocument.cjs"),g=require("./HtmlDocumentsPreloader.cjs"),_=require("./HtmlDocumentsIntersectionObserver.cjs"),v=require("../location/HtmlElementLocator.cjs"),y=require("../layout/HtmlRendererViewport.cjs"),b=require("../layout/geometry/getLayoutOffsetLeft.cjs");let x=require("perfect-debounce");var S=class extends u.BaseDocumentsProvider{constructor(e,n,r,i){super(e,n),this.readerContainer=r,this.htmlOptions=i,this.isInit=!1,this.isFirstLoad=!0,this.hangTasks=[],this.resetTransformContainer=()=>{let e=this.getTransformContainer();e&&(e.style.removeProperty(`transition`),e.style.transform=`translate3d(0px,0,0)`,e.setAttribute(`data-target-transform`,`0`),e.offsetWidth)},this.removeElementTransitionEvent=async e=>{let t=e.target;for(t.style.removeProperty(`transition`),t.style.removeProperty(`will-change`),t.removeAttribute(d.HtmlSettings.PageMovingAttributeName),t.removeEventListener(`transitionend`,this.removeElementTransitionEvent);this.hangTasks.length>0;)await this.hangTasks.shift()()},this.scrollWrapperIntoView=(e,t)=>{let n=e.getWrapperContainer(),r=f.getLayoutGeometry(this.htmlOptions);if(r.flipMode==`page`){let t=this.rendererViewport.getLayoutMetrics(),i=this.getTransformContainer();if(r.pageAxis==`y`){let e=Math.max(0,n.offsetTop);i.style.transform=r.getPageTranslateCss(e),i.setAttribute(`data-target-transform`,`${e}`)}else{let n=this.getDocumentPageBox(e),a=r.getPageTransformOffset(n,1,t.pageMoveLength);i.style.transform=r.getPageTranslateCss(a),i.setAttribute(`data-target-transform`,`${a}`)}}else(!n.isVisible||t)&&r.alignWrapperToViewport({wrapper:n,scrollElement:this.getScrollElement(),rootDocument:this.owner.getRootContainer()?.ownerDocument});this.setCurrentVisibleDocument(e)},this.setDocumentVisible=(e,t)=>{e.isVisible=t},this.reload=async()=>{let e=this.owner.context.currentLocation;t.isNullOrWhiteSpace(e?.url)||await this.load(e,!0)},this.restoreReadingPosition=async()=>{let e=this.owner.context.currentLocation;if(t.isNullOrWhiteSpace(e?.url))return;let n=this.getDocument(e.url)??this.getFirstVisibleDocument();n&&await this.gotoDoc(n,e,!0)},this.delayRestoreReadingPosition=(0,x.debounce)(this.restoreReadingPosition,100),this.delayReloadTime=300,this.delayReload=(0,x.debounce)(this.reload,this.delayReloadTime),i.documentLanguage=e.context?.metadata?.language,this.logger=this.owner.loggerFactory.getLogger(this.constructor.name),this.elementLocator=new v.HtmlElementLocator(this),this.rendererViewport=new y.HtmlRendererViewport(e,this.readerContainer,this.owner.optionsProvider,i),this.documentsIntersectionObserver=new _.HtmlDocumentsIntersectionObserver(this),this.documentPreloader=new g.HtmlDocumentsPreloader(this.owner.events,this,()=>this.loadingDoc,i)}getTransformContainer(){return this.getRendererContainer().querySelector(`.`+d.HtmlSettings.TransformContainerCssName)}getRendererContainer(){return this.rendererViewport.getRendererContainer()}getScrollElement(){return this.rendererViewport.getScrollElement()}getLoadingDocument(){return this.loadingDoc}getLoadedDocuments(){return this.getDocuments().filter(e=>e.getLoadStatus()==`success`)}getVisibleDocuments(){return this.getDocuments().filter(e=>e.getWrapperContainer()?.isVisible)}getFirstVisibleDocument(e){let t=this.getVisibleDocuments();if(e){let e=t.find(e=>e.getVisibleElements(!0).length>0);if(e)return e}if(t[0])return t[0];let n=this.owner.context.currentLocation?.url;return n&&this.getDocument(n)||this.getDocuments()[0]||null}getLastVisibleDocument(e){let t=this.getVisibleDocuments();if(e){let e=[...t].reverse().find(e=>e.getVisibleElements().length>0);if(e)return e}if(t.length>0)return t[t.length-1];let n=this.owner.context.currentLocation?.url,r=this.getDocuments();return n&&this.getDocument(n)||r[r.length-1]||null}async createDocument(e,t,n){return new h.HtmlDocument(this.owner,this.rendererViewport,this.fileParser,e,t,this.htmlOptions)}async initialize(e){this.rendererViewport.applyCssVariables(),await super.initialize(e);let t=this.getDocuments();for(let e of t)e.getWrapperContainer().classList.add(d.HtmlSettings.FileContentContainerClassName,d.HtmlSettings.FileContentContainerHeightClassName)}async load(e,t){this.htmlOptions.documentLanguage=this.owner.context?.metadata?.language,this.isInit||=(await this.initialize(this.getTransformContainer()),this.documentsIntersectionObserver.register(),!0),e?.storeCurrent&&await this.owner.onBeforeRedirect?.(this),t??=!1;let r=e?.url,i=this.getDocument(r);if(!i){let t=this.getDocuments();i=t[0],(t.length>1||!e)&&(e=new n.FileLocation(i.url,1,`ratio`),e.current=0)}f.getLayoutGeometry(this.htmlOptions).flipMode==`page`?this.appendPageStyles():this.removePageStyles(),this.loadingDoc=i,this.owner.context.redirectingDocUrl=i.url,p.shouldBeginAbsoluteLocate(e?.direction,f.getLayoutGeometry(this.htmlOptions).holdsAbsoluteLocate)&&p.beginAbsoluteLocate();try{this.owner.context.setUserChangedProgress(!t,e?.from),!t&&e?.url&&(this.owner.context.currentLocation=e),await this.gotoDoc(i,e,t),this.isFirstLoad&&!t&&(await this.owner.loading?.hide(),this.isFirstLoad=!1),await this.documentPreloader.preloadDocuments(),this.shouldRealignAfterPreload(e,t)&&await this.gotoDoc(i,e,!0)}finally{setTimeout(()=>{this.loadingDoc=null,this.owner.context.redirectingDocUrl=void 0},166)}}async gotoDoc(e,n,r){if(!n)return;r??=!1;let i=f.getLayoutGeometry(this.htmlOptions).flipMode,a=e instanceof h.HtmlDocument?e:null,s=!!a&&i==`scroll`&&!r&&!n.suppressScroll&&e.getLoadStatus()!=`success`;s&&a&&(a.prepareCoveredLoad(),this.scrollWrapperIntoView(e,!0),await o.yieldToMain());try{if(await e.load(),!e.getContentContainer())return;let a=await this.findTarget(e,n),o=a?.target,s=a?.pageNumber,c=a?.isDocumentStart;if(!o&&!s)return;let u=this.resolveRedirectTarget(o,n);i==`scroll`?n.suppressScroll?this.setDocumentVisible(e.getWrapperContainer(),!0):u&&await this.gotoScroll(e,n,u,c):(r&&u&&!t.isNullOrWhiteSpace(n.tagName)?s=await e.getPageNumber(u):n.unit===`page`&&n.current!=null&&n.current>0?s=m.remapStoredPageNumber(n,await e.getNumberOfPages()):(l.isDomRange(u)||!s&&u)&&(s=await e.getPageNumber(u)),await this.transformPage(e,s,r?void 0:n.direction))}finally{s&&a&&await a.revealCoveredLoad()}}resolveRedirectTarget(e,t){if(!e||!(t?.textOffset>=0))return e;let n=e.textContent??``;if(t.textOffset>=n.length)return e;let r=t.textOffset,a=e.firstElementChild;return a&&i.compareTagName(a.tagName,`ST`)&&a.getBoundingClientRect().width==0&&(r=a.textContent?.length??0),r>=n.length?e:c.createRange(e,e,r,Math.min(r+1,n.length))??e}async gotoScroll(t,n,r,i){if(f.getLayoutGeometry(this.htmlOptions).blockAxis==`x`){await this.gotoScrollX(t,n,r,i);return}let a=l.getLocateElement(r),o=l.getLocateClientRect(r),c=0;n?.ignoreOverlayHeader||(c=this.owner.options.redirectPositionOffset,o.height==0&&(!a||a.clientHeight==0)&&(c+=50)),n.offsetTop&&(c+=n.offsetTop);let u=this.getScrollElement(),d=o.y,p=t.getContentContainer().ownerDocument.defaultView?.frameElement,m=p?.getBoundingClientRect()?.y??0,h=d+m,g=u.scrollTop;if(n.useAbsoluteScrollTop){let e=g+h-c;u.scrollTo(0,e)}else if(i)this.scrollWrapperIntoView(t,!0);else{if(e.BrowserCapabilities.isSafari()){s.scrollElementIntoView(t.getWrapperContainer(),void 0,void 0,this.owner.getRootContainer()?.ownerDocument),g=u.scrollTop;let e=p?.offsetTop??0;if(Math.abs(e+d-g)>5){let e=g+t.getWrapperContainer().getBoundingClientRect().y+d;u.scrollTo(0,e)}m=p?.getBoundingClientRect()?.y??0,h=d+m}else c=h-c-u.getBoundingClientRect().top;c>0?u.scrollHeight-u.scrollTop-u.clientHeight>0?u.scrollBy(0,c):a&&s.scrollElementIntoView(a,void 0,n?.scrollIntoViewIfNeeded,this.owner.getRootContainer()?.ownerDocument):u.scrollBy(0,c),this.setDocumentVisible(t.getWrapperContainer(),!0)}}async gotoScrollX(e,t,n,r){let i=this.getScrollElement();if(r){this.scrollWrapperIntoView(e,!0);return}let a=l.getLocateClientRect(n),o=(e.getContentContainer().ownerDocument.defaultView?.frameElement)?.getBoundingClientRect()?.x??0,s=i.getBoundingClientRect(),c=t.offsetLeft??0,u=a.x+o-c,d=a.right+o-c,p=f.getLayoutGeometry(this.htmlOptions).getScrollLocateDelta({targetStart:u,viewportStart:s.left,targetEnd:d,viewportEnd:s.right});if(t.useAbsoluteScrollTop){i.scrollTo(i.scrollLeft+p,i.scrollTop),this.setDocumentVisible(e.getWrapperContainer(),!0);return}i.scrollBy(p,0),this.setDocumentVisible(e.getWrapperContainer(),!0)}async findTarget(e,t){return this.elementLocator.locateElement(e,t,this.htmlOptions)}async transformPage(e,t,n){if(this.setCurrentVisibleDocument(e),f.getLayoutGeometry(this.htmlOptions).pageAxis==`y`){this.transformVerticalPage(e,t,n);return}this.transformHorizontalPage(e,t,n)}transformHorizontalPage(e,t,n){let r=this.resolveRelativePageTransform(e,t,n,`x`);if(!r){this.syncPageNumberWhenTransformBlocked(e,n);return}this.applyPageTransform(r.transformContainer,r.newTransformLength,n,`x`),this.setCurrentPageNumber(e,t)}transformVerticalPage(e,t,n){let r=this.resolveRelativePageTransform(e,t,n,`y`);if(!r){this.syncPageNumberWhenTransformBlocked(e,n);return}this.applyPageTransform(r.transformContainer,r.newTransformLength,n,`y`),this.setCurrentPageNumber(e,t)}resolveRelativePageTransform(e,t,n,i){let a=this.getTransformContainer();if(!a)return null;let o=s.getTransformLength(a,i),c=a.getAttribute(`data-target-transform`),l=0;l=c?r.parseNumber(c,0,`parseFloat`):o;let u=this.rendererViewport.getLayoutMetrics(),d=Math.max(1,u.pageMoveLength);if(n==`previous`)return{transformContainer:a,newTransformLength:Math.max(0,l-d)};if(n==`next`){let e=l+d;return this.wouldExceedLastContent(e,i,a)?null:{transformContainer:a,newTransformLength:e}}let f=this.getDocumentPageStartOffset(e,i),p=f+(t-1)*u.pageMoveLength,m=i==`y`?e.getWrapperContainer()?.scrollHeight??0:this.getDocumentPageBox(e).contentWidth,h=i==`y`?u.pageHeight:u.pageWidth,g=Number.isFinite(h)&&h>0?h:u.pageMoveLength,_=Math.max(0,f+m-g);return p>_&&(p=_),p<0&&(p=0),{transformContainer:a,newTransformLength:p}}canAdvancePageTransform(e){let t=f.getLayoutGeometry(this.htmlOptions),n=this.getCurrentPageNumber(e)+1;return this.resolveRelativePageTransform(e,n,`next`,t.pageAxis)!=null}wouldExceedLastContent(e,t,n){return this.getLastContentExtent(t,n)-e<=0}getLastContentExtent(e,t){let n=this.getDocuments(),r=n[n.length-1]?.getWrapperContainer();return r?f.getLayoutGeometry(this.htmlOptions).getLastContentExtent(r,t):0}syncPageNumberWhenTransformBlocked(e,t){if(t!=`next`)return;let n=e.getContentContainer()?.ownerDocument?.documentElement,i=r.parseNumber(n?.getAttribute(d.HtmlSettings.HtmlDocumentNumperOfPagesPropertyName),this.getCurrentPageNumber(e),`parseInt`);this.setCurrentPageNumber(e,i)}getDocumentPageStartOffset(e,t){let n=e.getWrapperContainer(),r=this.getDocumentPageBox(e);return f.getLayoutGeometry(this.htmlOptions).getDocumentPageStartOffset(n,r)}getDocumentPageBox(e){let t=e.getWrapperContainer(),n=(e.getContentContainer()?.ownerDocument?.documentElement)?.ownerDocument?.defaultView?.frameElement,r=n?.offsetWidth||(t?.clientWidth??0),i=this.getTransformContainer(),a=n&&i?b.getLayoutOffsetLeft(n,i):t?.offsetLeft??0,o=i?.offsetWidth??0;return{offsetLeft:a,contentWidth:r,startOffset:f.getLayoutGeometry(this.htmlOptions).getPageStartOffset({offsetLeft:a,contentWidth:r,containerWidth:o}),containerWidth:o}}applyPageTransform(e,t,n,r=`x`){let i=f.getLayoutGeometry(this.htmlOptions),a=parseFloat(t.toFixed(10)),o=i.getPageTranslateCss(a),c=i.getSignedTranslateLength(a),l=s.getTransformLength(e,r,!0);e.setAttribute(`data-target-transform`,`${a}`),!(n&&Math.abs(c-l)<=.5)&&(!e.style.transition&&this.htmlOptions.flipPageStyle==`slide`&&(n==`next`||n==`previous`)&&(e.style.transition=`transform 0.2s ease`),e.style.transition&&e.addEventListener(`transitionend`,this.removeElementTransitionEvent),e.style.transform=o)}setCurrentPageNumber(e,t){let n=e.getContentContainer()?.ownerDocument?.documentElement;n&&n.setAttribute(d.HtmlSettings.HtmlDocumentCurrentPagePropertyName,t.toFixed(0))}getCurrentPageNumber(e){let t=e.getContentContainer()?.ownerDocument?.documentElement;if(!t)return 1;let n=t.getAttribute(d.HtmlSettings.HtmlDocumentCurrentPagePropertyName);return r.parseNumber(n,1,`parseInt`)}async syncPageState(e){(e.getContentContainer()?.ownerDocument?.documentElement)?.removeAttribute(d.HtmlSettings.HtmlDocumentNumperOfPagesPropertyName);let t=Math.max(1,await e.getNumberOfPages()),n=f.getLayoutGeometry(this.htmlOptions),i=this.rendererViewport.getLayoutMetrics(),a=Math.max(1,i.pageMoveLength),o=this.getTransformContainer(),s=r.parseNumber(o?.getAttribute(`data-target-transform`),0,`parseFloat`),c=this.getDocumentPageStartOffset(e,n.pageAxis),l=Math.min(t,Math.max(1,Math.round(Math.abs(s-c)/a)+1));return this.setCurrentPageNumber(e,l),{current:l,total:t}}setCurrentVisibleDocument(e){for(let t of this.getDocuments())this.setDocumentVisible(t.getWrapperContainer(),t===e)}shouldRealignAfterPreload(e,t){return t||e?.direction==`next`||e?.direction==`previous`?!1:f.getLayoutGeometry(this.htmlOptions).flipMode==`page`}appendPageStyles(){}clearPageTransform(){let e=this.getTransformContainer();e&&(e.style.removeProperty(`transition`),e.style.removeProperty(`transform`),e.removeAttribute(`data-target-transform`),e.offsetWidth)}removePageStyles(){this.getRendererContainer().classList.remove(d.HtmlSettings.TransformPagesClassName),this.clearPageTransform()}async dispose(){await this.documentsIntersectionObserver.dispose(),await this.documentPreloader.dispose(),await super.dispose(),this.readerContainer&&a.emptyElement(this.readerContainer),this.isInit=!1}};exports.HtmlDocumentsProvider=S;

package/dist/mediaTypes/html/renderer/documents/HtmlDocumentsProvider.d.ts

@@ -10,11 +10,10 @@ import { DebouncedReturn } from 'perfect-debounce';
 
 export declare class HtmlDocumentsProvider extends BaseDocumentsProvider<IHtmlDocument> implements IHtmlDocumentsProvider {
     protected readonly readerContainer: HTMLElement;
-    protected readonly htmlOptions: HtmlOptions;
+    readonly htmlOptions: HtmlOptions;
     protected logger: ILogger;
     private isInit;
     private isFirstLoad;
-    private delayHideLoadingLayerTimer;
     private loadingDoc;
     private readonly documentsIntersectionObserver;
     private readonly documentPreloader;
@@ -26,24 +25,48 @@ export declare class HtmlDocumentsProvider extends BaseDocumentsProvider<IHtmlDo
     getRendererContainer(): HTMLElement;
     getScrollElement(): HTMLElement;
     getLoadingDocument(): IHtmlDocument;
+    getLoadedDocuments(): IHtmlDocument[];
+    getVisibleDocuments(): IHtmlDocument[];
+    getFirstVisibleDocument(containVisibleElements?: boolean): IHtmlDocument;
+    getLastVisibleDocument(containVisibleElements?: boolean): IHtmlDocument;
     createDocument(documentContainer: HTMLElement, spineFile: SpineFile, fileIndex: number): Promise<IHtmlDocument>;
     protected initialize(documentsWrapper: HTMLElement): Promise<void>;
     load(location?: FileLocation, isReload?: boolean): Promise<void>;
     private gotoDoc;
+    private resolveRedirectTarget;
     private gotoScroll;
+    private gotoScrollX;
     private findTarget;
     private transformPage;
+    private transformHorizontalPage;
+    private transformVerticalPage;
+    private resolveRelativePageTransform;
+    canAdvancePageTransform(doc: IHtmlDocument): boolean;
+    private wouldExceedLastContent;
+    private getLastContentExtent;
+    private syncPageNumberWhenTransformBlocked;
+    private getDocumentPageStartOffset;
+    private getDocumentPageBox;
+    private applyPageTransform;
     private resetTransformContainer;
     private removeElementTransitionEvent;
     private setCurrentPageNumber;
     private scrollWrapperIntoView;
     getCurrentPageNumber(doc: IHtmlDocument): number;
+    syncPageState(doc: IHtmlDocument): Promise<{
+        current: number;
+        total: number;
+    }>;
     private setDocumentVisible;
-    private isVerticalWriting;
+    private setCurrentVisibleDocument;
     reload: () => Promise<void>;
+    private shouldRealignAfterPreload;
+    restoreReadingPosition: () => Promise<void>;
+    delayRestoreReadingPosition: DebouncedReturn<[], void>;
     protected readonly delayReloadTime = 300;
     protected delayReload: DebouncedReturn<[], void>;
     private appendPageStyles;
+    private clearPageTransform;
     private removePageStyles;
     dispose(): Promise<void>;
 }