Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit acdeb7f

Browse files
author
takuma-hmng8
committed
fix onBeforeCompile
1 parent 00fbf6b commit acdeb7f

File tree

13 files changed

+89
-27
lines changed

13 files changed

+89
-27
lines changed

‎.storybook/stories/UseBlank.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export const UseBlank = (args: BlankParams) => {
2727
dpr: dpr,
2828
onBeforeCompile: React.useCallback((shader: THREE.Shader) => {
2929
shader.fragmentShader = shader.fragmentShader.replace(
30-
"//#usf main",
30+
"#usf main",
3131
`float t=uTime,c;vec2 z,n=vec2(cos(t),sin(t));z=vUv*2.-1.;for(int i=0;i<12;i++){if(dot(z,z)>8.)discard;z=vec2(z.x*z.x-z.y*z.y,z.x*z.y)+n;}c=cos(length(z)+log(length(z)));usf_FragColor=vec4(vec3(c),1.);`
3232
);
3333
}, []),

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -544,11 +544,11 @@ const [updateBlank, _, { output: blank, material }] = useBlank({
544544
},
545545
onBeforeCompile: useCallback((shader: THREE.Shader) => {
546546
shader.fragmentShader = shader.fragmentShader.replace(
547-
"//#usf uniforms",
547+
"#usf uniforms",
548548
"uniform float hoge;"
549549
);
550550
shader.fragmentShader = shader.fragmentShader.replace(
551-
"//#usf main",
551+
"#usf main",
552552
`usf_FragColor=vec4(vec3(1.,hoge,1.),1.);`
553553
);
554554
}, []),

‎app/expo2025/Playground.tsx‎

Lines changed: 42 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
import { FxMaterial } from "./FxMaterial";
1212
import GUI from "lil-gui";
1313
import { useGUI } from "@/utils/useGUI";
14-
import { Environment } from "@react-three/drei";
14+
import { Environment,Lightformer } from "@react-three/drei";
1515

1616
extend({ FxMaterial });
1717

@@ -121,7 +121,47 @@ export const Playground = () => {
121121

122122
return (
123123
<mesh>
124-
<Environment preset="warehouse" />
124+
{/* <Environment preset="warehouse" /> */}
125+
<ambientLight intensity={0.4} />
126+
<spotLight
127+
position={[10, 10, 10]}
128+
angle={0.15}
129+
penumbra={1}
130+
intensity={1}
131+
castShadow
132+
/>
133+
<Environment resolution={256}>
134+
<group rotation={[-Math.PI / 3, 0, 1]}>
135+
<Lightformer
136+
form="circle"
137+
intensity={4}
138+
rotation-x={Math.PI / 2}
139+
position={[0, 5, -9]}
140+
scale={2}
141+
/>
142+
<Lightformer
143+
form="circle"
144+
intensity={2}
145+
rotation-y={Math.PI / 2}
146+
position={[-5, 1, -1]}
147+
scale={2}
148+
/>
149+
<Lightformer
150+
form="circle"
151+
intensity={2}
152+
rotation-y={Math.PI / 2}
153+
position={[-5, -1, -1]}
154+
scale={2}
155+
/>
156+
<Lightformer
157+
form="circle"
158+
intensity={2}
159+
rotation-y={-Math.PI / 2}
160+
position={[10, 1, 0]}
161+
scale={8}
162+
/>
163+
</group>
164+
</Environment>
125165
<MyakuMyaku position={[-6, 0, 0]} scale={[1, 1, 1]} />
126166
<MyakuMyaku
127167
position={[-4, 3.5, 0]}

‎app/useBlank/Playground.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,11 @@ export const Playground = () => {
3030
},
3131
onBeforeCompile: useCallback((shader: THREE.Shader) => {
3232
shader.fragmentShader = shader.fragmentShader.replace(
33-
"//#usf uniforms",
33+
"#usf uniforms",
3434
"uniform float hoge;"
3535
);
3636
shader.fragmentShader = shader.fragmentShader.replace(
37-
"//#usf main",
37+
"#usf main",
3838
`float t=uTime,c;vec2 z,u,n=vec2(cos(t),sin(t));z=vUv*2.-1.;for(int i=0;i<12;i++){if(dot(z,z)>8.)discard;z=vec2(z.x*z.x-z.y*z.y,z.x*z.y)+n;}c=cos(length(z)+log(length(z)));u=vUv;u+=z*hoge;usf_FragColor=vec4(mix(vec3(c),texture2D(uTexture,u).rgb,1.-hoge),1.);`
3939
);
4040
console.log(shader.vertexShader);

‎packages/use-shader-fx/build/use-shader-fx.js‎

Lines changed: 14 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/use-shader-fx/build/use-shader-fx.js.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/use-shader-fx/build/use-shader-fx.umd.cjs‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -916,31 +916,37 @@ void main() {
916916
}`;const Tt=({scene:e,size:n,dpr:t,uniforms:r,onBeforeCompile:o})=>{const m=v.useMemo(()=>new i.PlaneGeometry(2,2),[]),s=v.useMemo(()=>{const g=new i.ShaderMaterial({uniforms:{u_texture:{value:T},u_resolution:{value:new i.Vector2},u_keyColor:{value:X.color},u_similarity:{value:X.similarity},u_smoothness:{value:X.smoothness},u_spill:{value:X.spill},u_color:{value:X.color},u_contrast:{value:X.contrast},u_brightness:{value:X.brightness},u_gamma:{value:X.gamma},...r},vertexShader:_t,fragmentShader:Ct,...z});return o&&(g.onBeforeCompile=o),g},[o,r]),u=N(n,t);A(s)("u_resolution",u.clone());const c=B(e,m,s,i.Mesh);return{material:s,mesh:c}},X=Object.freeze({texture:T,keyColor:new i.Color(65280),similarity:.2,smoothness:.1,spill:.2,color:new i.Vector4(1,1,1,1),contrast:1,brightness:0,gamma:1}),wt=({size:e,dpr:n,samples:t,isSizeUpdate:r,uniforms:o,onBeforeCompile:m})=>{const s=O(n),u=v.useMemo(()=>new i.Scene,[]),{material:c,mesh:g}=Tt({scene:u,size:e,dpr:s.shader,uniforms:o,onBeforeCompile:m}),d=L(e),[x,h]=$({scene:u,camera:d,size:e,dpr:s.fbo,samples:t,isSizeUpdate:r}),[a,f]=k(X),l=A(c),p=V(c);return[v.useCallback((S,b,M)=>{const{gl:_}=S;return b&&f(b),l("u_texture",a.texture),l("u_keyColor",a.keyColor),l("u_similarity",a.similarity),l("u_smoothness",a.smoothness),l("u_spill",a.spill),l("u_color",a.color),l("u_contrast",a.contrast),l("u_brightness",a.brightness),l("u_gamma",a.gamma),p(M),h(_)},[h,l,f,a,p]),f,{scene:u,mesh:g,material:c,camera:d,renderTarget:x,output:x.texture}]};var Rt=`precision highp float;
917917
918918
varying vec2 vUv;
919+
#usf varyings
920+
921+
#usf uniforms
919922
920923
void main() {
921924
vec4 usf_Position = vec4(position,1.);
922925
vUv = uv;
923926
924-
927+
#usf main
925928
926929
gl_Position = usf_Position;
927930
}`,Dt=`precision highp float;
928931
929932
varying vec2 vUv;
933+
#usf varyings
930934
931935
uniform sampler2D uTexture;
932936
uniform sampler2D uBackbuffer;
933937
uniform float uTime;
934938
uniform vec2 uPointer;
935939
uniform vec2 uResolution;
936940
941+
#usf uniforms
942+
937943
void main() {
938944
vec4 usf_FragColor = vec4(1.);
939945
940-
946+
#usf main
941947
942948
gl_FragColor = usf_FragColor;
943-
}`;const At=({scene:e,size:n,dpr:t,uniforms:r,onBeforeCompile:o})=>{const m=v.useMemo(()=>new i.PlaneGeometry(2,2),[]),s=v.useMemo(()=>{const g=new i.ShaderMaterial({uniforms:{uTexture:{value:T},uBackbuffer:{value:T},uTime:{value:0},uPointer:{value:new i.Vector2},uResolution:{value:new i.Vector2},...r},vertexShader:Rt,fragmentShader:Dt,...z});return o&&(g.onBeforeCompile=o),g},[o,r]),u=N(n,t);A(s)("uResolution",u.clone());const c=B(e,m,s,i.Mesh);return{material:s,mesh:c}},Ae=Object.freeze({texture:T,beat:!1}),Pt=({size:e,dpr:n,samples:t,isSizeUpdate:r,uniforms:o,onBeforeCompile:m})=>{const s=O(n),u=v.useMemo(()=>new i.Scene,[]),{material:c,mesh:g}=At({scene:u,size:e,dpr:s.shader,uniforms:o,onBeforeCompile:m}),d=L(e),x=v.useMemo(()=>({scene:u,camera:d,size:e,dpr:s.fbo,samples:t,isSizeUpdate:r}),[u,d,e,s.fbo,t,r]),[h,a]=ne(x),[f,l]=k(Ae),p=A(c),y=V(c);return[v.useCallback((b,M,_)=>{const{gl:w,clock:R,pointer:U}=b;return M&&l(M),p("uTexture",f.texture),p("uPointer",U),p("uTime",f.beat||R.getElapsedTime()),y(_),a(w,({read:F})=>{p("uBackbuffer",F)})},[a,p,l,f,y]),l,{scene:u,mesh:g,material:c,camera:d,renderTarget:h,output:h.read.texture}]},It=({scene:e,geometry:n,material:t})=>{const r=B(e,n,t,i.Points),o=B(e,v.useMemo(()=>n.clone(),[n]),v.useMemo(()=>t.clone(),[t]),i.Mesh);return o.visible=!1,{points:r,interactiveMesh:o}};var Ft=`uniform vec2 uResolution;
949+
}`;const At=({scene:e,size:n,dpr:t,uniforms:r,onBeforeCompile:o})=>{const m=v.useMemo(()=>new i.PlaneGeometry(2,2),[]),s=v.useMemo(()=>{const g=new i.ShaderMaterial({uniforms:{uTexture:{value:T},uBackbuffer:{value:T},uTime:{value:0},uPointer:{value:new i.Vector2},uResolution:{value:new i.Vector2},...r},vertexShader:Rt,fragmentShader:Dt,...z});return g.onBeforeCompile=(d,x)=>{o&&o(d,x),d.fragmentShader=d.fragmentShader.replace(/#usf[^\n]*\n/g,""),d.vertexShader=d.vertexShader.replace(/#usf[^\n]*\n/g,"")},g},[o,r]),u=N(n,t);A(s)("uResolution",u.clone());const c=B(e,m,s,i.Mesh);return{material:s,mesh:c}},Ae=Object.freeze({texture:T,beat:!1}),Pt=({size:e,dpr:n,samples:t,isSizeUpdate:r,uniforms:o,onBeforeCompile:m})=>{const s=O(n),u=v.useMemo(()=>new i.Scene,[]),{material:c,mesh:g}=At({scene:u,size:e,dpr:s.shader,uniforms:o,onBeforeCompile:m}),d=L(e),x=v.useMemo(()=>({scene:u,camera:d,size:e,dpr:s.fbo,samples:t,isSizeUpdate:r}),[u,d,e,s.fbo,t,r]),[h,a]=ne(x),[f,l]=k(Ae),p=A(c),y=V(c);return[v.useCallback((b,M,_)=>{const{gl:w,clock:R,pointer:U}=b;return M&&l(M),p("uTexture",f.texture),p("uPointer",U),p("uTime",f.beat||R.getElapsedTime()),y(_),a(w,({read:F})=>{p("uBackbuffer",F)})},[a,p,l,f,y]),l,{scene:u,mesh:g,material:c,camera:d,renderTarget:h,output:h.read.texture}]},It=({scene:e,geometry:n,material:t})=>{const r=B(e,n,t,i.Points),o=B(e,v.useMemo(()=>n.clone(),[n]),v.useMemo(()=>t.clone(),[t]),i.Mesh);return o.visible=!1,{points:r,interactiveMesh:o}};var Ft=`uniform vec2 uResolution;
944950
uniform float uMorphProgress;
945951
uniform float uPointSize;
946952

‎packages/use-shader-fx/build/use-shader-fx.umd.cjs.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/use-shader-fx/package-lock.json‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/use-shader-fx/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@funtech-inc/use-shader-fx",
3-
"version": "1.1.22",
3+
"version": "1.1.23",
44
"description": "⚡️ More FXs, Less GLSL",
55
"main": "./build/use-shader-fx.umd.cjs",
66
"module": "./build/use-shader-fx.js",

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /