@applicaster/zapp-react-native-ui-components 12.0.0-rc.111 → 12.0.0-rc.112
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/Components/MasterCell/DefaultComponents/BorderContainerView/index.tsx +1 -1
- package/Components/MasterCell/SharedUI/ProgressBar/hooks/useFillInPercent.ts +7 -1
- package/Components/VideoModal/ModalAnimation/AnimatedScrollModal.tsx +17 -1
- package/Components/VideoModal/ModalAnimation/AnimationComponent.tsx +17 -0
- package/package.json +5 -5
|
@@ -128,7 +128,7 @@ export const BorderContainerView = (props: Props) => {
|
|
|
128
128
|
: {};
|
|
129
129
|
|
|
130
130
|
return (
|
|
131
|
-
<View {...props} style={[style, styles.container]}>
|
|
131
|
+
<View {...props} style={[style, styles.container]} pointerEvents="box-none">
|
|
132
132
|
<Border style={style} padding={padding} borderPosition={borderPosition} />
|
|
133
133
|
{children}
|
|
134
134
|
</View>
|
|
@@ -5,6 +5,7 @@ import * as R from "ramda";
|
|
|
5
5
|
|
|
6
6
|
import { useActions } from "@applicaster/zapp-react-native-utils/reactHooks/actions";
|
|
7
7
|
import { normalizeProgressValue } from "./utils";
|
|
8
|
+
import { useIsScreenActive } from "@applicaster/zapp-react-native-utils/reactHooks";
|
|
8
9
|
|
|
9
10
|
const ACTION_NAME = "continue-watching";
|
|
10
11
|
const DEFAULT_FILL = 0;
|
|
@@ -27,6 +28,7 @@ const getProgressValue = (
|
|
|
27
28
|
|
|
28
29
|
export const useFillInPercent = (entry: ZappEntry): number => {
|
|
29
30
|
const action = useActions(ACTION_NAME);
|
|
31
|
+
const isActive = useIsScreenActive();
|
|
30
32
|
|
|
31
33
|
const [fillInPercent, setFillInPercent] =
|
|
32
34
|
React.useState<number>(DEFAULT_FILL);
|
|
@@ -39,6 +41,10 @@ export const useFillInPercent = (entry: ZappEntry): number => {
|
|
|
39
41
|
}, []);
|
|
40
42
|
|
|
41
43
|
React.useEffect(() => {
|
|
44
|
+
if (!isActive) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
|
|
42
48
|
// refresh progress in UI when it was changed in CW
|
|
43
49
|
const unsubscribe = action?.addDataSourceListener?.(() => {
|
|
44
50
|
getProgressValue(action, entry, (progress) => {
|
|
@@ -49,7 +55,7 @@ export const useFillInPercent = (entry: ZappEntry): number => {
|
|
|
49
55
|
return () => {
|
|
50
56
|
unsubscribe?.();
|
|
51
57
|
};
|
|
52
|
-
}, []);
|
|
58
|
+
}, [isActive]);
|
|
53
59
|
|
|
54
60
|
return fillInPercent;
|
|
55
61
|
};
|
|
@@ -200,7 +200,23 @@ export const AnimatedScrollModalComponent = ({ children }: Props) => {
|
|
|
200
200
|
videoModalState.mode === "MINIMIZED" &&
|
|
201
201
|
videoModalState.previousMode === "MAXIMIZED"
|
|
202
202
|
) {
|
|
203
|
-
|
|
203
|
+
// set animation to the minimize values if moving from the player to another screen
|
|
204
|
+
if (playerAnimationState === null) {
|
|
205
|
+
setScrollModalAnimatedValue(
|
|
206
|
+
translateYOffset,
|
|
207
|
+
modalSnapPoints[1],
|
|
208
|
+
setLastSnap
|
|
209
|
+
);
|
|
210
|
+
|
|
211
|
+
resetScrollAnimatedValues(
|
|
212
|
+
lastScrollY,
|
|
213
|
+
lastScrollYValue,
|
|
214
|
+
dragScrollY,
|
|
215
|
+
dragVideoPlayerY
|
|
216
|
+
);
|
|
217
|
+
} else {
|
|
218
|
+
resetPlayerAnimationState();
|
|
219
|
+
}
|
|
204
220
|
}
|
|
205
221
|
|
|
206
222
|
if (
|
|
@@ -309,6 +309,23 @@ export const AnimationView = ({
|
|
|
309
309
|
}
|
|
310
310
|
}, [additionalData, screenWidth]);
|
|
311
311
|
|
|
312
|
+
React.useEffect(() => {
|
|
313
|
+
if (
|
|
314
|
+
videoModalState.mode === "MINIMIZED" &&
|
|
315
|
+
videoModalState.previousMode === "MAXIMIZED"
|
|
316
|
+
) {
|
|
317
|
+
// set animation to the minimize values if moving from the player to another screen
|
|
318
|
+
if (playerAnimationState === null) {
|
|
319
|
+
const value = getAnimationValue(
|
|
320
|
+
animationType,
|
|
321
|
+
PlayerAnimationStateEnum.minimize
|
|
322
|
+
).toValue;
|
|
323
|
+
|
|
324
|
+
animatedValue.setValue(value);
|
|
325
|
+
}
|
|
326
|
+
}
|
|
327
|
+
}, [videoModalState]);
|
|
328
|
+
|
|
312
329
|
React.useEffect(() => {
|
|
313
330
|
if (
|
|
314
331
|
playerAnimationState === PlayerAnimationStateEnum.minimize &&
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@applicaster/zapp-react-native-ui-components",
|
|
3
|
-
"version": "12.0.0-rc.
|
|
3
|
+
"version": "12.0.0-rc.112",
|
|
4
4
|
"description": "Applicaster Zapp React Native ui components for the Quick Brick App",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"types": "index.d.ts",
|
|
@@ -34,10 +34,10 @@
|
|
|
34
34
|
"redux-mock-store": "^1.5.3"
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@applicaster/applicaster-types": "12.0.0-rc.
|
|
38
|
-
"@applicaster/zapp-react-native-bridge": "12.0.0-rc.
|
|
39
|
-
"@applicaster/zapp-react-native-redux": "12.0.0-rc.
|
|
40
|
-
"@applicaster/zapp-react-native-utils": "12.0.0-rc.
|
|
37
|
+
"@applicaster/applicaster-types": "12.0.0-rc.112",
|
|
38
|
+
"@applicaster/zapp-react-native-bridge": "12.0.0-rc.112",
|
|
39
|
+
"@applicaster/zapp-react-native-redux": "12.0.0-rc.112",
|
|
40
|
+
"@applicaster/zapp-react-native-utils": "12.0.0-rc.112",
|
|
41
41
|
"promise": "^8.3.0",
|
|
42
42
|
"react-router-native": "^5.1.2",
|
|
43
43
|
"url": "^0.11.0",
|