@shopify/react-native-skia 1.3.2 → 1.3.3
Sign up to get free protection for your applications and to get access to all the features.
- package/android/cpp/rnskia-android/RNSkAndroidVideo.cpp +59 -1
- package/android/cpp/rnskia-android/RNSkAndroidVideo.h +4 -0
- package/android/src/main/java/com/shopify/reactnative/skia/RNSkVideo.java +80 -7
- package/cpp/api/JsiVideo.h +32 -7
- package/cpp/rnskia/RNSkVideo.h +4 -0
- package/ios/RNSkia-iOS/RNSkiOSVideo.h +13 -4
- package/ios/RNSkia-iOS/RNSkiOSVideo.mm +65 -67
- package/lib/commonjs/dom/nodes/datatypes/Fitting.js +42 -30
- package/lib/commonjs/dom/nodes/datatypes/Fitting.js.map +1 -1
- package/lib/commonjs/external/reanimated/useVideo.d.ts +16 -4
- package/lib/commonjs/external/reanimated/useVideo.js +76 -14
- package/lib/commonjs/external/reanimated/useVideo.js.map +1 -1
- package/lib/commonjs/renderer/components/shapes/FitBox.d.ts +2 -10
- package/lib/commonjs/renderer/components/shapes/FitBox.js +32 -3
- package/lib/commonjs/renderer/components/shapes/FitBox.js.map +1 -1
- package/lib/commonjs/skia/core/Matrix.js +5 -1
- package/lib/commonjs/skia/core/Matrix.js.map +1 -1
- package/lib/commonjs/skia/types/Matrix.js +2 -0
- package/lib/commonjs/skia/types/Matrix.js.map +1 -1
- package/lib/commonjs/skia/types/Video/Video.d.ts +9 -1
- package/lib/commonjs/skia/types/Video/Video.js.map +1 -1
- package/lib/module/dom/nodes/datatypes/Fitting.js +41 -29
- package/lib/module/dom/nodes/datatypes/Fitting.js.map +1 -1
- package/lib/module/external/reanimated/useVideo.d.ts +16 -4
- package/lib/module/external/reanimated/useVideo.js +76 -14
- package/lib/module/external/reanimated/useVideo.js.map +1 -1
- package/lib/module/renderer/components/shapes/FitBox.d.ts +2 -10
- package/lib/module/renderer/components/shapes/FitBox.js +32 -3
- package/lib/module/renderer/components/shapes/FitBox.js.map +1 -1
- package/lib/module/skia/core/Matrix.js +5 -1
- package/lib/module/skia/core/Matrix.js.map +1 -1
- package/lib/module/skia/types/Matrix.js +2 -0
- package/lib/module/skia/types/Matrix.js.map +1 -1
- package/lib/module/skia/types/Video/Video.d.ts +9 -1
- package/lib/module/skia/types/Video/Video.js.map +1 -1
- package/lib/typescript/src/external/reanimated/useVideo.d.ts +16 -4
- package/lib/typescript/src/renderer/components/shapes/FitBox.d.ts +2 -10
- package/lib/typescript/src/skia/types/Video/Video.d.ts +9 -1
- package/package.json +1 -1
- package/src/dom/nodes/datatypes/Fitting.ts +28 -21
- package/src/external/reanimated/useVideo.ts +90 -29
- package/src/renderer/components/shapes/FitBox.tsx +38 -4
- package/src/skia/core/Matrix.ts +4 -2
- package/src/skia/types/Matrix.ts +1 -0
- package/src/skia/types/Video/Video.ts +7 -1
- package/lib/commonjs/external/reanimated/video.d.ts +0 -16
- package/lib/commonjs/external/reanimated/video.js +0 -54
- package/lib/commonjs/external/reanimated/video.js.map +0 -1
- package/lib/module/external/reanimated/video.d.ts +0 -16
- package/lib/module/external/reanimated/video.js +0 -46
- package/lib/module/external/reanimated/video.js.map +0 -1
- package/lib/typescript/src/external/reanimated/video.d.ts +0 -16
- package/src/external/reanimated/video.ts +0 -82
@@ -1,9 +1,21 @@
|
|
1
|
+
import type { SharedValue } from "react-native-reanimated";
|
1
2
|
import type { SkImage } from "../../skia/types";
|
2
|
-
|
3
|
+
type Animated<T> = SharedValue<T> | T;
|
4
|
+
interface PlaybackOptions {
|
5
|
+
looping: Animated<boolean>;
|
6
|
+
paused: Animated<boolean>;
|
7
|
+
seek: Animated<number | null>;
|
8
|
+
volume: Animated<number>;
|
9
|
+
}
|
3
10
|
export declare const useVideo: (source: string | null, userOptions?: Partial<PlaybackOptions>) => {
|
4
|
-
currentFrame:
|
5
|
-
currentTime:
|
11
|
+
currentFrame: SharedValue<SkImage | null>;
|
12
|
+
currentTime: SharedValue<number>;
|
6
13
|
duration: number;
|
7
14
|
framerate: number;
|
8
|
-
|
15
|
+
rotation: import("../../skia/types").VideoRotation;
|
16
|
+
size: {
|
17
|
+
width: number;
|
18
|
+
height: number;
|
19
|
+
};
|
9
20
|
};
|
21
|
+
export {};
|
@@ -6,15 +6,30 @@ Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
exports.useVideo = void 0;
|
7
7
|
var _react = require("react");
|
8
8
|
var _Skia = require("../../skia/Skia");
|
9
|
+
var _Platform = require("../../Platform");
|
9
10
|
var _ReanimatedProxy = _interopRequireDefault(require("./ReanimatedProxy"));
|
10
|
-
var _video = require("./video");
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
12
|
+
const setFrame = (video, currentFrame) => {
|
13
|
+
"worklet";
|
14
|
+
|
15
|
+
const img = video.nextImage();
|
16
|
+
if (img) {
|
17
|
+
if (currentFrame.value) {
|
18
|
+
currentFrame.value.dispose();
|
19
|
+
}
|
20
|
+
if (_Platform.Platform.OS === "android") {
|
21
|
+
currentFrame.value = img.makeNonTextureImage();
|
22
|
+
} else {
|
23
|
+
currentFrame.value = img;
|
24
|
+
}
|
25
|
+
}
|
26
|
+
};
|
12
27
|
const defaultOptions = {
|
13
|
-
playbackSpeed: 1,
|
14
28
|
looping: true,
|
15
29
|
paused: false,
|
16
30
|
seek: null,
|
17
|
-
currentTime: 0
|
31
|
+
currentTime: 0,
|
32
|
+
volume: 0
|
18
33
|
};
|
19
34
|
const useOption = value => {
|
20
35
|
"worklet";
|
@@ -29,12 +44,12 @@ const disposeVideo = video => {
|
|
29
44
|
video === null || video === void 0 || video.dispose();
|
30
45
|
};
|
31
46
|
const useVideo = (source, userOptions) => {
|
32
|
-
var _userOptions$paused, _userOptions$looping, _userOptions$seek, _userOptions$
|
47
|
+
var _userOptions$paused, _userOptions$looping, _userOptions$seek, _userOptions$volume;
|
33
48
|
const video = (0, _react.useMemo)(() => source ? _Skia.Skia.Video(source) : null, [source]);
|
34
49
|
const isPaused = useOption((_userOptions$paused = userOptions === null || userOptions === void 0 ? void 0 : userOptions.paused) !== null && _userOptions$paused !== void 0 ? _userOptions$paused : defaultOptions.paused);
|
35
50
|
const looping = useOption((_userOptions$looping = userOptions === null || userOptions === void 0 ? void 0 : userOptions.looping) !== null && _userOptions$looping !== void 0 ? _userOptions$looping : defaultOptions.looping);
|
36
51
|
const seek = useOption((_userOptions$seek = userOptions === null || userOptions === void 0 ? void 0 : userOptions.seek) !== null && _userOptions$seek !== void 0 ? _userOptions$seek : defaultOptions.seek);
|
37
|
-
const
|
52
|
+
const volume = useOption((_userOptions$volume = userOptions === null || userOptions === void 0 ? void 0 : userOptions.volume) !== null && _userOptions$volume !== void 0 ? _userOptions$volume : defaultOptions.volume);
|
38
53
|
const currentFrame = _ReanimatedProxy.default.useSharedValue(null);
|
39
54
|
const currentTime = _ReanimatedProxy.default.useSharedValue(0);
|
40
55
|
const lastTimestamp = _ReanimatedProxy.default.useSharedValue(-1);
|
@@ -46,16 +61,62 @@ const useVideo = (source, userOptions) => {
|
|
46
61
|
var _video$framerate;
|
47
62
|
return (_video$framerate = video === null || video === void 0 ? void 0 : video.framerate()) !== null && _video$framerate !== void 0 ? _video$framerate : 0;
|
48
63
|
}, [video]);
|
49
|
-
const
|
50
|
-
var _video$
|
51
|
-
return (_video$
|
64
|
+
const size = (0, _react.useMemo)(() => {
|
65
|
+
var _video$size;
|
66
|
+
return (_video$size = video === null || video === void 0 ? void 0 : video.size()) !== null && _video$size !== void 0 ? _video$size : {
|
67
|
+
width: 0,
|
68
|
+
height: 0
|
69
|
+
};
|
70
|
+
}, [video]);
|
71
|
+
const rotation = (0, _react.useMemo)(() => {
|
72
|
+
var _video$rotation;
|
73
|
+
return (_video$rotation = video === null || video === void 0 ? void 0 : video.rotation()) !== null && _video$rotation !== void 0 ? _video$rotation : 0;
|
52
74
|
}, [video]);
|
75
|
+
const frameDuration = 1000 / framerate;
|
76
|
+
const currentFrameDuration = Math.floor(frameDuration);
|
77
|
+
_ReanimatedProxy.default.useAnimatedReaction(() => isPaused.value, paused => {
|
78
|
+
if (paused) {
|
79
|
+
video === null || video === void 0 || video.pause();
|
80
|
+
} else {
|
81
|
+
lastTimestamp.value = -1;
|
82
|
+
video === null || video === void 0 || video.play();
|
83
|
+
}
|
84
|
+
});
|
85
|
+
_ReanimatedProxy.default.useAnimatedReaction(() => seek.value, value => {
|
86
|
+
if (value !== null) {
|
87
|
+
video === null || video === void 0 || video.seek(value);
|
88
|
+
currentTime.value = value;
|
89
|
+
seek.value = null;
|
90
|
+
}
|
91
|
+
});
|
92
|
+
_ReanimatedProxy.default.useAnimatedReaction(() => volume.value, value => {
|
93
|
+
video === null || video === void 0 || video.setVolume(value);
|
94
|
+
});
|
53
95
|
_ReanimatedProxy.default.useFrameCallback(frameInfo => {
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
}
|
96
|
+
"worklet";
|
97
|
+
|
98
|
+
if (!video) {
|
99
|
+
return;
|
100
|
+
}
|
101
|
+
if (isPaused.value) {
|
102
|
+
return;
|
103
|
+
}
|
104
|
+
const currentTimestamp = frameInfo.timestamp;
|
105
|
+
if (lastTimestamp.value === -1) {
|
106
|
+
lastTimestamp.value = currentTimestamp;
|
107
|
+
}
|
108
|
+
const delta = currentTimestamp - lastTimestamp.value;
|
109
|
+
const isOver = currentTime.value + delta > duration;
|
110
|
+
if (isOver && looping.value) {
|
111
|
+
seek.value = 0;
|
112
|
+
currentTime.value = seek.value;
|
113
|
+
lastTimestamp.value = currentTimestamp;
|
114
|
+
}
|
115
|
+
if (delta >= currentFrameDuration && !isOver) {
|
116
|
+
setFrame(video, currentFrame);
|
117
|
+
currentTime.value += delta;
|
118
|
+
lastTimestamp.value = currentTimestamp;
|
119
|
+
}
|
59
120
|
});
|
60
121
|
(0, _react.useEffect)(() => {
|
61
122
|
return () => {
|
@@ -68,7 +129,8 @@ const useVideo = (source, userOptions) => {
|
|
68
129
|
currentTime,
|
69
130
|
duration,
|
70
131
|
framerate,
|
71
|
-
|
132
|
+
rotation,
|
133
|
+
size
|
72
134
|
};
|
73
135
|
};
|
74
136
|
exports.useVideo = useVideo;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_react","require","_Skia","
|
1
|
+
{"version":3,"names":["_react","require","_Skia","_Platform","_ReanimatedProxy","_interopRequireDefault","obj","__esModule","default","setFrame","video","currentFrame","img","nextImage","value","dispose","Platform","OS","makeNonTextureImage","defaultOptions","looping","paused","seek","currentTime","volume","useOption","defaultValue","Rea","useSharedValue","isSharedValue","disposeVideo","useVideo","source","userOptions","_userOptions$paused","_userOptions$looping","_userOptions$seek","_userOptions$volume","useMemo","Skia","Video","isPaused","lastTimestamp","duration","_video$duration","framerate","_video$framerate","size","_video$size","width","height","rotation","_video$rotation","frameDuration","currentFrameDuration","Math","floor","useAnimatedReaction","pause","play","setVolume","useFrameCallback","frameInfo","currentTimestamp","timestamp","delta","isOver","useEffect","runOnUI","exports"],"sources":["useVideo.ts"],"sourcesContent":["import type { SharedValue, FrameInfo } from \"react-native-reanimated\";\nimport { useEffect, useMemo } from \"react\";\n\nimport { Skia } from \"../../skia/Skia\";\nimport type { SkImage, Video } from \"../../skia/types\";\nimport { Platform } from \"../../Platform\";\n\nimport Rea from \"./ReanimatedProxy\";\n\ntype Animated<T> = SharedValue<T> | T;\n\ninterface PlaybackOptions {\n looping: Animated<boolean>;\n paused: Animated<boolean>;\n seek: Animated<number | null>;\n volume: Animated<number>;\n}\n\nconst setFrame = (video: Video, currentFrame: SharedValue<SkImage | null>) => {\n \"worklet\";\n const img = video.nextImage();\n if (img) {\n if (currentFrame.value) {\n currentFrame.value.dispose();\n }\n if (Platform.OS === \"android\") {\n currentFrame.value = img.makeNonTextureImage();\n } else {\n currentFrame.value = img;\n }\n }\n};\n\nconst defaultOptions = {\n looping: true,\n paused: false,\n seek: null,\n currentTime: 0,\n volume: 0,\n};\n\nconst useOption = <T>(value: Animated<T>) => {\n \"worklet\";\n // TODO: only create defaultValue is needed (via makeMutable)\n const defaultValue = Rea.useSharedValue(\n Rea.isSharedValue(value) ? value.value : value\n );\n return Rea.isSharedValue(value) ? value : defaultValue;\n};\n\nconst disposeVideo = (video: Video | null) => {\n \"worklet\";\n video?.dispose();\n};\n\nexport const useVideo = (\n source: string | null,\n userOptions?: Partial<PlaybackOptions>\n) => {\n const video = useMemo(() => (source ? Skia.Video(source) : null), [source]);\n const isPaused = useOption(userOptions?.paused ?? defaultOptions.paused);\n const looping = useOption(userOptions?.looping ?? defaultOptions.looping);\n const seek = useOption(userOptions?.seek ?? defaultOptions.seek);\n const volume = useOption(userOptions?.volume ?? defaultOptions.volume);\n const currentFrame = Rea.useSharedValue<null | SkImage>(null);\n const currentTime = Rea.useSharedValue(0);\n const lastTimestamp = Rea.useSharedValue(-1);\n const duration = useMemo(() => video?.duration() ?? 0, [video]);\n const framerate = useMemo(() => video?.framerate() ?? 0, [video]);\n const size = useMemo(() => video?.size() ?? { width: 0, height: 0 }, [video]);\n const rotation = useMemo(() => video?.rotation() ?? 0, [video]);\n const frameDuration = 1000 / framerate;\n const currentFrameDuration = Math.floor(frameDuration);\n Rea.useAnimatedReaction(\n () => isPaused.value,\n (paused) => {\n if (paused) {\n video?.pause();\n } else {\n lastTimestamp.value = -1;\n video?.play();\n }\n }\n );\n Rea.useAnimatedReaction(\n () => seek.value,\n (value) => {\n if (value !== null) {\n video?.seek(value);\n currentTime.value = value;\n seek.value = null;\n }\n }\n );\n Rea.useAnimatedReaction(\n () => volume.value,\n (value) => {\n video?.setVolume(value);\n }\n );\n Rea.useFrameCallback((frameInfo: FrameInfo) => {\n \"worklet\";\n if (!video) {\n return;\n }\n if (isPaused.value) {\n return;\n }\n const currentTimestamp = frameInfo.timestamp;\n if (lastTimestamp.value === -1) {\n lastTimestamp.value = currentTimestamp;\n }\n const delta = currentTimestamp - lastTimestamp.value;\n\n const isOver = currentTime.value + delta > duration;\n if (isOver && looping.value) {\n seek.value = 0;\n currentTime.value = seek.value;\n lastTimestamp.value = currentTimestamp;\n }\n if (delta >= currentFrameDuration && !isOver) {\n setFrame(video, currentFrame);\n currentTime.value += delta;\n lastTimestamp.value = currentTimestamp;\n }\n });\n\n useEffect(() => {\n return () => {\n // TODO: should video simply be a shared value instead?\n Rea.runOnUI(disposeVideo)(video);\n };\n }, [video]);\n\n return {\n currentFrame,\n currentTime,\n duration,\n framerate,\n rotation,\n size,\n };\n};\n"],"mappings":"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"}
|
@@ -1,21 +1,13 @@
|
|
1
1
|
import type { ReactNode } from "react";
|
2
2
|
import React from "react";
|
3
3
|
import type { Fit } from "../../../dom/nodes";
|
4
|
-
import type { SkRect } from "../../../skia/types";
|
4
|
+
import type { SkRect, Transforms3d } from "../../../skia/types";
|
5
5
|
interface FitProps {
|
6
6
|
fit?: Fit;
|
7
7
|
src: SkRect;
|
8
8
|
dst: SkRect;
|
9
9
|
children: ReactNode | ReactNode[];
|
10
10
|
}
|
11
|
-
export declare const fitbox: (fit: Fit, src: SkRect, dst: SkRect) =>
|
12
|
-
translateX: number;
|
13
|
-
}, {
|
14
|
-
translateY: number;
|
15
|
-
}, {
|
16
|
-
scaleX: number;
|
17
|
-
}, {
|
18
|
-
scaleY: number;
|
19
|
-
}];
|
11
|
+
export declare const fitbox: (fit: Fit, src: SkRect, dst: SkRect, rotation?: 0 | 90 | 180 | 270) => Transforms3d;
|
20
12
|
export declare const FitBox: ({ fit, src, dst, children }: FitProps) => React.JSX.Element;
|
21
13
|
export {};
|
@@ -9,9 +9,38 @@ var _nodes = require("../../../dom/nodes");
|
|
9
9
|
var _Group = require("../Group");
|
10
10
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
11
11
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
12
|
-
const fitbox = (fit, src, dst) => {
|
13
|
-
|
14
|
-
|
12
|
+
const fitbox = (fit, src, dst, rotation = 0) => {
|
13
|
+
"worklet";
|
14
|
+
|
15
|
+
const rects = (0, _nodes.fitRects)(fit, rotation === 90 || rotation === 270 ? {
|
16
|
+
x: 0,
|
17
|
+
y: 0,
|
18
|
+
width: src.height,
|
19
|
+
height: src.width
|
20
|
+
} : src, dst);
|
21
|
+
const result = (0, _nodes.rect2rect)(rects.src, rects.dst);
|
22
|
+
if (rotation === 90) {
|
23
|
+
return [...result, {
|
24
|
+
translate: [src.height, 0]
|
25
|
+
}, {
|
26
|
+
rotate: Math.PI / 2
|
27
|
+
}];
|
28
|
+
}
|
29
|
+
if (rotation === 180) {
|
30
|
+
return [...result, {
|
31
|
+
translate: [src.width, src.height]
|
32
|
+
}, {
|
33
|
+
rotate: Math.PI
|
34
|
+
}];
|
35
|
+
}
|
36
|
+
if (rotation === 270) {
|
37
|
+
return [...result, {
|
38
|
+
translate: [0, src.width]
|
39
|
+
}, {
|
40
|
+
rotate: -Math.PI / 2
|
41
|
+
}];
|
42
|
+
}
|
43
|
+
return result;
|
15
44
|
};
|
16
45
|
exports.fitbox = fitbox;
|
17
46
|
const FitBox = ({
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_nodes","_Group","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","fitbox","fit","src","dst","rects","fitRects","rect2rect","exports","FitBox","children","transform","useMemo","createElement","Group"],"sources":["FitBox.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport React, { useMemo } from \"react\";\n\nimport type { Fit } from \"../../../dom/nodes\";\nimport { fitRects, rect2rect } from \"../../../dom/nodes\";\nimport type { SkRect } from \"../../../skia/types\";\nimport { Group } from \"../Group\";\n\ninterface FitProps {\n fit?: Fit;\n src: SkRect;\n dst: SkRect;\n children: ReactNode | ReactNode[];\n}\n\nexport const fitbox = (fit: Fit
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_nodes","_Group","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","fitbox","fit","src","dst","rotation","rects","fitRects","x","y","width","height","result","rect2rect","translate","rotate","Math","PI","exports","FitBox","children","transform","useMemo","createElement","Group"],"sources":["FitBox.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport React, { useMemo } from \"react\";\n\nimport type { Fit } from \"../../../dom/nodes\";\nimport { fitRects, rect2rect } from \"../../../dom/nodes\";\nimport type { SkRect, Transforms3d } from \"../../../skia/types\";\nimport { Group } from \"../Group\";\n\ninterface FitProps {\n fit?: Fit;\n src: SkRect;\n dst: SkRect;\n children: ReactNode | ReactNode[];\n}\n\nexport const fitbox = (\n fit: Fit,\n src: SkRect,\n dst: SkRect,\n rotation: 0 | 90 | 180 | 270 = 0\n) => {\n \"worklet\";\n const rects = fitRects(\n fit,\n rotation === 90 || rotation === 270\n ? { x: 0, y: 0, width: src.height, height: src.width }\n : src,\n dst\n );\n const result = rect2rect(rects.src, rects.dst);\n if (rotation === 90) {\n return [\n ...result,\n { translate: [src.height, 0] },\n { rotate: Math.PI / 2 },\n ] as Transforms3d;\n }\n if (rotation === 180) {\n return [\n ...result,\n { translate: [src.width, src.height] },\n { rotate: Math.PI },\n ] as Transforms3d;\n }\n if (rotation === 270) {\n return [\n ...result,\n { translate: [0, src.width] },\n { rotate: -Math.PI / 2 },\n ] as Transforms3d;\n }\n return result;\n};\n\nexport const FitBox = ({ fit = \"contain\", src, dst, children }: FitProps) => {\n const transform = useMemo(() => fitbox(fit, src, dst), [dst, fit, src]);\n return <Group transform={transform}>{children}</Group>;\n};\n"],"mappings":"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"}
|
@@ -6,6 +6,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
exports.processTransform2d = void 0;
|
7
7
|
var _Skia = require("../Skia");
|
8
8
|
var _types = require("../types");
|
9
|
-
const processTransform2d = transforms =>
|
9
|
+
const processTransform2d = transforms => {
|
10
|
+
"worklet";
|
11
|
+
|
12
|
+
return (0, _types.processTransform)(_Skia.Skia.Matrix(), transforms);
|
13
|
+
};
|
10
14
|
exports.processTransform2d = processTransform2d;
|
11
15
|
//# sourceMappingURL=Matrix.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_Skia","require","_types","processTransform2d","transforms","processTransform","Skia","Matrix","exports"],"sources":["Matrix.ts"],"sourcesContent":["import { Skia } from \"../Skia\";\nimport type { Transforms3d } from \"../types\";\nimport { processTransform } from \"../types\";\n\nexport const processTransform2d = (transforms: Transforms3d)
|
1
|
+
{"version":3,"names":["_Skia","require","_types","processTransform2d","transforms","processTransform","Skia","Matrix","exports"],"sources":["Matrix.ts"],"sourcesContent":["import { Skia } from \"../Skia\";\nimport type { Transforms3d } from \"../types\";\nimport { processTransform } from \"../types\";\n\nexport const processTransform2d = (transforms: Transforms3d) => {\n \"worklet\";\n return processTransform(Skia.Matrix(), transforms);\n};\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAD,OAAA;AAEO,MAAME,kBAAkB,GAAIC,UAAwB,IAAK;EAC9D,SAAS;;EACT,OAAO,IAAAC,uBAAgB,EAACC,UAAI,CAACC,MAAM,CAAC,CAAC,EAAEH,UAAU,CAAC;AACpD,CAAC;AAACI,OAAA,CAAAL,kBAAA,GAAAA,kBAAA"}
|
@@ -8,6 +8,8 @@ var _Matrix = require("./Matrix4");
|
|
8
8
|
const isMatrix = obj => obj !== null && obj.__typename__ === "Matrix";
|
9
9
|
exports.isMatrix = isMatrix;
|
10
10
|
const processTransform = (m, transforms) => {
|
11
|
+
"worklet";
|
12
|
+
|
11
13
|
const m3 = (0, _Matrix.processTransform3d)(transforms);
|
12
14
|
m.concat(m3);
|
13
15
|
return m;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_Matrix","require","isMatrix","obj","__typename__","exports","processTransform","m","transforms","m3","processTransform3d","concat","toDegrees","rad","Math","PI"],"sources":["Matrix.ts"],"sourcesContent":["import type { SkJSIInstance } from \"./JsiInstance\";\nimport type { SkCanvas } from \"./Canvas\";\nimport type { Matrix3, Matrix4, Transforms3d } from \"./Matrix4\";\nimport { processTransform3d } from \"./Matrix4\";\n\nexport const isMatrix = (obj: unknown): obj is SkMatrix =>\n obj !== null && (obj as SkJSIInstance<string>).__typename__ === \"Matrix\";\n\nexport interface SkMatrix extends SkJSIInstance<\"Matrix\"> {\n concat: (matrix: InputMatrix) => SkMatrix;\n translate: (x: number, y: number) => SkMatrix;\n scale: (x: number, y?: number) => SkMatrix;\n skew: (x: number, y: number) => SkMatrix;\n rotate: (theta: number) => SkMatrix;\n postTranslate: (x: number, y: number) => SkMatrix;\n postScale: (x: number, y?: number) => SkMatrix;\n postSkew: (x: number, y: number) => SkMatrix;\n postRotate: (theta: number) => SkMatrix;\n identity: () => SkMatrix;\n get: () => number[];\n}\n\nexport type InputMatrix = SkMatrix | Matrix3 | Matrix4 | number[];\n\nexport interface TransformProp {\n transform?: Transforms3d;\n}\n\nexport const processTransform = <T extends SkMatrix | SkCanvas>(\n m: T,\n transforms: Transforms3d\n) => {\n const m3 = processTransform3d(transforms);\n m.concat(m3);\n return m;\n};\n\nexport const toDegrees = (rad: number) => {\n return (rad * 180) / Math.PI;\n};\n"],"mappings":";;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAEO,MAAMC,QAAQ,GAAIC,GAAY,IACnCA,GAAG,KAAK,IAAI,IAAKA,GAAG,CAA2BC,YAAY,KAAK,QAAQ;AAACC,OAAA,CAAAH,QAAA,GAAAA,QAAA;AAsBpE,MAAMI,gBAAgB,GAAGA,CAC9BC,CAAI,EACJC,UAAwB,KACrB;EACH,MAAMC,EAAE,GAAG,IAAAC,0BAAkB,EAACF,UAAU,CAAC;EACzCD,CAAC,CAACI,MAAM,CAACF,EAAE,CAAC;EACZ,OAAOF,CAAC;AACV,CAAC;AAACF,OAAA,CAAAC,gBAAA,GAAAA,gBAAA;AAEK,MAAMM,SAAS,GAAIC,GAAW,IAAK;EACxC,OAAQA,GAAG,GAAG,GAAG,GAAIC,IAAI,CAACC,EAAE;AAC9B,CAAC;AAACV,OAAA,CAAAO,SAAA,GAAAA,SAAA"}
|
1
|
+
{"version":3,"names":["_Matrix","require","isMatrix","obj","__typename__","exports","processTransform","m","transforms","m3","processTransform3d","concat","toDegrees","rad","Math","PI"],"sources":["Matrix.ts"],"sourcesContent":["import type { SkJSIInstance } from \"./JsiInstance\";\nimport type { SkCanvas } from \"./Canvas\";\nimport type { Matrix3, Matrix4, Transforms3d } from \"./Matrix4\";\nimport { processTransform3d } from \"./Matrix4\";\n\nexport const isMatrix = (obj: unknown): obj is SkMatrix =>\n obj !== null && (obj as SkJSIInstance<string>).__typename__ === \"Matrix\";\n\nexport interface SkMatrix extends SkJSIInstance<\"Matrix\"> {\n concat: (matrix: InputMatrix) => SkMatrix;\n translate: (x: number, y: number) => SkMatrix;\n scale: (x: number, y?: number) => SkMatrix;\n skew: (x: number, y: number) => SkMatrix;\n rotate: (theta: number) => SkMatrix;\n postTranslate: (x: number, y: number) => SkMatrix;\n postScale: (x: number, y?: number) => SkMatrix;\n postSkew: (x: number, y: number) => SkMatrix;\n postRotate: (theta: number) => SkMatrix;\n identity: () => SkMatrix;\n get: () => number[];\n}\n\nexport type InputMatrix = SkMatrix | Matrix3 | Matrix4 | number[];\n\nexport interface TransformProp {\n transform?: Transforms3d;\n}\n\nexport const processTransform = <T extends SkMatrix | SkCanvas>(\n m: T,\n transforms: Transforms3d\n) => {\n \"worklet\";\n const m3 = processTransform3d(transforms);\n m.concat(m3);\n return m;\n};\n\nexport const toDegrees = (rad: number) => {\n return (rad * 180) / Math.PI;\n};\n"],"mappings":";;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAEO,MAAMC,QAAQ,GAAIC,GAAY,IACnCA,GAAG,KAAK,IAAI,IAAKA,GAAG,CAA2BC,YAAY,KAAK,QAAQ;AAACC,OAAA,CAAAH,QAAA,GAAAA,QAAA;AAsBpE,MAAMI,gBAAgB,GAAGA,CAC9BC,CAAI,EACJC,UAAwB,KACrB;EACH,SAAS;;EACT,MAAMC,EAAE,GAAG,IAAAC,0BAAkB,EAACF,UAAU,CAAC;EACzCD,CAAC,CAACI,MAAM,CAACF,EAAE,CAAC;EACZ,OAAOF,CAAC;AACV,CAAC;AAACF,OAAA,CAAAC,gBAAA,GAAAA,gBAAA;AAEK,MAAMM,SAAS,GAAIC,GAAW,IAAK;EACxC,OAAQA,GAAG,GAAG,GAAG,GAAIC,IAAI,CAACC,EAAE;AAC9B,CAAC;AAACV,OAAA,CAAAO,SAAA,GAAAA,SAAA"}
|
@@ -1,9 +1,17 @@
|
|
1
1
|
import type { SkImage } from "../Image";
|
2
2
|
import type { SkJSIInstance } from "../JsiInstance";
|
3
|
+
export type VideoRotation = 0 | 90 | 180 | 270;
|
3
4
|
export interface Video extends SkJSIInstance<"Video"> {
|
4
5
|
duration(): number;
|
5
6
|
framerate(): number;
|
6
7
|
nextImage(): SkImage | null;
|
7
8
|
seek(time: number): void;
|
8
|
-
|
9
|
+
rotation(): VideoRotation;
|
10
|
+
size(): {
|
11
|
+
width: number;
|
12
|
+
height: number;
|
13
|
+
};
|
14
|
+
pause(): void;
|
15
|
+
play(): void;
|
16
|
+
setVolume(volume: number): void;
|
9
17
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":[],"sources":["Video.ts"],"sourcesContent":["import type { SkImage } from \"../Image\";\nimport type { SkJSIInstance } from \"../JsiInstance\";\n\nexport interface Video extends SkJSIInstance<\"Video\"> {\n duration(): number;\n framerate(): number;\n nextImage(): SkImage | null;\n seek(time: number): void;\n
|
1
|
+
{"version":3,"names":[],"sources":["Video.ts"],"sourcesContent":["import type { SkImage } from \"../Image\";\nimport type { SkJSIInstance } from \"../JsiInstance\";\n\nexport type VideoRotation = 0 | 90 | 180 | 270;\n\nexport interface Video extends SkJSIInstance<\"Video\"> {\n duration(): number;\n framerate(): number;\n nextImage(): SkImage | null;\n seek(time: number): void;\n rotation(): VideoRotation;\n size(): { width: number; height: number };\n pause(): void;\n play(): void;\n setVolume(volume: number): void;\n}\n"],"mappings":""}
|
@@ -1,9 +1,15 @@
|
|
1
1
|
import { exhaustiveCheck } from "../../../renderer/typeddash";
|
2
|
-
export const size = (width = 0, height = 0) =>
|
3
|
-
|
4
|
-
|
5
|
-
|
2
|
+
export const size = (width = 0, height = 0) => {
|
3
|
+
"worklet";
|
4
|
+
|
5
|
+
return {
|
6
|
+
width,
|
7
|
+
height
|
8
|
+
};
|
9
|
+
};
|
6
10
|
export const rect2rect = (src, dst) => {
|
11
|
+
"worklet";
|
12
|
+
|
7
13
|
const scaleX = dst.width / src.width;
|
8
14
|
const scaleY = dst.height / src.height;
|
9
15
|
const translateX = dst.x - src.x * scaleX;
|
@@ -18,35 +24,12 @@ export const rect2rect = (src, dst) => {
|
|
18
24
|
scaleY
|
19
25
|
}];
|
20
26
|
};
|
21
|
-
export const fitRects = (fit, rect, {
|
22
|
-
x,
|
23
|
-
y,
|
24
|
-
width,
|
25
|
-
height
|
26
|
-
}) => {
|
27
|
-
const sizes = applyBoxFit(fit, {
|
28
|
-
width: rect.width,
|
29
|
-
height: rect.height
|
30
|
-
}, {
|
31
|
-
width,
|
32
|
-
height
|
33
|
-
});
|
34
|
-
const src = inscribe(sizes.src, rect);
|
35
|
-
const dst = inscribe(sizes.dst, {
|
36
|
-
x,
|
37
|
-
y,
|
38
|
-
width,
|
39
|
-
height
|
40
|
-
});
|
41
|
-
return {
|
42
|
-
src,
|
43
|
-
dst
|
44
|
-
};
|
45
|
-
};
|
46
27
|
const inscribe = ({
|
47
28
|
width,
|
48
29
|
height
|
49
30
|
}, rect) => {
|
31
|
+
"worklet";
|
32
|
+
|
50
33
|
const halfWidthDelta = (rect.width - width) / 2.0;
|
51
34
|
const halfHeightDelta = (rect.height - height) / 2.0;
|
52
35
|
return {
|
@@ -57,6 +40,8 @@ const inscribe = ({
|
|
57
40
|
};
|
58
41
|
};
|
59
42
|
const applyBoxFit = (fit, input, output) => {
|
43
|
+
"worklet";
|
44
|
+
|
60
45
|
let src = size(),
|
61
46
|
dst = size();
|
62
47
|
if (input.height <= 0.0 || input.width <= 0.0 || output.height <= 0.0 || output.width <= 0.0) {
|
@@ -117,4 +102,31 @@ const applyBoxFit = (fit, input, output) => {
|
|
117
102
|
dst
|
118
103
|
};
|
119
104
|
};
|
105
|
+
export const fitRects = (fit, rect, {
|
106
|
+
x,
|
107
|
+
y,
|
108
|
+
width,
|
109
|
+
height
|
110
|
+
}) => {
|
111
|
+
"worklet";
|
112
|
+
|
113
|
+
const sizes = applyBoxFit(fit, {
|
114
|
+
width: rect.width,
|
115
|
+
height: rect.height
|
116
|
+
}, {
|
117
|
+
width,
|
118
|
+
height
|
119
|
+
});
|
120
|
+
const src = inscribe(sizes.src, rect);
|
121
|
+
const dst = inscribe(sizes.dst, {
|
122
|
+
x,
|
123
|
+
y,
|
124
|
+
width,
|
125
|
+
height
|
126
|
+
});
|
127
|
+
return {
|
128
|
+
src,
|
129
|
+
dst
|
130
|
+
};
|
131
|
+
};
|
120
132
|
//# sourceMappingURL=Fitting.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["exhaustiveCheck","size","width","height","rect2rect","src","dst","scaleX","scaleY","translateX","x","translateY","y","
|
1
|
+
{"version":3,"names":["exhaustiveCheck","size","width","height","rect2rect","src","dst","scaleX","scaleY","translateX","x","translateY","y","inscribe","rect","halfWidthDelta","halfHeightDelta","applyBoxFit","fit","input","output","Math","min","aspectRatio","fitRects","sizes"],"sources":["Fitting.ts"],"sourcesContent":["import { exhaustiveCheck } from \"../../../renderer/typeddash\";\nimport type { SkRect } from \"../../../skia/types\";\nimport type { Fit } from \"../../types\";\n\nexport interface Size {\n width: number;\n height: number;\n}\n\nexport const size = (width = 0, height = 0) => {\n \"worklet\";\n return { width, height };\n};\n\nexport const rect2rect = (\n src: SkRect,\n dst: SkRect\n): [\n { translateX: number },\n { translateY: number },\n { scaleX: number },\n { scaleY: number }\n] => {\n \"worklet\";\n const scaleX = dst.width / src.width;\n const scaleY = dst.height / src.height;\n const translateX = dst.x - src.x * scaleX;\n const translateY = dst.y - src.y * scaleY;\n return [{ translateX }, { translateY }, { scaleX }, { scaleY }];\n};\n\nconst inscribe = (\n { width, height }: Size,\n rect: { x: number; y: number; width: number; height: number }\n) => {\n \"worklet\";\n const halfWidthDelta = (rect.width - width) / 2.0;\n const halfHeightDelta = (rect.height - height) / 2.0;\n return {\n x: rect.x + halfWidthDelta,\n y: rect.y + halfHeightDelta,\n width,\n height,\n };\n};\n\nconst applyBoxFit = (fit: Fit, input: Size, output: Size) => {\n \"worklet\";\n let src = size(),\n dst = size();\n if (\n input.height <= 0.0 ||\n input.width <= 0.0 ||\n output.height <= 0.0 ||\n output.width <= 0.0\n ) {\n return { src, dst };\n }\n switch (fit) {\n case \"fill\":\n src = input;\n dst = output;\n break;\n case \"contain\":\n src = input;\n if (output.width / output.height > src.width / src.height) {\n dst = size((src.width * output.height) / src.height, output.height);\n } else {\n dst = size(output.width, (src.height * output.width) / src.width);\n }\n break;\n case \"cover\":\n if (output.width / output.height > input.width / input.height) {\n src = size(input.width, (input.width * output.height) / output.width);\n } else {\n src = size((input.height * output.width) / output.height, input.height);\n }\n dst = output;\n break;\n case \"fitWidth\":\n src = size(input.width, (input.width * output.height) / output.width);\n dst = size(output.width, (src.height * output.width) / src.width);\n break;\n case \"fitHeight\":\n src = size((input.height * output.width) / output.height, input.height);\n dst = size((src.width * output.height) / src.height, output.height);\n break;\n case \"none\":\n src = size(\n Math.min(input.width, output.width),\n Math.min(input.height, output.height)\n );\n dst = src;\n break;\n case \"scaleDown\":\n src = input;\n dst = input;\n const aspectRatio = input.width / input.height;\n if (dst.height > output.height) {\n dst = size(output.height * aspectRatio, output.height);\n }\n if (dst.width > output.width) {\n dst = size(output.width, output.width / aspectRatio);\n }\n break;\n default:\n exhaustiveCheck(fit);\n }\n return { src, dst };\n};\n\nexport const fitRects = (\n fit: Fit,\n rect: SkRect,\n { x, y, width, height }: SkRect\n) => {\n \"worklet\";\n const sizes = applyBoxFit(\n fit,\n { width: rect.width, height: rect.height },\n { width, height }\n );\n const src = inscribe(sizes.src, rect);\n const dst = inscribe(sizes.dst, {\n x,\n y,\n width,\n height,\n });\n return { src, dst };\n};\n"],"mappings":"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"}
|
@@ -1,9 +1,21 @@
|
|
1
|
+
import type { SharedValue } from "react-native-reanimated";
|
1
2
|
import type { SkImage } from "../../skia/types";
|
2
|
-
|
3
|
+
type Animated<T> = SharedValue<T> | T;
|
4
|
+
interface PlaybackOptions {
|
5
|
+
looping: Animated<boolean>;
|
6
|
+
paused: Animated<boolean>;
|
7
|
+
seek: Animated<number | null>;
|
8
|
+
volume: Animated<number>;
|
9
|
+
}
|
3
10
|
export declare const useVideo: (source: string | null, userOptions?: Partial<PlaybackOptions>) => {
|
4
|
-
currentFrame:
|
5
|
-
currentTime:
|
11
|
+
currentFrame: SharedValue<SkImage | null>;
|
12
|
+
currentTime: SharedValue<number>;
|
6
13
|
duration: number;
|
7
14
|
framerate: number;
|
8
|
-
|
15
|
+
rotation: import("../../skia/types").VideoRotation;
|
16
|
+
size: {
|
17
|
+
width: number;
|
18
|
+
height: number;
|
19
|
+
};
|
9
20
|
};
|
21
|
+
export {};
|