react-native-shine 0.5.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (90) hide show
  1. package/lib/module/components/Content.js +56 -36
  2. package/lib/module/components/Content.js.map +1 -1
  3. package/lib/module/components/ShineGroup.js +16 -8
  4. package/lib/module/components/ShineGroup.js.map +1 -1
  5. package/lib/module/config/debugMode.js +1 -0
  6. package/lib/module/config/debugMode.js.map +1 -1
  7. package/lib/module/enums/colorHighlightPresets.js +24 -0
  8. package/lib/module/enums/colorHighlightPresets.js.map +1 -0
  9. package/lib/module/enums/effectPresets.js +16 -0
  10. package/lib/module/enums/effectPresets.js.map +1 -0
  11. package/lib/module/enums/waveCallback.js +2 -1
  12. package/lib/module/enums/waveCallback.js.map +1 -1
  13. package/lib/module/index.js +2 -0
  14. package/lib/module/index.js.map +1 -1
  15. package/lib/module/shaders/bindGroupLayouts.js +21 -16
  16. package/lib/module/shaders/bindGroupLayouts.js.map +1 -1
  17. package/lib/module/shaders/bindGroupUtils.js +16 -7
  18. package/lib/module/shaders/bindGroupUtils.js.map +1 -1
  19. package/lib/module/shaders/fragmentShaders/baseTextureFragment.js +28 -0
  20. package/lib/module/shaders/fragmentShaders/baseTextureFragment.js.map +1 -0
  21. package/lib/module/shaders/fragmentShaders/colorMaskFragment.js +56 -39
  22. package/lib/module/shaders/fragmentShaders/colorMaskFragment.js.map +1 -1
  23. package/lib/module/shaders/fragmentShaders/glareFragment.js +13 -11
  24. package/lib/module/shaders/fragmentShaders/glareFragment.js.map +1 -1
  25. package/lib/module/shaders/fragmentShaders/holoFragment.js +13 -4
  26. package/lib/module/shaders/fragmentShaders/holoFragment.js.map +1 -1
  27. package/lib/module/shaders/fragmentShaders/maskFragment.js +1 -0
  28. package/lib/module/shaders/fragmentShaders/maskFragment.js.map +1 -1
  29. package/lib/module/shaders/fragmentShaders/reverseHoloFragment.js +13 -8
  30. package/lib/module/shaders/fragmentShaders/reverseHoloFragment.js.map +1 -1
  31. package/lib/module/shaders/resourceManagement/textures.js.map +1 -1
  32. package/lib/module/shaders/tgpuUtils.js +49 -29
  33. package/lib/module/shaders/tgpuUtils.js.map +1 -1
  34. package/lib/module/shaders/vertexShaders/mainRotationEffectVertex.js +1 -0
  35. package/lib/module/shaders/vertexShaders/mainRotationEffectVertex.js.map +1 -1
  36. package/lib/module/shaders/vertexShaders/mainVertex.js +1 -0
  37. package/lib/module/shaders/vertexShaders/mainVertex.js.map +1 -1
  38. package/lib/module/types/size.js +2 -0
  39. package/lib/module/types/typeUtils.js +100 -51
  40. package/lib/module/types/typeUtils.js.map +1 -1
  41. package/lib/module/types/vector.js +2 -0
  42. package/lib/module/utils/vector.js +6 -6
  43. package/lib/typescript/src/components/Content.d.ts +11 -8
  44. package/lib/typescript/src/components/Content.d.ts.map +1 -1
  45. package/lib/typescript/src/components/ShineGroup.d.ts +1 -1
  46. package/lib/typescript/src/components/ShineGroup.d.ts.map +1 -1
  47. package/lib/typescript/src/config/debugMode.d.ts +1 -0
  48. package/lib/typescript/src/config/debugMode.d.ts.map +1 -1
  49. package/lib/typescript/src/enums/colorHighlightPresets.d.ts +12 -0
  50. package/lib/typescript/src/enums/colorHighlightPresets.d.ts.map +1 -0
  51. package/lib/typescript/src/enums/effectPresets.d.ts +14 -0
  52. package/lib/typescript/src/enums/effectPresets.d.ts.map +1 -0
  53. package/lib/typescript/src/index.d.ts +2 -0
  54. package/lib/typescript/src/index.d.ts.map +1 -1
  55. package/lib/typescript/src/shaders/bindGroupLayouts.d.ts +90 -51
  56. package/lib/typescript/src/shaders/bindGroupLayouts.d.ts.map +1 -1
  57. package/lib/typescript/src/shaders/bindGroupUtils.d.ts +41 -46
  58. package/lib/typescript/src/shaders/bindGroupUtils.d.ts.map +1 -1
  59. package/lib/typescript/src/shaders/fragmentShaders/baseTextureFragment.d.ts +5 -0
  60. package/lib/typescript/src/shaders/fragmentShaders/baseTextureFragment.d.ts.map +1 -0
  61. package/lib/typescript/src/shaders/fragmentShaders/colorMaskFragment.d.ts.map +1 -1
  62. package/lib/typescript/src/shaders/fragmentShaders/glareFragment.d.ts.map +1 -1
  63. package/lib/typescript/src/shaders/fragmentShaders/holoFragment.d.ts.map +1 -1
  64. package/lib/typescript/src/shaders/fragmentShaders/reverseHoloFragment.d.ts.map +1 -1
  65. package/lib/typescript/src/shaders/resourceManagement/textures.d.ts +3 -3
  66. package/lib/typescript/src/shaders/resourceManagement/textures.d.ts.map +1 -1
  67. package/lib/typescript/src/shaders/tgpuUtils.d.ts.map +1 -1
  68. package/lib/typescript/src/types/typeUtils.d.ts +33 -3
  69. package/lib/typescript/src/types/typeUtils.d.ts.map +1 -1
  70. package/lib/typescript/src/types/types.d.ts +32 -4
  71. package/lib/typescript/src/types/types.d.ts.map +1 -1
  72. package/package.json +5 -4
  73. package/src/components/Content.tsx +92 -47
  74. package/src/components/ShineGroup.tsx +16 -8
  75. package/src/config/debugMode.ts +1 -0
  76. package/src/enums/colorHighlightPresets.ts +33 -0
  77. package/src/enums/effectPresets.ts +11 -0
  78. package/src/enums/waveCallback.ts +1 -1
  79. package/src/index.tsx +2 -0
  80. package/src/shaders/bindGroupLayouts.ts +27 -10
  81. package/src/shaders/bindGroupUtils.ts +19 -26
  82. package/src/shaders/fragmentShaders/baseTextureFragment.ts +18 -0
  83. package/src/shaders/fragmentShaders/colorMaskFragment.ts +70 -42
  84. package/src/shaders/fragmentShaders/glareFragment.ts +10 -8
  85. package/src/shaders/fragmentShaders/holoFragment.ts +9 -3
  86. package/src/shaders/fragmentShaders/reverseHoloFragment.ts +12 -7
  87. package/src/shaders/resourceManagement/textures.ts +3 -3
  88. package/src/shaders/tgpuUtils.ts +41 -46
  89. package/src/types/typeUtils.ts +102 -56
  90. package/src/types/types.ts +37 -4
@@ -10,83 +10,127 @@ import type {
10
10
  } from './types';
11
11
  import { div } from 'typegpu/std';
12
12
  import { WAVE_CALLBACKS } from '../enums/waveCallback';
13
+ import { colorMaskDebug } from '../config/debugMode';
14
+ import { COLOR_MASK_MAX_COUNT } from '../shaders/bindGroupLayouts';
13
15
 
14
16
  export const createGlareOptions = (
15
17
  options: Partial<GlareOptions>
16
18
  ): GlareOptions => {
17
- const {
18
- glowPower,
19
- hueShiftAngleMax,
20
- hueShiftAngleMin,
21
- hueBlendPower,
22
- lightIntensity,
23
- glareIntensity,
24
- } = options;
19
+ const { glowPower, glareColor, lightIntensity, glareIntensity } = options;
20
+ const { hueBlendPower, hueShiftAngleMax, hueShiftAngleMin } =
21
+ glareColor || {};
25
22
 
26
23
  const glareOp = {
27
24
  glowPower: glowPower ?? 1.0,
28
- hueShiftAngleMax: hueShiftAngleMax ?? 1.0,
29
- hueShiftAngleMin: hueShiftAngleMin ?? 0.0,
30
- hueBlendPower: hueBlendPower ?? 1.0,
31
25
  lightIntensity: lightIntensity ?? 1.0,
32
26
  glareIntensity: glareIntensity ?? 1.0,
27
+ glareColor: {
28
+ hueShiftAngleMax: hueShiftAngleMax ?? 1.0,
29
+ hueShiftAngleMin: hueShiftAngleMin ?? 0.0,
30
+ hueBlendPower: hueBlendPower ?? 1.0,
31
+ },
33
32
  };
34
33
 
35
34
  return glareOp;
36
35
  };
37
36
 
38
- export const mapToF32 = <T extends Record<string, number>>(
39
- obj: T
40
- ): {
41
- [K in keyof T]: ReturnType<typeof f32>;
42
- } => {
43
- const result = {} as any;
44
- for (const key in obj) {
45
- result[key] = f32(obj[key]);
46
- }
47
-
48
- return result;
37
+ export const glareOptionsToTyped = (glareOptions: GlareOptions) => {
38
+ return {
39
+ glowPower: f32(glareOptions.glowPower),
40
+ lightIntensity: f32(glareOptions.lightIntensity),
41
+ glareIntensity: f32(glareOptions.glareIntensity),
42
+ glareColor: {
43
+ hueShiftAngleMax: f32(glareOptions.glareColor.hueShiftAngleMax),
44
+ hueShiftAngleMin: f32(glareOptions.glareColor.hueShiftAngleMin),
45
+ hueBlendPower: f32(glareOptions.glareColor.hueBlendPower),
46
+ },
47
+ };
49
48
  };
50
49
 
51
- export const createColorMask = (
52
- colorMask: DeepPartiallyOptional<ColorMask, 'baseColor'>
53
- ): ColorMask => {
54
- const {
55
- baseColor,
56
- rgbToleranceRange,
57
- useHSV,
58
- hueToleranceRange,
59
- brightnessTolerance,
60
- saturationTolerance,
61
- lowBrightnessThreshold,
62
- lowSaturationThreshold,
63
- } = colorMask;
64
- const baseTolerance = {
65
- upper: [20, 20, 20] as vec3,
66
- lower: [20, 20, 20] as vec3,
67
- };
68
- const baseHueTolerance = {
69
- upper: 20,
70
- lower: 20,
71
- };
72
- const tolerance = { ...baseTolerance, ...rgbToleranceRange };
73
- const hueTolerance = { ...baseHueTolerance, ...hueToleranceRange };
50
+ export const createColorMasks = (
51
+ colorMasks: DeepPartiallyOptional<ColorMask, 'baseColor'>[]
52
+ ): ColorMask[] => {
53
+ const newColorMasks: ColorMask[] = [];
54
+ for (const i in colorMasks) {
55
+ const {
56
+ baseColor,
57
+ rgbToleranceRange,
58
+ useHSV,
59
+ hueToleranceRange,
60
+ brightnessTolerance,
61
+ saturationTolerance,
62
+ lowBrightnessThreshold,
63
+ lowSaturationThreshold,
64
+ } = colorMasks[i]!;
65
+ const baseTolerance = {
66
+ upper: [20, 20, 20] as vec3,
67
+ lower: [20, 20, 20] as vec3,
68
+ };
69
+ const baseHueTolerance = {
70
+ upper: 20,
71
+ lower: 20,
72
+ };
73
+ const tolerance = { ...baseTolerance, ...rgbToleranceRange };
74
+ const hueTolerance = { ...baseHueTolerance, ...hueToleranceRange };
75
+ const newColorMask: ColorMask = {
76
+ baseColor: baseColor,
77
+ rgbToleranceRange: tolerance,
78
+ useHSV: useHSV!!,
79
+ hueToleranceRange: hueTolerance,
80
+ brightnessTolerance: brightnessTolerance ?? 1.0,
81
+ saturationTolerance: saturationTolerance ?? 1.0,
82
+ lowBrightnessThreshold: lowBrightnessThreshold ?? 0.0,
83
+ lowSaturationThreshold: lowSaturationThreshold ?? 0.0,
84
+ debugMode: colorMaskDebug,
85
+ };
86
+
87
+ newColorMasks[i] = newColorMask;
88
+ }
74
89
 
75
90
  // TODO: add radian and degree angle handling
76
91
  // '123deg' <- interpret as a numeric angle value
77
92
  // 2 <- interpret as a radian value
78
- const mask: ColorMask = {
79
- baseColor: baseColor,
80
- rgbToleranceRange: tolerance,
81
- useHSV: useHSV!!,
82
- hueToleranceRange: hueTolerance,
83
- brightnessTolerance: brightnessTolerance ?? 1.0,
84
- saturationTolerance: saturationTolerance ?? 1.0,
85
- lowBrightnessThreshold: lowBrightnessThreshold ?? 0.0,
86
- lowSaturationThreshold: lowSaturationThreshold ?? 0.0,
87
- };
88
93
 
89
- return mask;
94
+ return newColorMasks;
95
+ };
96
+
97
+ const fillColorMaskBufferWithDummies = (
98
+ colorMasks: ColorMask[]
99
+ ): ColorMask[] => {
100
+ const dummyFilledColorMasks = new Array(COLOR_MASK_MAX_COUNT);
101
+ for (let i = 0; i < dummyFilledColorMasks.length; i++) {
102
+ if (i < colorMasks.length) {
103
+ dummyFilledColorMasks[i] = colorMasks[i];
104
+ } else {
105
+ dummyFilledColorMasks[i] = {
106
+ baseColor: [0, 0, 0],
107
+ useHSV: false,
108
+ rgbToleranceRange: {
109
+ upper: [0, 0, 0],
110
+ lower: [0, 0, 0],
111
+ },
112
+ hueToleranceRange: {
113
+ upper: 0,
114
+ lower: 0,
115
+ },
116
+ };
117
+ }
118
+ }
119
+ return dummyFilledColorMasks;
120
+ };
121
+
122
+ export const colorMasksToTyped = (
123
+ colorMasks: ColorMask[],
124
+ reverseHighlight: boolean
125
+ ) => {
126
+ const typedColorMasks = fillColorMaskBufferWithDummies(colorMasks).map(
127
+ (mask) => colorMaskToTyped(mask)
128
+ );
129
+ return {
130
+ masks: typedColorMasks,
131
+ usedMaskCount: colorMasks.length,
132
+ reverseHighlight: reverseHighlight ? 1 : 0,
133
+ };
90
134
  };
91
135
 
92
136
  export const colorMaskToTyped = (colorMask: ColorMask) => {
@@ -105,7 +149,9 @@ export const colorMaskToTyped = (colorMask: ColorMask) => {
105
149
  saturationTolerance: f32(colorMask.saturationTolerance),
106
150
  lowSaturationThreshold: f32(colorMask.lowSaturationThreshold),
107
151
  lowBrightnessThreshold: f32(colorMask.lowBrightnessThreshold),
152
+ debugMode: d.u32(colorMask.debugMode ? d.u32(1) : d.u32(0)),
108
153
  };
154
+
109
155
  return result;
110
156
  };
111
157
 
@@ -12,11 +12,13 @@ export type quaternion = vec4;
12
12
 
13
13
  export type GlareOptions = {
14
14
  glowPower: number;
15
- hueShiftAngleMax: number;
16
- hueShiftAngleMin: number;
17
- hueBlendPower: number;
18
15
  lightIntensity: number;
19
16
  glareIntensity: number;
17
+ glareColor: {
18
+ hueBlendPower: number;
19
+ hueShiftAngleMax: number;
20
+ hueShiftAngleMin: number;
21
+ };
20
22
  };
21
23
 
22
24
  export type ColorMask = {
@@ -24,15 +26,46 @@ export type ColorMask = {
24
26
  useHSV?: boolean;
25
27
  hueToleranceRange: { upper: number; lower: number };
26
28
  brightnessTolerance?: number;
27
- lowBrightnessThreshold?: number;
28
29
  saturationTolerance?: number;
30
+ lowBrightnessThreshold?: number;
29
31
  lowSaturationThreshold?: number;
30
32
  rgbToleranceRange: {
31
33
  upper: vec3;
32
34
  lower: vec3;
33
35
  };
36
+ debugMode?: boolean;
34
37
  };
35
38
 
39
+ //TODO: figure out how to tell compiler that im sure that it's long enough ;-;
40
+ export type ColorMaskArrayShaderAssert = [
41
+ any,
42
+ any,
43
+ any,
44
+ any,
45
+ any,
46
+ any,
47
+ any,
48
+ any,
49
+ any,
50
+ any,
51
+ any,
52
+ any,
53
+ any,
54
+ any,
55
+ any,
56
+ any,
57
+ ];
58
+
59
+ export type Effect =
60
+ | {
61
+ name: 'reverseHolo';
62
+ options: Partial<ReverseHoloDetectionChannelFlags>;
63
+ }
64
+ | {
65
+ name: 'holo';
66
+ options?: HoloOptions;
67
+ };
68
+
36
69
  export type ReverseHoloDetectionChannelFlags = {
37
70
  redChannel: number;
38
71
  greenChannel: number;