react-native-readium 2.0.0 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/lib/web/hooks/useLocationObserver.js +3 -1
  2. package/lib/web/hooks/useReaderRef.js +37 -3
  3. package/package.json +1 -1
  4. package/web/hooks/useLocationObserver.ts +3 -1
  5. package/web/hooks/useReaderRef.ts +49 -2
package/lib/web/hooks/useLocationObserver.js CHANGED
@@ -7,7 +7,9 @@ export const useLocationObserver = (reader, location) => {
7
7
  reader.goTo(location);
8
8
  }
9
9
  }, [
10
- location,
10
+ location?.href,
11
+ //@ts-ignore
12
+ location?.locations,
11
13
  !!reader,
12
14
  ]);
13
15
  };
package/lib/web/hooks/useReaderRef.js CHANGED
@@ -1,6 +1,24 @@
1
- import { useEffect, useRef } from 'react';
1
+ import { useCallback, useEffect, useRef } from 'react';
2
2
  export const useReaderRef = ({ file, onLocationChange, onTableOfContents, }) => {
3
3
  const readerRef = useRef(null);
4
+ const readingOrder = useRef([]);
5
+ const onLocationChangeWithTotalProgression = useCallback((newLocation) => {
6
+ if (!onLocationChange ||
7
+ !readingOrder.current ||
8
+ !newLocation.locations) {
9
+ return;
10
+ }
11
+ if (!newLocation.locations.totalProgression) {
12
+ const newLocationIndex = readingOrder.current.findIndex((entry) => entry.href === newLocation.href);
13
+ const readingOrderCount = readingOrder.current.length;
14
+ const chapterTotalProgression = readingOrder.current[newLocationIndex].locations?.totalProgression ||
15
+ 0;
16
+ const intraChapterTotalProgression = newLocation.locations.progression / readingOrderCount;
17
+ newLocation.locations.totalProgression =
18
+ chapterTotalProgression + intraChapterTotalProgression;
19
+ }
20
+ onLocationChange(newLocation);
21
+ }, [onLocationChange]);
4
22
  useEffect(() => {
5
23
  async function run() {
6
24
  const D2Reader = await import('@d-i-t-a/reader');
@@ -10,8 +28,7 @@ export const useReaderRef = ({ file, onLocationChange, onTableOfContents, }) =>
10
28
  userSettings: { verticalScroll: false },
11
29
  api: {
12
30
  updateCurrentLocation: async (location) => {
13
- if (onLocationChange)
14
- onLocationChange(location);
31
+ onLocationChangeWithTotalProgression(location);
15
32
  return location;
16
33
  },
17
34
  },
@@ -20,6 +37,23 @@ export const useReaderRef = ({ file, onLocationChange, onTableOfContents, }) =>
20
37
  if (onTableOfContents) {
21
38
  onTableOfContents(ref.tableOfContents);
22
39
  }
40
+ // This way of estimating the totalProgression treats all reading order
41
+ // entries as equal in length.
42
+ // It is based on the implementation in the Readium Go toolkit
43
+ // https://github.com/readium/go-toolkit/blob/31c6a65b588f825ffb6b4f2445337ffdc53af685/pkg/pub/service_positions.go#L66
44
+ const oldReadingOrder = ref.readingOrder;
45
+ const readingOrderCount = oldReadingOrder.length;
46
+ readingOrder.current = oldReadingOrder.map((item, index) => {
47
+ const totalProgression = index / readingOrderCount;
48
+ return {
49
+ ...item,
50
+ locations: {
51
+ ...item.locations,
52
+ progression: 0,
53
+ totalProgression: totalProgression,
54
+ },
55
+ };
56
+ });
23
57
  readerRef.current = ref;
24
58
  }
25
59
  run();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-readium",
3
- "version": "2.0.0",
3
+ "version": "2.0.1",
4
4
  "description": "A react-native wrapper for https://readium.org/",
5
5
  "main": "lib/src/index",
6
6
  "types": "lib/src/index.d.ts",
package/web/hooks/useLocationObserver.ts CHANGED
@@ -13,7 +13,9 @@ export const useLocationObserver = (
13
13
  reader.goTo(location as R2Locator);
14
14
  }
15
15
  }, [
16
- location,
16
+ location?.href,
17
+ //@ts-ignore
18
+ location?.locations,
17
19
  !!reader,
18
20
  ]);
19
21
  };
package/web/hooks/useReaderRef.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { useEffect, useRef } from 'react';
1
+ import { useCallback, useEffect, useRef, useState } from 'react';
2
2
 
3
3
  import type { ReadiumProps } from '../../src/components/ReadiumView';
4
4
  import type { Locator } from '../../src/interfaces';
@@ -9,6 +9,34 @@ export const useReaderRef = ({
9
9
  onTableOfContents,
10
10
  }: Pick<ReadiumProps, 'file' | 'onLocationChange' | 'onTableOfContents' >) => {
11
11
  const readerRef = useRef<D2Reader | null>(null);
12
+ const readingOrder = useRef<Locator[]>([]);
13
+
14
+ const onLocationChangeWithTotalProgression = useCallback(
15
+ (newLocation: Locator) => {
16
+ if (
17
+ !onLocationChange ||
18
+ !readingOrder.current ||
19
+ !newLocation.locations
20
+ ) {
21
+ return;
22
+ }
23
+ if (!newLocation.locations.totalProgression) {
24
+ const newLocationIndex = readingOrder.current.findIndex(
25
+ (entry) => entry.href === newLocation.href
26
+ );
27
+ const readingOrderCount = readingOrder.current.length;
28
+ const chapterTotalProgression =
29
+ readingOrder.current[newLocationIndex].locations?.totalProgression ||
30
+ 0;
31
+ const intraChapterTotalProgression =
32
+ newLocation.locations.progression / readingOrderCount;
33
+ newLocation.locations.totalProgression =
34
+ chapterTotalProgression + intraChapterTotalProgression;
35
+ }
36
+ onLocationChange(newLocation);
37
+ },
38
+ [onLocationChange]
39
+ );
12
40
 
13
41
  useEffect(() => {
14
42
  async function run() {
@@ -19,7 +47,7 @@ export const useReaderRef = ({
19
47
  userSettings: { verticalScroll: false },
20
48
  api: {
21
49
  updateCurrentLocation: async (location: Locator) => {
22
- if (onLocationChange) onLocationChange(location);
50
+ onLocationChangeWithTotalProgression(location);
23
51
  return location;
24
52
  },
25
53
  },
@@ -29,6 +57,25 @@ export const useReaderRef = ({
29
57
  if (onTableOfContents) {
30
58
  onTableOfContents(ref.tableOfContents);
31
59
  }
60
+
61
+ // This way of estimating the totalProgression treats all reading order
62
+ // entries as equal in length.
63
+ // It is based on the implementation in the Readium Go toolkit
64
+ // https://github.com/readium/go-toolkit/blob/31c6a65b588f825ffb6b4f2445337ffdc53af685/pkg/pub/service_positions.go#L66
65
+ const oldReadingOrder: Locator[] = ref.readingOrder;
66
+ const readingOrderCount = oldReadingOrder.length;
67
+ readingOrder.current = oldReadingOrder.map((item, index) => {
68
+ const totalProgression = index / readingOrderCount;
69
+ return {
70
+ ...item,
71
+ locations: {
72
+ ...item.locations,
73
+ progression: 0,
74
+ totalProgression: totalProgression,
75
+ },
76
+ };
77
+ });
78
+
32
79
  readerRef.current = ref;
33
80
  }
34
81
  run();