@lightningjs/renderer 3.0.0-beta13 → 3.0.0-beta15
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/dist/exports/index.d.ts +1 -0
- package/dist/exports/index.js.map +1 -1
- package/dist/src/core/CoreNode.d.ts +1 -1
- package/dist/src/core/CoreTextNode.d.ts +0 -2
- package/dist/src/core/CoreTextNode.js +4 -16
- package/dist/src/core/CoreTextNode.js.map +1 -1
- package/dist/src/core/Stage.js +2 -3
- package/dist/src/core/Stage.js.map +1 -1
- package/dist/src/core/TextureError.d.ts +11 -0
- package/dist/src/core/TextureError.js +37 -0
- package/dist/src/core/TextureError.js.map +1 -0
- package/dist/src/core/animations/CoreAnimation.d.ts +3 -2
- package/dist/src/core/animations/CoreAnimation.js +3 -2
- package/dist/src/core/animations/CoreAnimation.js.map +1 -1
- package/dist/src/core/lib/WebGlContextWrapper.d.ts +6 -6
- package/dist/src/core/lib/WebGlContextWrapper.js +2 -2
- package/dist/src/core/lib/WebGlContextWrapper.js.map +1 -1
- package/dist/src/core/lib/textureCompression.js +1 -1
- package/dist/src/core/lib/textureCompression.js.map +1 -1
- package/dist/src/core/platform.d.ts +10 -0
- package/dist/src/core/platform.js +81 -0
- package/dist/src/core/platform.js.map +1 -0
- package/dist/src/core/renderers/CoreShader.d.ts +9 -0
- package/{src/core/text-rendering/sdf/index.ts → dist/src/core/renderers/CoreShader.js} +11 -3
- package/dist/src/core/renderers/CoreShader.js.map +1 -0
- package/dist/src/core/renderers/canvas/CanvasCoreRenderer.d.ts +33 -0
- package/dist/src/core/renderers/canvas/CanvasCoreRenderer.js +250 -0
- package/dist/src/core/renderers/canvas/CanvasCoreRenderer.js.map +1 -0
- package/dist/src/core/renderers/canvas/CanvasCoreTexture.d.ts +17 -0
- package/dist/src/core/renderers/canvas/CanvasCoreTexture.js +125 -0
- package/dist/src/core/renderers/canvas/CanvasCoreTexture.js.map +1 -0
- package/dist/src/core/renderers/canvas/internal/C2DShaderUtils.d.ts +14 -0
- package/dist/src/core/renderers/canvas/internal/C2DShaderUtils.js +138 -0
- package/dist/src/core/renderers/canvas/internal/C2DShaderUtils.js.map +1 -0
- package/dist/src/core/renderers/canvas/internal/ColorUtils.d.ts +19 -0
- package/dist/src/core/renderers/canvas/internal/ColorUtils.js +58 -0
- package/dist/src/core/renderers/canvas/internal/ColorUtils.js.map +1 -0
- package/dist/src/core/renderers/canvas/shaders/UnsupportedShader.d.ts +10 -0
- package/dist/src/core/renderers/canvas/shaders/UnsupportedShader.js +43 -0
- package/dist/src/core/renderers/canvas/shaders/UnsupportedShader.js.map +1 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxRenderTexture.d.ts +12 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxRenderTexture.js +58 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxRenderTexture.js.map +1 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxSubTexture.d.ts +9 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxSubTexture.js +38 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxSubTexture.js.map +1 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxTexture.d.ts +65 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxTexture.js +269 -0
- package/dist/src/core/renderers/webgl/WebGlCoreCtxTexture.js.map +1 -0
- package/dist/src/core/renderers/webgl/WebGlCoreRenderOp.d.ts +34 -0
- package/dist/src/core/renderers/webgl/WebGlCoreRenderOp.js +114 -0
- package/dist/src/core/renderers/webgl/WebGlCoreRenderOp.js.map +1 -0
- package/dist/src/core/renderers/webgl/WebGlCoreRenderer.d.ts +133 -0
- package/dist/src/core/renderers/webgl/WebGlCoreRenderer.js +616 -0
- package/dist/src/core/renderers/webgl/WebGlCoreRenderer.js.map +1 -0
- package/dist/src/core/renderers/webgl/WebGlCoreShader.d.ts +83 -0
- package/dist/src/core/renderers/webgl/WebGlCoreShader.js +233 -0
- package/dist/src/core/renderers/webgl/WebGlCoreShader.js.map +1 -0
- package/dist/src/core/renderers/webgl/WebGlShaderProgram.d.ts +1 -1
- package/dist/src/core/renderers/webgl/WebGlShaderProgram.js +4 -5
- package/dist/src/core/renderers/webgl/WebGlShaderProgram.js.map +1 -1
- package/dist/src/core/renderers/webgl/shaders/DefaultShader.d.ts +9 -0
- package/dist/src/core/renderers/webgl/shaders/DefaultShader.js +87 -0
- package/dist/src/core/renderers/webgl/shaders/DefaultShader.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/DefaultShaderBatched.d.ts +10 -0
- package/dist/src/core/renderers/webgl/shaders/DefaultShaderBatched.js +119 -0
- package/dist/src/core/renderers/webgl/shaders/DefaultShaderBatched.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/DynamicShader.d.ts +29 -0
- package/dist/src/core/renderers/webgl/shaders/DynamicShader.js +413 -0
- package/dist/src/core/renderers/webgl/shaders/DynamicShader.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/RoundedRectangle.d.ts +28 -0
- package/dist/src/core/renderers/webgl/shaders/RoundedRectangle.js +131 -0
- package/dist/src/core/renderers/webgl/shaders/RoundedRectangle.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/SdfShader.d.ts +47 -0
- package/dist/src/core/renderers/webgl/shaders/SdfShader.js +160 -0
- package/dist/src/core/renderers/webgl/shaders/SdfShader.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderBottomEffect.d.ts +31 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderBottomEffect.js +71 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderBottomEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderEffect.d.ts +30 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderEffect.js +58 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderLeftEffect.d.ts +31 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderLeftEffect.js +71 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderLeftEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderRightEffect.d.ts +31 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderRightEffect.js +71 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderRightEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderTopEffect.d.ts +31 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderTopEffect.js +71 -0
- package/dist/src/core/renderers/webgl/shaders/effects/BorderTopEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/EffectUtils.d.ts +9 -0
- package/dist/src/core/renderers/webgl/shaders/effects/EffectUtils.js +136 -0
- package/dist/src/core/renderers/webgl/shaders/effects/EffectUtils.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/FadeOutEffect.d.ts +36 -0
- package/dist/src/core/renderers/webgl/shaders/effects/FadeOutEffect.js +85 -0
- package/dist/src/core/renderers/webgl/shaders/effects/FadeOutEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/GlitchEffect.d.ts +45 -0
- package/dist/src/core/renderers/webgl/shaders/effects/GlitchEffect.js +104 -0
- package/dist/src/core/renderers/webgl/shaders/effects/GlitchEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/GrayscaleEffect.d.ts +22 -0
- package/dist/src/core/renderers/webgl/shaders/effects/GrayscaleEffect.js +45 -0
- package/dist/src/core/renderers/webgl/shaders/effects/GrayscaleEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/HolePunchEffect.d.ts +58 -0
- package/dist/src/core/renderers/webgl/shaders/effects/HolePunchEffect.js +80 -0
- package/dist/src/core/renderers/webgl/shaders/effects/HolePunchEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/LinearGradientEffect.d.ts +35 -0
- package/dist/src/core/renderers/webgl/shaders/effects/LinearGradientEffect.js +129 -0
- package/dist/src/core/renderers/webgl/shaders/effects/LinearGradientEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadialGradientEffect.d.ts +39 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadialGradientEffect.js +116 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadialGradientEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadialProgressEffect.d.ts +61 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadialProgressEffect.js +127 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadialProgressEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadiusEffect.d.ts +40 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadiusEffect.js +71 -0
- package/dist/src/core/renderers/webgl/shaders/effects/RadiusEffect.js.map +1 -0
- package/dist/src/core/renderers/webgl/shaders/effects/ShaderEffect.d.ts +115 -0
- package/dist/src/core/renderers/webgl/shaders/effects/ShaderEffect.js +61 -0
- package/dist/src/core/renderers/webgl/shaders/effects/ShaderEffect.js.map +1 -0
- package/dist/src/core/shaders/canvas/RoundedWithBorder.js +1 -1
- package/dist/src/core/shaders/canvas/RoundedWithBorder.js.map +1 -1
- package/dist/src/core/shaders/canvas/RoundedWithBorderAndShadow.js +1 -1
- package/dist/src/core/shaders/canvas/RoundedWithBorderAndShadow.js.map +1 -1
- package/dist/src/core/shaders/webgl/LinearGradient.js +26 -3
- package/dist/src/core/shaders/webgl/LinearGradient.js.map +1 -1
- package/dist/src/core/shaders/webgl/RadialGradient.js +49 -27
- package/dist/src/core/shaders/webgl/RadialGradient.js.map +1 -1
- package/dist/src/core/shaders/webgl/SdfShader.d.ts +0 -2
- package/dist/src/core/shaders/webgl/SdfShader.js +1 -10
- package/dist/src/core/shaders/webgl/SdfShader.js.map +1 -1
- package/dist/src/core/text-rendering/CanvasFontHandler.d.ts +21 -3
- package/dist/src/core/text-rendering/CanvasFontHandler.js +94 -32
- package/dist/src/core/text-rendering/CanvasFontHandler.js.map +1 -1
- package/dist/src/core/text-rendering/CanvasTextRenderer.d.ts +2 -7
- package/dist/src/core/text-rendering/CanvasTextRenderer.js +51 -260
- package/dist/src/core/text-rendering/CanvasTextRenderer.js.map +1 -1
- package/dist/src/core/text-rendering/SdfFontHandler.d.ts +35 -5
- package/dist/src/core/text-rendering/SdfFontHandler.js +76 -56
- package/dist/src/core/text-rendering/SdfFontHandler.js.map +1 -1
- package/dist/src/core/text-rendering/SdfTextRenderer.d.ts +1 -1
- package/dist/src/core/text-rendering/SdfTextRenderer.js +38 -82
- package/dist/src/core/text-rendering/SdfTextRenderer.js.map +1 -1
- package/dist/src/core/text-rendering/TextLayoutEngine.d.ts +19 -0
- package/dist/src/core/text-rendering/{sdf/Utils.js → TextLayoutEngine.js} +125 -105
- package/dist/src/core/text-rendering/TextLayoutEngine.js.map +1 -0
- package/dist/src/core/text-rendering/TextRenderer.d.ts +30 -13
- package/dist/src/core/text-rendering/TextRenderingUtils.d.ts +12 -0
- package/dist/src/core/text-rendering/TextRenderingUtils.js +14 -0
- package/dist/src/core/text-rendering/TextRenderingUtils.js.map +1 -0
- package/dist/src/core/text-rendering/TextTextureRendererUtils.d.ts +72 -0
- package/dist/src/core/text-rendering/TextTextureRendererUtils.js +217 -0
- package/dist/src/core/text-rendering/TextTextureRendererUtils.js.map +1 -0
- package/dist/src/core/text-rendering/TrFontManager.d.ts +26 -0
- package/dist/src/core/text-rendering/TrFontManager.js +131 -0
- package/dist/src/core/text-rendering/TrFontManager.js.map +1 -0
- package/dist/src/core/text-rendering/Utils.d.ts +1 -42
- package/dist/src/core/text-rendering/Utils.js +4 -132
- package/dist/src/core/text-rendering/Utils.js.map +1 -1
- package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/SdfTrFontFace.d.ts +39 -0
- package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/SdfTrFontFace.js +125 -0
- package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/SdfTrFontFace.js.map +1 -0
- package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/internal/FontShaper.d.ts +103 -0
- package/dist/src/core/text-rendering/{sdf/index.js → font-face-types/SdfTrFontFace/internal/FontShaper.js} +4 -3
- package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/internal/FontShaper.js.map +1 -0
- package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/internal/SdfFontShaper.d.ts +62 -0
- package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/internal/SdfFontShaper.js +88 -0
- package/dist/src/core/text-rendering/font-face-types/SdfTrFontFace/internal/SdfFontShaper.js.map +1 -0
- package/dist/src/core/text-rendering/font-face-types/TrFontFace.d.ts +118 -0
- package/dist/src/core/text-rendering/font-face-types/TrFontFace.js +63 -0
- package/dist/src/core/text-rendering/font-face-types/TrFontFace.js.map +1 -0
- package/dist/src/core/text-rendering/font-face-types/WebTrFontFace.d.ts +14 -0
- package/dist/src/core/text-rendering/font-face-types/WebTrFontFace.js +66 -0
- package/dist/src/core/text-rendering/font-face-types/WebTrFontFace.js.map +1 -0
- package/dist/src/core/text-rendering/font-face-types/utils.d.ts +1 -0
- package/dist/src/core/text-rendering/font-face-types/utils.js +38 -0
- package/dist/src/core/text-rendering/font-face-types/utils.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/CanvasTextRenderer.d.ts +59 -0
- package/dist/src/core/text-rendering/renderers/CanvasTextRenderer.js +397 -0
- package/dist/src/core/text-rendering/renderers/CanvasTextRenderer.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/LightningTextTextureRenderer.d.ts +120 -0
- package/dist/src/core/text-rendering/renderers/LightningTextTextureRenderer.js +551 -0
- package/dist/src/core/text-rendering/renderers/LightningTextTextureRenderer.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/SdfTextRenderer.d.ts +92 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/SdfTextRenderer.js +607 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/SdfTextRenderer.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/PeekableGenerator.d.ts +12 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/PeekableGenerator.js +61 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/PeekableGenerator.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/SpecialCodepoints.d.ts +33 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/SpecialCodepoints.js +52 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/SpecialCodepoints.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/constants.d.ts +13 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/constants.js +32 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/constants.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/getStartConditions.d.ts +23 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/getStartConditions.js +84 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/getStartConditions.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/getUnicodeCodepoints.d.ts +4 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/getUnicodeCodepoints.js +34 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/getUnicodeCodepoints.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/layoutText.d.ts +20 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/layoutText.js +308 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/layoutText.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/measureText.d.ts +10 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/measureText.js +40 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/measureText.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/setRenderWindow.d.ts +26 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/setRenderWindow.js +70 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/setRenderWindow.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/util.d.ts +16 -0
- package/dist/src/core/text-rendering/{canvas/Settings.js → renderers/SdfTextRenderer/internal/util.js} +22 -3
- package/dist/src/core/text-rendering/renderers/SdfTextRenderer/internal/util.js.map +1 -0
- package/dist/src/core/text-rendering/renderers/TextRenderer.d.ts +373 -0
- package/dist/src/core/text-rendering/renderers/TextRenderer.js +178 -0
- package/dist/src/core/text-rendering/renderers/TextRenderer.js.map +1 -0
- package/dist/src/core/utils.d.ts +2 -1
- package/dist/src/core/utils.js +1 -1
- package/dist/src/core/utils.js.map +1 -1
- package/dist/src/main-api/DynamicShaderController.d.ts +29 -0
- package/dist/src/main-api/DynamicShaderController.js +58 -0
- package/dist/src/main-api/DynamicShaderController.js.map +1 -0
- package/dist/src/main-api/Inspector.d.ts +124 -0
- package/dist/src/main-api/Inspector.js +283 -8
- package/dist/src/main-api/Inspector.js.map +1 -1
- package/dist/src/main-api/Renderer.d.ts +150 -26
- package/dist/src/main-api/Renderer.js +27 -25
- package/dist/src/main-api/Renderer.js.map +1 -1
- package/dist/src/main-api/ShaderController.d.ts +31 -0
- package/dist/src/main-api/ShaderController.js +37 -0
- package/dist/src/main-api/ShaderController.js.map +1 -0
- package/dist/tsconfig.dist.tsbuildinfo +1 -1
- package/exports/index.ts +1 -0
- package/package.json +14 -15
- package/src/core/CoreTextNode.ts +4 -22
- package/src/core/Stage.ts +2 -3
- package/src/core/animations/CoreAnimation.ts +8 -7
- package/src/core/lib/WebGlContextWrapper.ts +4 -3
- package/src/core/lib/textureCompression.ts +4 -2
- package/src/core/renderers/webgl/WebGlShaderProgram.ts +5 -6
- package/src/core/shaders/canvas/RoundedWithBorder.ts +1 -1
- package/src/core/shaders/canvas/RoundedWithBorderAndShadow.ts +1 -1
- package/src/core/shaders/webgl/LinearGradient.ts +26 -3
- package/src/core/shaders/webgl/RadialGradient.ts +50 -28
- package/src/core/shaders/webgl/SdfShader.ts +1 -12
- package/src/core/text-rendering/CanvasFontHandler.ts +136 -39
- package/src/core/text-rendering/CanvasTextRenderer.ts +75 -440
- package/src/core/text-rendering/SdfFontHandler.ts +94 -60
- package/src/core/text-rendering/SdfTextRenderer.ts +62 -116
- package/src/core/text-rendering/{sdf/Utils.ts → TextLayoutEngine.ts} +209 -143
- package/src/core/text-rendering/TextRenderer.ts +36 -13
- package/src/core/text-rendering/Utils.ts +5 -163
- package/src/core/text-rendering/{sdf/Utils.test.ts → tests/Canvas.test.ts} +98 -122
- package/src/core/text-rendering/tests/SdfTests.test.ts +414 -0
- package/src/core/utils.ts +9 -7
- package/src/main-api/Inspector.ts +502 -12
- package/src/main-api/Renderer.ts +158 -26
- package/dist/src/core/text-rendering/canvas/Settings.d.ts +0 -64
- package/dist/src/core/text-rendering/canvas/Settings.js.map +0 -1
- package/dist/src/core/text-rendering/canvas/Utils.d.ts +0 -20
- package/dist/src/core/text-rendering/canvas/Utils.js +0 -144
- package/dist/src/core/text-rendering/canvas/Utils.js.map +0 -1
- package/dist/src/core/text-rendering/canvas/calculateRenderInfo.d.ts +0 -60
- package/dist/src/core/text-rendering/canvas/calculateRenderInfo.js +0 -183
- package/dist/src/core/text-rendering/canvas/calculateRenderInfo.js.map +0 -1
- package/dist/src/core/text-rendering/canvas/draw.d.ts +0 -5
- package/dist/src/core/text-rendering/canvas/draw.js +0 -132
- package/dist/src/core/text-rendering/canvas/draw.js.map +0 -1
- package/dist/src/core/text-rendering/sdf/Utils.d.ts +0 -26
- package/dist/src/core/text-rendering/sdf/Utils.js.map +0 -1
- package/dist/src/core/text-rendering/sdf/index.d.ts +0 -1
- package/dist/src/core/text-rendering/sdf/index.js.map +0 -1
- package/src/core/text-rendering/canvas/Settings.ts +0 -99
- package/src/core/text-rendering/canvas/Utils.test.ts +0 -206
- package/src/core/text-rendering/canvas/Utils.ts +0 -178
- package/src/core/text-rendering/canvas/calculateRenderInfo.ts +0 -299
- package/src/core/text-rendering/canvas/draw.ts +0 -165
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
import { type RGBA } from '../../lib/utils.js';
|
|
2
|
+
import type { NormalizedFontMetrics } from '../font-face-types/TrFontFace.js';
|
|
3
|
+
import type { WebTrFontFace } from '../font-face-types/WebTrFontFace.js';
|
|
4
|
+
/**
|
|
5
|
+
* Text Overflow Values
|
|
6
|
+
*/
|
|
7
|
+
export type TextOverflow = 'ellipsis' | 'clip' | (string & Record<never, never>);
|
|
8
|
+
/***
|
|
9
|
+
* Text Horizontal Align Values
|
|
10
|
+
*/
|
|
11
|
+
export type TextAlign = 'left' | 'center' | 'right';
|
|
12
|
+
/***
|
|
13
|
+
* Text Baseline Values
|
|
14
|
+
*/
|
|
15
|
+
export type TextBaseline = 'alphabetic' | 'top' | 'hanging' | 'middle' | 'ideographic' | 'bottom';
|
|
16
|
+
/***
|
|
17
|
+
* Text Vertical Align Values
|
|
18
|
+
*/
|
|
19
|
+
export type TextVerticalAlign = 'top' | 'middle' | 'bottom';
|
|
20
|
+
/**
|
|
21
|
+
* Text Texture Settings
|
|
22
|
+
*/
|
|
23
|
+
export interface Settings {
|
|
24
|
+
w: number;
|
|
25
|
+
h: number;
|
|
26
|
+
text: string;
|
|
27
|
+
fontStyle: string;
|
|
28
|
+
fontSize: number;
|
|
29
|
+
fontBaselineRatio: number;
|
|
30
|
+
fontFamily: string | null;
|
|
31
|
+
trFontFace: WebTrFontFace | null;
|
|
32
|
+
wordWrap: boolean;
|
|
33
|
+
wordWrapWidth: number;
|
|
34
|
+
wordBreak: boolean;
|
|
35
|
+
textOverflow: TextOverflow | null;
|
|
36
|
+
lineHeight: number | null;
|
|
37
|
+
textBaseline: TextBaseline;
|
|
38
|
+
textAlign: TextAlign;
|
|
39
|
+
verticalAlign: TextVerticalAlign;
|
|
40
|
+
offsetY: number | null;
|
|
41
|
+
maxLines: number;
|
|
42
|
+
maxHeight: number | null;
|
|
43
|
+
overflowSuffix: string;
|
|
44
|
+
precision: number;
|
|
45
|
+
textColor: RGBA;
|
|
46
|
+
paddingLeft: number;
|
|
47
|
+
paddingRight: number;
|
|
48
|
+
shadow: boolean;
|
|
49
|
+
shadowColor: RGBA;
|
|
50
|
+
shadowOffsetX: number;
|
|
51
|
+
shadowOffsetY: number;
|
|
52
|
+
shadowBlur: number;
|
|
53
|
+
highlight: boolean;
|
|
54
|
+
highlightHeight: number;
|
|
55
|
+
highlightColor: RGBA;
|
|
56
|
+
highlightOffset: number;
|
|
57
|
+
highlightPaddingLeft: number;
|
|
58
|
+
highlightPaddingRight: number;
|
|
59
|
+
letterSpacing: number;
|
|
60
|
+
textIndent: number;
|
|
61
|
+
cutSx: number;
|
|
62
|
+
cutSy: number;
|
|
63
|
+
cutEx: number;
|
|
64
|
+
cutEy: number;
|
|
65
|
+
advancedRenderer: boolean;
|
|
66
|
+
textRenderIssueMargin: number;
|
|
67
|
+
}
|
|
68
|
+
export interface RenderInfo {
|
|
69
|
+
w: number;
|
|
70
|
+
h: number;
|
|
71
|
+
lines: string[];
|
|
72
|
+
precision: number;
|
|
73
|
+
remainingText: string;
|
|
74
|
+
moreTextLines: boolean;
|
|
75
|
+
width: number;
|
|
76
|
+
innerWidth: number;
|
|
77
|
+
height: number;
|
|
78
|
+
fontSize: number;
|
|
79
|
+
cutSx: number;
|
|
80
|
+
cutSy: number;
|
|
81
|
+
cutEx: number;
|
|
82
|
+
cutEy: number;
|
|
83
|
+
lineHeight: number;
|
|
84
|
+
defLineHeight: number;
|
|
85
|
+
lineWidths: number[];
|
|
86
|
+
offsetY: number;
|
|
87
|
+
paddingLeft: number;
|
|
88
|
+
paddingRight: number;
|
|
89
|
+
letterSpacing: number;
|
|
90
|
+
textIndent: number;
|
|
91
|
+
metrics: NormalizedFontMetrics;
|
|
92
|
+
}
|
|
93
|
+
export declare class LightningTextTextureRenderer {
|
|
94
|
+
private _canvas;
|
|
95
|
+
private _context;
|
|
96
|
+
private _settings;
|
|
97
|
+
constructor(canvas: OffscreenCanvas | HTMLCanvasElement, context: OffscreenCanvasRenderingContext2D | CanvasRenderingContext2D);
|
|
98
|
+
set settings(v: Partial<Settings>);
|
|
99
|
+
get settings(): Settings;
|
|
100
|
+
getPrecision(): number;
|
|
101
|
+
setFontProperties(): void;
|
|
102
|
+
_getFontSetting(): string;
|
|
103
|
+
_load(): Promise<void> | undefined;
|
|
104
|
+
calculateRenderInfo(): RenderInfo;
|
|
105
|
+
draw(renderInfo: RenderInfo, linesOverride?: {
|
|
106
|
+
lines: string[];
|
|
107
|
+
lineWidths: number[];
|
|
108
|
+
}): void;
|
|
109
|
+
wrapWord(word: string, wordWrapWidth: number, suffix: string): string;
|
|
110
|
+
/**
|
|
111
|
+
* Applies newlines to a string to have it optimally fit into the horizontal
|
|
112
|
+
* bounds set by the Text object's wordWrapWidth property.
|
|
113
|
+
*/
|
|
114
|
+
wrapText(text: string, wordWrapWidth: number, letterSpacing: number, indent?: number): {
|
|
115
|
+
l: string[];
|
|
116
|
+
n: number[];
|
|
117
|
+
};
|
|
118
|
+
measureText(word: string, space?: number): number;
|
|
119
|
+
mergeDefaults(settings: Partial<Settings>): Settings;
|
|
120
|
+
}
|
|
@@ -0,0 +1,551 @@
|
|
|
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
|
+
/* eslint-disable @typescript-eslint/no-non-null-assertion */
|
|
20
|
+
import { assertTruthy } from '../../../utils.js';
|
|
21
|
+
import { getRgbaString } from '../../lib/utils.js';
|
|
22
|
+
import { calcDefaultLineHeight } from '../TextRenderingUtils.js';
|
|
23
|
+
import { getWebFontMetrics, isZeroWidthSpace, } from '../TextTextureRendererUtils.js';
|
|
24
|
+
const MAX_TEXTURE_DIMENSION = 2048;
|
|
25
|
+
/**
|
|
26
|
+
* Calculate height for the canvas
|
|
27
|
+
*
|
|
28
|
+
* @param textBaseline
|
|
29
|
+
* @param fontSize
|
|
30
|
+
* @param lineHeight
|
|
31
|
+
* @param numLines
|
|
32
|
+
* @param offsetY
|
|
33
|
+
* @returns
|
|
34
|
+
*/
|
|
35
|
+
function calcHeight(textBaseline, fontSize, lineHeight, numLines, offsetY) {
|
|
36
|
+
const baselineOffset = textBaseline !== 'bottom' ? 0.5 * fontSize : 0;
|
|
37
|
+
return (lineHeight * (numLines - 1) +
|
|
38
|
+
baselineOffset +
|
|
39
|
+
Math.max(lineHeight, fontSize) +
|
|
40
|
+
(offsetY || 0));
|
|
41
|
+
}
|
|
42
|
+
export class LightningTextTextureRenderer {
|
|
43
|
+
_canvas;
|
|
44
|
+
_context;
|
|
45
|
+
_settings;
|
|
46
|
+
constructor(canvas, context) {
|
|
47
|
+
this._canvas = canvas;
|
|
48
|
+
this._context = context;
|
|
49
|
+
this._settings = this.mergeDefaults({});
|
|
50
|
+
}
|
|
51
|
+
set settings(v) {
|
|
52
|
+
this._settings = this.mergeDefaults(v);
|
|
53
|
+
}
|
|
54
|
+
get settings() {
|
|
55
|
+
return this._settings;
|
|
56
|
+
}
|
|
57
|
+
getPrecision() {
|
|
58
|
+
return this._settings.precision;
|
|
59
|
+
}
|
|
60
|
+
setFontProperties() {
|
|
61
|
+
this._context.font = this._getFontSetting();
|
|
62
|
+
this._context.textBaseline = this._settings.textBaseline;
|
|
63
|
+
}
|
|
64
|
+
_getFontSetting() {
|
|
65
|
+
const ff = [this._settings.fontFamily];
|
|
66
|
+
const ffs = [];
|
|
67
|
+
for (let i = 0, n = ff.length; i < n; i++) {
|
|
68
|
+
if (ff[i] === 'serif' || ff[i] === 'sans-serif') {
|
|
69
|
+
ffs.push(ff[i]);
|
|
70
|
+
}
|
|
71
|
+
else {
|
|
72
|
+
ffs.push(`"${ff[i]}"`);
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
return `${this._settings.fontStyle} ${this._settings.fontSize * this.getPrecision()}px ${ffs.join(',')}`;
|
|
76
|
+
}
|
|
77
|
+
_load() {
|
|
78
|
+
if (true && document.fonts) {
|
|
79
|
+
const fontSetting = this._getFontSetting();
|
|
80
|
+
try {
|
|
81
|
+
if (!document.fonts.check(fontSetting, this._settings.text)) {
|
|
82
|
+
// Use a promise that waits for loading.
|
|
83
|
+
return document.fonts
|
|
84
|
+
.load(fontSetting, this._settings.text)
|
|
85
|
+
.catch((err) => {
|
|
86
|
+
// Just load the fallback font.
|
|
87
|
+
console.warn('[Lightning] Font load error', err, fontSetting);
|
|
88
|
+
})
|
|
89
|
+
.then(() => {
|
|
90
|
+
if (!document.fonts.check(fontSetting, this._settings.text)) {
|
|
91
|
+
console.warn('[Lightning] Font not found', fontSetting);
|
|
92
|
+
}
|
|
93
|
+
});
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
catch (e) {
|
|
97
|
+
console.warn("[Lightning] Can't check font loading for " + fontSetting);
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
calculateRenderInfo() {
|
|
102
|
+
const renderInfo = {};
|
|
103
|
+
const precision = this.getPrecision();
|
|
104
|
+
const paddingLeft = this._settings.paddingLeft * precision;
|
|
105
|
+
const paddingRight = this._settings.paddingRight * precision;
|
|
106
|
+
const fontSize = this._settings.fontSize * precision;
|
|
107
|
+
let offsetY = this._settings.offsetY === null
|
|
108
|
+
? null
|
|
109
|
+
: this._settings.offsetY * precision;
|
|
110
|
+
const w = this._settings.w * precision;
|
|
111
|
+
const h = this._settings.h * precision;
|
|
112
|
+
let wordWrapWidth = this._settings.wordWrapWidth * precision;
|
|
113
|
+
const cutSx = this._settings.cutSx * precision;
|
|
114
|
+
const cutEx = this._settings.cutEx * precision;
|
|
115
|
+
const cutSy = this._settings.cutSy * precision;
|
|
116
|
+
const cutEy = this._settings.cutEy * precision;
|
|
117
|
+
const letterSpacing = (this._settings.letterSpacing || 0) * precision;
|
|
118
|
+
const textIndent = this._settings.textIndent * precision;
|
|
119
|
+
const trFontFace = this._settings.trFontFace;
|
|
120
|
+
// Set font properties.
|
|
121
|
+
this.setFontProperties();
|
|
122
|
+
assertTruthy(trFontFace);
|
|
123
|
+
const metrics = getWebFontMetrics(this._context, trFontFace, fontSize);
|
|
124
|
+
const defLineHeight = calcDefaultLineHeight(metrics, fontSize) * precision;
|
|
125
|
+
const lineHeight = this._settings.lineHeight !== null
|
|
126
|
+
? this._settings.lineHeight * precision
|
|
127
|
+
: defLineHeight;
|
|
128
|
+
const maxHeight = this._settings.maxHeight;
|
|
129
|
+
const containedMaxLines = maxHeight !== null && lineHeight > 0
|
|
130
|
+
? Math.floor(maxHeight / lineHeight)
|
|
131
|
+
: 0;
|
|
132
|
+
const setMaxLines = this._settings.maxLines;
|
|
133
|
+
const calcMaxLines = containedMaxLines > 0 && setMaxLines > 0
|
|
134
|
+
? Math.min(containedMaxLines, setMaxLines)
|
|
135
|
+
: Math.max(containedMaxLines, setMaxLines);
|
|
136
|
+
// Total width.
|
|
137
|
+
let width = w || 2048 / this.getPrecision();
|
|
138
|
+
// Inner width.
|
|
139
|
+
let innerWidth = width - paddingLeft;
|
|
140
|
+
if (innerWidth < 10) {
|
|
141
|
+
width += 10 - innerWidth;
|
|
142
|
+
innerWidth = 10;
|
|
143
|
+
}
|
|
144
|
+
if (!wordWrapWidth) {
|
|
145
|
+
wordWrapWidth = innerWidth;
|
|
146
|
+
}
|
|
147
|
+
// Text overflow
|
|
148
|
+
if (this._settings.textOverflow && !this._settings.wordWrap) {
|
|
149
|
+
let suffix;
|
|
150
|
+
switch (this._settings.textOverflow) {
|
|
151
|
+
case 'clip':
|
|
152
|
+
suffix = '';
|
|
153
|
+
break;
|
|
154
|
+
case 'ellipsis':
|
|
155
|
+
suffix = this._settings.overflowSuffix;
|
|
156
|
+
break;
|
|
157
|
+
default:
|
|
158
|
+
suffix = this._settings.textOverflow;
|
|
159
|
+
}
|
|
160
|
+
this._settings.text = this.wrapWord(this._settings.text, wordWrapWidth - textIndent, suffix);
|
|
161
|
+
}
|
|
162
|
+
// word wrap
|
|
163
|
+
// preserve original text
|
|
164
|
+
let linesInfo;
|
|
165
|
+
if (this._settings.wordWrap) {
|
|
166
|
+
linesInfo = this.wrapText(this._settings.text, wordWrapWidth, letterSpacing, textIndent);
|
|
167
|
+
}
|
|
168
|
+
else {
|
|
169
|
+
linesInfo = { l: this._settings.text.split(/(?:\r\n|\r|\n)/), n: [] };
|
|
170
|
+
const n = linesInfo.l.length;
|
|
171
|
+
for (let i = 0; i < n - 1; i++) {
|
|
172
|
+
linesInfo.n.push(i);
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
let lines = linesInfo.l;
|
|
176
|
+
if (calcMaxLines && lines.length > calcMaxLines) {
|
|
177
|
+
const usedLines = lines.slice(0, calcMaxLines);
|
|
178
|
+
let otherLines = null;
|
|
179
|
+
if (this._settings.overflowSuffix) {
|
|
180
|
+
// Wrap again with max lines suffix enabled.
|
|
181
|
+
const w = this._settings.overflowSuffix
|
|
182
|
+
? this.measureText(this._settings.overflowSuffix)
|
|
183
|
+
: 0;
|
|
184
|
+
const al = this.wrapText(usedLines[usedLines.length - 1], wordWrapWidth - w, letterSpacing, textIndent);
|
|
185
|
+
usedLines[usedLines.length - 1] = `${al.l[0]}${this._settings.overflowSuffix}`;
|
|
186
|
+
otherLines = [al.l.length > 1 ? al.l[1] : ''];
|
|
187
|
+
}
|
|
188
|
+
else {
|
|
189
|
+
otherLines = [''];
|
|
190
|
+
}
|
|
191
|
+
// Re-assemble the remaining text.
|
|
192
|
+
let i;
|
|
193
|
+
const n = lines.length;
|
|
194
|
+
let j = 0;
|
|
195
|
+
const m = linesInfo.n.length;
|
|
196
|
+
for (i = calcMaxLines; i < n; i++) {
|
|
197
|
+
otherLines[j] += `${otherLines[j] ? ' ' : ''}${lines[i]}`;
|
|
198
|
+
if (i + 1 < m && linesInfo.n[i + 1]) {
|
|
199
|
+
j++;
|
|
200
|
+
}
|
|
201
|
+
}
|
|
202
|
+
renderInfo.remainingText = otherLines.join('\n');
|
|
203
|
+
renderInfo.moreTextLines = true;
|
|
204
|
+
lines = usedLines;
|
|
205
|
+
}
|
|
206
|
+
else {
|
|
207
|
+
renderInfo.moreTextLines = false;
|
|
208
|
+
renderInfo.remainingText = '';
|
|
209
|
+
}
|
|
210
|
+
// calculate text width
|
|
211
|
+
let maxLineWidth = 0;
|
|
212
|
+
const lineWidths = [];
|
|
213
|
+
for (let i = 0; i < lines.length; i++) {
|
|
214
|
+
const lineWidth = this.measureText(lines[i], letterSpacing) + (i === 0 ? textIndent : 0);
|
|
215
|
+
lineWidths.push(lineWidth);
|
|
216
|
+
maxLineWidth = Math.max(maxLineWidth, lineWidth);
|
|
217
|
+
}
|
|
218
|
+
renderInfo.lineWidths = lineWidths;
|
|
219
|
+
if (!w) {
|
|
220
|
+
// Auto-set width to max text length.
|
|
221
|
+
width = maxLineWidth + paddingLeft + paddingRight;
|
|
222
|
+
innerWidth = maxLineWidth;
|
|
223
|
+
}
|
|
224
|
+
// If word wrap is enabled the width needs to be the width of the text.
|
|
225
|
+
if (this._settings.wordWrap &&
|
|
226
|
+
w > maxLineWidth &&
|
|
227
|
+
this._settings.textAlign === 'left' &&
|
|
228
|
+
lines.length === 1) {
|
|
229
|
+
width = maxLineWidth + paddingLeft + paddingRight;
|
|
230
|
+
}
|
|
231
|
+
let height;
|
|
232
|
+
if (h) {
|
|
233
|
+
height = h;
|
|
234
|
+
}
|
|
235
|
+
else {
|
|
236
|
+
height = calcHeight(this._settings.textBaseline, fontSize, lineHeight, lines.length, offsetY);
|
|
237
|
+
}
|
|
238
|
+
if (offsetY === null) {
|
|
239
|
+
offsetY = fontSize;
|
|
240
|
+
}
|
|
241
|
+
renderInfo.w = width;
|
|
242
|
+
renderInfo.h = height;
|
|
243
|
+
renderInfo.lines = lines;
|
|
244
|
+
renderInfo.precision = precision;
|
|
245
|
+
if (!width) {
|
|
246
|
+
// To prevent canvas errors.
|
|
247
|
+
width = 1;
|
|
248
|
+
}
|
|
249
|
+
if (!height) {
|
|
250
|
+
// To prevent canvas errors.
|
|
251
|
+
height = 1;
|
|
252
|
+
}
|
|
253
|
+
if (cutSx || cutEx) {
|
|
254
|
+
width = Math.min(width, cutEx - cutSx);
|
|
255
|
+
}
|
|
256
|
+
if (cutSy || cutEy) {
|
|
257
|
+
height = Math.min(height, cutEy - cutSy);
|
|
258
|
+
}
|
|
259
|
+
renderInfo.width = width;
|
|
260
|
+
renderInfo.innerWidth = innerWidth;
|
|
261
|
+
renderInfo.height = height;
|
|
262
|
+
renderInfo.fontSize = fontSize;
|
|
263
|
+
renderInfo.cutSx = cutSx;
|
|
264
|
+
renderInfo.cutSy = cutSy;
|
|
265
|
+
renderInfo.cutEx = cutEx;
|
|
266
|
+
renderInfo.cutEy = cutEy;
|
|
267
|
+
renderInfo.lineHeight = lineHeight;
|
|
268
|
+
renderInfo.defLineHeight = defLineHeight;
|
|
269
|
+
renderInfo.lineWidths = lineWidths;
|
|
270
|
+
renderInfo.offsetY = offsetY;
|
|
271
|
+
renderInfo.paddingLeft = paddingLeft;
|
|
272
|
+
renderInfo.paddingRight = paddingRight;
|
|
273
|
+
renderInfo.letterSpacing = letterSpacing;
|
|
274
|
+
renderInfo.textIndent = textIndent;
|
|
275
|
+
renderInfo.metrics = metrics;
|
|
276
|
+
return renderInfo;
|
|
277
|
+
}
|
|
278
|
+
draw(renderInfo, linesOverride) {
|
|
279
|
+
const precision = this.getPrecision();
|
|
280
|
+
// Allow lines to be overriden for partial rendering.
|
|
281
|
+
const lines = linesOverride?.lines || renderInfo.lines;
|
|
282
|
+
const lineWidths = linesOverride?.lineWidths || renderInfo.lineWidths;
|
|
283
|
+
const height = linesOverride
|
|
284
|
+
? calcHeight(this._settings.textBaseline, renderInfo.fontSize, renderInfo.lineHeight, linesOverride.lines.length, this._settings.offsetY === null
|
|
285
|
+
? null
|
|
286
|
+
: this._settings.offsetY * precision)
|
|
287
|
+
: renderInfo.height;
|
|
288
|
+
// Add extra margin to prevent issue with clipped text when scaling.
|
|
289
|
+
this._canvas.width = Math.min(Math.ceil(renderInfo.width + this._settings.textRenderIssueMargin), MAX_TEXTURE_DIMENSION);
|
|
290
|
+
this._canvas.height = Math.min(Math.ceil(height), MAX_TEXTURE_DIMENSION);
|
|
291
|
+
// Canvas context has been reset.
|
|
292
|
+
this.setFontProperties();
|
|
293
|
+
if (renderInfo.fontSize >= 128) {
|
|
294
|
+
// WpeWebKit bug: must force compositing because cairo-traps-compositor will not work with text first.
|
|
295
|
+
this._context.globalAlpha = 0.01;
|
|
296
|
+
this._context.fillRect(0, 0, 0.01, 0.01);
|
|
297
|
+
this._context.globalAlpha = 1.0;
|
|
298
|
+
}
|
|
299
|
+
if (renderInfo.cutSx || renderInfo.cutSy) {
|
|
300
|
+
this._context.translate(-renderInfo.cutSx, -renderInfo.cutSy);
|
|
301
|
+
}
|
|
302
|
+
let linePositionX;
|
|
303
|
+
let linePositionY;
|
|
304
|
+
const drawLines = [];
|
|
305
|
+
const { metrics } = renderInfo;
|
|
306
|
+
/**
|
|
307
|
+
* Ascender (in pixels)
|
|
308
|
+
*/
|
|
309
|
+
const ascenderPx = metrics
|
|
310
|
+
? metrics.ascender * renderInfo.fontSize
|
|
311
|
+
: renderInfo.fontSize;
|
|
312
|
+
/**
|
|
313
|
+
* Bare line height is the distance between the ascender and descender of the font.
|
|
314
|
+
* without the line gap metric.
|
|
315
|
+
*/
|
|
316
|
+
const bareLineHeightPx = (metrics.ascender - metrics.descender) * renderInfo.fontSize;
|
|
317
|
+
// Draw lines line by line.
|
|
318
|
+
for (let i = 0, n = lines.length; i < n; i++) {
|
|
319
|
+
linePositionX = i === 0 ? renderInfo.textIndent : 0;
|
|
320
|
+
// By default, text is aligned to top
|
|
321
|
+
linePositionY = i * renderInfo.lineHeight + ascenderPx;
|
|
322
|
+
if (this._settings.verticalAlign == 'middle') {
|
|
323
|
+
linePositionY += (renderInfo.lineHeight - bareLineHeightPx) / 2;
|
|
324
|
+
}
|
|
325
|
+
else if (this._settings.verticalAlign == 'bottom') {
|
|
326
|
+
linePositionY += renderInfo.lineHeight - bareLineHeightPx;
|
|
327
|
+
}
|
|
328
|
+
if (this._settings.textAlign === 'right') {
|
|
329
|
+
linePositionX += renderInfo.innerWidth - lineWidths[i];
|
|
330
|
+
}
|
|
331
|
+
else if (this._settings.textAlign === 'center') {
|
|
332
|
+
linePositionX += (renderInfo.innerWidth - lineWidths[i]) / 2;
|
|
333
|
+
}
|
|
334
|
+
linePositionX += renderInfo.paddingLeft;
|
|
335
|
+
drawLines.push({
|
|
336
|
+
text: lines[i],
|
|
337
|
+
x: linePositionX,
|
|
338
|
+
y: linePositionY,
|
|
339
|
+
w: lineWidths[i],
|
|
340
|
+
});
|
|
341
|
+
}
|
|
342
|
+
// Highlight.
|
|
343
|
+
if (this._settings.highlight) {
|
|
344
|
+
const color = this._settings.highlightColor;
|
|
345
|
+
const hlHeight = this._settings.highlightHeight * precision || renderInfo.fontSize * 1.5;
|
|
346
|
+
const offset = this._settings.highlightOffset * precision;
|
|
347
|
+
const hlPaddingLeft = this._settings.highlightPaddingLeft !== null
|
|
348
|
+
? this._settings.highlightPaddingLeft * precision
|
|
349
|
+
: renderInfo.paddingLeft;
|
|
350
|
+
const hlPaddingRight = this._settings.highlightPaddingRight !== null
|
|
351
|
+
? this._settings.highlightPaddingRight * precision
|
|
352
|
+
: renderInfo.paddingRight;
|
|
353
|
+
this._context.fillStyle = getRgbaString(color);
|
|
354
|
+
for (let i = 0; i < drawLines.length; i++) {
|
|
355
|
+
const drawLine = drawLines[i];
|
|
356
|
+
this._context.fillRect(drawLine.x - hlPaddingLeft, drawLine.y - renderInfo.offsetY + offset, drawLine.w + hlPaddingRight + hlPaddingLeft, hlHeight);
|
|
357
|
+
}
|
|
358
|
+
}
|
|
359
|
+
// Text shadow.
|
|
360
|
+
let prevShadowSettings = null;
|
|
361
|
+
if (this._settings.shadow) {
|
|
362
|
+
prevShadowSettings = [
|
|
363
|
+
this._context.shadowColor,
|
|
364
|
+
this._context.shadowOffsetX,
|
|
365
|
+
this._context.shadowOffsetY,
|
|
366
|
+
this._context.shadowBlur,
|
|
367
|
+
];
|
|
368
|
+
this._context.shadowColor = getRgbaString(this._settings.shadowColor);
|
|
369
|
+
this._context.shadowOffsetX = this._settings.shadowOffsetX * precision;
|
|
370
|
+
this._context.shadowOffsetY = this._settings.shadowOffsetY * precision;
|
|
371
|
+
this._context.shadowBlur = this._settings.shadowBlur * precision;
|
|
372
|
+
}
|
|
373
|
+
this._context.fillStyle = getRgbaString(this._settings.textColor);
|
|
374
|
+
for (let i = 0, n = drawLines.length; i < n; i++) {
|
|
375
|
+
const drawLine = drawLines[i];
|
|
376
|
+
if (renderInfo.letterSpacing === 0) {
|
|
377
|
+
this._context.fillText(drawLine.text, drawLine.x, drawLine.y);
|
|
378
|
+
}
|
|
379
|
+
else {
|
|
380
|
+
const textSplit = drawLine.text.split('');
|
|
381
|
+
let x = drawLine.x;
|
|
382
|
+
for (let i = 0, j = textSplit.length; i < j; i++) {
|
|
383
|
+
this._context.fillText(textSplit[i], x, drawLine.y);
|
|
384
|
+
x += this.measureText(textSplit[i], renderInfo.letterSpacing);
|
|
385
|
+
}
|
|
386
|
+
}
|
|
387
|
+
}
|
|
388
|
+
if (prevShadowSettings) {
|
|
389
|
+
this._context.shadowColor = prevShadowSettings[0];
|
|
390
|
+
this._context.shadowOffsetX = prevShadowSettings[1];
|
|
391
|
+
this._context.shadowOffsetY = prevShadowSettings[2];
|
|
392
|
+
this._context.shadowBlur = prevShadowSettings[3];
|
|
393
|
+
}
|
|
394
|
+
if (renderInfo.cutSx || renderInfo.cutSy) {
|
|
395
|
+
this._context.translate(renderInfo.cutSx, renderInfo.cutSy);
|
|
396
|
+
}
|
|
397
|
+
}
|
|
398
|
+
wrapWord(word, wordWrapWidth, suffix) {
|
|
399
|
+
const suffixWidth = this._context.measureText(suffix).width;
|
|
400
|
+
const wordLen = word.length;
|
|
401
|
+
const wordWidth = this._context.measureText(word).width;
|
|
402
|
+
/* If word fits wrapWidth, do nothing */
|
|
403
|
+
if (wordWidth <= wordWrapWidth) {
|
|
404
|
+
return word;
|
|
405
|
+
}
|
|
406
|
+
/* Make initial guess for text cuttoff */
|
|
407
|
+
let cutoffIndex = Math.floor((wordWrapWidth * wordLen) / wordWidth);
|
|
408
|
+
let truncWordWidth = this._context.measureText(word.substring(0, cutoffIndex)).width +
|
|
409
|
+
suffixWidth;
|
|
410
|
+
/* In case guess was overestimated, shrink it letter by letter. */
|
|
411
|
+
if (truncWordWidth > wordWrapWidth) {
|
|
412
|
+
while (cutoffIndex > 0) {
|
|
413
|
+
truncWordWidth =
|
|
414
|
+
this._context.measureText(word.substring(0, cutoffIndex)).width +
|
|
415
|
+
suffixWidth;
|
|
416
|
+
if (truncWordWidth > wordWrapWidth) {
|
|
417
|
+
cutoffIndex -= 1;
|
|
418
|
+
}
|
|
419
|
+
else {
|
|
420
|
+
break;
|
|
421
|
+
}
|
|
422
|
+
}
|
|
423
|
+
/* In case guess was underestimated, extend it letter by letter. */
|
|
424
|
+
}
|
|
425
|
+
else {
|
|
426
|
+
while (cutoffIndex < wordLen) {
|
|
427
|
+
truncWordWidth =
|
|
428
|
+
this._context.measureText(word.substring(0, cutoffIndex)).width +
|
|
429
|
+
suffixWidth;
|
|
430
|
+
if (truncWordWidth < wordWrapWidth) {
|
|
431
|
+
cutoffIndex += 1;
|
|
432
|
+
}
|
|
433
|
+
else {
|
|
434
|
+
// Finally, when bound is crossed, retract last letter.
|
|
435
|
+
cutoffIndex -= 1;
|
|
436
|
+
break;
|
|
437
|
+
}
|
|
438
|
+
}
|
|
439
|
+
}
|
|
440
|
+
/* If wrapWidth is too short to even contain suffix alone, return empty string */
|
|
441
|
+
return (word.substring(0, cutoffIndex) +
|
|
442
|
+
(wordWrapWidth >= suffixWidth ? suffix : ''));
|
|
443
|
+
}
|
|
444
|
+
/**
|
|
445
|
+
* Applies newlines to a string to have it optimally fit into the horizontal
|
|
446
|
+
* bounds set by the Text object's wordWrapWidth property.
|
|
447
|
+
*/
|
|
448
|
+
wrapText(text, wordWrapWidth, letterSpacing, indent = 0) {
|
|
449
|
+
const spaceRegex = / |\u200B/g; // ZWSP and spaces
|
|
450
|
+
const lines = text.split(/\r?\n/g);
|
|
451
|
+
let allLines = [];
|
|
452
|
+
const realNewlines = [];
|
|
453
|
+
for (let i = 0; i < lines.length; i++) {
|
|
454
|
+
const resultLines = [];
|
|
455
|
+
let result = '';
|
|
456
|
+
let spaceLeft = wordWrapWidth - indent;
|
|
457
|
+
// Split the line into words, considering ZWSP
|
|
458
|
+
const words = lines[i].split(spaceRegex);
|
|
459
|
+
const spaces = lines[i].match(spaceRegex) || [];
|
|
460
|
+
for (let j = 0; j < words.length; j++) {
|
|
461
|
+
const space = spaces[j - 1] || '';
|
|
462
|
+
const word = words[j];
|
|
463
|
+
const wordWidth = this.measureText(word, letterSpacing);
|
|
464
|
+
const wordWidthWithSpace = isZeroWidthSpace(space)
|
|
465
|
+
? wordWidth
|
|
466
|
+
: wordWidth + this.measureText(space, letterSpacing);
|
|
467
|
+
if (j === 0 || wordWidthWithSpace > spaceLeft) {
|
|
468
|
+
if (j > 0) {
|
|
469
|
+
resultLines.push(result);
|
|
470
|
+
result = '';
|
|
471
|
+
}
|
|
472
|
+
result += word;
|
|
473
|
+
spaceLeft = wordWrapWidth - wordWidth - (j === 0 ? indent : 0);
|
|
474
|
+
}
|
|
475
|
+
else {
|
|
476
|
+
spaceLeft -= wordWidthWithSpace;
|
|
477
|
+
result += space + word;
|
|
478
|
+
}
|
|
479
|
+
}
|
|
480
|
+
resultLines.push(result);
|
|
481
|
+
result = '';
|
|
482
|
+
allLines = allLines.concat(resultLines);
|
|
483
|
+
if (i < lines.length - 1) {
|
|
484
|
+
realNewlines.push(allLines.length);
|
|
485
|
+
}
|
|
486
|
+
}
|
|
487
|
+
return { l: allLines, n: realNewlines };
|
|
488
|
+
}
|
|
489
|
+
measureText(word, space = 0) {
|
|
490
|
+
if (!space) {
|
|
491
|
+
return this._context.measureText(word).width;
|
|
492
|
+
}
|
|
493
|
+
// Split word into characters, but skip ZWSP in the width calculation
|
|
494
|
+
return word.split('').reduce((acc, char) => {
|
|
495
|
+
// Check if the character is a zero-width space and skip it
|
|
496
|
+
if (isZeroWidthSpace(char)) {
|
|
497
|
+
return acc;
|
|
498
|
+
}
|
|
499
|
+
return acc + this._context.measureText(char).width + space;
|
|
500
|
+
}, 0);
|
|
501
|
+
}
|
|
502
|
+
mergeDefaults(settings) {
|
|
503
|
+
return {
|
|
504
|
+
text: '',
|
|
505
|
+
w: 0,
|
|
506
|
+
h: 0,
|
|
507
|
+
fontStyle: 'normal',
|
|
508
|
+
fontSize: 40,
|
|
509
|
+
fontFamily: null,
|
|
510
|
+
trFontFace: null,
|
|
511
|
+
wordWrap: true,
|
|
512
|
+
wordWrapWidth: 0,
|
|
513
|
+
wordBreak: false,
|
|
514
|
+
textOverflow: '',
|
|
515
|
+
lineHeight: null,
|
|
516
|
+
textBaseline: 'alphabetic',
|
|
517
|
+
textAlign: 'left',
|
|
518
|
+
verticalAlign: 'top',
|
|
519
|
+
offsetY: null,
|
|
520
|
+
maxLines: 0,
|
|
521
|
+
maxHeight: null,
|
|
522
|
+
overflowSuffix: '...',
|
|
523
|
+
textColor: [1.0, 1.0, 1.0, 1.0],
|
|
524
|
+
paddingLeft: 0,
|
|
525
|
+
paddingRight: 0,
|
|
526
|
+
shadow: false,
|
|
527
|
+
shadowColor: [0.0, 0.0, 0.0, 1.0],
|
|
528
|
+
shadowOffsetX: 0,
|
|
529
|
+
shadowOffsetY: 0,
|
|
530
|
+
shadowBlur: 5,
|
|
531
|
+
highlight: false,
|
|
532
|
+
highlightHeight: 0,
|
|
533
|
+
highlightColor: [0.0, 0.0, 0.0, 1.0],
|
|
534
|
+
highlightOffset: 0,
|
|
535
|
+
highlightPaddingLeft: 0,
|
|
536
|
+
highlightPaddingRight: 0,
|
|
537
|
+
letterSpacing: 0,
|
|
538
|
+
textIndent: 0,
|
|
539
|
+
cutSx: 0,
|
|
540
|
+
cutEx: 0,
|
|
541
|
+
cutSy: 0,
|
|
542
|
+
cutEy: 0,
|
|
543
|
+
advancedRenderer: false,
|
|
544
|
+
fontBaselineRatio: 0,
|
|
545
|
+
precision: 1,
|
|
546
|
+
textRenderIssueMargin: 0,
|
|
547
|
+
...settings,
|
|
548
|
+
};
|
|
549
|
+
}
|
|
550
|
+
}
|
|
551
|
+
//# sourceMappingURL=LightningTextTextureRenderer.js.map
|