@prose-reader/core 1.68.0 → 1.70.0

package/dist/index.umd.cjs

@@ -705,7 +705,7 @@
       spineItemPosition
     );
     if (!isNewNavigationInCurrentItem) {
-      return navigationResolver.wrapPositionWithSafeEdge(
+      return navigationResolver.getAdjustedPositionWithSafeEdge(
         pageTurnDirection === `horizontal` ? { x: position.x + context.getPageSize().width, y: 0 } : { y: position.y + context.getPageSize().height, x: 0 }
       );
     } else {
@@ -739,7 +739,7 @@
     if (context.state.isUsingSpreadMode) {
       if ((spineItem == null ? void 0 : spineItem.isUsingVerticalWriting()) && position.x !== navigation.x) {
         return navigationResolver.getAdjustedPositionForSpread(
-          navigationResolver.wrapPositionWithSafeEdge(
+          navigationResolver.getAdjustedPositionWithSafeEdge(
             context.isRTL() ? {
               ...navigation,
               x: navigation.x - context.getPageSize().width
@@ -818,7 +818,7 @@
       spineItemPosition
     );
     if (!isNewNavigationInCurrentItem) {
-      return navigationResolver.wrapPositionWithSafeEdge(
+      return navigationResolver.getAdjustedPositionWithSafeEdge(
         pageTurnDirection === `horizontal` ? { x: position.x - context.getPageSize().width, y: 0 } : { y: position.y - context.getPageSize().height, x: 0 }
       );
     } else {
@@ -852,7 +852,7 @@
     if (context.state.isUsingSpreadMode) {
       if ((spineItem == null ? void 0 : spineItem.isUsingVerticalWriting()) && position.x !== navigation.x) {
         return navigationResolver.getAdjustedPositionForSpread(
-          navigationResolver.wrapPositionWithSafeEdge(
+          navigationResolver.getAdjustedPositionWithSafeEdge(
             context.isRTL() ? { ...navigation, x: navigation.x + context.getPageSize().width } : {
               ...navigation,
               x: navigation.x - context.getPageSize().width
@@ -2250,12 +2250,12 @@
     const correctedX = isOffsetNotAtEdge ? x - pageSizeWidth : x;
     return { x: correctedX, y };
   };
-  const wrapPositionWithSafeEdge = ({
+  const getAdjustedPositionWithSafeEdge = ({
     position,
     isRTL,
-    pageSizeWidth,
     pageSizeHeight,
-    spineItemsManager
+    spineItemsManager,
+    visibleAreaRectWidth
   }) => {
     const lastSpineItem = spineItemsManager.get(spineItemsManager.getLength() - 1);
     const distanceOfLastSpineItem = spineItemsManager.getAbsolutePositionOf(
@@ -2269,7 +2269,7 @@
         y
       };
     }
-    const maximumXOffset = distanceOfLastSpineItem.right - pageSizeWidth;
+    const maximumXOffset = distanceOfLastSpineItem.right - visibleAreaRectWidth;
     return {
       x: Math.min(Math.max(0, position.x), maximumXOffset),
       y
@@ -3400,14 +3400,14 @@
       const triggerPercentage = 0.5;
       const triggerXPosition = pageTurnDirection === `horizontal` ? viewportPosition.x + context.state.visibleAreaRect.width * triggerPercentage : 0;
       const triggerYPosition = pageTurnDirection === `horizontal` ? 0 : viewportPosition.y + context.state.visibleAreaRect.height * triggerPercentage;
-      const midScreenPositionSafePosition = wrapPositionWithSafeEdge({
+      const midScreenPositionSafePosition = getAdjustedPositionWithSafeEdge({
         position: {
           x: triggerXPosition,
           y: triggerYPosition
         },
         isRTL: context.isRTL(),
         pageSizeHeight: context.getPageSize().height,
-        pageSizeWidth: context.getPageSize().width,
+        visibleAreaRectWidth: context.state.visibleAreaRect.width,
         spineItemsManager
       });
       return getNavigationForPosition({
@@ -3456,11 +3456,11 @@
         spineLocator: locator
       }),
       getMostPredominantNavigationForPosition,
-      wrapPositionWithSafeEdge: (position) => wrapPositionWithSafeEdge({
+      getAdjustedPositionWithSafeEdge: (position) => getAdjustedPositionWithSafeEdge({
         position,
         isRTL: context.isRTL(),
         pageSizeHeight: context.getPageSize().height,
-        pageSizeWidth: context.getPageSize().width,
+        visibleAreaRectWidth: context.state.visibleAreaRect.width,
         spineItemsManager
       }),
       isNavigationGoingForwardFrom,
@@ -4149,7 +4149,7 @@
           return {
             navigation: {
               ...navigation,
-              position: navigationResolver.wrapPositionWithSafeEdge(
+              position: navigationResolver.getAdjustedPositionWithSafeEdge(
                 navigation.position
               )
             },
@@ -5537,73 +5537,88 @@
     const loadSubject = new rxjs.Subject();
     const unloadSubject = new rxjs.Subject();
     const frameElementSubject = new rxjs.BehaviorSubject(void 0);
-    const load$ = loadSubject.asObservable();
-    const unload$ = unloadSubject.asObservable();
-    const stateIdle$ = stateSubject.pipe(operators.filter((state) => state === "idle"));
-    const stateIsReady$ = stateSubject.pipe(
-      operators.map((state) => state === "ready"),
-      operators.distinctUntilChanged()
-    );
-    const unloaded$ = unload$.pipe(
+    const unloadFrame$ = unloadSubject.pipe(
       operators.withLatestFrom(stateSubject),
       operators.filter(([, state]) => state !== "unloading" && state !== "idle"),
-      operators.exhaustMap(() => {
-        stateSubject.next("unloading");
-        return unloadFrame({
-          hookManager,
-          item,
-          frameElement: frameElementSubject.getValue(),
-          context
-        }).pipe(
-          operators.tap(() => {
-            frameElementSubject.next(void 0);
-            stateSubject.next("idle");
-          })
-        );
-      }),
-      operators.share()
-    );
-    const loaded$ = load$.pipe(
       operators.exhaustMap(
-        () => stateIdle$.pipe(
+        () => context.bridgeEvent.viewportFree$.pipe(
           operators.first(),
-          operators.tap(() => {
-            stateSubject.next("loading");
-          }),
-          waitForSwitch(context.bridgeEvent.viewportFree$),
           operators.switchMap(
-            () => loadFrame({
-              element: parent,
+            () => unloadFrame({
               hookManager,
               item,
-              onFrameElement: (element) => {
-                frameElementSubject.next(element);
-              },
-              settings,
+              frameElement: frameElementSubject.getValue(),
               context
             })
           ),
           operators.tap(() => {
-            stateSubject.next("loaded");
+            frameElementSubject.next(void 0);
           }),
-          operators.takeUntil(unload$)
+          operators.ignoreElements(),
+          operators.startWith("loading"),
+          operators.endWith("success"),
+          operators.defaultIfEmpty("idle")
         )
       ),
+      operators.startWith("idle"),
+      operators.distinctUntilChanged(),
+      operators.share()
+    );
+    const unloaded$ = unloadFrame$.pipe(operators.filter((state) => state === "success"));
+    const unloading$ = unloadFrame$.pipe(operators.filter((state) => state === "loading"));
+    const loadFrame$ = loadSubject.pipe(
+      operators.exhaustMap(() => {
+        const preventFurtherLoad$ = rxjs.NEVER;
+        return rxjs.merge(
+          preventFurtherLoad$,
+          context.bridgeEvent.viewportFree$.pipe(
+            operators.first(),
+            operators.switchMap(
+              () => loadFrame({
+                element: parent,
+                hookManager,
+                item,
+                onFrameElement: (element) => {
+                  frameElementSubject.next(element);
+                },
+                settings,
+                context
+              })
+            ),
+            operators.map((frame) => ({ state: "success", frame })),
+            operators.startWith({ state: "loading" }),
+            operators.defaultIfEmpty({ state: "idle" })
+          )
+        ).pipe(operators.takeUntil(unloaded$));
+      }),
+      operators.startWith({ state: "idle" }),
       operators.share()
     );
-    const ready$ = loaded$.pipe(
+    const loading$ = loadFrame$.pipe(operators.filter(({ state }) => state === "loading"));
+    const loaded$ = loadFrame$.pipe(
+      operators.filter((state) => state.state === "success"),
+      operators.map(({ frame }) => frame)
+    );
+    const frameIsReady$ = loaded$.pipe(
       operators.switchMap(
-        (frame) => rxjs.of(frame).pipe(
-          waitForFrameReady,
-          operators.tap(() => {
-            stateSubject.next("ready");
-          }),
-          operators.takeUntil(unload$)
-        )
+        (frame) => rxjs.of(frame).pipe(waitForFrameReady, operators.takeUntil(unloadSubject))
       ),
       operators.share()
     );
-    rxjs.merge(unloaded$, loaded$, ready$).pipe(operators.takeUntil(destroySubject$)).subscribe();
+    const ready$ = frameIsReady$;
+    const state$ = rxjs.merge(
+      unloaded$.pipe(operators.map(() => "idle")),
+      unloading$.pipe(operators.map(() => "unloading")),
+      loaded$.pipe(operators.map(() => "loaded")),
+      loading$.pipe(operators.map(() => "loading")),
+      ready$.pipe(operators.map(() => "ready"))
+    ).pipe(
+      operators.startWith("idle"),
+      operators.tap((state) => stateSubject.next(state)),
+      operators.shareReplay(1)
+    );
+    const isReady$ = state$.pipe(operators.map((state) => state === "ready"));
+    state$.pipe(operators.takeUntil(destroySubject$)).subscribe();
     return {
       load: () => loadSubject.next(),
       unload: () => unloadSubject.next(),
@@ -5614,6 +5629,7 @@
         frameElementSubject.complete();
         destroySubject$.next();
         destroySubject$.complete();
+        stateSubject.complete();
       },
       get state() {
         return stateSubject.getValue();
@@ -5621,7 +5637,7 @@
       get element() {
         return frameElementSubject.getValue();
       },
-      isReady$: stateIsReady$,
+      isReady$,
       ready$,
       loaded$,
       unloaded$,