@fountain-ui/lab 2.0.0-beta.44 → 2.0.0-beta.46
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.
- package/build/commonjs/ComicViewer/ComicViewer.js +45 -8
- package/build/commonjs/ComicViewer/ComicViewer.js.map +1 -1
- package/build/commonjs/ComicViewer/ComicViewerProps.js.map +1 -1
- package/build/commonjs/ComicViewer/FastScroll.js +162 -0
- package/build/commonjs/ComicViewer/FastScroll.js.map +1 -0
- package/build/commonjs/ComicViewer/FastScrollProps.js +6 -0
- package/build/commonjs/ComicViewer/FastScrollProps.js.map +1 -0
- package/build/commonjs/ComicViewer/ViewerItem.js +4 -2
- package/build/commonjs/ComicViewer/ViewerItem.js.map +1 -1
- package/build/commonjs/ComicViewer/index.js.map +1 -1
- package/build/commonjs/ComicViewer/util.js +27 -0
- package/build/commonjs/ComicViewer/util.js.map +1 -0
- package/build/module/ComicViewer/ComicViewer.js +44 -8
- package/build/module/ComicViewer/ComicViewer.js.map +1 -1
- package/build/module/ComicViewer/ComicViewerProps.js.map +1 -1
- package/build/module/ComicViewer/FastScroll.js +141 -0
- package/build/module/ComicViewer/FastScroll.js.map +1 -0
- package/build/module/ComicViewer/FastScrollProps.js +2 -0
- package/build/module/ComicViewer/FastScrollProps.js.map +1 -0
- package/build/module/ComicViewer/ViewerItem.js +4 -2
- package/build/module/ComicViewer/ViewerItem.js.map +1 -1
- package/build/module/ComicViewer/index.js.map +1 -1
- package/build/module/ComicViewer/util.js +15 -0
- package/build/module/ComicViewer/util.js.map +1 -0
- package/build/typescript/AnimatedY/AnimatedY.d.ts +1 -0
- package/build/typescript/BottomSheet/BottomSheetNative.d.ts +1 -0
- package/build/typescript/BottomSheet/BottomSheetWeb.d.ts +1 -0
- package/build/typescript/BottomSheet/TransparentBackdrop.d.ts +1 -0
- package/build/typescript/ComicViewer/ComicViewer.d.ts +1 -0
- package/build/typescript/ComicViewer/ComicViewerProps.d.ts +10 -0
- package/build/typescript/ComicViewer/FastScroll.d.ts +4 -0
- package/build/typescript/ComicViewer/FastScrollProps.d.ts +70 -0
- package/build/typescript/ComicViewer/ReloadButton.d.ts +1 -0
- package/build/typescript/ComicViewer/ViewerItem.d.ts +5 -0
- package/build/typescript/ComicViewer/index.d.ts +1 -0
- package/build/typescript/ComicViewer/util.d.ts +2 -0
- package/build/typescript/DateTimePicker/DateTimePicker.d.ts +1 -0
- package/build/typescript/DateTimePicker/YearPicker.d.ts +1 -0
- package/build/typescript/FlipCard/FlipCard.d.ts +1 -0
- package/build/typescript/StatusBarProvider/StatusBarProvider.d.ts +1 -0
- package/build/typescript/ViewabilityTrackerView/ViewabilityTrackerView.d.ts +1 -0
- package/package.json +3 -3
- package/src/ComicViewer/ComicViewer.tsx +60 -19
- package/src/ComicViewer/ComicViewerProps.ts +12 -0
- package/src/ComicViewer/FastScroll.tsx +158 -0
- package/src/ComicViewer/FastScrollProps.ts +83 -0
- package/src/ComicViewer/ViewerItem.tsx +8 -1
- package/src/ComicViewer/index.ts +6 -0
- package/src/ComicViewer/util.ts +15 -0
- package/yarn-error.log +103 -0
|
@@ -15,6 +15,8 @@ var _core = require("@fountain-ui/core");
|
|
|
15
15
|
|
|
16
16
|
var _ViewerItem = _interopRequireDefault(require("./ViewerItem"));
|
|
17
17
|
|
|
18
|
+
var _FastScroll = _interopRequireDefault(require("./FastScroll"));
|
|
19
|
+
|
|
18
20
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
21
|
|
|
20
22
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
@@ -46,6 +48,7 @@ const mapImageStateToItemState = (index, imageState, autoHandleErrorCount) => {
|
|
|
46
48
|
};
|
|
47
49
|
};
|
|
48
50
|
|
|
51
|
+
const mapIndexed = R.addIndex(R.map);
|
|
49
52
|
const MAXIMUM_WIDTH = 720;
|
|
50
53
|
const NUMBER_OF_ADJACENT_ITEM = 5;
|
|
51
54
|
|
|
@@ -53,6 +56,7 @@ function ComicViewer(props) {
|
|
|
53
56
|
const {
|
|
54
57
|
debounceMillis = 100,
|
|
55
58
|
autoHandleErrorCount = 3,
|
|
59
|
+
fastScrollOptions,
|
|
56
60
|
getUrlByIndex,
|
|
57
61
|
initialNumToRender = 1,
|
|
58
62
|
initialScrollPercentage = 0,
|
|
@@ -60,10 +64,13 @@ function ComicViewer(props) {
|
|
|
60
64
|
intrinsicDimensions,
|
|
61
65
|
maxContentWidth = MAXIMUM_WIDTH,
|
|
62
66
|
onItemPress,
|
|
67
|
+
onScroll,
|
|
63
68
|
viewportWidth,
|
|
69
|
+
invisiblePaddingTop = 0,
|
|
64
70
|
windowSize = 3,
|
|
65
71
|
...otherProps
|
|
66
72
|
} = props;
|
|
73
|
+
const fastScrollRef = fastScrollOptions === null || fastScrollOptions === void 0 ? void 0 : fastScrollOptions.ref;
|
|
67
74
|
const flatListRef = (0, _react.useRef)(null);
|
|
68
75
|
const maybeLoadableItemsIndexRange = (0, _react.useRef)([-1, 0]);
|
|
69
76
|
const actualImageWidth = Math.min(viewportWidth, maxContentWidth);
|
|
@@ -78,9 +85,9 @@ function ComicViewer(props) {
|
|
|
78
85
|
return mapImageStatesToItemStates(imageStatesRef.current);
|
|
79
86
|
});
|
|
80
87
|
const renderedDimensions = (0, _react.useMemo)(() => {
|
|
81
|
-
return
|
|
88
|
+
return mapIndexed((intrinsicDimension, index) => ({
|
|
82
89
|
width: actualImageWidth,
|
|
83
|
-
height: intrinsicDimension.height * actualImageWidth / intrinsicDimension.width
|
|
90
|
+
height: intrinsicDimension.height * actualImageWidth / intrinsicDimension.width + (index === 0 ? invisiblePaddingTop : 0)
|
|
84
91
|
}), intrinsicDimensions);
|
|
85
92
|
}, [actualImageWidth]);
|
|
86
93
|
const layoutFromDimensions = (0, _react.useCallback)(() => {
|
|
@@ -122,7 +129,7 @@ function ComicViewer(props) {
|
|
|
122
129
|
var _state$urlState;
|
|
123
130
|
|
|
124
131
|
const state = imageStatesRef.current[index];
|
|
125
|
-
return R.isNil(state.urlState) || ((_state$urlState = state.urlState) === null || _state$urlState === void 0 ? void 0 : _state$urlState.validity) === 'invalid'
|
|
132
|
+
return !state.isNewUrlIncoming && (R.isNil(state.urlState) || ((_state$urlState = state.urlState) === null || _state$urlState === void 0 ? void 0 : _state$urlState.validity) === 'invalid');
|
|
126
133
|
}, indexes);
|
|
127
134
|
updateImageState((imageState, i) => {
|
|
128
135
|
return R.includes(i, filteredIndexes) ? { ...imageState,
|
|
@@ -147,6 +154,7 @@ function ComicViewer(props) {
|
|
|
147
154
|
|
|
148
155
|
return imageState;
|
|
149
156
|
});
|
|
157
|
+
} catch (e) {// ignore
|
|
150
158
|
} finally {
|
|
151
159
|
updateImageState((imageState, i) => {
|
|
152
160
|
return R.includes(i, filteredIndexes) ? { ...imageState,
|
|
@@ -156,12 +164,13 @@ function ComicViewer(props) {
|
|
|
156
164
|
}
|
|
157
165
|
};
|
|
158
166
|
|
|
159
|
-
const loadMaybeLoadableItems =
|
|
167
|
+
const loadMaybeLoadableItems = () => {
|
|
160
168
|
const [startIndex, endIndex] = maybeLoadableItemsIndexRange.current;
|
|
161
169
|
const affectedIndexes = R.range(startIndex, endIndex);
|
|
162
|
-
|
|
170
|
+
loadUrlByIndex(affectedIndexes);
|
|
163
171
|
};
|
|
164
172
|
|
|
173
|
+
const ignoreDebounce = (0, _react.useRef)(true);
|
|
165
174
|
const loadItemsDebounce = (0, _core.useDebounce)(loadMaybeLoadableItems, debounceMillis);
|
|
166
175
|
const onViewableItemsChanged = (0, _react.useRef)(_ref => {
|
|
167
176
|
var _R$head, _R$last;
|
|
@@ -180,8 +189,31 @@ function ComicViewer(props) {
|
|
|
180
189
|
const startIndex = R.max(firstViewableIndex - NUMBER_OF_ADJACENT_ITEM, 0);
|
|
181
190
|
const endIndex = R.min(lastViewableItemIndex + NUMBER_OF_ADJACENT_ITEM, itemStates.length - 1);
|
|
182
191
|
maybeLoadableItemsIndexRange.current = [startIndex, endIndex + 1];
|
|
192
|
+
|
|
193
|
+
if (ignoreDebounce.current) {
|
|
194
|
+
loadMaybeLoadableItems();
|
|
195
|
+
ignoreDebounce.current = false;
|
|
196
|
+
return;
|
|
197
|
+
}
|
|
198
|
+
|
|
183
199
|
loadItemsDebounce();
|
|
184
200
|
});
|
|
201
|
+
const handleScroll = (0, _react.useCallback)(event => {
|
|
202
|
+
var _fastScrollRef$curren;
|
|
203
|
+
|
|
204
|
+
fastScrollRef === null || fastScrollRef === void 0 ? void 0 : (_fastScrollRef$curren = fastScrollRef.current) === null || _fastScrollRef$curren === void 0 ? void 0 : _fastScrollRef$curren.onContentScroll(event);
|
|
205
|
+
onScroll === null || onScroll === void 0 ? void 0 : onScroll(event);
|
|
206
|
+
}, [onScroll]);
|
|
207
|
+
|
|
208
|
+
const scrollContentToOffset = offset => {
|
|
209
|
+
var _flatListRef$current;
|
|
210
|
+
|
|
211
|
+
(_flatListRef$current = flatListRef.current) === null || _flatListRef$current === void 0 ? void 0 : _flatListRef$current.scrollToOffset({
|
|
212
|
+
offset,
|
|
213
|
+
animated: false
|
|
214
|
+
});
|
|
215
|
+
};
|
|
216
|
+
|
|
185
217
|
const renderItem = (0, _react.useCallback)(_ref2 => {
|
|
186
218
|
var _renderedDimensions$i, _renderedDimensions$i2;
|
|
187
219
|
|
|
@@ -247,6 +279,7 @@ function ComicViewer(props) {
|
|
|
247
279
|
onPress: onItemPress,
|
|
248
280
|
onReloadPress: onReloadPress,
|
|
249
281
|
url: item.url,
|
|
282
|
+
invisiblePaddingTop: index === 0 ? invisiblePaddingTop : 0,
|
|
250
283
|
width: ((_renderedDimensions$i = renderedDimensions[index]) === null || _renderedDimensions$i === void 0 ? void 0 : _renderedDimensions$i.width) ?? 0,
|
|
251
284
|
height: ((_renderedDimensions$i2 = renderedDimensions[index]) === null || _renderedDimensions$i2 === void 0 ? void 0 : _renderedDimensions$i2.height) ?? 0,
|
|
252
285
|
reloadButtonVisible: item.reloadButtonVisible
|
|
@@ -262,7 +295,7 @@ function ComicViewer(props) {
|
|
|
262
295
|
});
|
|
263
296
|
}
|
|
264
297
|
}, []);
|
|
265
|
-
return /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, _extends({
|
|
298
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, _extends({
|
|
266
299
|
data: itemStates,
|
|
267
300
|
getItemLayout: getItemLayout,
|
|
268
301
|
initialNumToRender: initialNumToRender,
|
|
@@ -271,8 +304,12 @@ function ComicViewer(props) {
|
|
|
271
304
|
ref: flatListRef,
|
|
272
305
|
renderItem: renderItem,
|
|
273
306
|
viewabilityConfig: viewabilityConfig,
|
|
274
|
-
windowSize: windowSize
|
|
275
|
-
|
|
307
|
+
windowSize: windowSize,
|
|
308
|
+
onScroll: handleScroll
|
|
309
|
+
}, otherProps)), /*#__PURE__*/_react.default.createElement(_FastScroll.default, _extends({}, fastScrollOptions, {
|
|
310
|
+
contentLength: totalHeight,
|
|
311
|
+
scrollContentToOffset: scrollContentToOffset
|
|
312
|
+
})));
|
|
276
313
|
}
|
|
277
314
|
|
|
278
315
|
;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["appender","left","right","getHeightAccum","heights","R","mapAccum","keyExtractor","item","String","index","createInitialImageState","dimension","isNewUrlIncoming","totalErrorCount","mapImageStateToItemState","imageState","autoHandleErrorCount","url","urlState","reloadButtonVisible","validity","MAXIMUM_WIDTH","NUMBER_OF_ADJACENT_ITEM","ComicViewer","props","debounceMillis","getUrlByIndex","initialNumToRender","initialScrollPercentage","itemVisiblePercentThreshold","intrinsicDimensions","maxContentWidth","onItemPress","viewportWidth","windowSize","otherProps","flatListRef","useRef","maybeLoadableItemsIndexRange","actualImageWidth","Math","min","initialImageStates","useMemo","map","imageStatesRef","mapImageStatesToItemStates","imageStates","image","itemStates","setItemStates","useState","current","renderedDimensions","intrinsicDimension","width","height","layoutFromDimensions","useCallback","itemHeights","totalHeight","heightAccum","itemOffsets","prepend","getItemLayout","data","length","offset","viewabilityConfig","updateImageState","updateFunction","prevImageStates","newImageStates","prevItemStates","newItemStates","equals","loadUrlByIndex","indexes","filteredIndexes","filter","state","isNil","i","includes","urls","newUrl","get","undefined","loadMaybeLoadableItems","startIndex","endIndex","affectedIndexes","range","loadItemsDebounce","useDebounce","onViewableItemsChanged","viewableItems","orderedViewableItems","sort","a","b","firstViewableIndex","head","lastViewableItemIndex","last","max","renderItem","onError","onReloadPress","onLoad","useEffect","floor","scrollToOffset","animated"],"sources":["ComicViewer.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { FlatList, ListRenderItem, ViewToken } from 'react-native';\nimport * as R from 'ramda';\nimport { useDebounce } from '@fountain-ui/core';\nimport { default as ComicViewerProps, Dimension } from './ComicViewerProps';\nimport ViewerItem from './ViewerItem';\n\nconst appender = (left: number, right: number): [number, number] => [left + right, left + right];\nconst getHeightAccum = (heights: number[]): [number, number[]] => R.mapAccum(appender, 0, heights);\n\nconst keyExtractor = <T, >(item: ItemState) => String(item.index);\n\ninterface UrlState {\n url: string;\n validity: 'valid' | 'invalid' | 'unknown';\n}\n\ninterface ImageState {\n urlState?: UrlState;\n isNewUrlIncoming: boolean;\n totalErrorCount: number;\n dimension: Dimension;\n}\n\ninterface ItemState {\n index: number;\n url?: string;\n reloadButtonVisible: boolean;\n dimension: Dimension;\n}\n\nconst createInitialImageState = (dimension: Dimension): ImageState => ({\n isNewUrlIncoming: false,\n totalErrorCount: 0,\n dimension,\n});\n\nconst mapImageStateToItemState = (\n index: number,\n imageState: ImageState,\n autoHandleErrorCount: number,\n): ItemState => ({\n index,\n url: imageState.urlState?.url,\n reloadButtonVisible: (imageState.urlState?.validity !== 'valid') && imageState.totalErrorCount >= autoHandleErrorCount,\n dimension: imageState.dimension,\n});\n\nconst MAXIMUM_WIDTH = 720;\n\nconst NUMBER_OF_ADJACENT_ITEM = 5;\n\nexport default function ComicViewer(props: ComicViewerProps) {\n const {\n debounceMillis = 100,\n autoHandleErrorCount = 3,\n getUrlByIndex,\n initialNumToRender = 1,\n initialScrollPercentage = 0,\n itemVisiblePercentThreshold = 0,\n intrinsicDimensions,\n maxContentWidth = MAXIMUM_WIDTH,\n onItemPress,\n viewportWidth,\n windowSize = 3,\n ...otherProps\n } = props;\n\n const flatListRef = useRef<FlatList>(null);\n\n const maybeLoadableItemsIndexRange = useRef<[number, number]>([-1, 0]);\n\n const actualImageWidth = Math.min(viewportWidth, maxContentWidth);\n\n const initialImageStates = useMemo<Array<ImageState>>(() => R.map(createInitialImageState, intrinsicDimensions), []);\n const imageStatesRef = useRef<Array<ImageState>>(initialImageStates);\n\n const mapImageStatesToItemStates = (imageStates: Array<ImageState>): Array<ItemState> => {\n return imageStates.map((image, index) => mapImageStateToItemState(\n index, image, autoHandleErrorCount,\n ));\n };\n\n const [itemStates, setItemStates] = useState<Array<ItemState>>(() => {\n return mapImageStatesToItemStates(imageStatesRef.current);\n });\n\n const renderedDimensions = useMemo<Array<Dimension>>(() => {\n return R.map(intrinsicDimension => ({\n width: actualImageWidth,\n height: (intrinsicDimension.height * actualImageWidth) / intrinsicDimension.width,\n }), intrinsicDimensions);\n }, [actualImageWidth]);\n\n const layoutFromDimensions = useCallback(() => {\n const itemHeights = R.map(dimension => dimension.height, renderedDimensions);\n const [totalHeight, heightAccum] = getHeightAccum(itemHeights);\n const itemOffsets = R.prepend(0, heightAccum);\n\n const getItemLayout = (data: any, index: number) => ({\n index,\n length: itemHeights[index],\n offset: itemOffsets[index],\n });\n\n return {\n totalHeight,\n getItemLayout,\n };\n }, [renderedDimensions]);\n\n const { totalHeight, getItemLayout } = layoutFromDimensions();\n\n const viewabilityConfig = useMemo(() => ({\n itemVisiblePercentThreshold,\n }), [itemVisiblePercentThreshold]);\n\n const updateImageState = (updateFunction: (prev: ImageState, index: number) => ImageState) => {\n const prevImageStates = imageStatesRef.current;\n const newImageStates = prevImageStates.map(updateFunction);\n\n imageStatesRef.current = newImageStates;\n\n setItemStates(prevItemStates => {\n const newItemStates = mapImageStatesToItemStates(newImageStates);\n\n return R.equals(prevItemStates, newItemStates) ? prevItemStates : newItemStates;\n });\n };\n\n const loadUrlByIndex = async (indexes: number[]) => {\n const filteredIndexes = R.filter(index => {\n const state = imageStatesRef.current[index];\n\n return R.isNil(state.urlState)\n || (state.urlState?.validity === 'invalid' && !state.isNewUrlIncoming);\n }, indexes);\n\n updateImageState((imageState, i) => {\n return R.includes(i, filteredIndexes)\n ? { ...imageState, isNewUrlIncoming: true }\n : imageState;\n });\n\n try {\n const urls = await getUrlByIndex(filteredIndexes);\n\n updateImageState((imageState, i) => {\n const newUrl = urls?.get(i);\n const urlState = imageState.urlState;\n\n if (newUrl !== undefined && urlState?.validity !== 'valid') {\n return {\n ...imageState,\n urlState: {\n url: newUrl,\n validity: 'unknown',\n },\n };\n }\n\n return imageState;\n });\n } finally {\n updateImageState((imageState, i) => {\n return R.includes(i, filteredIndexes)\n ? { ...imageState, isNewUrlIncoming: false }\n : imageState;\n });\n }\n };\n\n const loadMaybeLoadableItems = async () => {\n const [startIndex, endIndex] = maybeLoadableItemsIndexRange.current;\n const affectedIndexes = R.range(startIndex, endIndex);\n\n await loadUrlByIndex(affectedIndexes);\n };\n\n const loadItemsDebounce = useDebounce(loadMaybeLoadableItems, debounceMillis);\n\n const onViewableItemsChanged = useRef(({ viewableItems }: { viewableItems: Array<ViewToken> }) => {\n const orderedViewableItems = R.sort((a, b) => (a.index || 0) - (b.index || 0), viewableItems);\n\n const firstViewableIndex = R.head(orderedViewableItems)?.index;\n const lastViewableItemIndex = R.last(orderedViewableItems)?.index;\n\n if (R.isNil(firstViewableIndex) || R.isNil(lastViewableItemIndex)) {\n return;\n }\n\n const startIndex = R.max(firstViewableIndex - NUMBER_OF_ADJACENT_ITEM, 0);\n const endIndex = R.min(lastViewableItemIndex + NUMBER_OF_ADJACENT_ITEM, itemStates.length - 1);\n\n maybeLoadableItemsIndexRange.current = [startIndex, endIndex + 1];\n\n loadItemsDebounce();\n });\n\n const renderItem: ListRenderItem<ItemState> = useCallback(({ item, index }) => {\n const onError = () => {\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index && urlState !== undefined) {\n return {\n ...imageState,\n totalErrorCount: imageState.totalErrorCount + 1,\n urlState: {\n ...urlState,\n validity: 'invalid',\n },\n };\n }\n\n return imageState;\n });\n\n if (item.reloadButtonVisible) {\n return;\n }\n\n const [startIndex, endIndex] = maybeLoadableItemsIndexRange.current;\n if (index >= startIndex || index < endIndex) {\n loadItemsDebounce();\n }\n };\n\n const onReloadPress = () => {\n const [startIndex, endIndex] = maybeLoadableItemsIndexRange.current;\n if (index >= startIndex || index < endIndex) {\n loadUrlByIndex([index]);\n }\n };\n\n const onLoad = () => {\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index && urlState !== undefined) {\n return {\n ...imageState,\n urlState: {\n ...urlState,\n validity: 'valid',\n },\n };\n }\n\n return imageState;\n });\n };\n\n return (\n <ViewerItem\n onError={onError}\n onLoad={onLoad}\n onPress={onItemPress}\n onReloadPress={onReloadPress}\n url={item.url}\n width={renderedDimensions[index]?.width ?? 0}\n height={renderedDimensions[index]?.height ?? 0}\n reloadButtonVisible={item.reloadButtonVisible}\n />\n );\n }, [onItemPress, renderedDimensions]);\n\n useEffect(() => {\n const offset = Math.floor((initialScrollPercentage / 100) * totalHeight);\n\n if (flatListRef.current) {\n flatListRef.current.scrollToOffset({ offset, animated: false });\n }\n }, []);\n\n return (\n <FlatList\n data={itemStates}\n getItemLayout={getItemLayout}\n initialNumToRender={initialNumToRender}\n keyExtractor={keyExtractor}\n onViewableItemsChanged={onViewableItemsChanged.current}\n ref={flatListRef}\n renderItem={renderItem}\n viewabilityConfig={viewabilityConfig}\n windowSize={windowSize}\n {...otherProps}\n />\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["appender","left","right","getHeightAccum","heights","R","mapAccum","keyExtractor","item","String","index","createInitialImageState","dimension","isNewUrlIncoming","totalErrorCount","mapImageStateToItemState","imageState","autoHandleErrorCount","url","urlState","reloadButtonVisible","validity","mapIndexed","addIndex","map","MAXIMUM_WIDTH","NUMBER_OF_ADJACENT_ITEM","ComicViewer","props","debounceMillis","fastScrollOptions","getUrlByIndex","initialNumToRender","initialScrollPercentage","itemVisiblePercentThreshold","intrinsicDimensions","maxContentWidth","onItemPress","onScroll","viewportWidth","invisiblePaddingTop","windowSize","otherProps","fastScrollRef","ref","flatListRef","useRef","maybeLoadableItemsIndexRange","actualImageWidth","Math","min","initialImageStates","useMemo","imageStatesRef","mapImageStatesToItemStates","imageStates","image","itemStates","setItemStates","useState","current","renderedDimensions","intrinsicDimension","width","height","layoutFromDimensions","useCallback","itemHeights","totalHeight","heightAccum","itemOffsets","prepend","getItemLayout","data","length","offset","viewabilityConfig","updateImageState","updateFunction","prevImageStates","newImageStates","prevItemStates","newItemStates","equals","loadUrlByIndex","indexes","filteredIndexes","filter","state","isNil","i","includes","urls","newUrl","get","undefined","e","loadMaybeLoadableItems","startIndex","endIndex","affectedIndexes","range","ignoreDebounce","loadItemsDebounce","useDebounce","onViewableItemsChanged","viewableItems","orderedViewableItems","sort","a","b","firstViewableIndex","head","lastViewableItemIndex","last","max","handleScroll","event","onContentScroll","scrollContentToOffset","scrollToOffset","animated","renderItem","onError","onReloadPress","onLoad","useEffect","floor"],"sources":["ComicViewer.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { FlatList, ListRenderItem, NativeScrollEvent, NativeSyntheticEvent, ViewToken } from 'react-native';\nimport * as R from 'ramda';\nimport { useDebounce } from '@fountain-ui/core';\nimport { default as ComicViewerProps, Dimension } from './ComicViewerProps';\nimport ViewerItem from './ViewerItem';\nimport FastScroll from './FastScroll';\n\nconst appender = (left: number, right: number): [number, number] => [left + right, left + right];\nconst getHeightAccum = (heights: number[]): [number, number[]] => R.mapAccum(appender, 0, heights);\n\nconst keyExtractor = <T, >(item: ItemState) => String(item.index);\n\ninterface UrlState {\n url: string;\n validity: 'valid' | 'invalid' | 'unknown';\n}\n\ninterface ImageState {\n urlState?: UrlState;\n isNewUrlIncoming: boolean;\n totalErrorCount: number;\n dimension: Dimension;\n}\n\ninterface ItemState {\n index: number;\n url?: string;\n reloadButtonVisible: boolean;\n dimension: Dimension;\n}\n\nconst createInitialImageState = (dimension: Dimension): ImageState => ({\n isNewUrlIncoming: false,\n totalErrorCount: 0,\n dimension,\n});\n\nconst mapImageStateToItemState = (\n index: number,\n imageState: ImageState,\n autoHandleErrorCount: number,\n): ItemState => ({\n index,\n url: imageState.urlState?.url,\n reloadButtonVisible: (imageState.urlState?.validity !== 'valid') && imageState.totalErrorCount >= autoHandleErrorCount,\n dimension: imageState.dimension,\n});\n\nconst mapIndexed = R.addIndex<Dimension>(R.map);\n\nconst MAXIMUM_WIDTH = 720;\n\nconst NUMBER_OF_ADJACENT_ITEM = 5;\n\nexport default function ComicViewer(props: ComicViewerProps) {\n const {\n debounceMillis = 100,\n autoHandleErrorCount = 3,\n fastScrollOptions,\n getUrlByIndex,\n initialNumToRender = 1,\n initialScrollPercentage = 0,\n itemVisiblePercentThreshold = 0,\n intrinsicDimensions,\n maxContentWidth = MAXIMUM_WIDTH,\n onItemPress,\n onScroll,\n viewportWidth,\n invisiblePaddingTop = 0,\n windowSize = 3,\n ...otherProps\n } = props;\n\n const fastScrollRef = fastScrollOptions?.ref;\n\n const flatListRef = useRef<FlatList>(null);\n\n const maybeLoadableItemsIndexRange = useRef<[number, number]>([-1, 0]);\n\n const actualImageWidth = Math.min(viewportWidth, maxContentWidth);\n\n const initialImageStates = useMemo<Array<ImageState>>(() => R.map(createInitialImageState, intrinsicDimensions), []);\n const imageStatesRef = useRef<Array<ImageState>>(initialImageStates);\n\n const mapImageStatesToItemStates = (imageStates: Array<ImageState>): Array<ItemState> => {\n return imageStates.map((image, index) => mapImageStateToItemState(\n index, image, autoHandleErrorCount,\n ));\n };\n\n const [itemStates, setItemStates] = useState<Array<ItemState>>(() => {\n return mapImageStatesToItemStates(imageStatesRef.current);\n });\n\n const renderedDimensions = useMemo<Array<Dimension>>(() => {\n return mapIndexed((intrinsicDimension, index) => ({\n width: actualImageWidth,\n height: (intrinsicDimension.height * actualImageWidth) / intrinsicDimension.width + (index === 0 ? invisiblePaddingTop : 0),\n }), intrinsicDimensions);\n }, [actualImageWidth]);\n\n const layoutFromDimensions = useCallback(() => {\n const itemHeights = R.map(dimension => dimension.height, renderedDimensions);\n const [totalHeight, heightAccum] = getHeightAccum(itemHeights);\n const itemOffsets = R.prepend(0, heightAccum);\n\n const getItemLayout = (data: any, index: number) => ({\n index,\n length: itemHeights[index],\n offset: itemOffsets[index],\n });\n\n return {\n totalHeight,\n getItemLayout,\n };\n }, [renderedDimensions]);\n\n const { totalHeight, getItemLayout } = layoutFromDimensions();\n\n const viewabilityConfig = useMemo(() => ({\n itemVisiblePercentThreshold,\n }), [itemVisiblePercentThreshold]);\n\n const updateImageState = (updateFunction: (prev: ImageState, index: number) => ImageState) => {\n const prevImageStates = imageStatesRef.current;\n const newImageStates = prevImageStates.map(updateFunction);\n\n imageStatesRef.current = newImageStates;\n\n setItemStates(prevItemStates => {\n const newItemStates = mapImageStatesToItemStates(newImageStates);\n\n return R.equals(prevItemStates, newItemStates) ? prevItemStates : newItemStates;\n });\n };\n\n const loadUrlByIndex = async (indexes: number[]) => {\n const filteredIndexes = R.filter(index => {\n const state = imageStatesRef.current[index];\n\n return !state.isNewUrlIncoming\n && (R.isNil(state.urlState) || state.urlState?.validity === 'invalid');\n }, indexes);\n\n updateImageState((imageState, i) => {\n return R.includes(i, filteredIndexes)\n ? { ...imageState, isNewUrlIncoming: true }\n : imageState;\n });\n\n try {\n const urls = await getUrlByIndex(filteredIndexes);\n\n updateImageState((imageState, i) => {\n const newUrl = urls?.get(i);\n const urlState = imageState.urlState;\n\n if (newUrl !== undefined && urlState?.validity !== 'valid') {\n return {\n ...imageState,\n urlState: {\n url: newUrl,\n validity: 'unknown',\n },\n };\n }\n\n return imageState;\n });\n } catch (e) {\n // ignore\n } finally {\n updateImageState((imageState, i) => {\n return R.includes(i, filteredIndexes)\n ? { ...imageState, isNewUrlIncoming: false }\n : imageState;\n });\n }\n };\n\n const loadMaybeLoadableItems = () => {\n const [startIndex, endIndex] = maybeLoadableItemsIndexRange.current;\n const affectedIndexes = R.range(startIndex, endIndex);\n\n loadUrlByIndex(affectedIndexes);\n };\n\n const ignoreDebounce = useRef(true);\n const loadItemsDebounce = useDebounce(loadMaybeLoadableItems, debounceMillis);\n\n const onViewableItemsChanged = useRef(({ viewableItems }: { viewableItems: Array<ViewToken> }) => {\n const orderedViewableItems = R.sort((a, b) => (a.index || 0) - (b.index || 0), viewableItems);\n\n const firstViewableIndex = R.head(orderedViewableItems)?.index;\n const lastViewableItemIndex = R.last(orderedViewableItems)?.index;\n\n if (R.isNil(firstViewableIndex) || R.isNil(lastViewableItemIndex)) {\n return;\n }\n\n const startIndex = R.max(firstViewableIndex - NUMBER_OF_ADJACENT_ITEM, 0);\n const endIndex = R.min(lastViewableItemIndex + NUMBER_OF_ADJACENT_ITEM, itemStates.length - 1);\n\n maybeLoadableItemsIndexRange.current = [startIndex, endIndex + 1];\n\n if (ignoreDebounce.current) {\n loadMaybeLoadableItems();\n\n ignoreDebounce.current = false;\n return;\n }\n\n loadItemsDebounce();\n });\n\n const handleScroll = useCallback((event: NativeSyntheticEvent<NativeScrollEvent>) => {\n fastScrollRef?.current?.onContentScroll(event);\n\n onScroll?.(event);\n }, [onScroll]);\n\n const scrollContentToOffset = (offset: number) => {\n flatListRef.current?.scrollToOffset({\n offset,\n animated: false,\n });\n };\n\n const renderItem: ListRenderItem<ItemState> = useCallback(({ item, index }) => {\n const onError = () => {\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index && urlState !== undefined) {\n return {\n ...imageState,\n totalErrorCount: imageState.totalErrorCount + 1,\n urlState: {\n ...urlState,\n validity: 'invalid',\n },\n };\n }\n\n return imageState;\n });\n\n if (item.reloadButtonVisible) {\n return;\n }\n\n const [startIndex, endIndex] = maybeLoadableItemsIndexRange.current;\n if (index >= startIndex || index < endIndex) {\n loadItemsDebounce();\n }\n };\n\n const onReloadPress = () => {\n const [startIndex, endIndex] = maybeLoadableItemsIndexRange.current;\n if (index >= startIndex || index < endIndex) {\n loadUrlByIndex([index]);\n }\n };\n\n const onLoad = () => {\n updateImageState((imageState, i) => {\n const urlState = imageState.urlState;\n\n if (i === index && urlState !== undefined) {\n return {\n ...imageState,\n urlState: {\n ...urlState,\n validity: 'valid',\n },\n };\n }\n\n return imageState;\n });\n };\n\n return (\n <ViewerItem\n onError={onError}\n onLoad={onLoad}\n onPress={onItemPress}\n onReloadPress={onReloadPress}\n url={item.url}\n invisiblePaddingTop={index === 0 ? invisiblePaddingTop : 0}\n width={renderedDimensions[index]?.width ?? 0}\n height={renderedDimensions[index]?.height ?? 0}\n reloadButtonVisible={item.reloadButtonVisible}\n />\n );\n }, [onItemPress, renderedDimensions]);\n\n useEffect(() => {\n const offset = Math.floor((initialScrollPercentage / 100) * totalHeight);\n\n if (flatListRef.current) {\n flatListRef.current.scrollToOffset({ offset, animated: false });\n }\n }, []);\n\n return (\n <React.Fragment>\n <FlatList\n data={itemStates}\n getItemLayout={getItemLayout}\n initialNumToRender={initialNumToRender}\n keyExtractor={keyExtractor}\n onViewableItemsChanged={onViewableItemsChanged.current}\n ref={flatListRef}\n renderItem={renderItem}\n viewabilityConfig={viewabilityConfig}\n windowSize={windowSize}\n onScroll={handleScroll}\n {...otherProps}\n />\n\n <FastScroll\n {...fastScrollOptions}\n contentLength={totalHeight}\n scrollContentToOffset={scrollContentToOffset}\n />\n </React.Fragment>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["ComicViewerProps.ts"],"sourcesContent":["import React from 'react';\nimport { ComponentProps } from '@fountain-ui/core';\nimport { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';\n\nexport interface Dimension {\n width: number;\n height: number;\n}\n\nexport default interface ComicViewerProps extends ComponentProps <{\n /**\n * Delay Time to call the error handler.\n * @default 100\n */\n debounceMillis?: number;\n\n /**\n * How many times handle onError directly when item error occur\n * @default 3\n */\n autoHandleErrorCount?: number;\n\n /**\n * How many items to render in the initial batch.\n * @default 1\n */\n initialNumToRender?: number;\n\n /**\n * Start at initialScrollPercentage.\n * If over 100, scroll to end.\n * @default 0\n */\n initialScrollPercentage?: number;\n\n /**\n * The value for FlatList viewabilityConfig.itemVisiblePercentThreshold.\n * @default 0\n */\n itemVisiblePercentThreshold?: number;\n\n /**\n * Dimensions of each Image considering viewport.\n */\n intrinsicDimensions: Array<Dimension>;\n\n /**\n * Max value of contents image width size.\n * @default 720\n */\n maxContentWidth?: number;\n\n /**\n * Width of viewport.\n */\n viewportWidth: number;\n\n /**\n * The value for FlatList windowSize.\n * @default 3\n */\n windowSize?: number;\n\n /**\n * Get contents urls by indexes.\n */\n getUrlByIndex: (indexes: Array<number>) => Promise<Map<number, string> | undefined> ;\n\n /**\n * Handle scroll event.\n * @param event Scroll event.\n */\n onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;\n\n /**\n * Handle item press event.\n */\n onItemPress?: () => void;\n\n /**\n * Component for comic viewer footer.\n */\n ListFooterComponent?: React.ReactElement;\n}> {}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"names":[],"sources":["ComicViewerProps.ts"],"sourcesContent":["import React from 'react';\nimport { ComponentProps } from '@fountain-ui/core';\nimport { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';\nimport { FastScrollOptions } from './FastScrollProps';\n\nexport interface Dimension {\n width: number;\n height: number;\n}\n\nexport default interface ComicViewerProps extends ComponentProps <{\n /**\n * Delay Time to call the error handler.\n * @default 100\n */\n debounceMillis?: number;\n\n /**\n * How many times handle onError directly when item error occur\n * @default 3\n */\n autoHandleErrorCount?: number;\n\n /**\n * How many items to render in the initial batch.\n * @default 1\n */\n initialNumToRender?: number;\n\n /**\n * Start at initialScrollPercentage.\n * If over 100, scroll to end.\n * @default 0\n */\n initialScrollPercentage?: number;\n\n /**\n * The value for FlatList viewabilityConfig.itemVisiblePercentThreshold.\n * @default 0\n */\n itemVisiblePercentThreshold?: number;\n\n /**\n * Dimensions of each Image considering viewport.\n */\n intrinsicDimensions: Array<Dimension>;\n\n /**\n * Need invisible paddingTop viewer vertically expanded.\n * @default 0\n */\n invisiblePaddingTop?: number;\n\n /**\n * Max value of contents image width size.\n * @default 720\n */\n maxContentWidth?: number;\n\n /**\n * Width of viewport.\n */\n viewportWidth: number;\n\n /**\n * The value for FlatList windowSize.\n * @default 3\n */\n windowSize?: number;\n\n /**\n * Options for fastscroll component.\n */\n fastScrollOptions: FastScrollOptions;\n\n /**\n * Get contents urls by indexes.\n */\n getUrlByIndex: (indexes: Array<number>) => Promise<Map<number, string> | undefined> ;\n\n /**\n * Handle scroll event.\n * @param event Scroll event.\n */\n onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;\n\n /**\n * Handle item press event.\n */\n onItemPress?: () => void;\n\n /**\n * Component for comic viewer footer.\n */\n ListFooterComponent?: React.ReactElement;\n}> {}\n"],"mappings":""}
|
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _reactNativeGestureHandler = require("react-native-gesture-handler");
|
|
13
|
+
|
|
14
|
+
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
|
|
15
|
+
|
|
16
|
+
var _icons = require("@fountain-ui/icons");
|
|
17
|
+
|
|
18
|
+
var _core = require("@fountain-ui/core");
|
|
19
|
+
|
|
20
|
+
var _util = require("./util");
|
|
21
|
+
|
|
22
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
23
|
+
|
|
24
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
25
|
+
|
|
26
|
+
const styles = _core.StyleSheet.create({
|
|
27
|
+
indicator: {
|
|
28
|
+
width: 24,
|
|
29
|
+
height: 40,
|
|
30
|
+
backgroundColor: '#767676',
|
|
31
|
+
flexDirection: 'column',
|
|
32
|
+
alignItems: 'center',
|
|
33
|
+
borderRadius: 4
|
|
34
|
+
},
|
|
35
|
+
view: {
|
|
36
|
+
position: 'absolute'
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
const FastScroll = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
|
|
41
|
+
const {
|
|
42
|
+
absolutePosition,
|
|
43
|
+
additionalLength = 0,
|
|
44
|
+
contentLength,
|
|
45
|
+
movementRange,
|
|
46
|
+
scrollContentToOffset,
|
|
47
|
+
visibleDurations = {
|
|
48
|
+
hideMillis: 200,
|
|
49
|
+
showMillis: 350
|
|
50
|
+
}
|
|
51
|
+
} = props;
|
|
52
|
+
const lastIndicatorOffset = (0, _reactNativeReanimated.useSharedValue)(0);
|
|
53
|
+
const indicatorOffset = (0, _reactNativeReanimated.useSharedValue)(lastIndicatorOffset.value);
|
|
54
|
+
const isIndicatorDragging = (0, _react.useRef)(false);
|
|
55
|
+
const indicatorOpacity = (0, _reactNativeReanimated.useSharedValue)(1);
|
|
56
|
+
const [visible, setVisible] = (0, _react.useState)(true);
|
|
57
|
+
const animatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
|
|
58
|
+
transform: [{
|
|
59
|
+
translateY: indicatorOffset.value
|
|
60
|
+
}],
|
|
61
|
+
opacity: indicatorOpacity.value
|
|
62
|
+
}));
|
|
63
|
+
const totalContentLength = contentLength + additionalLength;
|
|
64
|
+
|
|
65
|
+
const onContentScroll = event => {
|
|
66
|
+
if (isIndicatorDragging.current === false) {
|
|
67
|
+
const contentPercentage = (0, _util.offsetToPercentage)(event.nativeEvent.contentOffset.y, totalContentLength);
|
|
68
|
+
const offset = (0, _util.percentageToOffset)(contentPercentage, movementRange);
|
|
69
|
+
|
|
70
|
+
if (offset < 0 || indicatorOffset.value < 0) {
|
|
71
|
+
lastIndicatorOffset.value = 0;
|
|
72
|
+
indicatorOffset.value = 0;
|
|
73
|
+
return;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
if (offset > movementRange || indicatorOffset.value > movementRange) {
|
|
77
|
+
lastIndicatorOffset.value = movementRange;
|
|
78
|
+
indicatorOffset.value = movementRange;
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
lastIndicatorOffset.value = offset;
|
|
83
|
+
} else {
|
|
84
|
+
setVisible(true);
|
|
85
|
+
}
|
|
86
|
+
};
|
|
87
|
+
|
|
88
|
+
const getIsIndicatorDragging = () => isIndicatorDragging.current;
|
|
89
|
+
|
|
90
|
+
(0, _react.useImperativeHandle)(ref, () => ({
|
|
91
|
+
getIsIndicatorDragging,
|
|
92
|
+
onContentScroll,
|
|
93
|
+
setVisible
|
|
94
|
+
}), []);
|
|
95
|
+
|
|
96
|
+
const handleUpdate = () => {
|
|
97
|
+
const contentPercentage = (0, _util.offsetToPercentage)(indicatorOffset.value, movementRange);
|
|
98
|
+
const offset = (0, _util.percentageToOffset)(contentPercentage, totalContentLength);
|
|
99
|
+
scrollContentToOffset(offset);
|
|
100
|
+
};
|
|
101
|
+
|
|
102
|
+
const setIsIndicatorDragging = value => isIndicatorDragging.current = value;
|
|
103
|
+
|
|
104
|
+
const pan = _reactNativeGestureHandler.Gesture.Pan().onBegin(e => {
|
|
105
|
+
indicatorOffset.value = lastIndicatorOffset.value;
|
|
106
|
+
(0, _reactNativeReanimated.runOnJS)(setIsIndicatorDragging)(true);
|
|
107
|
+
}).onUpdate(e => {
|
|
108
|
+
if (indicatorOffset.value <= 0 && e.translationY < 0) {
|
|
109
|
+
indicatorOffset.value = 0;
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
if (indicatorOffset.value >= movementRange && e.translationY > 0) {
|
|
114
|
+
indicatorOffset.value = movementRange;
|
|
115
|
+
return;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
indicatorOffset.value = lastIndicatorOffset.value + e.translationY;
|
|
119
|
+
(0, _reactNativeReanimated.runOnJS)(handleUpdate)();
|
|
120
|
+
}).onFinalize(e => {
|
|
121
|
+
lastIndicatorOffset.value = indicatorOffset.value;
|
|
122
|
+
(0, _reactNativeReanimated.runOnJS)(setIsIndicatorDragging)(false);
|
|
123
|
+
});
|
|
124
|
+
|
|
125
|
+
const hide = () => indicatorOpacity.value = (0, _reactNativeReanimated.withDelay)(0, (0, _reactNativeReanimated.withTiming)(0, {
|
|
126
|
+
duration: visibleDurations.hideMillis
|
|
127
|
+
}));
|
|
128
|
+
|
|
129
|
+
const show = () => indicatorOpacity.value = (0, _reactNativeReanimated.withDelay)(0, (0, _reactNativeReanimated.withTiming)(1, {
|
|
130
|
+
duration: visibleDurations.showMillis
|
|
131
|
+
}));
|
|
132
|
+
|
|
133
|
+
(0, _react.useEffect)(() => {
|
|
134
|
+
if (visible) {
|
|
135
|
+
indicatorOffset.value = lastIndicatorOffset.value;
|
|
136
|
+
show();
|
|
137
|
+
} else {
|
|
138
|
+
hide();
|
|
139
|
+
}
|
|
140
|
+
}, [visible]);
|
|
141
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
142
|
+
style: [{
|
|
143
|
+
height: movementRange
|
|
144
|
+
}, styles.view, absolutePosition]
|
|
145
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNativeGestureHandler.GestureDetector, {
|
|
146
|
+
gesture: pan
|
|
147
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
|
|
148
|
+
style: [animatedStyle, styles.indicator]
|
|
149
|
+
}, /*#__PURE__*/_react.default.createElement(_icons.ChevronUp, {
|
|
150
|
+
fill: '#ededed',
|
|
151
|
+
height: 20,
|
|
152
|
+
width: 20
|
|
153
|
+
}), /*#__PURE__*/_react.default.createElement(_icons.ChevronDown, {
|
|
154
|
+
fill: '#ededed',
|
|
155
|
+
height: 20,
|
|
156
|
+
width: 20
|
|
157
|
+
}))));
|
|
158
|
+
});
|
|
159
|
+
|
|
160
|
+
var _default = FastScroll;
|
|
161
|
+
exports.default = _default;
|
|
162
|
+
//# sourceMappingURL=FastScroll.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["styles","StyleSheet","create","indicator","width","height","backgroundColor","flexDirection","alignItems","borderRadius","view","position","FastScroll","React","forwardRef","props","ref","absolutePosition","additionalLength","contentLength","movementRange","scrollContentToOffset","visibleDurations","hideMillis","showMillis","lastIndicatorOffset","useSharedValue","indicatorOffset","value","isIndicatorDragging","useRef","indicatorOpacity","visible","setVisible","useState","animatedStyle","useAnimatedStyle","transform","translateY","opacity","totalContentLength","onContentScroll","event","current","contentPercentage","offsetToPercentage","nativeEvent","contentOffset","y","offset","percentageToOffset","getIsIndicatorDragging","useImperativeHandle","handleUpdate","setIsIndicatorDragging","pan","Gesture","Pan","onBegin","e","runOnJS","onUpdate","translationY","onFinalize","hide","withDelay","withTiming","duration","show","useEffect"],"sources":["FastScroll.tsx"],"sourcesContent":["import React, { useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport { NativeScrollEvent, NativeSyntheticEvent, View } from 'react-native';\nimport { Gesture, GestureDetector } from 'react-native-gesture-handler';\nimport Animated, { runOnJS, useAnimatedStyle, useSharedValue, withDelay, withTiming } from 'react-native-reanimated';\nimport { ChevronDown, ChevronUp } from '@fountain-ui/icons';\nimport { StyleSheet } from '@fountain-ui/core';\nimport FastScrollProps from './FastScrollProps';\nimport { offsetToPercentage, percentageToOffset } from './util';\n\nconst styles = StyleSheet.create({\n indicator: {\n width: 24,\n height: 40,\n backgroundColor: '#767676',\n flexDirection: 'column',\n alignItems: 'center',\n borderRadius: 4,\n },\n view: { position: 'absolute' },\n});\n\nconst FastScroll = React.forwardRef((props: FastScrollProps, ref) => {\n const {\n absolutePosition,\n additionalLength = 0,\n contentLength,\n movementRange,\n scrollContentToOffset,\n visibleDurations = { hideMillis: 200, showMillis: 350 },\n } = props;\n\n const lastIndicatorOffset = useSharedValue(0);\n const indicatorOffset = useSharedValue(lastIndicatorOffset.value);\n\n const isIndicatorDragging = useRef(false);\n\n const indicatorOpacity = useSharedValue(1);\n const [visible, setVisible] = useState(true);\n\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: indicatorOffset.value }],\n opacity: indicatorOpacity.value,\n }));\n\n const totalContentLength = contentLength + additionalLength;\n\n const onContentScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {\n if (isIndicatorDragging.current === false) {\n const contentPercentage = offsetToPercentage(event.nativeEvent.contentOffset.y, totalContentLength);\n const offset = percentageToOffset(contentPercentage, movementRange);\n\n if (offset < 0 || indicatorOffset.value < 0) {\n lastIndicatorOffset.value = 0;\n indicatorOffset.value = 0;\n return;\n }\n\n if (offset > movementRange || indicatorOffset.value > movementRange) {\n lastIndicatorOffset.value = movementRange;\n indicatorOffset.value = movementRange;\n return;\n }\n\n lastIndicatorOffset.value = offset;\n } else {\n setVisible(true);\n }\n };\n\n const getIsIndicatorDragging = () => isIndicatorDragging.current;\n\n useImperativeHandle(\n ref,\n () => ({\n getIsIndicatorDragging,\n onContentScroll,\n setVisible,\n }),\n [],\n );\n\n const handleUpdate = () => {\n const contentPercentage = offsetToPercentage(indicatorOffset.value, movementRange);\n const offset = percentageToOffset(contentPercentage, totalContentLength);\n\n scrollContentToOffset(offset);\n };\n\n const setIsIndicatorDragging = (value: boolean) => isIndicatorDragging.current = value;\n\n const pan = Gesture.Pan()\n .onBegin((e) => {\n indicatorOffset.value = lastIndicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(true);\n })\n .onUpdate((e) => {\n if (indicatorOffset.value <= 0 && e.translationY < 0) {\n indicatorOffset.value = 0;\n return;\n }\n\n if (indicatorOffset.value >= movementRange && e.translationY > 0) {\n indicatorOffset.value = movementRange;\n return;\n }\n\n indicatorOffset.value = lastIndicatorOffset.value + e.translationY;\n\n runOnJS(handleUpdate)();\n })\n .onFinalize((e) => {\n lastIndicatorOffset.value = indicatorOffset.value;\n runOnJS(setIsIndicatorDragging)(false);\n });\n\n const hide = () => indicatorOpacity.value = withDelay(0, withTiming(0, { duration: visibleDurations.hideMillis }));\n\n const show = () => indicatorOpacity.value = withDelay(0, withTiming(1, { duration: visibleDurations.showMillis }));\n\n useEffect(() => {\n if (visible) {\n indicatorOffset.value = lastIndicatorOffset.value;\n show();\n } else {\n hide();\n }\n }, [visible]);\n\n return (\n <View\n style={[\n { height: movementRange },\n styles.view,\n absolutePosition,\n ]}\n >\n <GestureDetector gesture={pan}>\n <Animated.View style={[\n animatedStyle,\n styles.indicator,\n ]}>\n <ChevronUp\n fill={'#ededed'}\n height={20}\n width={20}\n />\n <ChevronDown\n fill={'#ededed'}\n height={20}\n width={20}\n />\n </Animated.View>\n </GestureDetector>\n </View>\n );\n});\n\nexport default FastScroll;"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["FastScrollProps.ts"],"sourcesContent":["import React from 'react';\nimport { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';\nimport type { RefObject } from 'react';\n\n/**\n * Position infos with display: 'position'.\n */\nexport type AbsolutePosition = {\n top: number;\n bottom: number;\n right: number;\n left: number;\n};\n\n/**\n * Durations(millis) for show, hide animation.\n */\nexport type VisibleDurations = {\n hideMillis: number;\n showMillis: number;\n}\n\nexport interface FastScrollInstance {\n /**\n * Handle content scroll event, not using fast scroll indicator.\n * @param event Function onScroll event params.\n */\n onContentScroll: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;\n\n /**\n * Set indicator visible state.\n */\n setVisible: React.Dispatch<React.SetStateAction<boolean>>;\n\n /**\n * Return true, if pan gesture state is begin to finalize.\n */\n getIsIndicatorDragging: () => boolean,\n}\n\nexport interface FastScrollOptions {\n /**\n * Ref for React.forwardRef.\n */\n ref: RefObject<FastScrollInstance>;\n\n /**\n * Range within which the indicator can move.\n */\n movementRange: number;\n\n /**\n * Scrollbar positions for 'display: position'.\n */\n absolutePosition?: Partial<AbsolutePosition>;\n\n /**\n * Durations(millis) for show, hide animation.\n * @default { hide: 200, show: 350 }\n */\n visibleDurations?: VisibleDurations;\n\n /**\n * Additional height except contentLength.\n * @default 0\n */\n additionalLength?: number;\n}\n\ninterface FastScrollProps extends FastScrollOptions {\n /**\n * Total length of scrollable content.\n */\n contentLength: number;\n\n /**\n * Scroll content to offset appropriate for the indicator location.\n * @param offset Content offset.\n */\n scrollContentToOffset: (offset: number) => void;\n}\n\nexport default FastScrollProps;\n"],"mappings":""}
|
|
@@ -22,6 +22,7 @@ function ViewerItem(props) {
|
|
|
22
22
|
height,
|
|
23
23
|
url,
|
|
24
24
|
width,
|
|
25
|
+
invisiblePaddingTop,
|
|
25
26
|
onError,
|
|
26
27
|
onLoad,
|
|
27
28
|
onPress,
|
|
@@ -31,10 +32,11 @@ function ViewerItem(props) {
|
|
|
31
32
|
const styles = {
|
|
32
33
|
view: {
|
|
33
34
|
height,
|
|
34
|
-
width: '100%'
|
|
35
|
+
width: '100%',
|
|
36
|
+
paddingTop: invisiblePaddingTop
|
|
35
37
|
},
|
|
36
38
|
image: {
|
|
37
|
-
height,
|
|
39
|
+
height: height - invisiblePaddingTop,
|
|
38
40
|
width
|
|
39
41
|
}
|
|
40
42
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["ViewerItem","props","height","url","width","onError","onLoad","onPress","onReloadPress","reloadButtonVisible","styles","view","image","error","placeholder","uri","EncodedTile","css","alignSelf"],"sources":["ViewerItem.tsx"],"sourcesContent":["import React from 'react';\nimport { Image, TouchableWithoutFeedback, View } from 'react-native';\nimport { css, Image as FuiImage, ImageProps } from '@fountain-ui/core';\nimport ReloadButton from './ReloadButton';\nimport EncodedTile from './EncodedTile';\n\nexport interface ViewerItemProps {\n /**\n * Image width.\n */\n width: number;\n\n /**\n * Image height.\n */\n height: number;\n\n /**\n * Image sourceUrl for displaying.\n */\n url?: string;\n\n /**\n * Error handler.\n */\n onError?: ImageProps['onError'];\n\n /**\n * Load handler.\n */\n onLoad?: ImageProps['onLoad'];\n\n /**\n * Handle Reload button press event.\n */\n onReloadPress?: ImageProps['onError'];\n\n /**\n * Handle item press event.\n */\n onPress?: () => void;\n\n /**\n * If true, reload button visible.\n * @default false\n */\n reloadButtonVisible?: boolean;\n}\n\nexport default function ViewerItem(props: ViewerItemProps) {\n const {\n height,\n url,\n width,\n onError,\n onLoad,\n onPress,\n onReloadPress,\n reloadButtonVisible = false,\n } = props;\n\n const styles = {\n view: {\n height,\n width: '100%',\n },\n image: {\n height,\n width,\n },\n };\n\n const error = reloadButtonVisible ? <ReloadButton onPress={onReloadPress}/> : null;\n\n const placeholder = <Image\n source={{ uri: EncodedTile }}\n resizeMode={'cover'}\n style={styles.image}\n />;\n\n return (\n <TouchableWithoutFeedback onPress={onPress}>\n <View style={styles.view}>\n <FuiImage\n cache={'web'}\n disableDrag={true}\n disableLongClick={true}\n disableOutline={true}\n error={error}\n onError={onError}\n onLoad={onLoad}\n loading={'eager'}\n placeholder={placeholder}\n source={{ uri: url }}\n square={true}\n style={css([\n { alignSelf: 'center' },\n styles.image,\n ])}\n />\n </View>\n </TouchableWithoutFeedback>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;
|
|
1
|
+
{"version":3,"names":["ViewerItem","props","height","url","width","invisiblePaddingTop","onError","onLoad","onPress","onReloadPress","reloadButtonVisible","styles","view","paddingTop","image","error","placeholder","uri","EncodedTile","css","alignSelf"],"sources":["ViewerItem.tsx"],"sourcesContent":["import React from 'react';\nimport { Image, TouchableWithoutFeedback, View } from 'react-native';\nimport { css, Image as FuiImage, ImageProps } from '@fountain-ui/core';\nimport ReloadButton from './ReloadButton';\nimport EncodedTile from './EncodedTile';\n\nexport interface ViewerItemProps {\n /**\n * Image width.\n */\n width: number;\n\n /**\n * Image height.\n */\n height: number;\n\n /**\n * Need invisible paddingTop viewer vertically expanded.\n */\n invisiblePaddingTop: number;\n\n /**\n * Image sourceUrl for displaying.\n */\n url?: string;\n\n /**\n * Error handler.\n */\n onError?: ImageProps['onError'];\n\n /**\n * Load handler.\n */\n onLoad?: ImageProps['onLoad'];\n\n /**\n * Handle Reload button press event.\n */\n onReloadPress?: ImageProps['onError'];\n\n /**\n * Handle item press event.\n */\n onPress?: () => void;\n\n /**\n * If true, reload button visible.\n * @default false\n */\n reloadButtonVisible?: boolean;\n}\n\nexport default function ViewerItem(props: ViewerItemProps) {\n const {\n height,\n url,\n width,\n invisiblePaddingTop,\n onError,\n onLoad,\n onPress,\n onReloadPress,\n reloadButtonVisible = false,\n } = props;\n\n const styles = {\n view: {\n height,\n width: '100%',\n paddingTop: invisiblePaddingTop,\n },\n image: {\n height: height - invisiblePaddingTop,\n width,\n },\n };\n\n const error = reloadButtonVisible ? <ReloadButton onPress={onReloadPress}/> : null;\n\n const placeholder = <Image\n source={{ uri: EncodedTile }}\n resizeMode={'cover'}\n style={styles.image}\n />;\n\n return (\n <TouchableWithoutFeedback onPress={onPress}>\n <View style={styles.view}>\n <FuiImage\n cache={'web'}\n disableDrag={true}\n disableLongClick={true}\n disableOutline={true}\n error={error}\n onError={onError}\n onLoad={onLoad}\n loading={'eager'}\n placeholder={placeholder}\n source={{ uri: url }}\n square={true}\n style={css([\n { alignSelf: 'center' },\n styles.image,\n ])}\n />\n </View>\n </TouchableWithoutFeedback>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;AAkDe,SAASA,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,MADE;IAEFC,GAFE;IAGFC,KAHE;IAIFC,mBAJE;IAKFC,OALE;IAMFC,MANE;IAOFC,OAPE;IAQFC,aARE;IASFC,mBAAmB,GAAG;EATpB,IAUFT,KAVJ;EAYA,MAAMU,MAAM,GAAG;IACXC,IAAI,EAAE;MACFV,MADE;MAEFE,KAAK,EAAE,MAFL;MAGFS,UAAU,EAAER;IAHV,CADK;IAMXS,KAAK,EAAE;MACHZ,MAAM,EAAEA,MAAM,GAAGG,mBADd;MAEHD;IAFG;EANI,CAAf;EAYA,MAAMW,KAAK,GAAGL,mBAAmB,gBAAG,6BAAC,qBAAD;IAAc,OAAO,EAAED;EAAvB,EAAH,GAA6C,IAA9E;;EAEA,MAAMO,WAAW,gBAAG,6BAAC,kBAAD;IAChB,MAAM,EAAE;MAAEC,GAAG,EAAEC;IAAP,CADQ;IAEhB,UAAU,EAAE,OAFI;IAGhB,KAAK,EAAEP,MAAM,CAACG;EAHE,EAApB;;EAMA,oBACI,6BAAC,qCAAD;IAA0B,OAAO,EAAEN;EAAnC,gBACI,6BAAC,iBAAD;IAAM,KAAK,EAAEG,MAAM,CAACC;EAApB,gBACI,6BAAC,WAAD;IACI,KAAK,EAAE,KADX;IAEI,WAAW,EAAE,IAFjB;IAGI,gBAAgB,EAAE,IAHtB;IAII,cAAc,EAAE,IAJpB;IAKI,KAAK,EAAEG,KALX;IAMI,OAAO,EAAET,OANb;IAOI,MAAM,EAAEC,MAPZ;IAQI,OAAO,EAAE,OARb;IASI,WAAW,EAAES,WATjB;IAUI,MAAM,EAAE;MAAEC,GAAG,EAAEd;IAAP,CAVZ;IAWI,MAAM,EAAE,IAXZ;IAYI,KAAK,EAAE,IAAAgB,SAAA,EAAI,CACP;MAAEC,SAAS,EAAE;IAAb,CADO,EAEPT,MAAM,CAACG,KAFA,CAAJ;EAZX,EADJ,CADJ,CADJ;AAuBH;;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './ComicViewer';\nexport type { Dimension, default as ComicViewerProps } from './ComicViewerProps';\nexport type { ViewerItemProps } from './ViewerItem';\n"],"mappings":";;;;;;;;;;;;AAAA"}
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './ComicViewer';\nexport type { Dimension, default as ComicViewerProps } from './ComicViewerProps';\nexport type { ViewerItemProps } from './ViewerItem';\nexport type {\n AbsolutePosition,\n FastScrollInstance,\n FastScrollOptions,\n VisibleDurations,\n} from './FastScrollProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.percentageToOffset = exports.offsetToPercentage = void 0;
|
|
7
|
+
|
|
8
|
+
const offsetToPercentage = (offset, total) => {
|
|
9
|
+
if (offset === 0 || total === 0) {
|
|
10
|
+
return 0;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
return offset / total * 100;
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
exports.offsetToPercentage = offsetToPercentage;
|
|
17
|
+
|
|
18
|
+
const percentageToOffset = (percentage, total) => {
|
|
19
|
+
if (percentage === 0 || total === 0) {
|
|
20
|
+
return 0;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
return percentage / 100 * total;
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
exports.percentageToOffset = percentageToOffset;
|
|
27
|
+
//# sourceMappingURL=util.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["offsetToPercentage","offset","total","percentageToOffset","percentage"],"sources":["util.ts"],"sourcesContent":["export const offsetToPercentage = (offset: number, total: number) => {\n if (offset === 0 || total === 0) {\n return 0;\n }\n\n return offset / total * 100;\n};\n\nexport const percentageToOffset = (percentage: number, total: number) => {\n if (percentage === 0 || total === 0) {\n return 0;\n }\n\n return percentage / 100 * total;\n};\n"],"mappings":";;;;;;;AAAO,MAAMA,kBAAkB,GAAG,CAACC,MAAD,EAAiBC,KAAjB,KAAmC;EACjE,IAAID,MAAM,KAAK,CAAX,IAAgBC,KAAK,KAAK,CAA9B,EAAiC;IAC7B,OAAO,CAAP;EACH;;EAED,OAAOD,MAAM,GAAGC,KAAT,GAAiB,GAAxB;AACH,CANM;;;;AAQA,MAAMC,kBAAkB,GAAG,CAACC,UAAD,EAAqBF,KAArB,KAAuC;EACrE,IAAIE,UAAU,KAAK,CAAf,IAAoBF,KAAK,KAAK,CAAlC,EAAqC;IACjC,OAAO,CAAP;EACH;;EAED,OAAOE,UAAU,GAAG,GAAb,GAAmBF,KAA1B;AACH,CANM"}
|