@prose-reader/core 1.68.0 → 1.70.0

package/dist/createReaderWithEnhancer.d.ts

@@ -63,7 +63,7 @@ export declare const createReaderWithEnhancers: (options: Partial<import('./sett
             getNavigationForSpineIndexOrId: (indexOrId: number | string | import('./spineItem/createSpineItem').SpineItem) => import('./navigation/viewport/ViewportNavigator').ViewportPosition;
             getNavigationForPosition: (viewportPosition: import('./navigation/viewport/ViewportNavigator').ViewportPosition) => import('./navigation/viewport/ViewportNavigator').ViewportPosition;
             getMostPredominantNavigationForPosition: (viewportPosition: import('./navigation/viewport/ViewportNavigator').ViewportPosition) => import('./navigation/viewport/ViewportNavigator').ViewportPosition;
-            wrapPositionWithSafeEdge: (position: import('./navigation/viewport/ViewportNavigator').ViewportPosition) => {
+            getAdjustedPositionWithSafeEdge: (position: import('./navigation/viewport/ViewportNavigator').ViewportPosition) => {
                 x: number;
                 y: number;
             };

package/dist/index.js

@@ -1,5 +1,5 @@
 import { takeUntil, Subject, combineLatest, map as map$1, switchMap, merge, EMPTY, fromEvent, withLatestFrom, NEVER, Observable, of, scheduled, animationFrameScheduler, distinctUntilChanged as distinctUntilChanged$1, startWith as startWith$1, debounceTime as debounceTime$1, BehaviorSubject, combineLatestWith, tap as tap$1, shareReplay as shareReplay$1, ReplaySubject, filter as filter$1, share, mergeMap, delay, identity, timer, skip as skip$1, exhaustMap, take as take$1, finalize, first as first$1, from, catchError, forkJoin } from "rxjs";
-import { startWith, map, shareReplay, tap, pairwise, switchMap as switchMap$1, take, distinctUntilChanged, takeUntil as takeUntil$1, first, filter, debounceTime, skip, withLatestFrom as withLatestFrom$1, exhaustMap as exhaustMap$1, share as share$1, mergeMap as mergeMap$1, catchError as catchError$1 } from "rxjs/operators";
+import { startWith, map, shareReplay, tap, pairwise, switchMap as switchMap$1, take, distinctUntilChanged, takeUntil as takeUntil$1, first, filter, debounceTime, skip, withLatestFrom as withLatestFrom$1, exhaustMap as exhaustMap$1, ignoreElements, endWith, defaultIfEmpty, share as share$1, mergeMap as mergeMap$1, catchError as catchError$1 } from "rxjs/operators";
 import { parseContentType, detectMimeTypeFromName } from "@prose-reader/shared";
 const chromeEnhancer = (next) => (options) => {
   const reader = next(options);
@@ -704,7 +704,7 @@ const getNavigationForRightSinglePage = ({
     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 {
@@ -738,7 +738,7 @@ const getNavigationForRightPage = ({
   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
@@ -817,7 +817,7 @@ const getNavigationForLeftSinglePage = ({
     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 {
@@ -851,7 +851,7 @@ const getNavigationForLeftPage = ({
   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
@@ -2249,12 +2249,12 @@ const getAdjustedPositionForSpread = ({
   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(
@@ -2268,7 +2268,7 @@ const wrapPositionWithSafeEdge = ({
       y
     };
   }
-  const maximumXOffset = distanceOfLastSpineItem.right - pageSizeWidth;
+  const maximumXOffset = distanceOfLastSpineItem.right - visibleAreaRectWidth;
   return {
     x: Math.min(Math.max(0, position.x), maximumXOffset),
     y
@@ -3399,14 +3399,14 @@ const createNavigationResolver = ({
     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({
@@ -3455,11 +3455,11 @@ const createNavigationResolver = ({
       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,
@@ -4148,7 +4148,7 @@ const withFallbackPosition = ({
         return {
           navigation: {
             ...navigation,
-            position: navigationResolver.wrapPositionWithSafeEdge(
+            position: navigationResolver.getAdjustedPositionWithSafeEdge(
               navigation.position
             )
           },
@@ -5536,73 +5536,88 @@ const createLoader = ({
   const loadSubject = new Subject();
   const unloadSubject = new Subject();
   const frameElementSubject = new BehaviorSubject(void 0);
-  const load$ = loadSubject.asObservable();
-  const unload$ = unloadSubject.asObservable();
-  const stateIdle$ = stateSubject.pipe(filter((state) => state === "idle"));
-  const stateIsReady$ = stateSubject.pipe(
-    map((state) => state === "ready"),
-    distinctUntilChanged()
-  );
-  const unloaded$ = unload$.pipe(
+  const unloadFrame$ = unloadSubject.pipe(
     withLatestFrom$1(stateSubject),
     filter(([, state]) => state !== "unloading" && state !== "idle"),
-    exhaustMap$1(() => {
-      stateSubject.next("unloading");
-      return unloadFrame({
-        hookManager,
-        item,
-        frameElement: frameElementSubject.getValue(),
-        context
-      }).pipe(
-        tap(() => {
-          frameElementSubject.next(void 0);
-          stateSubject.next("idle");
-        })
-      );
-    }),
-    share$1()
-  );
-  const loaded$ = load$.pipe(
     exhaustMap$1(
-      () => stateIdle$.pipe(
+      () => context.bridgeEvent.viewportFree$.pipe(
         first(),
-        tap(() => {
-          stateSubject.next("loading");
-        }),
-        waitForSwitch(context.bridgeEvent.viewportFree$),
         switchMap$1(
-          () => loadFrame({
-            element: parent,
+          () => unloadFrame({
             hookManager,
             item,
-            onFrameElement: (element) => {
-              frameElementSubject.next(element);
-            },
-            settings,
+            frameElement: frameElementSubject.getValue(),
             context
           })
         ),
         tap(() => {
-          stateSubject.next("loaded");
+          frameElementSubject.next(void 0);
         }),
-        takeUntil$1(unload$)
+        ignoreElements(),
+        startWith("loading"),
+        endWith("success"),
+        defaultIfEmpty("idle")
       )
     ),
+    startWith("idle"),
+    distinctUntilChanged(),
+    share$1()
+  );
+  const unloaded$ = unloadFrame$.pipe(filter((state) => state === "success"));
+  const unloading$ = unloadFrame$.pipe(filter((state) => state === "loading"));
+  const loadFrame$ = loadSubject.pipe(
+    exhaustMap$1(() => {
+      const preventFurtherLoad$ = NEVER;
+      return merge(
+        preventFurtherLoad$,
+        context.bridgeEvent.viewportFree$.pipe(
+          first(),
+          switchMap$1(
+            () => loadFrame({
+              element: parent,
+              hookManager,
+              item,
+              onFrameElement: (element) => {
+                frameElementSubject.next(element);
+              },
+              settings,
+              context
+            })
+          ),
+          map((frame) => ({ state: "success", frame })),
+          startWith({ state: "loading" }),
+          defaultIfEmpty({ state: "idle" })
+        )
+      ).pipe(takeUntil$1(unloaded$));
+    }),
+    startWith({ state: "idle" }),
     share$1()
   );
-  const ready$ = loaded$.pipe(
+  const loading$ = loadFrame$.pipe(filter(({ state }) => state === "loading"));
+  const loaded$ = loadFrame$.pipe(
+    filter((state) => state.state === "success"),
+    map(({ frame }) => frame)
+  );
+  const frameIsReady$ = loaded$.pipe(
     switchMap$1(
-      (frame) => of(frame).pipe(
-        waitForFrameReady,
-        tap(() => {
-          stateSubject.next("ready");
-        }),
-        takeUntil$1(unload$)
-      )
+      (frame) => of(frame).pipe(waitForFrameReady, takeUntil$1(unloadSubject))
     ),
     share$1()
   );
-  merge(unloaded$, loaded$, ready$).pipe(takeUntil$1(destroySubject$)).subscribe();
+  const ready$ = frameIsReady$;
+  const state$ = merge(
+    unloaded$.pipe(map(() => "idle")),
+    unloading$.pipe(map(() => "unloading")),
+    loaded$.pipe(map(() => "loaded")),
+    loading$.pipe(map(() => "loading")),
+    ready$.pipe(map(() => "ready"))
+  ).pipe(
+    startWith("idle"),
+    tap((state) => stateSubject.next(state)),
+    shareReplay(1)
+  );
+  const isReady$ = state$.pipe(map((state) => state === "ready"));
+  state$.pipe(takeUntil$1(destroySubject$)).subscribe();
   return {
     load: () => loadSubject.next(),
     unload: () => unloadSubject.next(),
@@ -5613,6 +5628,7 @@ const createLoader = ({
       frameElementSubject.complete();
       destroySubject$.next();
       destroySubject$.complete();
+      stateSubject.complete();
     },
     get state() {
       return stateSubject.getValue();
@@ -5620,7 +5636,7 @@ const createLoader = ({
     get element() {
       return frameElementSubject.getValue();
     },
-    isReady$: stateIsReady$,
+    isReady$,
     ready$,
     loaded$,
     unloaded$,