Skip to content

Commit 415f35b

Browse files
Mugen87Mugen87
authored
Examples: More usage of template strings. (#21816)
1 parent 06f8631 commit 415f35b

File tree

13 files changed

+305
-306
lines changed

13 files changed

+305
-306
lines changed

‎examples/jsm/nodes/accessors/CameraNode.js‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -203,23 +203,23 @@ class CameraNode extends TempNode {
203203

204204
CameraNode.Nodes = ( function () {
205205

206-
const depthColor = new FunctionNode( [
207-
'float depthColor( float mNear, float mFar ) {',
206+
const depthColor = new FunctionNode( /* glsl */`
207+
float depthColor( float mNear, float mFar ) {
208208
209-
' #ifdef USE_LOGDEPTHBUF_EXT',
209+
#ifdef USE_LOGDEPTHBUF_EXT
210210
211-
' float depth = gl_FragDepthEXT / gl_FragCoord.w;',
211+
float depth = gl_FragDepthEXT / gl_FragCoord.w;
212212
213-
' #else',
213+
#else
214214
215-
' float depth = gl_FragCoord.z / gl_FragCoord.w;',
215+
float depth = gl_FragCoord.z / gl_FragCoord.w;
216216
217-
' #endif',
217+
#endif
218218
219-
' return 1.0 - smoothstep( mNear, mFar, depth );',
219+
return 1.0 - smoothstep( mNear, mFar, depth );
220220
221-
'}'
222-
].join( '\n' ) );
221+
}`
222+
);
223223

224224
return {
225225
depthColor: depthColor

‎examples/jsm/nodes/core/NodeBuilder.js‎

Lines changed: 14 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -75,29 +75,27 @@ class NodeBuilder {
7575

7676
this.attributes = {};
7777

78-
this.prefixCode = [
79-
'#ifdef TEXTURE_LOD_EXT',
78+
this.prefixCode = /* glsl */`
79+
#ifdef TEXTURE_LOD_EXT
8080
81-
' #define texCube(a, b) textureCube(a, b)',
82-
' #define texCubeBias(a, b, c) textureCubeLodEXT(a, b, c)',
81+
#define texCube(a, b) textureCube(a, b)
82+
#define texCubeBias(a, b, c) textureCubeLodEXT(a, b, c)
8383
84-
' #define tex2D(a, b) texture2D(a, b)',
85-
' #define tex2DBias(a, b, c) texture2DLodEXT(a, b, c)',
84+
#define tex2D(a, b) texture2D(a, b)
85+
#define tex2DBias(a, b, c) texture2DLodEXT(a, b, c)
8686
87-
'#else',
87+
#else
8888
89-
' #define texCube(a, b) textureCube(a, b)',
90-
' #define texCubeBias(a, b, c) textureCube(a, b, c)',
89+
#define texCube(a, b) textureCube(a, b)
90+
#define texCubeBias(a, b, c) textureCube(a, b, c)
9191
92-
' #define tex2D(a, b) texture2D(a, b)',
93-
' #define tex2DBias(a, b, c) texture2D(a, b, c)',
92+
#define tex2D(a, b) texture2D(a, b)
93+
#define tex2DBias(a, b, c) texture2D(a, b, c)
9494
95-
'#endif',
95+
#endif
9696
97-
'#include <packing>',
98-
'#include <common>'
99-
100-
].join( '\n' );
97+
#include <packing>
98+
#include <common>`;
10199

102100
this.parsCode = {
103101
vertex: '',

‎examples/jsm/nodes/effects/BlurNode.js‎

Lines changed: 31 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -126,37 +126,37 @@ class BlurNode extends TempNode {
126126

127127
BlurNode.Nodes = ( function () {
128128

129-
const blurX = new FunctionNode( [
130-
'vec4 blurX( sampler2D tex, vec2 uv, float s ) {',
131-
' vec4 sum = vec4( 0.0 );',
132-
' sum += texture2D( tex, vec2( uv.x - 4.0 * s, uv.y ) ) * 0.051;',
133-
' sum += texture2D( tex, vec2( uv.x - 3.0 * s, uv.y ) ) * 0.0918;',
134-
' sum += texture2D( tex, vec2( uv.x - 2.0 * s, uv.y ) ) * 0.12245;',
135-
' sum += texture2D( tex, vec2( uv.x - 1.0 * s, uv.y ) ) * 0.1531;',
136-
' sum += texture2D( tex, vec2( uv.x, uv.y ) ) * 0.1633;',
137-
' sum += texture2D( tex, vec2( uv.x + 1.0 * s, uv.y ) ) * 0.1531;',
138-
' sum += texture2D( tex, vec2( uv.x + 2.0 * s, uv.y ) ) * 0.12245;',
139-
' sum += texture2D( tex, vec2( uv.x + 3.0 * s, uv.y ) ) * 0.0918;',
140-
' sum += texture2D( tex, vec2( uv.x + 4.0 * s, uv.y ) ) * 0.051;',
141-
' return sum * .667;',
142-
'}'
143-
].join( '\n' ) );
144-
145-
const blurY = new FunctionNode( [
146-
'vec4 blurY( sampler2D tex, vec2 uv, float s ) {',
147-
' vec4 sum = vec4( 0.0 );',
148-
' sum += texture2D( tex, vec2( uv.x, uv.y - 4.0 * s ) ) * 0.051;',
149-
' sum += texture2D( tex, vec2( uv.x, uv.y - 3.0 * s ) ) * 0.0918;',
150-
' sum += texture2D( tex, vec2( uv.x, uv.y - 2.0 * s ) ) * 0.12245;',
151-
' sum += texture2D( tex, vec2( uv.x, uv.y - 1.0 * s ) ) * 0.1531;',
152-
' sum += texture2D( tex, vec2( uv.x, uv.y ) ) * 0.1633;',
153-
' sum += texture2D( tex, vec2( uv.x, uv.y + 1.0 * s ) ) * 0.1531;',
154-
' sum += texture2D( tex, vec2( uv.x, uv.y + 2.0 * s ) ) * 0.12245;',
155-
' sum += texture2D( tex, vec2( uv.x, uv.y + 3.0 * s ) ) * 0.0918;',
156-
' sum += texture2D( tex, vec2( uv.x, uv.y + 4.0 * s ) ) * 0.051;',
157-
' return sum * .667;',
158-
'}'
159-
].join( '\n' ) );
129+
const blurX = new FunctionNode( /* glsl */`
130+
vec4 blurX( sampler2D tex, vec2 uv, float s ) {
131+
vec4 sum = vec4( 0.0 );
132+
sum += texture2D( tex, vec2( uv.x - 4.0 * s, uv.y ) ) * 0.051;
133+
sum += texture2D( tex, vec2( uv.x - 3.0 * s, uv.y ) ) * 0.0918;
134+
sum += texture2D( tex, vec2( uv.x - 2.0 * s, uv.y ) ) * 0.12245;
135+
sum += texture2D( tex, vec2( uv.x - 1.0 * s, uv.y ) ) * 0.1531;
136+
sum += texture2D( tex, vec2( uv.x, uv.y ) ) * 0.1633;
137+
sum += texture2D( tex, vec2( uv.x + 1.0 * s, uv.y ) ) * 0.1531;
138+
sum += texture2D( tex, vec2( uv.x + 2.0 * s, uv.y ) ) * 0.12245;
139+
sum += texture2D( tex, vec2( uv.x + 3.0 * s, uv.y ) ) * 0.0918;
140+
sum += texture2D( tex, vec2( uv.x + 4.0 * s, uv.y ) ) * 0.051;
141+
return sum * .667;
142+
}`
143+
);
144+
145+
const blurY = new FunctionNode( /* glsl */`
146+
vec4 blurY( sampler2D tex, vec2 uv, float s ) {
147+
vec4 sum = vec4( 0.0 );
148+
sum += texture2D( tex, vec2( uv.x, uv.y - 4.0 * s ) ) * 0.051;
149+
sum += texture2D( tex, vec2( uv.x, uv.y - 3.0 * s ) ) * 0.0918;
150+
sum += texture2D( tex, vec2( uv.x, uv.y - 2.0 * s ) ) * 0.12245;
151+
sum += texture2D( tex, vec2( uv.x, uv.y - 1.0 * s ) ) * 0.1531;
152+
sum += texture2D( tex, vec2( uv.x, uv.y ) ) * 0.1633;
153+
sum += texture2D( tex, vec2( uv.x, uv.y + 1.0 * s ) ) * 0.1531;
154+
sum += texture2D( tex, vec2( uv.x, uv.y + 2.0 * s ) ) * 0.12245;
155+
sum += texture2D( tex, vec2( uv.x, uv.y + 3.0 * s ) ) * 0.0918;
156+
sum += texture2D( tex, vec2( uv.x, uv.y + 4.0 * s ) ) * 0.051;
157+
return sum * .667;
158+
}`
159+
);
160160

161161
return {
162162
blurX: blurX,

‎examples/jsm/nodes/effects/ColorAdjustmentNode.js‎

Lines changed: 29 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -76,46 +76,49 @@ class ColorAdjustmentNode extends TempNode {
7676

7777
ColorAdjustmentNode.Nodes = ( function () {
7878

79-
const hue = new FunctionNode( [
80-
'vec3 hue(vec3 rgb, float adjustment) {',
79+
const hue = new FunctionNode( /* glsl */`
80+
vec3 hue(vec3 rgb, float adjustment) {
8181
82-
' const mat3 RGBtoYIQ = mat3(0.299, 0.587, 0.114, 0.595716, -0.274453, -0.321263, 0.211456, -0.522591, 0.311135);',
83-
' const mat3 YIQtoRGB = mat3(1.0, 0.9563, 0.6210, 1.0, -0.2721, -0.6474, 1.0, -1.107, 1.7046);',
82+
const mat3 RGBtoYIQ = mat3(0.299, 0.587, 0.114, 0.595716, -0.274453, -0.321263, 0.211456, -0.522591, 0.311135);
83+
const mat3 YIQtoRGB = mat3(1.0, 0.9563, 0.6210, 1.0, -0.2721, -0.6474, 1.0, -1.107, 1.7046);
8484
85-
' vec3 yiq = RGBtoYIQ * rgb;',
85+
vec3 yiq = RGBtoYIQ * rgb;
8686
87-
' float hue = atan(yiq.z, yiq.y) + adjustment;',
88-
' float chroma = sqrt(yiq.z * yiq.z + yiq.y * yiq.y);',
87+
float hue = atan(yiq.z, yiq.y) + adjustment;
88+
float chroma = sqrt(yiq.z * yiq.z + yiq.y * yiq.y);
8989
90-
' return YIQtoRGB * vec3(yiq.x, chroma * cos(hue), chroma * sin(hue));',
90+
return YIQtoRGB * vec3(yiq.x, chroma * cos(hue), chroma * sin(hue));
9191
92-
'}'
93-
].join( '\n' ) );
92+
}`
93+
);
9494

95-
const saturation = new FunctionNode( [
96-
// Algorithm from Chapter 16 of OpenGL Shading Language
97-
'vec3 saturation(vec3 rgb, float adjustment) {',
95+
// Algorithm from Chapter 16 of OpenGL Shading Language
9896

99-
' vec3 intensity = vec3( luminance( rgb ) );',
97+
const saturation = new FunctionNode( /* glsl */`
98+
vec3 saturation(vec3 rgb, float adjustment) {
10099
101-
' return mix( intensity, rgb, adjustment );',
100+
vec3 intensity = vec3( luminance( rgb ) );
102101
103-
'}'
104-
].join( '\n' ), [ LuminanceNode.Nodes.luminance ] ); // include LuminanceNode function
102+
return mix( intensity, rgb, adjustment );
105103
106-
const vibrance = new FunctionNode( [
107-
// Shader by Evan Wallace adapted by @lo-th
108-
'vec3 vibrance(vec3 rgb, float adjustment) {',
104+
}`
105+
, [ LuminanceNode.Nodes.luminance ] ); // include LuminanceNode function
109106

110-
' float average = (rgb.r + rgb.g + rgb.b) / 3.0;',
107+
// Shader by Evan Wallace adapted by @lo-th
111108

112-
' float mx = max(rgb.r, max(rgb.g, rgb.b));',
113-
' float amt = (mx - average) * (-3.0 * adjustment);',
109+
const vibrance = new FunctionNode( /* glsl */`
114110
115-
' return mix(rgb.rgb, vec3(mx), amt);',
111+
vec3 vibrance(vec3 rgb, float adjustment) {
116112
117-
'}'
118-
].join( '\n' ) );
113+
float average = (rgb.r + rgb.g + rgb.b) / 3.0;
114+
115+
float mx = max(rgb.r, max(rgb.g, rgb.b));
116+
float amt = (mx - average) * (-3.0 * adjustment);
117+
118+
return mix(rgb.rgb, vec3(mx), amt);
119+
120+
}`
121+
);
119122

120123
return {
121124
hue: hue,

‎examples/jsm/nodes/effects/LuminanceNode.js‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -52,14 +52,16 @@ LuminanceNode.Nodes = ( function () {
5252

5353
const LUMA = new ConstNode( 'vec3 LUMA vec3( 0.2125, 0.7154, 0.0721 )' );
5454

55-
const luminance = new FunctionNode( [
56-
// Algorithm from Chapter 10 of Graphics Shaders
57-
'float luminance( vec3 rgb ) {',
55+
// Algorithm from Chapter 10 of Graphics Shaders
5856

59-
' return dot( rgb, LUMA );',
57+
const luminance = new FunctionNode( /* glsl */`
6058
61-
'}'
62-
].join( '\n' ), [ LUMA ] );
59+
float luminance( vec3 rgb ) {
60+
61+
return dot( rgb, LUMA );
62+
63+
}`
64+
, [ LUMA ] );
6365

6466
return {
6567
LUMA: LUMA,

‎examples/jsm/nodes/materials/nodes/BasicNode.js‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -19,15 +19,15 @@ class BasicNode extends Node {
1919

2020
const position = this.position ? this.position.analyzeAndFlow( builder, 'v3', { cache: 'position' } ) : undefined;
2121

22-
builder.addParsCode( [
23-
'varying vec3 vViewPosition;',
22+
builder.addParsCode( /* glsl */`
23+
varying vec3 vViewPosition;
2424
25-
'#ifndef FLAT_SHADED',
25+
#ifndef FLAT_SHADED
2626
27-
' varying vec3 vNormal;',
27+
varying vec3 vNormal;
2828
29-
'#endif',
30-
].join( '\n' ) );
29+
#endif`
30+
);
3131

3232
const output = [
3333
'#include <beginnormal_vertex>',
@@ -82,15 +82,15 @@ class BasicNode extends Node {
8282

8383
builder.requires.transparent = alpha !== undefined;
8484

85-
builder.addParsCode( [
86-
'varying vec3 vViewPosition;',
85+
builder.addParsCode( /* glsl */`
86+
varying vec3 vViewPosition;
8787
88-
'#ifndef FLAT_SHADED',
88+
#ifndef FLAT_SHADED
8989
90-
' varying vec3 vNormal;',
90+
varying vec3 vNormal;
9191
92-
'#endif',
93-
].join( '\n' ) );
92+
#endif`
93+
);
9494

9595
const output = [
9696
// add before: prevent undeclared normal

‎examples/jsm/nodes/materials/nodes/PhongNode.js‎

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -38,23 +38,23 @@ class PhongNode extends Node {
3838

3939
] ) );
4040

41-
builder.addParsCode( [
42-
'varying vec3 vViewPosition;',
41+
builder.addParsCode( /* glsl */`
42+
varying vec3 vViewPosition;
4343
44-
'#ifndef FLAT_SHADED',
44+
#ifndef FLAT_SHADED
4545
46-
' varying vec3 vNormal;',
46+
varying vec3 vNormal;
4747
48-
'#endif',
48+
#endif
4949
50-
//"#include <encodings_pars_fragment>", // encoding functions
51-
'#include <fog_pars_vertex>',
52-
'#include <morphtarget_pars_vertex>',
53-
'#include <skinning_pars_vertex>',
54-
'#include <shadowmap_pars_vertex>',
55-
'#include <logdepthbuf_pars_vertex>',
56-
'#include <clipping_planes_pars_vertex>'
57-
].join( '\n' ) );
50+
//"#include <encodings_pars_fragment> // encoding functions
51+
#include <fog_pars_vertex>
52+
#include <morphtarget_pars_vertex>
53+
#include <skinning_pars_vertex>
54+
#include <shadowmap_pars_vertex>
55+
#include <logdepthbuf_pars_vertex>
56+
#include <clipping_planes_pars_vertex>`
57+
);
5858

5959
const output = [
6060
'#include <beginnormal_vertex>',
@@ -146,14 +146,14 @@ class PhongNode extends Node {
146146

147147
builder.requires.transparent = alpha !== undefined;
148148

149-
builder.addParsCode( [
150-
'#include <fog_pars_fragment>',
151-
'#include <bsdfs>',
152-
'#include <lights_pars_begin>',
153-
'#include <lights_phong_pars_fragment>',
154-
'#include <shadowmap_pars_fragment>',
155-
'#include <logdepthbuf_pars_fragment>'
156-
].join( '\n' ) );
149+
builder.addParsCode( /* glsl */`
150+
#include <fog_pars_fragment>
151+
#include <bsdfs>
152+
#include <lights_pars_begin>
153+
#include <lights_phong_pars_fragment>
154+
#include <shadowmap_pars_fragment>
155+
#include <logdepthbuf_pars_fragment>`
156+
);
157157

158158
const output = [
159159
// prevent undeclared normal

‎examples/jsm/nodes/materials/nodes/SpriteNode.js‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -34,11 +34,11 @@ class SpriteNode extends Node {
3434
UniformsLib.fog
3535
] ) );
3636

37-
builder.addParsCode( [
38-
'#include <fog_pars_vertex>',
39-
'#include <logdepthbuf_pars_vertex>',
40-
'#include <clipping_planes_pars_vertex>'
41-
].join( '\n' ) );
37+
builder.addParsCode( /* glsl */`
38+
#include <fog_pars_vertex>
39+
#include <logdepthbuf_pars_vertex>
40+
#include <clipping_planes_pars_vertex>`
41+
);
4242

4343
output = [
4444
'#include <clipping_planes_fragment>',
@@ -109,16 +109,16 @@ class SpriteNode extends Node {
109109

110110
} else {
111111

112-
builder.addParsCode( [
113-
'#include <fog_pars_fragment>',
114-
'#include <logdepthbuf_pars_fragment>',
115-
'#include <clipping_planes_pars_fragment>'
116-
].join( '\n' ) );
112+
builder.addParsCode( /* glsl */`
113+
#include <fog_pars_fragment>
114+
#include <logdepthbuf_pars_fragment>
115+
#include <clipping_planes_pars_fragment>`
116+
);
117117

118-
builder.addCode( [
119-
'#include <clipping_planes_fragment>',
120-
'#include <logdepthbuf_fragment>'
121-
].join( '\n' ) );
118+
builder.addCode( /* glsl */`
119+
#include <clipping_planes_fragment>
120+
#include <logdepthbuf_fragment>`
121+
);
122122

123123
// analyze all nodes to reuse generate codes
124124

0 commit comments

Comments
 (0)