@lightningjs/renderer 2.9.0-beta4 → 2.9.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 (208) hide show
  1. package/LICENSE +202 -202
  2. package/NOTICE +3 -3
  3. package/README.md +147 -147
  4. package/dist/exports/core-api.d.ts +74 -0
  5. package/dist/exports/core-api.js +96 -0
  6. package/dist/exports/core-api.js.map +1 -0
  7. package/dist/exports/main-api.d.ts +30 -0
  8. package/dist/exports/main-api.js +45 -0
  9. package/dist/exports/main-api.js.map +1 -0
  10. package/dist/src/core/CoreExtension.d.ts +12 -0
  11. package/dist/src/core/CoreExtension.js +29 -0
  12. package/dist/src/core/CoreExtension.js.map +1 -0
  13. package/dist/src/core/CoreNode.d.ts +5 -1
  14. package/dist/src/core/CoreNode.js +14 -4
  15. package/dist/src/core/CoreNode.js.map +1 -1
  16. package/dist/src/core/CoreTextureManager.d.ts +24 -0
  17. package/dist/src/core/CoreTextureManager.js.map +1 -1
  18. package/dist/src/core/renderers/webgl/shaders/DefaultShader.js +45 -45
  19. package/dist/src/core/renderers/webgl/shaders/DefaultShaderBatched.js +61 -61
  20. package/dist/src/core/renderers/webgl/shaders/DynamicShader.js +93 -93
  21. package/dist/src/core/renderers/webgl/shaders/RoundedRectangle.js +63 -63
  22. package/dist/src/core/renderers/webgl/shaders/SdfShader.js +62 -62
  23. package/dist/src/core/renderers/webgl/shaders/effects/BorderBottomEffect.js +15 -15
  24. package/dist/src/core/renderers/webgl/shaders/effects/BorderEffect.js +6 -6
  25. package/dist/src/core/renderers/webgl/shaders/effects/BorderLeftEffect.js +15 -15
  26. package/dist/src/core/renderers/webgl/shaders/effects/BorderRightEffect.js +15 -15
  27. package/dist/src/core/renderers/webgl/shaders/effects/BorderTopEffect.js +15 -15
  28. package/dist/src/core/renderers/webgl/shaders/effects/FadeOutEffect.js +42 -42
  29. package/dist/src/core/renderers/webgl/shaders/effects/GlitchEffect.js +44 -44
  30. package/dist/src/core/renderers/webgl/shaders/effects/GrayscaleEffect.js +3 -3
  31. package/dist/src/core/renderers/webgl/shaders/effects/HolePunchEffect.js +22 -22
  32. package/dist/src/core/renderers/webgl/shaders/effects/LinearGradientEffect.js +28 -28
  33. package/dist/src/core/renderers/webgl/shaders/effects/RadialGradientEffect.js +10 -10
  34. package/dist/src/core/renderers/webgl/shaders/effects/RadialProgressEffect.js +37 -37
  35. package/dist/src/core/renderers/webgl/shaders/effects/RadiusEffect.js +19 -19
  36. package/dist/src/main-api/ICoreDriver.d.ts +24 -0
  37. package/dist/src/main-api/ICoreDriver.js +20 -0
  38. package/dist/src/main-api/ICoreDriver.js.map +1 -0
  39. package/dist/src/main-api/RendererMain.d.ts +378 -0
  40. package/dist/src/main-api/RendererMain.js +367 -0
  41. package/dist/src/main-api/RendererMain.js.map +1 -0
  42. package/dist/src/main-api/texture-usage-trackers/FinalizationRegistryTextureUsageTracker.d.ts +9 -0
  43. package/dist/src/main-api/texture-usage-trackers/FinalizationRegistryTextureUsageTracker.js +38 -0
  44. package/dist/src/main-api/texture-usage-trackers/FinalizationRegistryTextureUsageTracker.js.map +1 -0
  45. package/dist/src/main-api/texture-usage-trackers/ManualCountTextureUsageTracker.d.ts +56 -0
  46. package/dist/src/main-api/texture-usage-trackers/ManualCountTextureUsageTracker.js +101 -0
  47. package/dist/src/main-api/texture-usage-trackers/ManualCountTextureUsageTracker.js.map +1 -0
  48. package/dist/src/main-api/texture-usage-trackers/TextureUsageTracker.d.ts +32 -0
  49. package/dist/src/main-api/texture-usage-trackers/TextureUsageTracker.js +28 -0
  50. package/dist/src/main-api/texture-usage-trackers/TextureUsageTracker.js.map +1 -0
  51. package/dist/src/render-drivers/main/MainCoreDriver.d.ts +21 -0
  52. package/dist/src/render-drivers/main/MainCoreDriver.js +115 -0
  53. package/dist/src/render-drivers/main/MainCoreDriver.js.map +1 -0
  54. package/dist/src/render-drivers/main/MainOnlyNode.d.ts +101 -0
  55. package/dist/src/render-drivers/main/MainOnlyNode.js +425 -0
  56. package/dist/src/render-drivers/main/MainOnlyNode.js.map +1 -0
  57. package/dist/src/render-drivers/main/MainOnlyTextNode.d.ts +47 -0
  58. package/dist/src/render-drivers/main/MainOnlyTextNode.js +204 -0
  59. package/dist/src/render-drivers/main/MainOnlyTextNode.js.map +1 -0
  60. package/dist/src/render-drivers/threadx/NodeStruct.d.ts +93 -0
  61. package/dist/src/render-drivers/threadx/NodeStruct.js +290 -0
  62. package/dist/src/render-drivers/threadx/NodeStruct.js.map +1 -0
  63. package/dist/src/render-drivers/threadx/SharedNode.d.ts +40 -0
  64. package/dist/src/render-drivers/threadx/SharedNode.js +61 -0
  65. package/dist/src/render-drivers/threadx/SharedNode.js.map +1 -0
  66. package/dist/src/render-drivers/threadx/TextNodeStruct.d.ts +44 -0
  67. package/dist/src/render-drivers/threadx/TextNodeStruct.js +203 -0
  68. package/dist/src/render-drivers/threadx/TextNodeStruct.js.map +1 -0
  69. package/dist/src/render-drivers/threadx/ThreadXCoreDriver.d.ts +25 -0
  70. package/dist/src/render-drivers/threadx/ThreadXCoreDriver.js +232 -0
  71. package/dist/src/render-drivers/threadx/ThreadXCoreDriver.js.map +1 -0
  72. package/dist/src/render-drivers/threadx/ThreadXMainAnimationController.d.ts +24 -0
  73. package/dist/src/render-drivers/threadx/ThreadXMainAnimationController.js +113 -0
  74. package/dist/src/render-drivers/threadx/ThreadXMainAnimationController.js.map +1 -0
  75. package/dist/src/render-drivers/threadx/ThreadXMainNode.d.ts +46 -0
  76. package/dist/src/render-drivers/threadx/ThreadXMainNode.js +160 -0
  77. package/dist/src/render-drivers/threadx/ThreadXMainNode.js.map +1 -0
  78. package/dist/src/render-drivers/threadx/ThreadXMainTextNode.d.ts +28 -0
  79. package/dist/src/render-drivers/threadx/ThreadXMainTextNode.js +55 -0
  80. package/dist/src/render-drivers/threadx/ThreadXMainTextNode.js.map +1 -0
  81. package/dist/src/render-drivers/threadx/ThreadXRendererMessage.d.ts +70 -0
  82. package/dist/src/render-drivers/threadx/ThreadXRendererMessage.js +32 -0
  83. package/dist/src/render-drivers/threadx/ThreadXRendererMessage.js.map +1 -0
  84. package/dist/src/render-drivers/threadx/worker/ThreadXRendererNode.d.ts +19 -0
  85. package/dist/src/render-drivers/threadx/worker/ThreadXRendererNode.js +184 -0
  86. package/dist/src/render-drivers/threadx/worker/ThreadXRendererNode.js.map +1 -0
  87. package/dist/src/render-drivers/threadx/worker/ThreadXRendererTextNode.d.ts +27 -0
  88. package/dist/src/render-drivers/threadx/worker/ThreadXRendererTextNode.js +109 -0
  89. package/dist/src/render-drivers/threadx/worker/ThreadXRendererTextNode.js.map +1 -0
  90. package/dist/src/render-drivers/threadx/worker/renderer.d.ts +1 -0
  91. package/dist/src/render-drivers/threadx/worker/renderer.js +147 -0
  92. package/dist/src/render-drivers/threadx/worker/renderer.js.map +1 -0
  93. package/dist/src/render-drivers/utils.d.ts +12 -0
  94. package/dist/src/render-drivers/utils.js +74 -0
  95. package/dist/src/render-drivers/utils.js.map +1 -0
  96. package/dist/tsconfig.dist.tsbuildinfo +1 -1
  97. package/dist/tsconfig.tsbuildinfo +1 -0
  98. package/exports/canvas.ts +39 -39
  99. package/exports/index.ts +89 -89
  100. package/exports/inspector.ts +24 -24
  101. package/exports/utils.ts +44 -44
  102. package/exports/webgl.ts +38 -38
  103. package/package.json +1 -1
  104. package/scripts/please-use-pnpm.js +13 -13
  105. package/src/common/CommonTypes.ts +139 -139
  106. package/src/common/EventEmitter.ts +77 -77
  107. package/src/common/IAnimationController.ts +92 -92
  108. package/src/common/IEventEmitter.ts +28 -28
  109. package/src/core/CoreNode.test.ts +199 -199
  110. package/src/core/CoreNode.ts +2335 -2313
  111. package/src/core/CoreShaderManager.ts +292 -292
  112. package/src/core/CoreTextNode.ts +455 -455
  113. package/src/core/CoreTextureManager.ts +548 -522
  114. package/src/core/Stage.ts +700 -700
  115. package/src/core/TextureMemoryManager.ts +277 -277
  116. package/src/core/animations/AnimationManager.ts +38 -38
  117. package/src/core/animations/CoreAnimation.ts +340 -340
  118. package/src/core/animations/CoreAnimationController.ts +157 -157
  119. package/src/core/lib/ContextSpy.ts +41 -41
  120. package/src/core/lib/ImageWorker.ts +270 -270
  121. package/src/core/lib/Matrix3d.ts +244 -244
  122. package/src/core/lib/RenderCoords.ts +86 -86
  123. package/src/core/lib/WebGlContextWrapper.ts +1322 -1322
  124. package/src/core/lib/textureCompression.ts +152 -152
  125. package/src/core/lib/textureSvg.ts +78 -78
  126. package/src/core/lib/utils.ts +306 -306
  127. package/src/core/platform.ts +61 -61
  128. package/src/core/renderers/CoreContextTexture.ts +43 -43
  129. package/src/core/renderers/CoreRenderOp.ts +22 -22
  130. package/src/core/renderers/CoreRenderer.ts +114 -114
  131. package/src/core/renderers/CoreShader.ts +41 -41
  132. package/src/core/renderers/canvas/CanvasCoreRenderer.ts +364 -364
  133. package/src/core/renderers/canvas/CanvasCoreTexture.ts +150 -150
  134. package/src/core/renderers/canvas/internal/C2DShaderUtils.ts +231 -231
  135. package/src/core/renderers/canvas/internal/ColorUtils.ts +69 -69
  136. package/src/core/renderers/canvas/shaders/UnsupportedShader.ts +48 -48
  137. package/src/core/renderers/webgl/WebGlCoreCtxRenderTexture.ts +79 -79
  138. package/src/core/renderers/webgl/WebGlCoreCtxSubTexture.ts +50 -50
  139. package/src/core/renderers/webgl/WebGlCoreCtxTexture.ts +298 -298
  140. package/src/core/renderers/webgl/WebGlCoreRenderOp.ts +125 -125
  141. package/src/core/renderers/webgl/WebGlCoreRenderer.ts +805 -805
  142. package/src/core/renderers/webgl/WebGlCoreShader.ts +362 -362
  143. package/src/core/renderers/webgl/internal/BufferCollection.ts +54 -54
  144. package/src/core/renderers/webgl/internal/RendererUtils.ts +155 -155
  145. package/src/core/renderers/webgl/internal/ShaderUtils.ts +143 -143
  146. package/src/core/renderers/webgl/internal/WebGlUtils.ts +35 -35
  147. package/src/core/renderers/webgl/shaders/DefaultShader.ts +93 -93
  148. package/src/core/renderers/webgl/shaders/DefaultShaderBatched.ts +132 -132
  149. package/src/core/renderers/webgl/shaders/DynamicShader.ts +580 -580
  150. package/src/core/renderers/webgl/shaders/RoundedRectangle.ts +167 -167
  151. package/src/core/renderers/webgl/shaders/SdfShader.ts +204 -204
  152. package/src/core/renderers/webgl/shaders/effects/BorderBottomEffect.ts +101 -101
  153. package/src/core/renderers/webgl/shaders/effects/BorderEffect.ts +87 -87
  154. package/src/core/renderers/webgl/shaders/effects/BorderLeftEffect.ts +101 -101
  155. package/src/core/renderers/webgl/shaders/effects/BorderRightEffect.ts +101 -101
  156. package/src/core/renderers/webgl/shaders/effects/BorderTopEffect.ts +101 -101
  157. package/src/core/renderers/webgl/shaders/effects/EffectUtils.ts +159 -159
  158. package/src/core/renderers/webgl/shaders/effects/FadeOutEffect.ts +127 -127
  159. package/src/core/renderers/webgl/shaders/effects/GlitchEffect.ts +148 -148
  160. package/src/core/renderers/webgl/shaders/effects/GrayscaleEffect.ts +67 -67
  161. package/src/core/renderers/webgl/shaders/effects/HolePunchEffect.ts +157 -157
  162. package/src/core/renderers/webgl/shaders/effects/LinearGradientEffect.ts +171 -171
  163. package/src/core/renderers/webgl/shaders/effects/RadialGradientEffect.ts +168 -168
  164. package/src/core/renderers/webgl/shaders/effects/RadialProgressEffect.ts +187 -187
  165. package/src/core/renderers/webgl/shaders/effects/RadiusEffect.ts +110 -110
  166. package/src/core/renderers/webgl/shaders/effects/ShaderEffect.ts +196 -196
  167. package/src/core/text-rendering/TextRenderingUtils.ts +36 -36
  168. package/src/core/text-rendering/TextTextureRendererUtils.ts +263 -263
  169. package/src/core/text-rendering/TrFontManager.ts +183 -183
  170. package/src/core/text-rendering/font-face-types/SdfTrFontFace/SdfTrFontFace.ts +176 -176
  171. package/src/core/text-rendering/font-face-types/SdfTrFontFace/internal/FontShaper.ts +139 -139
  172. package/src/core/text-rendering/font-face-types/SdfTrFontFace/internal/SdfFontShaper.test.ts +173 -173
  173. package/src/core/text-rendering/font-face-types/SdfTrFontFace/internal/SdfFontShaper.ts +171 -171
  174. package/src/core/text-rendering/font-face-types/TrFontFace.ts +187 -187
  175. package/src/core/text-rendering/font-face-types/WebTrFontFace.ts +89 -89
  176. package/src/core/text-rendering/renderers/CanvasTextRenderer.ts +509 -509
  177. package/src/core/text-rendering/renderers/LightningTextTextureRenderer.ts +798 -798
  178. package/src/core/text-rendering/renderers/SdfTextRenderer/SdfTextRenderer.ts +853 -853
  179. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/PeekableGenerator.test.ts +48 -48
  180. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/PeekableGenerator.ts +66 -66
  181. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/SpecialCodepoints.ts +52 -52
  182. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/constants.ts +32 -32
  183. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/getStartConditions.ts +117 -117
  184. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/getUnicodeCodepoints.test.ts +133 -133
  185. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/getUnicodeCodepoints.ts +38 -38
  186. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/layoutText.ts +403 -403
  187. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/measureText.test.ts +49 -49
  188. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/measureText.ts +52 -52
  189. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/setRenderWindow.test.ts +205 -205
  190. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/setRenderWindow.ts +93 -93
  191. package/src/core/text-rendering/renderers/SdfTextRenderer/internal/util.ts +40 -40
  192. package/src/core/text-rendering/renderers/TextRenderer.ts +557 -557
  193. package/src/core/textures/ColorTexture.ts +102 -102
  194. package/src/core/textures/ImageTexture.ts +378 -378
  195. package/src/core/textures/NoiseTexture.ts +104 -104
  196. package/src/core/textures/RenderTexture.ts +85 -85
  197. package/src/core/textures/SubTexture.ts +171 -171
  198. package/src/core/textures/Texture.ts +423 -423
  199. package/src/core/utils.ts +227 -227
  200. package/src/env.d.ts +7 -7
  201. package/src/main-api/DynamicShaderController.ts +104 -104
  202. package/src/main-api/INode.ts +101 -101
  203. package/src/main-api/Inspector.ts +505 -505
  204. package/src/main-api/Renderer.ts +693 -693
  205. package/src/main-api/ShaderController.ts +80 -80
  206. package/src/main-api/utils.ts +45 -45
  207. package/src/utils.ts +248 -248
  208. package/COPYING +0 -1
@@ -1,167 +1,167 @@
1
- /*
2
- * If not stated otherwise in this file or this component's LICENSE file the
3
- * following copyright and licenses apply:
4
- *
5
- * Copyright 2023 Comcast Cable Communications Management, LLC.
6
- *
7
- * Licensed under the Apache License, Version 2.0 (the License);
8
- * you may not use this file except in compliance with the License.
9
- * You may obtain a copy of the License at
10
- *
11
- * http://www.apache.org/licenses/LICENSE-2.0
12
- *
13
- * Unless required by applicable law or agreed to in writing, software
14
- * distributed under the License is distributed on an "AS IS" BASIS,
15
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16
- * See the License for the specific language governing permissions and
17
- * limitations under the License.
18
- */
19
-
20
- import type { WebGlCoreRenderer } from '../WebGlCoreRenderer.js';
21
- import {
22
- WebGlCoreShader,
23
- type DimensionsShaderProp,
24
- } from '../WebGlCoreShader.js';
25
- import type { WebGlCoreCtxTexture } from '../WebGlCoreCtxTexture.js';
26
- import type { ShaderProgramSources } from '../internal/ShaderUtils.js';
27
-
28
- /**
29
- * Properties of the {@link RoundedRectangle} shader
30
- */
31
- export interface RoundedRectangleProps extends DimensionsShaderProp {
32
- /**
33
- * Corner radius, in pixels, to cut out of the corners
34
- *
35
- * @defaultValue 10
36
- */
37
- radius?: number;
38
- }
39
-
40
- /**
41
- * Similar to the {@link DefaultShader} but cuts out 4 rounded rectangle corners
42
- * as defined by the specified corner {@link RoundedRectangleProps.radius}
43
- */
44
- export class RoundedRectangle extends WebGlCoreShader {
45
- constructor(renderer: WebGlCoreRenderer) {
46
- super({
47
- renderer,
48
- attributes: ['a_position', 'a_textureCoordinate', 'a_color'],
49
- uniforms: [
50
- { name: 'u_resolution', uniform: 'uniform2fv' },
51
- { name: 'u_pixelRatio', uniform: 'uniform1f' },
52
- { name: 'u_texture', uniform: 'uniform2f' },
53
- { name: 'u_dimensions', uniform: 'uniform2fv' },
54
- { name: 'u_radius', uniform: 'uniform1f' },
55
- ],
56
- });
57
- }
58
-
59
- static z$__type__Props: RoundedRectangleProps;
60
-
61
- static override resolveDefaults(
62
- props: RoundedRectangleProps,
63
- ): Required<RoundedRectangleProps> {
64
- return {
65
- radius: props.radius || 10,
66
- $dimensions: {
67
- width: 0,
68
- height: 0,
69
- },
70
- };
71
- }
72
-
73
- override bindTextures(textures: WebGlCoreCtxTexture[]) {
74
- const { glw } = this;
75
- glw.activeTexture(0);
76
- glw.bindTexture(textures[0]!.ctxTexture);
77
- }
78
-
79
- protected override bindProps(props: Required<RoundedRectangleProps>): void {
80
- const radiusFactor =
81
- Math.min(props.$dimensions.width, props.$dimensions.height) /
82
- (2.0 * props.radius);
83
- this.glw.uniform1f(
84
- this.getUniformLocation('u_radius'),
85
- props.radius * Math.min(radiusFactor, 1),
86
- );
87
- }
88
-
89
- override canBatchShaderProps(
90
- propsA: Required<RoundedRectangleProps>,
91
- propsB: Required<RoundedRectangleProps>,
92
- ): boolean {
93
- return (
94
- propsA.radius === propsB.radius &&
95
- propsA.$dimensions.width === propsB.$dimensions.width &&
96
- propsA.$dimensions.height === propsB.$dimensions.height
97
- );
98
- }
99
-
100
- static override shaderSources: ShaderProgramSources = {
101
- vertex: `
102
- # ifdef GL_FRAGMENT_PRECISION_HIGH
103
- precision highp float;
104
- # else
105
- precision mediump float;
106
- # endif
107
-
108
- attribute vec2 a_position;
109
- attribute vec2 a_textureCoordinate;
110
- attribute vec4 a_color;
111
- attribute float a_textureIndex;
112
- attribute float a_depth;
113
-
114
- uniform vec2 u_resolution;
115
- uniform float u_pixelRatio;
116
-
117
- varying vec4 v_color;
118
- varying vec2 v_textureCoordinate;
119
-
120
- void main() {
121
- vec2 normalized = a_position * u_pixelRatio / u_resolution;
122
- vec2 zero_two = normalized * 2.0;
123
- vec2 clip_space = zero_two - 1.0;
124
-
125
- // pass to fragment
126
- v_color = a_color;
127
- v_textureCoordinate = a_textureCoordinate;
128
-
129
- // flip y
130
- gl_Position = vec4(clip_space * vec2(1.0, -1.0), 0, 1);
131
- }
132
- `,
133
- fragment: `
134
- # ifdef GL_FRAGMENT_PRECISION_HIGH
135
- precision highp float;
136
- # else
137
- precision mediump float;
138
- # endif
139
-
140
- uniform vec2 u_resolution;
141
- uniform vec2 u_dimensions;
142
- uniform float u_radius;
143
- uniform sampler2D u_texture;
144
-
145
- varying vec4 v_color;
146
- varying vec2 v_textureCoordinate;
147
-
148
- float boxDist(vec2 p, vec2 size, float radius){
149
- size -= vec2(radius);
150
- vec2 d = abs(p) - size;
151
- return min(max(d.x, d.y), 0.0) + length(max(d, 0.0)) - radius;
152
- }
153
-
154
- float fillMask(float dist) {
155
- return clamp(-dist, 0.0, 1.0);
156
- }
157
-
158
- void main() {
159
- vec4 color = texture2D(u_texture, v_textureCoordinate) * v_color;
160
- vec2 halfDimensions = u_dimensions * 0.5;
161
-
162
- float d = boxDist(v_textureCoordinate.xy * u_dimensions - halfDimensions, halfDimensions + 0.5, u_radius);
163
- gl_FragColor = mix(vec4(0.0), color, fillMask(d));
164
- }
165
- `,
166
- };
167
- }
1
+ /*
2
+ * If not stated otherwise in this file or this component's LICENSE file the
3
+ * following copyright and licenses apply:
4
+ *
5
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
6
+ *
7
+ * Licensed under the Apache License, Version 2.0 (the License);
8
+ * you may not use this file except in compliance with the License.
9
+ * You may obtain a copy of the License at
10
+ *
11
+ * http://www.apache.org/licenses/LICENSE-2.0
12
+ *
13
+ * Unless required by applicable law or agreed to in writing, software
14
+ * distributed under the License is distributed on an "AS IS" BASIS,
15
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16
+ * See the License for the specific language governing permissions and
17
+ * limitations under the License.
18
+ */
19
+
20
+ import type { WebGlCoreRenderer } from '../WebGlCoreRenderer.js';
21
+ import {
22
+ WebGlCoreShader,
23
+ type DimensionsShaderProp,
24
+ } from '../WebGlCoreShader.js';
25
+ import type { WebGlCoreCtxTexture } from '../WebGlCoreCtxTexture.js';
26
+ import type { ShaderProgramSources } from '../internal/ShaderUtils.js';
27
+
28
+ /**
29
+ * Properties of the {@link RoundedRectangle} shader
30
+ */
31
+ export interface RoundedRectangleProps extends DimensionsShaderProp {
32
+ /**
33
+ * Corner radius, in pixels, to cut out of the corners
34
+ *
35
+ * @defaultValue 10
36
+ */
37
+ radius?: number;
38
+ }
39
+
40
+ /**
41
+ * Similar to the {@link DefaultShader} but cuts out 4 rounded rectangle corners
42
+ * as defined by the specified corner {@link RoundedRectangleProps.radius}
43
+ */
44
+ export class RoundedRectangle extends WebGlCoreShader {
45
+ constructor(renderer: WebGlCoreRenderer) {
46
+ super({
47
+ renderer,
48
+ attributes: ['a_position', 'a_textureCoordinate', 'a_color'],
49
+ uniforms: [
50
+ { name: 'u_resolution', uniform: 'uniform2fv' },
51
+ { name: 'u_pixelRatio', uniform: 'uniform1f' },
52
+ { name: 'u_texture', uniform: 'uniform2f' },
53
+ { name: 'u_dimensions', uniform: 'uniform2fv' },
54
+ { name: 'u_radius', uniform: 'uniform1f' },
55
+ ],
56
+ });
57
+ }
58
+
59
+ static z$__type__Props: RoundedRectangleProps;
60
+
61
+ static override resolveDefaults(
62
+ props: RoundedRectangleProps,
63
+ ): Required<RoundedRectangleProps> {
64
+ return {
65
+ radius: props.radius || 10,
66
+ $dimensions: {
67
+ width: 0,
68
+ height: 0,
69
+ },
70
+ };
71
+ }
72
+
73
+ override bindTextures(textures: WebGlCoreCtxTexture[]) {
74
+ const { glw } = this;
75
+ glw.activeTexture(0);
76
+ glw.bindTexture(textures[0]!.ctxTexture);
77
+ }
78
+
79
+ protected override bindProps(props: Required<RoundedRectangleProps>): void {
80
+ const radiusFactor =
81
+ Math.min(props.$dimensions.width, props.$dimensions.height) /
82
+ (2.0 * props.radius);
83
+ this.glw.uniform1f(
84
+ this.getUniformLocation('u_radius'),
85
+ props.radius * Math.min(radiusFactor, 1),
86
+ );
87
+ }
88
+
89
+ override canBatchShaderProps(
90
+ propsA: Required<RoundedRectangleProps>,
91
+ propsB: Required<RoundedRectangleProps>,
92
+ ): boolean {
93
+ return (
94
+ propsA.radius === propsB.radius &&
95
+ propsA.$dimensions.width === propsB.$dimensions.width &&
96
+ propsA.$dimensions.height === propsB.$dimensions.height
97
+ );
98
+ }
99
+
100
+ static override shaderSources: ShaderProgramSources = {
101
+ vertex: `
102
+ # ifdef GL_FRAGMENT_PRECISION_HIGH
103
+ precision highp float;
104
+ # else
105
+ precision mediump float;
106
+ # endif
107
+
108
+ attribute vec2 a_position;
109
+ attribute vec2 a_textureCoordinate;
110
+ attribute vec4 a_color;
111
+ attribute float a_textureIndex;
112
+ attribute float a_depth;
113
+
114
+ uniform vec2 u_resolution;
115
+ uniform float u_pixelRatio;
116
+
117
+ varying vec4 v_color;
118
+ varying vec2 v_textureCoordinate;
119
+
120
+ void main() {
121
+ vec2 normalized = a_position * u_pixelRatio / u_resolution;
122
+ vec2 zero_two = normalized * 2.0;
123
+ vec2 clip_space = zero_two - 1.0;
124
+
125
+ // pass to fragment
126
+ v_color = a_color;
127
+ v_textureCoordinate = a_textureCoordinate;
128
+
129
+ // flip y
130
+ gl_Position = vec4(clip_space * vec2(1.0, -1.0), 0, 1);
131
+ }
132
+ `,
133
+ fragment: `
134
+ # ifdef GL_FRAGMENT_PRECISION_HIGH
135
+ precision highp float;
136
+ # else
137
+ precision mediump float;
138
+ # endif
139
+
140
+ uniform vec2 u_resolution;
141
+ uniform vec2 u_dimensions;
142
+ uniform float u_radius;
143
+ uniform sampler2D u_texture;
144
+
145
+ varying vec4 v_color;
146
+ varying vec2 v_textureCoordinate;
147
+
148
+ float boxDist(vec2 p, vec2 size, float radius){
149
+ size -= vec2(radius);
150
+ vec2 d = abs(p) - size;
151
+ return min(max(d.x, d.y), 0.0) + length(max(d, 0.0)) - radius;
152
+ }
153
+
154
+ float fillMask(float dist) {
155
+ return clamp(-dist, 0.0, 1.0);
156
+ }
157
+
158
+ void main() {
159
+ vec4 color = texture2D(u_texture, v_textureCoordinate) * v_color;
160
+ vec2 halfDimensions = u_dimensions * 0.5;
161
+
162
+ float d = boxDist(v_textureCoordinate.xy * u_dimensions - halfDimensions, halfDimensions + 0.5, u_radius);
163
+ gl_FragColor = mix(vec4(0.0), color, fillMask(d));
164
+ }
165
+ `,
166
+ };
167
+ }