react-native-shine 0.2.2 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +22 -7
- package/lib/module/components/Content.js +232 -0
- package/lib/module/components/Content.js.map +1 -0
- package/lib/module/components/Shine.js +33 -0
- package/lib/module/components/Shine.js.map +1 -0
- package/lib/module/components/ShineGroup.js +92 -0
- package/lib/module/components/ShineGroup.js.map +1 -0
- package/lib/module/enums/waveCallback.js +19 -0
- package/lib/module/enums/waveCallback.js.map +1 -0
- package/lib/module/hooks/useAnimationFrame.js +17 -0
- package/lib/module/hooks/useAnimationFrame.js.map +1 -0
- package/lib/module/hooks/useOrientation.js +10 -0
- package/lib/module/hooks/useOrientation.js.map +1 -0
- package/lib/module/index.js +6 -219
- package/lib/module/index.js.map +1 -1
- package/lib/module/shaders/bindGroupLayouts.js +41 -6
- package/lib/module/shaders/bindGroupLayouts.js.map +1 -1
- package/lib/module/shaders/bindGroupUtils.js +34 -41
- package/lib/module/shaders/bindGroupUtils.js.map +1 -1
- package/lib/module/shaders/fragmentShaders/colorMaskFragment.js +2 -2
- package/lib/module/shaders/fragmentShaders/colorMaskFragment.js.map +1 -1
- package/lib/module/shaders/fragmentShaders/glareFragment.js +115 -0
- package/lib/module/shaders/fragmentShaders/glareFragment.js.map +1 -0
- package/lib/module/shaders/fragmentShaders/holoFragment.js +28 -0
- package/lib/module/shaders/fragmentShaders/holoFragment.js.map +1 -0
- package/lib/module/shaders/fragmentShaders/maskFragment.js +20 -0
- package/lib/module/shaders/fragmentShaders/maskFragment.js.map +1 -0
- package/lib/module/shaders/fragmentShaders/reverseHoloFragment.js +46 -0
- package/lib/module/shaders/fragmentShaders/reverseHoloFragment.js.map +1 -0
- package/lib/module/shaders/pipelineSetups.js +72 -17
- package/lib/module/shaders/pipelineSetups.js.map +1 -1
- package/lib/module/shaders/{resourceManagement.js → resourceManagement/bitmaps.js} +2 -1
- package/lib/module/shaders/resourceManagement/bitmaps.js.map +1 -0
- package/lib/module/shaders/resourceManagement/bufferManager.js +46 -0
- package/lib/module/shaders/resourceManagement/bufferManager.js.map +1 -0
- package/lib/module/shaders/resourceManagement/textures.js +24 -0
- package/lib/module/shaders/resourceManagement/textures.js.map +1 -0
- package/lib/module/shaders/tgpuUtils.js +19 -1
- package/lib/module/shaders/tgpuUtils.js.map +1 -1
- package/lib/module/shaders/utils.js +8 -36
- package/lib/module/shaders/utils.js.map +1 -1
- package/lib/module/shaders/vertexShaders/mainRotationEffectVertex.js +47 -0
- package/lib/module/shaders/vertexShaders/mainRotationEffectVertex.js.map +1 -0
- package/lib/module/types/size.js +2 -0
- package/lib/module/types/size.js.map +1 -0
- package/lib/module/types/typeUtils.js +17 -19
- package/lib/module/types/typeUtils.js.map +1 -1
- package/lib/module/types/vector.js +2 -0
- package/lib/module/types/vector.js.map +1 -0
- package/lib/module/utils/size.js +25 -0
- package/lib/module/utils/size.js.map +1 -0
- package/lib/module/utils/vector.js +168 -0
- package/lib/module/utils/vector.js.map +1 -0
- package/lib/typescript/src/components/Content.d.ts +23 -0
- package/lib/typescript/src/components/Content.d.ts.map +1 -0
- package/lib/typescript/src/components/Shine.d.ts +7 -0
- package/lib/typescript/src/components/Shine.d.ts.map +1 -0
- package/lib/typescript/src/components/ShineGroup.d.ts +6 -0
- package/lib/typescript/src/components/ShineGroup.d.ts.map +1 -0
- package/lib/typescript/src/enums/waveCallback.d.ts +9 -0
- package/lib/typescript/src/enums/waveCallback.d.ts.map +1 -0
- package/lib/typescript/src/hooks/useAnimationFrame.d.ts +2 -0
- package/lib/typescript/src/hooks/useAnimationFrame.d.ts.map +1 -0
- package/lib/typescript/src/hooks/useOrientation.d.ts +4 -0
- package/lib/typescript/src/hooks/useOrientation.d.ts.map +1 -0
- package/lib/typescript/src/index.d.ts +8 -11
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/shaders/bindGroupLayouts.d.ts +46 -8
- package/lib/typescript/src/shaders/bindGroupLayouts.d.ts.map +1 -1
- package/lib/typescript/src/shaders/bindGroupUtils.d.ts +9 -9
- package/lib/typescript/src/shaders/bindGroupUtils.d.ts.map +1 -1
- package/lib/typescript/src/shaders/fragmentShaders/glareFragment.d.ts +8 -0
- package/lib/typescript/src/shaders/fragmentShaders/glareFragment.d.ts.map +1 -0
- package/lib/typescript/src/shaders/fragmentShaders/holoFragment.d.ts +5 -0
- package/lib/typescript/src/shaders/fragmentShaders/holoFragment.d.ts.map +1 -0
- package/lib/typescript/src/shaders/fragmentShaders/maskFragment.d.ts +6 -0
- package/lib/typescript/src/shaders/fragmentShaders/maskFragment.d.ts.map +1 -0
- package/lib/typescript/src/shaders/fragmentShaders/reverseHoloFragment.d.ts +5 -0
- package/lib/typescript/src/shaders/fragmentShaders/reverseHoloFragment.d.ts.map +1 -0
- package/lib/typescript/src/shaders/pipelineSetups.d.ts +9 -4
- package/lib/typescript/src/shaders/pipelineSetups.d.ts.map +1 -1
- package/lib/typescript/src/shaders/{resourceManagement.d.ts → resourceManagement/bitmaps.d.ts} +1 -1
- package/lib/typescript/src/shaders/resourceManagement/bitmaps.d.ts.map +1 -0
- package/lib/typescript/src/shaders/resourceManagement/bufferManager.d.ts +28 -0
- package/lib/typescript/src/shaders/resourceManagement/bufferManager.d.ts.map +1 -0
- package/lib/typescript/src/shaders/resourceManagement/textures.d.ts +8 -0
- package/lib/typescript/src/shaders/resourceManagement/textures.d.ts.map +1 -0
- package/lib/typescript/src/shaders/tgpuUtils.d.ts +5 -1
- package/lib/typescript/src/shaders/tgpuUtils.d.ts.map +1 -1
- package/lib/typescript/src/shaders/utils.d.ts +3 -10
- package/lib/typescript/src/shaders/utils.d.ts.map +1 -1
- package/lib/typescript/src/shaders/vertexShaders/mainRotationEffectVertex.d.ts +6 -0
- package/lib/typescript/src/shaders/vertexShaders/mainRotationEffectVertex.d.ts.map +1 -0
- package/lib/typescript/src/types/size.d.ts +5 -0
- package/lib/typescript/src/types/size.d.ts.map +1 -0
- package/lib/typescript/src/types/typeUtils.d.ts +3 -5
- package/lib/typescript/src/types/typeUtils.d.ts.map +1 -1
- package/lib/typescript/src/types/types.d.ts +10 -3
- package/lib/typescript/src/types/types.d.ts.map +1 -1
- package/lib/typescript/src/types/vector.d.ts +11 -0
- package/lib/typescript/src/types/vector.d.ts.map +1 -0
- package/lib/typescript/src/utils/size.d.ts +5 -0
- package/lib/typescript/src/utils/size.d.ts.map +1 -0
- package/lib/typescript/src/utils/vector.d.ts +33 -0
- package/lib/typescript/src/utils/vector.d.ts.map +1 -0
- package/package.json +7 -5
- package/scripts/postinstall.js +16 -17
- package/src/components/Content.tsx +403 -0
- package/src/components/Shine.tsx +38 -0
- package/src/components/ShineGroup.tsx +100 -0
- package/src/enums/waveCallback.ts +22 -0
- package/src/hooks/useAnimationFrame.ts +21 -0
- package/src/hooks/useOrientation.ts +18 -0
- package/src/index.tsx +14 -322
- package/src/shaders/bindGroupLayouts.ts +45 -8
- package/src/shaders/bindGroupUtils.ts +50 -65
- package/src/shaders/fragmentShaders/colorMaskFragment.ts +2 -2
- package/src/shaders/fragmentShaders/glareFragment.ts +143 -0
- package/src/shaders/fragmentShaders/holoFragment.ts +35 -0
- package/src/shaders/fragmentShaders/maskFragment.ts +31 -0
- package/src/shaders/fragmentShaders/reverseHoloFragment.ts +71 -0
- package/src/shaders/pipelineSetups.ts +152 -20
- package/src/shaders/{resourceManagement.ts → resourceManagement/bitmaps.ts} +1 -0
- package/src/shaders/resourceManagement/bufferManager.ts +82 -0
- package/src/shaders/resourceManagement/textures.ts +42 -0
- package/src/shaders/tgpuUtils.ts +36 -1
- package/src/shaders/utils.ts +13 -57
- package/src/shaders/vertexShaders/mainRotationEffectVertex.ts +76 -0
- package/src/types/size.ts +4 -0
- package/src/types/typeUtils.ts +22 -36
- package/src/types/types.ts +19 -3
- package/src/types/vector.ts +13 -0
- package/src/utils/size.ts +12 -0
- package/src/utils/vector.ts +132 -0
- package/lib/module/shaders/fragmentShaders/bloomFragment.js +0 -66
- package/lib/module/shaders/fragmentShaders/bloomFragment.js.map +0 -1
- package/lib/module/shaders/resourceManagement.js.map +0 -1
- package/lib/typescript/src/shaders/fragmentShaders/bloomFragment.d.ts +0 -6
- package/lib/typescript/src/shaders/fragmentShaders/bloomFragment.d.ts.map +0 -1
- package/lib/typescript/src/shaders/resourceManagement.d.ts.map +0 -1
- package/src/shaders/fragmentShaders/bloomFragment.ts +0 -83
package/src/shaders/utils.ts
CHANGED
|
@@ -1,35 +1,5 @@
|
|
|
1
|
-
import { type TgpuRoot, type TgpuTexture } from 'typegpu';
|
|
2
|
-
import type { quaternion, vec3 } from '../types/types';
|
|
3
1
|
import { Dimensions } from 'react-native';
|
|
4
|
-
|
|
5
|
-
export const createTexture = async (
|
|
6
|
-
root: TgpuRoot,
|
|
7
|
-
size: {
|
|
8
|
-
width: number;
|
|
9
|
-
height: number;
|
|
10
|
-
}
|
|
11
|
-
): Promise<TgpuTexture> => {
|
|
12
|
-
const texture = root['~unstable']
|
|
13
|
-
.createTexture({
|
|
14
|
-
size: [size.width, size.height],
|
|
15
|
-
format: 'rgba8unorm',
|
|
16
|
-
})
|
|
17
|
-
.$usage('sampled', 'render');
|
|
18
|
-
|
|
19
|
-
return texture;
|
|
20
|
-
};
|
|
21
|
-
|
|
22
|
-
export const loadTexture = async (
|
|
23
|
-
root: TgpuRoot,
|
|
24
|
-
imageBitmap: ImageBitmap,
|
|
25
|
-
texture: TgpuTexture
|
|
26
|
-
) => {
|
|
27
|
-
root.device.queue.copyExternalImageToTexture(
|
|
28
|
-
{ source: imageBitmap },
|
|
29
|
-
{ texture: root.unwrap(texture) },
|
|
30
|
-
[imageBitmap.width, imageBitmap.height]
|
|
31
|
-
);
|
|
32
|
-
};
|
|
2
|
+
import type { quaternion, vec3 } from '../types/types';
|
|
33
3
|
|
|
34
4
|
export const rotateVectorByQuaternion = (
|
|
35
5
|
vec: vec3,
|
|
@@ -65,39 +35,25 @@ export const rotateVectorByQuaternion = (
|
|
|
65
35
|
return [rotated[0], rotated[1], rotated[2]];
|
|
66
36
|
};
|
|
67
37
|
|
|
68
|
-
export const clamp = (v: number, min = -1, max = 1) => {
|
|
69
|
-
'worklet';
|
|
70
|
-
return Math.max(min, Math.min(max, v));
|
|
71
|
-
};
|
|
72
|
-
|
|
73
|
-
export const rotate2D = (
|
|
74
|
-
[x, y]: [number, number],
|
|
75
|
-
angleDeg: number
|
|
76
|
-
): [number, number] => {
|
|
77
|
-
'worklet';
|
|
78
|
-
const rad = (angleDeg * Math.PI) / 180;
|
|
79
|
-
const c = Math.cos(rad);
|
|
80
|
-
const s = Math.sin(rad);
|
|
81
|
-
return [x * c - y * s, x * s + y * c];
|
|
82
|
-
};
|
|
83
|
-
|
|
84
38
|
// Simple helper to get angle from dimensions (0 or 90)
|
|
85
39
|
export function getAngleFromDimensions() {
|
|
40
|
+
return 90 * Number(isLandscapeMode());
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
export function isLandscapeMode() {
|
|
86
44
|
const { width, height } = Dimensions.get('window');
|
|
87
|
-
|
|
45
|
+
|
|
46
|
+
return width >= height;
|
|
88
47
|
}
|
|
89
48
|
|
|
90
49
|
// Subscribe to orientation change via Dimensions API only
|
|
91
50
|
export function subscribeToOrientationChange(
|
|
92
|
-
callback: (
|
|
51
|
+
callback: (isLandscape: boolean) => void
|
|
93
52
|
) {
|
|
94
|
-
callback(
|
|
95
|
-
const
|
|
96
|
-
|
|
97
|
-
|
|
53
|
+
const handler = () => callback(isLandscapeMode());
|
|
54
|
+
const subscription = Dimensions.addEventListener('change', handler);
|
|
55
|
+
|
|
56
|
+
handler();
|
|
98
57
|
|
|
99
|
-
|
|
100
|
-
return () => {
|
|
101
|
-
dimSub.remove();
|
|
102
|
-
};
|
|
58
|
+
return () => subscription.remove();
|
|
103
59
|
}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import tgpu from 'typegpu';
|
|
2
|
+
import * as std from 'typegpu/std';
|
|
3
|
+
import * as d from 'typegpu/data';
|
|
4
|
+
import { rotationBindGroupLayout } from '../bindGroupLayouts';
|
|
5
|
+
|
|
6
|
+
const mainRotationEffectVertex = tgpu['~unstable'].vertexFn({
|
|
7
|
+
in: { vertexIndex: d.builtin.vertexIndex },
|
|
8
|
+
out: { position: d.builtin.position, uv: d.vec2f },
|
|
9
|
+
})((input) => {
|
|
10
|
+
const rot = rotationBindGroupLayout.$.vec;
|
|
11
|
+
|
|
12
|
+
// Maximum rotation angles in radians
|
|
13
|
+
const maxAngle = d.f32((25.0 * Math.PI) / 180.0);
|
|
14
|
+
const ax = d.f32(-rot.y * maxAngle); // rotateX depends on vertical touch
|
|
15
|
+
const ay = d.f32(-rot.x * 1.0); // rotateY depends on horizontal touch
|
|
16
|
+
|
|
17
|
+
const positions: d.v2f[] = [
|
|
18
|
+
d.vec2f(-1.0, -1.0),
|
|
19
|
+
d.vec2f(1.0, 1.0),
|
|
20
|
+
d.vec2f(1.0, -1.0),
|
|
21
|
+
d.vec2f(-1.0, -1.0),
|
|
22
|
+
d.vec2f(-1.0, 1.0),
|
|
23
|
+
d.vec2f(1.0, 1.0),
|
|
24
|
+
];
|
|
25
|
+
|
|
26
|
+
const uvs: d.v2f[] = [
|
|
27
|
+
d.vec2f(0.0, 0.0),
|
|
28
|
+
d.vec2f(1.0, 1.0),
|
|
29
|
+
d.vec2f(1.0, 0.0),
|
|
30
|
+
d.vec2f(0.0, 0.0),
|
|
31
|
+
d.vec2f(0.0, 1.0),
|
|
32
|
+
d.vec2f(1.0, 1.0),
|
|
33
|
+
];
|
|
34
|
+
|
|
35
|
+
const index = input.vertexIndex;
|
|
36
|
+
const pos = d.vec3f(positions[index] as d.v2f, 0.0);
|
|
37
|
+
|
|
38
|
+
const pivot = d.vec3f(rot.x, rot.y, 0.0);
|
|
39
|
+
|
|
40
|
+
const relative = std.sub(pos, pivot);
|
|
41
|
+
const cosX = std.cos(ax);
|
|
42
|
+
const sinX = std.sin(ax);
|
|
43
|
+
const rotatedX = d.vec3f(
|
|
44
|
+
relative.x,
|
|
45
|
+
cosX * relative.y - sinX * relative.z,
|
|
46
|
+
sinX * relative.y + cosX * relative.z
|
|
47
|
+
);
|
|
48
|
+
|
|
49
|
+
const cosY = std.cos(ay);
|
|
50
|
+
const sinY = std.sin(ay);
|
|
51
|
+
const rotatedXY = d.vec3f(
|
|
52
|
+
cosY * rotatedX.x + sinY * rotatedX.z,
|
|
53
|
+
rotatedX.y,
|
|
54
|
+
-sinY * rotatedX.x + cosY * rotatedX.z
|
|
55
|
+
);
|
|
56
|
+
|
|
57
|
+
const finalPos3D = std.add(rotatedXY, pivot);
|
|
58
|
+
const perspective = 100.0;
|
|
59
|
+
const zOffset = 2.5;
|
|
60
|
+
const z = finalPos3D.z + zOffset;
|
|
61
|
+
const persp = perspective / (perspective + z);
|
|
62
|
+
|
|
63
|
+
const finalPos = d.vec4f(
|
|
64
|
+
finalPos3D.x * persp,
|
|
65
|
+
finalPos3D.y * persp,
|
|
66
|
+
0.0,
|
|
67
|
+
1.0
|
|
68
|
+
);
|
|
69
|
+
|
|
70
|
+
return {
|
|
71
|
+
position: finalPos,
|
|
72
|
+
uv: uvs[index] as d.v2f,
|
|
73
|
+
};
|
|
74
|
+
});
|
|
75
|
+
|
|
76
|
+
export default mainRotationEffectVertex;
|
package/src/types/typeUtils.ts
CHANGED
|
@@ -1,36 +1,36 @@
|
|
|
1
1
|
import { f32, vec2f, vec3f, vec4f } from 'typegpu/data';
|
|
2
2
|
import type {
|
|
3
|
-
|
|
4
|
-
BloomOptions,
|
|
3
|
+
GlareOptions,
|
|
5
4
|
ColorMask,
|
|
6
5
|
DeepPartiallyOptional,
|
|
7
6
|
vec3,
|
|
7
|
+
HoloOptions,
|
|
8
8
|
} from './types';
|
|
9
9
|
import { div } from 'typegpu/std';
|
|
10
|
-
import
|
|
10
|
+
import { WAVE_CALLBACKS } from '../enums/waveCallback';
|
|
11
11
|
|
|
12
|
-
export const
|
|
13
|
-
options: Partial<
|
|
14
|
-
):
|
|
12
|
+
export const createGlareOptions = (
|
|
13
|
+
options: Partial<GlareOptions>
|
|
14
|
+
): GlareOptions => {
|
|
15
15
|
const {
|
|
16
16
|
glowPower,
|
|
17
17
|
hueShiftAngleMax,
|
|
18
18
|
hueShiftAngleMin,
|
|
19
19
|
hueBlendPower,
|
|
20
20
|
lightIntensity,
|
|
21
|
-
|
|
21
|
+
glareIntensity,
|
|
22
22
|
} = options;
|
|
23
23
|
|
|
24
|
-
const
|
|
24
|
+
const glareOp = {
|
|
25
25
|
glowPower: glowPower ?? 1.0,
|
|
26
26
|
hueShiftAngleMax: hueShiftAngleMax ?? 1.0,
|
|
27
27
|
hueShiftAngleMin: hueShiftAngleMin ?? 0.0,
|
|
28
28
|
hueBlendPower: hueBlendPower ?? 1.0,
|
|
29
29
|
lightIntensity: lightIntensity ?? 1.0,
|
|
30
|
-
|
|
30
|
+
glareIntensity: glareIntensity ?? 1.0,
|
|
31
31
|
};
|
|
32
32
|
|
|
33
|
-
return
|
|
33
|
+
return glareOp;
|
|
34
34
|
};
|
|
35
35
|
|
|
36
36
|
export const mapToF32 = <T extends Record<string, number>>(
|
|
@@ -75,6 +75,18 @@ export const colorMaskToTyped = (colorMask: ColorMask) => {
|
|
|
75
75
|
return result;
|
|
76
76
|
};
|
|
77
77
|
|
|
78
|
+
export const createHoloOptions = (
|
|
79
|
+
options: Partial<HoloOptions>
|
|
80
|
+
): HoloOptions => {
|
|
81
|
+
const { intensity, waveCallback } = options;
|
|
82
|
+
const holoOpt = {
|
|
83
|
+
intensity: intensity ?? 0.7,
|
|
84
|
+
waveCallback: waveCallback ?? WAVE_CALLBACKS.default,
|
|
85
|
+
};
|
|
86
|
+
|
|
87
|
+
return holoOpt;
|
|
88
|
+
};
|
|
89
|
+
|
|
78
90
|
export const numberArrToTyped = (vec: number[]) => {
|
|
79
91
|
let convFn: ((...args: number[]) => any) | null = null;
|
|
80
92
|
switch (vec.length) {
|
|
@@ -94,29 +106,3 @@ export const numberArrToTyped = (vec: number[]) => {
|
|
|
94
106
|
const typed = convFn(...vec);
|
|
95
107
|
return typed;
|
|
96
108
|
};
|
|
97
|
-
|
|
98
|
-
export const createBindGroupPair = (
|
|
99
|
-
bindGroupLayout: TgpuBindGroupLayout,
|
|
100
|
-
bindGroup: TgpuBindGroup
|
|
101
|
-
): BindGroupPair => {
|
|
102
|
-
return { layout: bindGroupLayout, group: bindGroup };
|
|
103
|
-
};
|
|
104
|
-
|
|
105
|
-
export const createBindGroupPairs = (
|
|
106
|
-
bindGroupLayouts: TgpuBindGroupLayout[],
|
|
107
|
-
bindGroups: TgpuBindGroup[]
|
|
108
|
-
): BindGroupPair[] => {
|
|
109
|
-
if (
|
|
110
|
-
bindGroupLayouts.length > 0 &&
|
|
111
|
-
bindGroupLayouts.length !== bindGroups.length
|
|
112
|
-
)
|
|
113
|
-
throw new Error(
|
|
114
|
-
'createBindGroups: bindGroupLayout and bindGroup arrrays must be of the same length'
|
|
115
|
-
);
|
|
116
|
-
const pairs: BindGroupPair[] = [];
|
|
117
|
-
for (let i = 0; i < bindGroupLayouts.length; i++) {
|
|
118
|
-
pairs.push(createBindGroupPair(bindGroupLayouts[i]!, bindGroups[i]!));
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
return pairs;
|
|
122
|
-
};
|
package/src/types/types.ts
CHANGED
|
@@ -1,17 +1,22 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type {
|
|
2
|
+
TgpuBindGroup,
|
|
3
|
+
TgpuBindGroupLayout,
|
|
4
|
+
TgpuRenderPipeline,
|
|
5
|
+
} from 'typegpu';
|
|
6
|
+
import type { WaveCallbackFn } from '../enums/waveCallback';
|
|
2
7
|
|
|
3
8
|
export type vec2 = [number, number];
|
|
4
9
|
export type vec3 = [number, number, number];
|
|
5
10
|
export type vec4 = [number, number, number, number];
|
|
6
11
|
export type quaternion = vec4;
|
|
7
12
|
|
|
8
|
-
export type
|
|
13
|
+
export type GlareOptions = {
|
|
9
14
|
glowPower: number;
|
|
10
15
|
hueShiftAngleMax: number;
|
|
11
16
|
hueShiftAngleMin: number;
|
|
12
17
|
hueBlendPower: number;
|
|
13
18
|
lightIntensity: number;
|
|
14
|
-
|
|
19
|
+
glareIntensity: number;
|
|
15
20
|
};
|
|
16
21
|
|
|
17
22
|
export type ColorMask = {
|
|
@@ -22,6 +27,11 @@ export type ColorMask = {
|
|
|
22
27
|
};
|
|
23
28
|
};
|
|
24
29
|
|
|
30
|
+
export type HoloOptions = {
|
|
31
|
+
intensity: number;
|
|
32
|
+
waveCallback: WaveCallbackFn;
|
|
33
|
+
};
|
|
34
|
+
|
|
25
35
|
//makes all keys besides specified optional
|
|
26
36
|
export type PartiallyOptional<T, K extends keyof T> = {
|
|
27
37
|
[P in K]: T[P];
|
|
@@ -49,3 +59,9 @@ export type BindGroupPair = {
|
|
|
49
59
|
layout: TgpuBindGroupLayout;
|
|
50
60
|
group: TgpuBindGroup;
|
|
51
61
|
};
|
|
62
|
+
|
|
63
|
+
export type ColorAttachment = Parameters<
|
|
64
|
+
TgpuRenderPipeline['withColorAttachment']
|
|
65
|
+
>[0];
|
|
66
|
+
|
|
67
|
+
export type PipelineAttachmentPair = [TgpuRenderPipeline, ColorAttachment];
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { Size } from '../types/size';
|
|
2
|
+
import type { V2d } from '../types/vector';
|
|
3
|
+
|
|
4
|
+
export function sizeToV2d({ width: x, height: y }: Size): V2d {
|
|
5
|
+
'worklet';
|
|
6
|
+
return { x, y };
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
export function sizeFromV2d({ x: width, y: height }: V2d): Size {
|
|
10
|
+
'worklet';
|
|
11
|
+
return { width, height };
|
|
12
|
+
}
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
import type { Transformer, V2d, V3d } from '../types/vector';
|
|
2
|
+
|
|
3
|
+
// 2d
|
|
4
|
+
export function scaleV2d(a: V2d, value: number): V2d {
|
|
5
|
+
'worklet';
|
|
6
|
+
return {
|
|
7
|
+
x: value * a.x,
|
|
8
|
+
y: value * a.y,
|
|
9
|
+
};
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
export const multiplyV2d = scaleV2d;
|
|
13
|
+
|
|
14
|
+
export function addV2d(a: V2d, b: V2d): V2d {
|
|
15
|
+
'worklet';
|
|
16
|
+
return {
|
|
17
|
+
x: a.x + b.x,
|
|
18
|
+
y: a.y + b.y,
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export function angleToV2d(angle: number): V2d {
|
|
23
|
+
'worklet';
|
|
24
|
+
return { x: Math.cos(angle), y: Math.sin(angle) };
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
export function rotateV2d({ x, y }: V2d, rad: number): V2d {
|
|
28
|
+
'worklet';
|
|
29
|
+
const { x: c, y: s } = angleToV2d(rad);
|
|
30
|
+
|
|
31
|
+
return { x: x * c - y * s, y: x * s + y * c };
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
export function negateV2dX({ x, y }: V2d): V2d {
|
|
35
|
+
'worklet';
|
|
36
|
+
return { x: -x, y };
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
export function negateV2dY({ x, y }: V2d): V2d {
|
|
40
|
+
'worklet';
|
|
41
|
+
return { x, y: -y };
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
export function transformV2d({ x, y }: V2d, transformer: Transformer): V2d {
|
|
45
|
+
'worklet';
|
|
46
|
+
return {
|
|
47
|
+
x: transformer(x),
|
|
48
|
+
y: transformer(y),
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
export function clampV2d(v2d: V2d, min: number, max: number): V2d {
|
|
53
|
+
'worklet';
|
|
54
|
+
return transformV2d(v2d, (value) => clamp(value, min, max));
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
export function round2D(v2d: V2d): V2d {
|
|
58
|
+
'worklet';
|
|
59
|
+
return transformV2d(v2d, (value) => Math.round(value));
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
export function areV2dEqual(a: V2d, b: V2d): boolean {
|
|
63
|
+
return a.x === b.x && a.y === b.y;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
export const zeroV2d = { x: 0, y: 0 };
|
|
67
|
+
|
|
68
|
+
// 3d
|
|
69
|
+
export function scaleV3d(a: V3d, value: number): V3d {
|
|
70
|
+
'worklet';
|
|
71
|
+
return {
|
|
72
|
+
...scaleV2d(a, value),
|
|
73
|
+
z: value * a.z,
|
|
74
|
+
};
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
export const multiplyV3d = scaleV3d;
|
|
78
|
+
|
|
79
|
+
export function divV3d(a: V3d, value: number): V3d {
|
|
80
|
+
'worklet';
|
|
81
|
+
return multiplyV3d(a, 1 / value);
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
export function negateV3d(a: V3d): V3d {
|
|
85
|
+
'worklet';
|
|
86
|
+
return scaleV3d(a, -1);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
export function addV3d(a: V3d, b: V3d): V3d {
|
|
90
|
+
'worklet';
|
|
91
|
+
return {
|
|
92
|
+
...addV2d(a, b),
|
|
93
|
+
z: a.z + b.z,
|
|
94
|
+
};
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
export function subtractV3d(a: V3d, b: V3d): V3d {
|
|
98
|
+
'worklet';
|
|
99
|
+
return addV3d(a, negateV3d(b));
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
export function componentsFromV3d({ x, y, z }: V3d): [number, number, number] {
|
|
103
|
+
'worklet';
|
|
104
|
+
return [x, y, z];
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
export function transformV3d(v3d: V3d, transformer: Transformer): V3d {
|
|
108
|
+
'worklet';
|
|
109
|
+
return {
|
|
110
|
+
...transformV2d(v3d, transformer),
|
|
111
|
+
z: transformer(v3d.z),
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
export function clamp(v: number, min = -1, max = 1): number {
|
|
116
|
+
'worklet';
|
|
117
|
+
return Math.max(min, Math.min(max, v));
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
export function clampV3d(v3d: V3d, min: number, max: number): V3d {
|
|
121
|
+
'worklet';
|
|
122
|
+
return transformV3d(v3d, (value) => clamp(value, min, max));
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
// helpers
|
|
126
|
+
|
|
127
|
+
export function degToRad(deg: number): number {
|
|
128
|
+
'worklet';
|
|
129
|
+
return (deg * Math.PI) / 180;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
export const zeroV3d = { x: 0, y: 0, z: 0 };
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import tgpu from 'typegpu';
|
|
4
|
-
import * as d from 'typegpu/data';
|
|
5
|
-
import * as std from 'typegpu/std';
|
|
6
|
-
import { rotationValuesBindGroupLayout, textureBindGroupLayout, bloomOptionsBindGroupLayout, colorMaskBindGroupLayout } from "../bindGroupLayouts.js";
|
|
7
|
-
import { bloomColorShift, hueShift, overlayChannels } from "../tgpuUtils.js";
|
|
8
|
-
const bloomFragment = tgpu['~unstable'].fragmentFn({
|
|
9
|
-
in: {
|
|
10
|
-
uv: d.vec2f
|
|
11
|
-
},
|
|
12
|
-
out: d.vec4f
|
|
13
|
-
})(input => {
|
|
14
|
-
const texcoord = d.vec2f(input.uv.x, 1.0 - input.uv.y);
|
|
15
|
-
const uv = d.vec2f(input.uv.x, 1.0 - input.uv.y);
|
|
16
|
-
const centeredCoords = std.sub(std.mul(uv, 2.0), 1); //-1 to 1
|
|
17
|
-
|
|
18
|
-
const rot = rotationValuesBindGroupLayout.$.vec;
|
|
19
|
-
const center = std.add(d.vec2f(0.0), d.vec2f(rot.x, rot.y));
|
|
20
|
-
const bloomOptions = bloomOptionsBindGroupLayout.$.bloomOptions;
|
|
21
|
-
const bloomIntensity = bloomOptions.bloomIntensity;
|
|
22
|
-
const glowPower = bloomOptions.glowPower;
|
|
23
|
-
const hueBlendPower = bloomOptions.hueBlendPower;
|
|
24
|
-
const hueShiftAngleMax = bloomOptions.hueShiftAngleMax;
|
|
25
|
-
const hueShiftAngleMin = bloomOptions.hueShiftAngleMin;
|
|
26
|
-
const lightIntensity = bloomOptions.lightIntensity;
|
|
27
|
-
const mask = colorMaskBindGroupLayout.$.mask;
|
|
28
|
-
const maskedColor = mask.baseColor;
|
|
29
|
-
const rgbToleranceRange = mask.rgbToleranceRange;
|
|
30
|
-
let color = std.textureSample(textureBindGroupLayout.$.texture, textureBindGroupLayout.$.sampler, texcoord);
|
|
31
|
-
const maskedColorLower = std.sub(maskedColor, rgbToleranceRange.lower);
|
|
32
|
-
const maskedColorUpper = std.add(maskedColor, rgbToleranceRange.upper);
|
|
33
|
-
const upperCheck = std.all(std.le(color.xyz, maskedColorUpper));
|
|
34
|
-
const lowerCheck = std.all(std.ge(color.xyz, maskedColorLower));
|
|
35
|
-
if (upperCheck && lowerCheck) {
|
|
36
|
-
return color;
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
//bloomIntensity
|
|
40
|
-
const dst = std.exp(-std.distance(center, centeredCoords));
|
|
41
|
-
const distToCenter = std.smoothstep(0.0, 1 / bloomIntensity, dst);
|
|
42
|
-
|
|
43
|
-
//glowPower
|
|
44
|
-
let glow = d.vec3f(distToCenter);
|
|
45
|
-
glow = std.mul(glow, glowPower * color.w);
|
|
46
|
-
|
|
47
|
-
//hueBlend
|
|
48
|
-
const hueBlend = d.f32(hueBlendPower) * dst / 10.0;
|
|
49
|
-
|
|
50
|
-
//lightIntensity
|
|
51
|
-
glow = std.add(glow, lightIntensity / 10.0);
|
|
52
|
-
let shiftedRGB = bloomColorShift(color.xyz, dst / (lightIntensity * 2));
|
|
53
|
-
|
|
54
|
-
//hueShiftAngleMin/Max
|
|
55
|
-
const hueShiftAngle = std.smoothstep(hueShiftAngleMin, hueShiftAngleMax, distToCenter);
|
|
56
|
-
const shiftedHue = hueShift(shiftedRGB, hueShiftAngle);
|
|
57
|
-
shiftedRGB = overlayChannels(shiftedRGB, shiftedHue);
|
|
58
|
-
color = d.vec4f(std.mix(color.xyz, shiftedRGB, hueBlend), color.w);
|
|
59
|
-
const baseColor = color;
|
|
60
|
-
const blendColor = glow;
|
|
61
|
-
const combined = overlayChannels(baseColor.xyz, blendColor);
|
|
62
|
-
color = d.vec4f(std.mix(color.xyz, combined, glow), color.w);
|
|
63
|
-
return color;
|
|
64
|
-
});
|
|
65
|
-
export default bloomFragment;
|
|
66
|
-
//# sourceMappingURL=bloomFragment.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["tgpu","d","std","rotationValuesBindGroupLayout","textureBindGroupLayout","bloomOptionsBindGroupLayout","colorMaskBindGroupLayout","bloomColorShift","hueShift","overlayChannels","bloomFragment","fragmentFn","in","uv","vec2f","out","vec4f","input","texcoord","x","y","centeredCoords","sub","mul","rot","$","vec","center","add","bloomOptions","bloomIntensity","glowPower","hueBlendPower","hueShiftAngleMax","hueShiftAngleMin","lightIntensity","mask","maskedColor","baseColor","rgbToleranceRange","color","textureSample","texture","sampler","maskedColorLower","lower","maskedColorUpper","upper","upperCheck","all","le","xyz","lowerCheck","ge","dst","exp","distance","distToCenter","smoothstep","glow","vec3f","w","hueBlend","f32","shiftedRGB","hueShiftAngle","shiftedHue","mix","blendColor","combined"],"sourceRoot":"../../../../src","sources":["shaders/fragmentShaders/bloomFragment.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["Asset","getBitmapFromURI","uri","uriToBitmapMap","has","get","console","log","ast","fromURI","downloadAsync","fileURI","localUri","response","fetch","blob","imageBitmap","createImageBitmap","set","Map"],"sourceRoot":"../../../src","sources":["shaders/resourceManagement.ts"],"mappings":";;AAAA,SAASA,KAAK,QAAQ,YAAY;AAElC,MAAMC,gBAAgB,GAAG,MAAOC,GAAW,IAA2B;EACpE,IAAIC,cAAc,CAACC,GAAG,CAACF,GAAG,CAAC,EAAE,OAAOC,cAAc,CAACE,GAAG,CAACH,GAAG,CAAC;EAC3DI,OAAO,CAACC,GAAG,CAAC,8CAA8C,CAAC;EAE3D,MAAMC,GAAG,GAAGR,KAAK,CAACS,OAAO,CAACP,GAAG,CAAC;EAC9B,MAAMM,GAAG,CAACE,aAAa,CAAC,CAAC;EACzB,MAAMC,OAAO,GAAGH,GAAG,CAACI,QAAQ,IAAIJ,GAAG,CAACN,GAAG;EAEvCI,OAAO,CAACC,GAAG,CAAC,uCAAuC,CAAC;EACpD,MAAMM,QAAQ,GAAG,MAAMC,KAAK,CAACH,OAAO,CAAC;EACrC,MAAMI,IAAI,GAAG,MAAMF,QAAQ,CAACE,IAAI,CAAC,CAAC;EAClC,MAAMC,WAAW,GAAG,MAAMC,iBAAiB,CAACF,IAAI,CAAC;EAEjDZ,cAAc,CAACe,GAAG,CAAChB,GAAG,EAAEc,WAAW,CAAC;EACpC,OAAOA,WAAW;AACpB,CAAC;AAED,MAAMb,cAAc,GAAG,IAAIgB,GAAG,CAAsB,CAAC;AAErD,eAAelB,gBAAgB","ignoreList":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"bloomFragment.d.ts","sourceRoot":"","sources":["../../../../../src/shaders/fragmentShaders/bloomFragment.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,CAAC,MAAM,cAAc,CAAC;AAUlC,QAAA,MAAM,aAAa;;WAqEjB,CAAC;AAEH,eAAe,aAAa,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"resourceManagement.d.ts","sourceRoot":"","sources":["../../../../src/shaders/resourceManagement.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,gBAAgB,GAAU,KAAK,MAAM,KAAG,OAAO,CAAC,WAAW,CAehE,CAAC;AAIF,eAAe,gBAAgB,CAAC"}
|
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
import tgpu from 'typegpu';
|
|
2
|
-
import * as d from 'typegpu/data';
|
|
3
|
-
import * as std from 'typegpu/std';
|
|
4
|
-
import {
|
|
5
|
-
rotationValuesBindGroupLayout,
|
|
6
|
-
textureBindGroupLayout,
|
|
7
|
-
bloomOptionsBindGroupLayout,
|
|
8
|
-
colorMaskBindGroupLayout,
|
|
9
|
-
} from '../bindGroupLayouts';
|
|
10
|
-
import { bloomColorShift, hueShift, overlayChannels } from '../tgpuUtils';
|
|
11
|
-
|
|
12
|
-
const bloomFragment = tgpu['~unstable'].fragmentFn({
|
|
13
|
-
in: { uv: d.vec2f },
|
|
14
|
-
out: d.vec4f,
|
|
15
|
-
})((input) => {
|
|
16
|
-
const texcoord = d.vec2f(input.uv.x, 1.0 - input.uv.y);
|
|
17
|
-
const uv = d.vec2f(input.uv.x, 1.0 - input.uv.y);
|
|
18
|
-
const centeredCoords = std.sub(std.mul(uv, 2.0), 1); //-1 to 1
|
|
19
|
-
|
|
20
|
-
const rot = rotationValuesBindGroupLayout.$.vec;
|
|
21
|
-
const center = std.add(d.vec2f(0.0), d.vec2f(rot.x, rot.y));
|
|
22
|
-
|
|
23
|
-
const bloomOptions = bloomOptionsBindGroupLayout.$.bloomOptions;
|
|
24
|
-
const bloomIntensity = bloomOptions.bloomIntensity;
|
|
25
|
-
const glowPower = bloomOptions.glowPower;
|
|
26
|
-
const hueBlendPower = bloomOptions.hueBlendPower;
|
|
27
|
-
const hueShiftAngleMax = bloomOptions.hueShiftAngleMax;
|
|
28
|
-
const hueShiftAngleMin = bloomOptions.hueShiftAngleMin;
|
|
29
|
-
const lightIntensity = bloomOptions.lightIntensity;
|
|
30
|
-
|
|
31
|
-
const mask = colorMaskBindGroupLayout.$.mask;
|
|
32
|
-
const maskedColor = mask.baseColor;
|
|
33
|
-
const rgbToleranceRange = mask.rgbToleranceRange;
|
|
34
|
-
|
|
35
|
-
let color = std.textureSample(
|
|
36
|
-
textureBindGroupLayout.$.texture,
|
|
37
|
-
textureBindGroupLayout.$.sampler,
|
|
38
|
-
texcoord
|
|
39
|
-
);
|
|
40
|
-
|
|
41
|
-
const maskedColorLower = std.sub(maskedColor, rgbToleranceRange.lower);
|
|
42
|
-
const maskedColorUpper = std.add(maskedColor, rgbToleranceRange.upper);
|
|
43
|
-
const upperCheck = std.all(std.le(color.xyz, maskedColorUpper));
|
|
44
|
-
const lowerCheck = std.all(std.ge(color.xyz, maskedColorLower));
|
|
45
|
-
if (upperCheck && lowerCheck) {
|
|
46
|
-
return color;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
//bloomIntensity
|
|
50
|
-
const dst = std.exp(-std.distance(center, centeredCoords));
|
|
51
|
-
const distToCenter = std.smoothstep(0.0, 1 / bloomIntensity, dst);
|
|
52
|
-
|
|
53
|
-
//glowPower
|
|
54
|
-
let glow = d.vec3f(distToCenter);
|
|
55
|
-
glow = std.mul(glow, glowPower * color.w);
|
|
56
|
-
|
|
57
|
-
//hueBlend
|
|
58
|
-
const hueBlend = (d.f32(hueBlendPower) * dst) / 10.0;
|
|
59
|
-
|
|
60
|
-
//lightIntensity
|
|
61
|
-
glow = std.add(glow, lightIntensity / 10.0);
|
|
62
|
-
let shiftedRGB = bloomColorShift(color.xyz, dst / (lightIntensity * 2));
|
|
63
|
-
|
|
64
|
-
//hueShiftAngleMin/Max
|
|
65
|
-
const hueShiftAngle = std.smoothstep(
|
|
66
|
-
hueShiftAngleMin,
|
|
67
|
-
hueShiftAngleMax,
|
|
68
|
-
distToCenter
|
|
69
|
-
);
|
|
70
|
-
const shiftedHue = hueShift(shiftedRGB, hueShiftAngle);
|
|
71
|
-
shiftedRGB = overlayChannels(shiftedRGB, shiftedHue);
|
|
72
|
-
|
|
73
|
-
color = d.vec4f(std.mix(color.xyz, shiftedRGB, hueBlend), color.w);
|
|
74
|
-
const baseColor = color;
|
|
75
|
-
const blendColor = glow;
|
|
76
|
-
|
|
77
|
-
const combined = overlayChannels(baseColor.xyz, blendColor);
|
|
78
|
-
color = d.vec4f(std.mix(color.xyz, combined, glow), color.w);
|
|
79
|
-
|
|
80
|
-
return color;
|
|
81
|
-
});
|
|
82
|
-
|
|
83
|
-
export default bloomFragment;
|