006: add note
This commit is contained in:
parent
c2db0d5f37
commit
4f291f4f50
11 changed files with 28 additions and 4217 deletions
|
@ -1,74 +1 @@
|
||||||
import {
|
import{a as N,b as U} from"../chunk-13ea4b456137d650.js";import{d as k,e as I,f as J,g as c,h as S,i as R,j as p,k as q,m as Y,n as w,o as f} from"../chunk-0ef35489d83e6289.js";var s=new k({colors:null,faces:new Uint8Array([0,1,2,1,0,3,0,2,4,0,4,5,0,5,3,1,3,6,2,1,7,4,2,8,9,10,11,12,9,13,1,6,7,2,7,8,10,8,11,9,11,13,12,13,6,7,6,14,8,7,14,11,8,14,13,11,14,6,13,14,15,16,17,17,16,18,19,20,21,18,16,22,22,16,15,23,24,25]),name:"src/meshes/trianglething/trianglething.ply",normals:new Float32Array([0,-1,0.00000083803394,-0.5257306,-0.44721383,0.723607,-0.8506533,-0.44721213,-0.2763879,0.5257306,-0.4472139,0.723607,0,-0.44721153,-0.89442825,0.8506533,-0.4472122,-0.27638793,0,0.44721153,0.89442825,-0.8506533,0.44721216,0.27638793,-0.5257306,0.4472139,-0.72360694,0.8506533,-0.4472122,-0.27638793,0,-0.44721153,-0.89442825,0.5257306,0.4472139,-0.72360694,0.5257306,-0.4472139,0.723607,0.85065323,0.4472122,0.2763879,0,1,-0.0000008165459,0.8999471,-0.43599886,0.00000024163015,-0.00000005150958,1,0,-0.000000030203772,-0.4359989,0.8999472,-0.8999471,-0.4359989,-0.00000024291313,-0.000000030203772,-0.4359989,0.8999472,0,-0.43599886,-0.8999471,0.8999471,-0.43599886,0.00000024163015,0,-0.43599886,-0.8999471,-0.000000030203772,-0.4359989,0.8999472,-0.8999471,-0.4359989,-0.00000024291313,0,-0.43599886,-0.8999471]),positions:new Float32Array([0,2.6090002,0,-0.36800402,2.9959497,0.50652003,-0.5954481,2.9959497,-0.19346952,0.36800402,2.9959497,0.50652003,0,2.9959497,-0.62609756,0.5954481,2.9959497,-0.19346952,0,3.6220508,0.62609756,-0.5954481,3.6220508,0.19346952,-0.36800402,3.6220508,-0.50652003,0.5954481,2.9959497,-0.19346952,0,2.9959497,-0.62609756,0.36800402,3.6220508,-0.50652003,0.36800402,2.9959497,0.50652003,0.5954481,3.6220508,0.19346952,0,4.0090003,0,1.0000001,0,0,0,2.5000002,0,-0.000000043711395,0,1.0000001,-1.0000001,0,-0.00000008742279,-0.000000043711395,0,1.0000001,0.000000011924882,0,-1.0000001,1.0000001,0,0,0.000000011924882,0,-1.0000001,-0.000000043711395,0,1.0000001,-1.0000001,0,-0.00000008742279,0.000000011924882,0,-1.0000001]),uvs:new Float32Array([0.7660872,0.5526656,0.6449925,0.52286637,0.8418907,0.33128682,0.60803074,0.79587877,0.96344936,0.40123126,0.8416727,0.64077806,0.50600564,0.49428308,0.704352,0.31297976,0.79145527,0.046412975,0.35179207,0.26814616,0.47356877,0.028599411,0.5382167,0.15491244,0.118150145,0.42324704,0.40614995,0.39580685,0.5992601,0.26365823,0.4984935,0.5027367,0.24900003,0.7522302,-0.00049349666,0.50273675,-0.00049346685,1.0017238,0.7633698,0.99398905,0.99752307,0.7598357,0.9975231,0.99398893,0.49849355,1.0017238,0.99646366,0.7612665,0.99646366,0.9954198,0.7623104,0.9954198]),vertexCount:26});var V="../texture0-577d5216cdab32bc.png";var g="../texture1-e472a46c91711e86.png";var Q={attributes:{vertex:"a_vertex",uv0:"a_uv0",normal:"a_normal",vertexColor:"a_vertex_color"},uniforms:{view:"u_view",projection:"u_projection",objectToWorld:"u_object_to_world",objectToWorldInv:"u_object_to_world_inv",light0:"u_light_0",light0Color:"u_light_0_color",time:"u_time",albedo:"u_albedo",texture0:"u_texture_0",texture1:"u_texture_1",texture2:"u_texture_2"}},W=(b)=>new p(Q).vertex(U).fragment(q).app(b);var B=new f({fov:45}),X=new J([2,3,3],c([-15,40,0])),l=new J([2,2,0]),a=new J(S(0),c([0,0,0])),L=new J([-3,0,1],c([0,0,0])),F=new N(B,V),y=new N(B,g);B.onUpdate(()=>{I.rotateY(a.rotation,a.rotation,0.001),I.rotateY(L.rotation,L.rotation,0.001)});new w(B,a,new R(B,s,W(B).addTexture("texture0",F).addTexture("texture1",y),X,l).configure({}));new w(B,L,new R(B,s,Y(B).addTexture("texture0",F).addTexture("texture1",y),X,l).configure({}));B.start();
|
||||||
Texture,
|
|
||||||
basic_vertex_rounding_default
|
|
||||||
} from "../chunk-701c22b55952babe.js";
|
|
||||||
import {
|
|
||||||
Mesh,
|
|
||||||
MeshRenderer,
|
|
||||||
Renderable,
|
|
||||||
Shader,
|
|
||||||
Transform,
|
|
||||||
WebGLApp,
|
|
||||||
basic,
|
|
||||||
basic_default,
|
|
||||||
etoq,
|
|
||||||
exports_quat,
|
|
||||||
v3
|
|
||||||
} from "../chunk-652b721da622b7d9.js";
|
|
||||||
|
|
||||||
// src/meshes/trianglething/trianglething.ts
|
|
||||||
var trianglething_default = new Mesh({
|
|
||||||
colors: null,
|
|
||||||
faces: new Uint8Array([0, 1, 2, 1, 0, 3, 0, 2, 4, 0, 4, 5, 0, 5, 3, 1, 3, 6, 2, 1, 7, 4, 2, 8, 9, 10, 11, 12, 9, 13, 1, 6, 7, 2, 7, 8, 10, 8, 11, 9, 11, 13, 12, 13, 6, 7, 6, 14, 8, 7, 14, 11, 8, 14, 13, 11, 14, 6, 13, 14, 15, 16, 17, 17, 16, 18, 19, 20, 21, 18, 16, 22, 22, 16, 15, 23, 24, 25]),
|
|
||||||
name: "src/meshes/trianglething/trianglething.ply",
|
|
||||||
normals: new Float32Array([0, -1, 0.00000083803394, -0.5257306, -0.44721383, 0.723607, -0.8506533, -0.44721213, -0.2763879, 0.5257306, -0.4472139, 0.723607, 0, -0.44721153, -0.89442825, 0.8506533, -0.4472122, -0.27638793, 0, 0.44721153, 0.89442825, -0.8506533, 0.44721216, 0.27638793, -0.5257306, 0.4472139, -0.72360694, 0.8506533, -0.4472122, -0.27638793, 0, -0.44721153, -0.89442825, 0.5257306, 0.4472139, -0.72360694, 0.5257306, -0.4472139, 0.723607, 0.85065323, 0.4472122, 0.2763879, 0, 1, -0.0000008165459, 0.8999471, -0.43599886, 0.00000024163015, -0.00000005150958, 1, 0, -0.000000030203772, -0.4359989, 0.8999472, -0.8999471, -0.4359989, -0.00000024291313, -0.000000030203772, -0.4359989, 0.8999472, 0, -0.43599886, -0.8999471, 0.8999471, -0.43599886, 0.00000024163015, 0, -0.43599886, -0.8999471, -0.000000030203772, -0.4359989, 0.8999472, -0.8999471, -0.4359989, -0.00000024291313, 0, -0.43599886, -0.8999471]),
|
|
||||||
positions: new Float32Array([0, 2.6090002, 0, -0.36800402, 2.9959497, 0.50652003, -0.5954481, 2.9959497, -0.19346952, 0.36800402, 2.9959497, 0.50652003, 0, 2.9959497, -0.62609756, 0.5954481, 2.9959497, -0.19346952, 0, 3.6220508, 0.62609756, -0.5954481, 3.6220508, 0.19346952, -0.36800402, 3.6220508, -0.50652003, 0.5954481, 2.9959497, -0.19346952, 0, 2.9959497, -0.62609756, 0.36800402, 3.6220508, -0.50652003, 0.36800402, 2.9959497, 0.50652003, 0.5954481, 3.6220508, 0.19346952, 0, 4.0090003, 0, 1.0000001, 0, 0, 0, 2.5000002, 0, -0.000000043711395, 0, 1.0000001, -1.0000001, 0, -0.00000008742279, -0.000000043711395, 0, 1.0000001, 0.000000011924882, 0, -1.0000001, 1.0000001, 0, 0, 0.000000011924882, 0, -1.0000001, -0.000000043711395, 0, 1.0000001, -1.0000001, 0, -0.00000008742279, 0.000000011924882, 0, -1.0000001]),
|
|
||||||
uvs: new Float32Array([0.7660872, 0.5526656, 0.6449925, 0.52286637, 0.8418907, 0.33128682, 0.60803074, 0.79587877, 0.96344936, 0.40123126, 0.8416727, 0.64077806, 0.50600564, 0.49428308, 0.704352, 0.31297976, 0.79145527, 0.046412975, 0.35179207, 0.26814616, 0.47356877, 0.028599411, 0.5382167, 0.15491244, 0.118150145, 0.42324704, 0.40614995, 0.39580685, 0.5992601, 0.26365823, 0.4984935, 0.5027367, 0.24900003, 0.7522302, -0.00049349666, 0.50273675, -0.00049346685, 1.0017238, 0.7633698, 0.99398905, 0.99752307, 0.7598357, 0.9975231, 0.99398893, 0.49849355, 1.0017238, 0.99646366, 0.7612665, 0.99646366, 0.9954198, 0.7623104, 0.9954198]),
|
|
||||||
vertexCount: 26
|
|
||||||
});
|
|
||||||
|
|
||||||
// src/meshes/trianglething/textures/texture0.png
|
|
||||||
var texture0_default = "../texture0-577d5216cdab32bc.png";
|
|
||||||
|
|
||||||
// src/meshes/trianglething/textures/texture1.png
|
|
||||||
var texture1_default = "../texture1-e472a46c91711e86.png";
|
|
||||||
|
|
||||||
// src/common-shaders/basic-vertex-rounding.ts
|
|
||||||
var basicShaderConfig = {
|
|
||||||
attributes: {
|
|
||||||
vertex: "a_vertex",
|
|
||||||
uv0: "a_uv0",
|
|
||||||
normal: "a_normal",
|
|
||||||
vertexColor: "a_vertex_color"
|
|
||||||
},
|
|
||||||
uniforms: {
|
|
||||||
view: "u_view",
|
|
||||||
projection: "u_projection",
|
|
||||||
objectToWorld: "u_object_to_world",
|
|
||||||
objectToWorldInv: "u_object_to_world_inv",
|
|
||||||
light0: "u_light_0",
|
|
||||||
light0Color: "u_light_0_color",
|
|
||||||
time: "u_time",
|
|
||||||
albedo: "u_albedo",
|
|
||||||
texture0: "u_texture_0",
|
|
||||||
texture1: "u_texture_1",
|
|
||||||
texture2: "u_texture_2"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
var basicVertexRounding = (app) => new Shader(basicShaderConfig).vertex(basic_vertex_rounding_default).fragment(basic_default).app(app);
|
|
||||||
|
|
||||||
// src/003-scene/main.ts
|
|
||||||
var app = new WebGLApp({ fov: 45 });
|
|
||||||
var camera = new Transform([2, 3, 3], etoq([-15, 40, 0]));
|
|
||||||
var light = new Transform([2, 2, 0]);
|
|
||||||
var transform2 = new Transform(v3(0), etoq([0, 0, 0]));
|
|
||||||
var transform22 = new Transform([-3, 0, 1], etoq([0, 0, 0]));
|
|
||||||
var trithingTexture = new Texture(app, texture0_default);
|
|
||||||
var trithingTextureNormals = new Texture(app, texture1_default);
|
|
||||||
app.onUpdate(() => {
|
|
||||||
exports_quat.rotateY(transform2.rotation, transform2.rotation, 0.001);
|
|
||||||
exports_quat.rotateY(transform22.rotation, transform22.rotation, 0.001);
|
|
||||||
});
|
|
||||||
new Renderable(app, transform2, new MeshRenderer(app, trianglething_default, basicVertexRounding(app).addTexture("texture0", trithingTexture).addTexture("texture1", trithingTextureNormals), camera, light).configure({}));
|
|
||||||
new Renderable(app, transform22, new MeshRenderer(app, trianglething_default, basic(app).addTexture("texture0", trithingTexture).addTexture("texture1", trithingTextureNormals), camera, light).configure({}));
|
|
||||||
app.start();
|
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -1,333 +1,6 @@
|
||||||
import {
|
import{c as N} from"../chunk-d24458ad0a4be457.js";import{f as D,g as I,h as j,i as O,j as k,l as y,n as Q,o as z} from"../chunk-0ef35489d83e6289.js";var C=`#version 300 es
|
||||||
plane_default
|
precision highp float;uniform float u_time;in vec2 uv0;out vec4 fragColor;vec2 squareImaginary(vec2 number,float mod){return vec2(pow(number.x*mod,2.0)-pow(number.y*mod,2.0),2.0*number.x*number.y);}float iterateMandelbrot(vec2 coord){vec2 z=vec2(0,0);float maxIterations=100.0;for(float i=0.0;i<maxIterations;i++){float factor=2.6+(1.3*sin(u_time*0.0001));z=squareImaginary(z,factor+1.0)+(coord/factor);if(length(z)>2.0)return i/float(maxIterations);}return maxIterations;}void main(){vec2 uvMirror=abs(uv0*2.0-1.0);fragColor=vec4(0.0);float mandelbrot=iterateMandelbrot((uvMirror.xy+vec2(0.14,-0.525))*0.9);fragColor.r=mandelbrot;vec2 outerNoise=(mandelbrot)*(1.0-uvMirror*0.5);fragColor.gb+=(1.0-mandelbrot)*outerNoise;fragColor.r+=pow(1.0-length(uvMirror),8.0);fragColor.a=1.0;}`;var V=`#version 300 es
|
||||||
} from "../chunk-a6d990db9d9ec9c3.js";
|
precision highp float;uniform float u_time;in vec2 uv0;out vec4 fragColor;vec2 squareImaginary(vec2 number,float mod){return vec2(pow(number.x*mod,2.0)-pow(number.y*mod,2.0),2.0*number.x*number.y);}float iterateMandelbrot(vec2 coord){vec2 z=vec2(0,0);float maxIterations=69.0;for(float i=0.0;i<maxIterations;i++){float mod=u_time*0.0003;z=squareImaginary(z,1.0/mod)+coord;if(length(z)>100.0)return i/float(maxIterations);}return maxIterations;}void main(){vec2 uvMirror=abs(uv0*2.0-1.0);fragColor=vec4(0.0);float mandelbrot=iterateMandelbrot((uvMirror.yx-vec2(-1.075,1.0))*0.9);fragColor.r=mandelbrot;vec2 outerNoise=(mandelbrot)*(1.0-uvMirror*0.5);fragColor.gb+=(1.0-mandelbrot)*outerNoise;fragColor.a=1.0;}`;var R={attributes:{vertex:"a_vertex",uv0:"a_uv0",normal:"a_normal",vertexColor:"a_vertex_color"},uniforms:{view:"u_view",projection:"u_projection",objectToWorld:"u_object_to_world",objectToWorldInv:"u_object_to_world_inv",light0:"u_light_0",light0Color:"u_light_0_color",time:"u_time",albedo:"u_albedo",texture0:"u_texture_0",texture1:"u_texture_1",texture2:"u_texture_2"}},E={normal:C,alt3:V},Z=(_,x=C)=>new k(R).vertex(y).fragment(x).app(_);var J=`#version 300 es
|
||||||
import {
|
precision highp float;uniform float u_time;in vec2 uv0;in vec3 light_pos;out vec4 fragColor;const float margin=0.5;vec3 hsv2rgb(vec3 c){vec4 K=vec4(1.0,2.0/3.0,1.0/3.0,3.0);vec3 p=abs(fract(c.xxx+K.xyz)*6.0-K.www);return c.z*mix(K.xxx,clamp(p-K.xxx,0.0,1.0),c.y);}void main(){vec2 cUV=uv0*2.0-1.0;float circleDistance=length(cUV);if(circleDistance>margin){discard;}float theta=atan(cUV.y,cUV.x);float spiral=sin(100.0*(sqrt(circleDistance*20.0)-10.0*theta-0.01*u_time*0.001));float edgeLightZone=pow(clamp(abs(dot(cUV.xyx,light_pos)),0.0,1.0)*2.0,4.0);float colorSpiral=sin(100.0*(sqrt(circleDistance*10.0)-0.001*theta-0.3*u_time*0.00005));vec3 hueRotation=hsv2rgb(vec3(colorSpiral,1.0,0.5));fragColor=vec4(hueRotation*spiral*edgeLightZone,1.0);fragColor.rgb+=min(spiral,0.0041666);}`;var $=`#version 300 es
|
||||||
MeshRenderer,
|
precision highp float;uniform float u_time;in vec2 uv0;in vec3 light_pos;out vec4 fragColor;const float margin=0.5;vec3 hsv2rgb(vec3 c){vec4 K=vec4(1.0,2.0/3.0,1.0/3.0,3.0);vec3 p=abs(fract(c.xxx+K.xyz)*6.0-K.www);return c.z*mix(K.xxx,clamp(p-K.xxx,0.0,1.0),c.y);}void main(){vec2 cUV=uv0*2.0-1.0;float circleDistance=length(cUV);if(circleDistance>margin){discard;}float theta=atan(cUV.y,cUV.x);float spiral=sin(100.0*(sqrt(circleDistance*20.0)-10.0*theta-0.01*u_time*0.001));float edgeLightZone=pow(clamp(abs(dot(cUV.xyx,light_pos)),0.0,1.0)*2.0,4.0);float colorSpiral=sin(100.0*(sqrt(circleDistance*10.0)-0.001*theta-0.3*u_time*0.00005));vec3 hueRotation=hsv2rgb(vec3(colorSpiral,1.0,0.5));fragColor=vec4(colorSpiral,spiral,1.0,1.0);}`;var q=`#version 300 es
|
||||||
Renderable,
|
precision highp float;uniform float u_time;in vec2 uv0;in vec3 light_pos;out vec4 fragColor;const float margin=0.9;vec3 hsv2rgb(vec3 c){vec4 K=vec4(1.0,2.0/3.0,1.0/3.0,3.0);vec3 p=abs(fract(c.xxx+K.xyz)*6.0-K.www);return c.z*mix(K.xxx,clamp(p-K.xxx,0.0,1.0),c.y);}void main(){vec2 cUV=uv0*2.0-1.0;float circleDistance=length(cUV);if(circleDistance>margin){discard;}float theta=atan(cUV.y,cUV.x);float spiral=sin(100.0*(sqrt(circleDistance*13.0)-(u_time*0.0001)*theta-0.01*u_time*0.001));float colorSpiral=sin(100.0*(sqrt(circleDistance*10.0)-0.001*theta-0.3*u_time*0.00005));fragColor=vec4(0,spiral,0,1.0);}`;var v={attributes:{vertex:"a_vertex",uv0:"a_uv0",normal:"a_normal",vertexColor:"a_vertex_color"},uniforms:{view:"u_view",projection:"u_projection",objectToWorld:"u_object_to_world",objectToWorldInv:"u_object_to_world_inv",light0:"u_light_0",light0Color:"u_light_0_color",time:"u_time",albedo:"u_albedo",texture0:"u_texture_0",texture1:"u_texture_1",texture2:"u_texture_2"}},B={normal:J,debug:$,alt2:q},w=(_,x=J)=>new k(v).vertex(y).fragment(x).app(_);var i=new z({fov:45}),G=new D([0,0,2],I([0,0,0])),K=new D([1,-1,0],I([0,0,0])),b=new D(j(0),I([0,180,0]),j(1.8)),m=new D(j(0),I([0,180,180]),j(0.6));document.body.addEventListener("mousemove",(_)=>{const{clientX:x,clientY:L}=_,{clientWidth:M,clientHeight:P}=document.body,c=x/M,F=L/P,W=c*2-1,A=F*2-1;K.position[1]=W,K.position[0]=A});i.onUpdate((_,x)=>{});var U=B.normal,H=E.normal;if(location.search.includes("alt1"))U=B.debug;if(location.search.includes("alt2"))U=B.alt2;if(location.search.includes("alt3"))H=E.alt3;new Q(i,b,new O(i,N,Z(i,H),G).configure({}));new Q(i,m,new O(i,N,w(i,U),G,K).configure({}));i.start();
|
||||||
Shader,
|
|
||||||
Transform,
|
|
||||||
WebGLApp,
|
|
||||||
basic_default1 as basic_default,
|
|
||||||
etoq,
|
|
||||||
v3
|
|
||||||
} from "../chunk-652b721da622b7d9.js";
|
|
||||||
|
|
||||||
// src/005-thoughtform-hidenoe/shaders/outer.frag
|
|
||||||
var outer_default = `#version 300 es
|
|
||||||
precision highp float;
|
|
||||||
|
|
||||||
uniform float u_time;
|
|
||||||
|
|
||||||
in vec2 uv0;
|
|
||||||
|
|
||||||
out vec4 fragColor;
|
|
||||||
|
|
||||||
vec2 squareImaginary(vec2 number, float mod){
|
|
||||||
return vec2(
|
|
||||||
pow(number.x * mod,2.0) - pow(number.y * mod, 2.0),
|
|
||||||
2.0 * number.x * number.y
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
float iterateMandelbrot(vec2 coord){
|
|
||||||
vec2 z = vec2(0,0);
|
|
||||||
float maxIterations = 100.0;
|
|
||||||
|
|
||||||
for (float i = 0.0; i < maxIterations; i++) {
|
|
||||||
float factor = 2.6 + (1.3 * sin(u_time * 0.0001));
|
|
||||||
z = squareImaginary(z, factor + 1.0) + (coord / factor);
|
|
||||||
if (length(z) > 2.0) return i / float(maxIterations);
|
|
||||||
}
|
|
||||||
|
|
||||||
return maxIterations;
|
|
||||||
}
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
// uv0 is 0..1, we want to denormalize this to -1..1
|
|
||||||
vec2 uvMirror = abs(uv0 * 2.0 - 1.0);
|
|
||||||
fragColor = vec4(0.0);
|
|
||||||
float mandelbrot = iterateMandelbrot((uvMirror.xy + vec2(0.14, -0.525)) * 0.9);
|
|
||||||
fragColor.r = mandelbrot;
|
|
||||||
|
|
||||||
vec2 outerNoise = (mandelbrot) * (1.0 - uvMirror * 0.5);
|
|
||||||
fragColor.gb += (1.0 - mandelbrot) * outerNoise;
|
|
||||||
|
|
||||||
fragColor.r += pow(1.0 - length(uvMirror), 8.0);
|
|
||||||
|
|
||||||
fragColor.a = 1.0;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
// src/005-thoughtform-hidenoe/shaders/outer-alt3.frag
|
|
||||||
var outer_alt3_default = `#version 300 es
|
|
||||||
precision highp float;
|
|
||||||
|
|
||||||
uniform float u_time;
|
|
||||||
|
|
||||||
in vec2 uv0;
|
|
||||||
|
|
||||||
out vec4 fragColor;
|
|
||||||
|
|
||||||
vec2 squareImaginary(vec2 number, float mod){
|
|
||||||
return vec2(
|
|
||||||
pow(number.x * mod,2.0) - pow(number.y * mod, 2.0),
|
|
||||||
2.0 * number.x * number.y
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
float iterateMandelbrot(vec2 coord){
|
|
||||||
vec2 z = vec2(0,0);
|
|
||||||
float maxIterations = 69.0;
|
|
||||||
|
|
||||||
for (float i = 0.0; i < maxIterations; i++) {
|
|
||||||
// float factor = cos((1.3*6.0) * sin(u_time * 0.0005));
|
|
||||||
float mod = u_time * 0.0003;
|
|
||||||
// mod = 0.5;
|
|
||||||
z = squareImaginary(z, 1.0/mod) + coord;
|
|
||||||
if (length(z) > 100.0) return i / float(maxIterations);
|
|
||||||
}
|
|
||||||
|
|
||||||
return maxIterations;
|
|
||||||
}
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
// uv0 is 0..1, we want to denormalize this to -1..1
|
|
||||||
vec2 uvMirror = abs(uv0 * 2.0 - 1.0);
|
|
||||||
fragColor = vec4(0.0);
|
|
||||||
float mandelbrot = iterateMandelbrot((uvMirror.yx - vec2(-1.075, 1.0)) * 0.9);
|
|
||||||
fragColor.r = mandelbrot;
|
|
||||||
|
|
||||||
vec2 outerNoise = (mandelbrot) * (1.0 - uvMirror * 0.5);
|
|
||||||
fragColor.gb += (1.0 - mandelbrot) * outerNoise;
|
|
||||||
|
|
||||||
// fragColor.r += pow(1.0 - length(uvMirror), 18.0);
|
|
||||||
|
|
||||||
fragColor.a = 1.0;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
// src/005-thoughtform-hidenoe/shaders/outer.ts
|
|
||||||
var basicShaderConfig = {
|
|
||||||
attributes: {
|
|
||||||
vertex: "a_vertex",
|
|
||||||
uv0: "a_uv0",
|
|
||||||
normal: "a_normal",
|
|
||||||
vertexColor: "a_vertex_color"
|
|
||||||
},
|
|
||||||
uniforms: {
|
|
||||||
view: "u_view",
|
|
||||||
projection: "u_projection",
|
|
||||||
objectToWorld: "u_object_to_world",
|
|
||||||
objectToWorldInv: "u_object_to_world_inv",
|
|
||||||
light0: "u_light_0",
|
|
||||||
light0Color: "u_light_0_color",
|
|
||||||
time: "u_time",
|
|
||||||
albedo: "u_albedo",
|
|
||||||
texture0: "u_texture_0",
|
|
||||||
texture1: "u_texture_1",
|
|
||||||
texture2: "u_texture_2"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
var outerFrags = {
|
|
||||||
normal: outer_default,
|
|
||||||
alt3: outer_alt3_default
|
|
||||||
};
|
|
||||||
var outer2 = (app, fragShader = outer_default) => new Shader(basicShaderConfig).vertex(basic_default).fragment(fragShader).app(app);
|
|
||||||
|
|
||||||
// src/005-thoughtform-hidenoe/shaders/noe.frag
|
|
||||||
var noe_default = `#version 300 es
|
|
||||||
precision highp float;
|
|
||||||
|
|
||||||
// uniform mat4 u_view;
|
|
||||||
// uniform mat4 u_projection;
|
|
||||||
// uniform mat4 u_object_to_world;
|
|
||||||
// uniform mat4 u_object_to_world_inv;
|
|
||||||
// uniform vec3 u_light_0;
|
|
||||||
// uniform vec4 u_light_0_color;
|
|
||||||
uniform float u_time;
|
|
||||||
// uniform vec4 u_albedo;
|
|
||||||
|
|
||||||
in vec2 uv0;
|
|
||||||
in vec3 light_pos;
|
|
||||||
|
|
||||||
out vec4 fragColor;
|
|
||||||
|
|
||||||
const float margin = 0.5;
|
|
||||||
|
|
||||||
vec3 hsv2rgb(vec3 c) {
|
|
||||||
vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);
|
|
||||||
vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);
|
|
||||||
return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);
|
|
||||||
}
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
// 0..1 to -1..1
|
|
||||||
vec2 cUV = uv0 * 2.0 - 1.0;
|
|
||||||
float circleDistance = length(cUV);
|
|
||||||
if (circleDistance > margin) {
|
|
||||||
discard;
|
|
||||||
}
|
|
||||||
|
|
||||||
float theta = atan(cUV.y, cUV.x) ;
|
|
||||||
float spiral = sin(100.0 * (sqrt(circleDistance*20.0) - 10.0 * theta - 0.01 * u_time * 0.001));
|
|
||||||
|
|
||||||
float edgeLightZone = pow(clamp(abs(dot(cUV.xyx, light_pos)), 0.0, 1.0) * 2.0, 4.0);
|
|
||||||
|
|
||||||
float colorSpiral = sin(100.0 * (sqrt(circleDistance * 10.0) - 0.001 * theta - 0.3 * u_time * 0.00005));
|
|
||||||
vec3 hueRotation = hsv2rgb(vec3(colorSpiral, 1.0, 0.5));
|
|
||||||
|
|
||||||
fragColor = vec4(hueRotation * spiral * edgeLightZone, 1.0);
|
|
||||||
fragColor.rgb += min(spiral, 0.0041666);
|
|
||||||
}`;
|
|
||||||
|
|
||||||
// src/005-thoughtform-hidenoe/shaders/noe-debug.frag
|
|
||||||
var noe_debug_default = `#version 300 es
|
|
||||||
precision highp float;
|
|
||||||
|
|
||||||
// uniform mat4 u_view;
|
|
||||||
// uniform mat4 u_projection;
|
|
||||||
// uniform mat4 u_object_to_world;
|
|
||||||
// uniform mat4 u_object_to_world_inv;
|
|
||||||
// uniform vec3 u_light_0;
|
|
||||||
// uniform vec4 u_light_0_color;
|
|
||||||
uniform float u_time;
|
|
||||||
// uniform vec4 u_albedo;
|
|
||||||
|
|
||||||
in vec2 uv0;
|
|
||||||
in vec3 light_pos;
|
|
||||||
|
|
||||||
out vec4 fragColor;
|
|
||||||
|
|
||||||
const float margin = 0.5;
|
|
||||||
|
|
||||||
vec3 hsv2rgb(vec3 c) {
|
|
||||||
vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);
|
|
||||||
vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);
|
|
||||||
return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);
|
|
||||||
}
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
// 0..1 to -1..1
|
|
||||||
vec2 cUV = uv0 * 2.0 - 1.0;
|
|
||||||
float circleDistance = length(cUV);
|
|
||||||
if (circleDistance > margin) {
|
|
||||||
discard;
|
|
||||||
}
|
|
||||||
|
|
||||||
float theta = atan(cUV.y, cUV.x) ;
|
|
||||||
float spiral = sin(100.0 * (sqrt(circleDistance*20.0) - 10.0 * theta - 0.01 * u_time * 0.001));
|
|
||||||
|
|
||||||
float edgeLightZone = pow(clamp(abs(dot(cUV.xyx, light_pos)), 0.0, 1.0) * 2.0, 4.0);
|
|
||||||
|
|
||||||
float colorSpiral = sin(100.0 * (sqrt(circleDistance * 10.0) - 0.001 * theta - 0.3 * u_time * 0.00005));
|
|
||||||
vec3 hueRotation = hsv2rgb(vec3(colorSpiral, 1.0, 0.5));
|
|
||||||
|
|
||||||
fragColor = vec4(colorSpiral, spiral, 1.0, 1.0);
|
|
||||||
}`;
|
|
||||||
|
|
||||||
// src/005-thoughtform-hidenoe/shaders/noe-alt2.frag
|
|
||||||
var noe_alt2_default = `#version 300 es
|
|
||||||
precision highp float;
|
|
||||||
|
|
||||||
// uniform mat4 u_view;
|
|
||||||
// uniform mat4 u_projection;
|
|
||||||
// uniform mat4 u_object_to_world;
|
|
||||||
// uniform mat4 u_object_to_world_inv;
|
|
||||||
// uniform vec3 u_light_0;
|
|
||||||
// uniform vec4 u_light_0_color;
|
|
||||||
uniform float u_time;
|
|
||||||
// uniform vec4 u_albedo;
|
|
||||||
|
|
||||||
in vec2 uv0;
|
|
||||||
in vec3 light_pos;
|
|
||||||
|
|
||||||
out vec4 fragColor;
|
|
||||||
|
|
||||||
const float margin = 0.9;
|
|
||||||
|
|
||||||
vec3 hsv2rgb(vec3 c) {
|
|
||||||
vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);
|
|
||||||
vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);
|
|
||||||
return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);
|
|
||||||
}
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
// 0..1 to -1..1
|
|
||||||
vec2 cUV = uv0 * 2.0 - 1.0;
|
|
||||||
float circleDistance = length(cUV);
|
|
||||||
if (circleDistance > margin) {
|
|
||||||
discard;
|
|
||||||
}
|
|
||||||
|
|
||||||
float theta = atan(cUV.y, cUV.x) ;
|
|
||||||
float spiral = sin(100.0 * (sqrt(circleDistance*13.0) - (u_time * 0.0001) * theta - 0.01 * u_time * 0.001));
|
|
||||||
|
|
||||||
// float edgeLightZone = pow(clamp(abs(dot(cUV.xyx, light_pos)), 0.0, 1.0) * 2.0, 4.0);
|
|
||||||
|
|
||||||
float colorSpiral = sin(100.0 * (sqrt(circleDistance * 10.0) - 0.001 * theta - 0.3 * u_time * 0.00005));
|
|
||||||
// vec3 hueRotation = hsv2rgb(vec3(colorSpiral, 1.0, 0.5));
|
|
||||||
|
|
||||||
fragColor = vec4(0, spiral, 0, 1.0);
|
|
||||||
}`;
|
|
||||||
|
|
||||||
// src/005-thoughtform-hidenoe/shaders/noe.ts
|
|
||||||
var basicShaderConfig2 = {
|
|
||||||
attributes: {
|
|
||||||
vertex: "a_vertex",
|
|
||||||
uv0: "a_uv0",
|
|
||||||
normal: "a_normal",
|
|
||||||
vertexColor: "a_vertex_color"
|
|
||||||
},
|
|
||||||
uniforms: {
|
|
||||||
view: "u_view",
|
|
||||||
projection: "u_projection",
|
|
||||||
objectToWorld: "u_object_to_world",
|
|
||||||
objectToWorldInv: "u_object_to_world_inv",
|
|
||||||
light0: "u_light_0",
|
|
||||||
light0Color: "u_light_0_color",
|
|
||||||
time: "u_time",
|
|
||||||
albedo: "u_albedo",
|
|
||||||
texture0: "u_texture_0",
|
|
||||||
texture1: "u_texture_1",
|
|
||||||
texture2: "u_texture_2"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
var frags = {
|
|
||||||
normal: noe_default,
|
|
||||||
debug: noe_debug_default,
|
|
||||||
alt2: noe_alt2_default
|
|
||||||
};
|
|
||||||
var noe2 = (app, fragShader = noe_default) => new Shader(basicShaderConfig2).vertex(basic_default).fragment(fragShader).app(app);
|
|
||||||
|
|
||||||
// src/005-thoughtform-hidenoe/main.ts
|
|
||||||
var app = new WebGLApp({ fov: 45 });
|
|
||||||
var camera = new Transform([0, 0, 2], etoq([0, 0, 0]));
|
|
||||||
var light = new Transform([1, -1, 0], etoq([0, 0, 0]));
|
|
||||||
var transformPlane = new Transform(v3(0), etoq([0, 180, 0]), v3(1.8));
|
|
||||||
var transformSphere = new Transform(v3(0), etoq([0, 180, 180]), v3(0.6));
|
|
||||||
document.body.addEventListener("mousemove", (event) => {
|
|
||||||
const { clientX, clientY } = event;
|
|
||||||
const { clientWidth, clientHeight } = document.body;
|
|
||||||
const screenX = clientX / clientWidth;
|
|
||||||
const screenY = clientY / clientHeight;
|
|
||||||
const centeredX = screenX * 2 - 1;
|
|
||||||
const centeredY = screenY * 2 - 1;
|
|
||||||
light.position[1] = centeredX;
|
|
||||||
light.position[0] = centeredY;
|
|
||||||
});
|
|
||||||
app.onUpdate((time, app2) => {
|
|
||||||
});
|
|
||||||
var noeShader = frags.normal;
|
|
||||||
var hShader = outerFrags.normal;
|
|
||||||
if (location.search.includes("alt1")) {
|
|
||||||
noeShader = frags.debug;
|
|
||||||
}
|
|
||||||
if (location.search.includes("alt2")) {
|
|
||||||
noeShader = frags.alt2;
|
|
||||||
}
|
|
||||||
if (location.search.includes("alt3")) {
|
|
||||||
hShader = outerFrags.alt3;
|
|
||||||
}
|
|
||||||
new Renderable(app, transformPlane, new MeshRenderer(app, plane_default, outer2(app, hShader), camera).configure({}));
|
|
||||||
new Renderable(app, transformSphere, new MeshRenderer(app, plane_default, noe2(app, noeShader), camera, light).configure({}));
|
|
||||||
app.start();
|
|
||||||
|
|
|
@ -1,199 +1,2 @@
|
||||||
import {
|
import{c as E} from"../chunk-d24458ad0a4be457.js";import{f as j,g as k,h as z,i as F,j as y,l as B,n as H,o as I} from"../chunk-0ef35489d83e6289.js";var t=`#version 300 es
|
||||||
plane_default
|
precision highp float;uniform float u_time;in vec2 uv0;out vec4 fragColor;const float railWidth=0.041666;const float railWiggle=0.0015;vec3 mod289(vec3 x){return x-floor(x*(1.0/289.0))*289.0;}vec4 mod289(vec4 x){return x-floor(x*(1.0/289.0))*289.0;}vec4 permute(vec4 x){return mod289(((x*34.0)+1.0)*x);}vec4 taylorInvSqrt(vec4 r){return 1.79284291400159-0.85373472095314*r;}float snoise(vec3 v){const vec2 C=vec2(1.0/6.0,1.0/3.0);const vec4 D=vec4(0.0,0.5,1.0,2.0);vec3 i=floor(v+dot(v,C.yyy));vec3 x0=v-i+dot(i,C.xxx);vec3 g=step(x0.yzx,x0.xyz);vec3 l=1.0-g;vec3 i1=min(g.xyz,l.zxy);vec3 i2=max(g.xyz,l.zxy);vec3 x1=x0-i1+C.xxx;vec3 x2=x0-i2+C.yyy;vec3 x3=x0-D.yyy;i=mod289(i);vec4 p=permute(permute(permute(i.z+vec4(0.0,i1.z,i2.z,1.0))+i.y+vec4(0.0,i1.y,i2.y,1.0))+i.x+vec4(0.0,i1.x,i2.x,1.0));const float n_=0.142857142857;vec3 ns=n_*D.wyz-D.xzx;vec4 j=p-49.0*floor(p*ns.z*ns.z);vec4 x_=floor(j*ns.z);vec4 y_=floor(j-7.0*x_);vec4 x=x_*ns.x+ns.yyyy;vec4 y=y_*ns.x+ns.yyyy;vec4 h=1.0-abs(x)-abs(y);vec4 b0=vec4(x.xy,y.xy);vec4 b1=vec4(x.zw,y.zw);vec4 s0=floor(b0)*2.0+1.0;vec4 s1=floor(b1)*2.0+1.0;vec4 sh=-step(h,vec4(0,0,0,0));vec4 a0=b0.xzyw+s0.xzyw*sh.xxyy;vec4 a1=b1.xzyw+s1.xzyw*sh.zzww;vec3 p0=vec3(a0.xy,h.x);vec3 p1=vec3(a0.zw,h.y);vec3 p2=vec3(a1.xy,h.z);vec3 p3=vec3(a1.zw,h.w);vec4 norm=taylorInvSqrt(vec4(dot(p0,p0),dot(p1,p1),dot(p2,p2),dot(p3,p3)));p0*=norm.x;p1*=norm.y;p2*=norm.z;p3*=norm.w;vec4 m=max(0.6-vec4(dot(x0,x0),dot(x1,x1),dot(x2,x2),dot(x3,x3)),0.0);m=m*m;return 42.0*dot(m*m,vec4(dot(p0,x0),dot(p1,x1),dot(p2,x2),dot(p3,x3)));}void main(){vec2 cUV=uv0*2.0-1.0;float sintime=sin(u_time*0.0001);float vY=cos(uv0.y*sintime);float vX=sin(uv0.x*sintime*10000.0);float vibes=railWiggle*snoise(vec3(vY,vX,u_time));float rail=1.0-step(abs(pow(abs(cUV.y)-railWidth+vibes,30.0)),1.0);vec4 railColor=vec4(rail);float noise=abs(sin(snoise(uv0.xxy*10000.*u_time)));float noise2=abs(sin(snoise(uv0.yxy*10000.*u_time)));float noise3=abs(sin(snoise(uv0.xyx*10000.*u_time)));railColor.rgb-=(vec3(noise,noise2,noise3)*0.3);float theta=atan(cUV.y,uv0.x);float spiral=sin(10.0*(sqrt(19.0+(15.0*sintime*0.05)))-1000.0*theta-0.01*u_time*0.0001);float theta2=atan(1.0-(cUV.y/1000.0),uv0.x-(railWidth/20.));float spiral2=sin(10.0*(sqrt(20.0+u_time*0.00001)-10000.0*theta2-0.01*u_time*0.0001));float theta3=atan(1.0-uv0.y/10.0,uv0.x);float spiral3=sin(100.0*(sqrt(100.0+uv0.y)-100000.0*theta3-0.01*sintime*0.0001));float sparkleNoise=snoise(vec3(spiral,spiral2,u_time*0.00001));fragColor.r=step(abs(spiral2*spiral*sparkleNoise),mix(0.0333,0.0666,abs(uv0.y+sin(u_time*0.00001))));fragColor.r*=pow(1.0-abs(cUV.y),3.0)*abs(spiral3);fragColor.r*=10.0;if(cUV.y>0.0){fragColor.r=0.0;}fragColor=clamp(vec4(fragColor+railColor),vec4(0),vec4(1));}`;var O={attributes:{vertex:"a_vertex",uv0:"a_uv0",normal:"a_normal",vertexColor:"a_vertex_color"},uniforms:{view:"u_view",projection:"u_projection",objectToWorld:"u_object_to_world",objectToWorldInv:"u_object_to_world_inv",light0:"u_light_0",light0Color:"u_light_0_color",time:"u_time",albedo:"u_albedo",texture0:"u_texture_0",texture1:"u_texture_1",texture2:"u_texture_2"}},D=(J,K=t)=>new y(O).vertex(B).fragment(K).app(J);var x=new I({fov:45}),P=new j([0,0,2],k([0,0,0])),Q=new j(z(0),k(z(0)),[1000,1,1]);new H(x,Q,new F(x,E,D(x),P).configure({}));x.start();
|
||||||
} from "../chunk-a6d990db9d9ec9c3.js";
|
|
||||||
import {
|
|
||||||
MeshRenderer,
|
|
||||||
Renderable,
|
|
||||||
Shader,
|
|
||||||
Transform,
|
|
||||||
WebGLApp,
|
|
||||||
basic_default1 as basic_default,
|
|
||||||
etoq,
|
|
||||||
v3
|
|
||||||
} from "../chunk-652b721da622b7d9.js";
|
|
||||||
|
|
||||||
// src/006-the-edge/shaders/rail.frag
|
|
||||||
var rail_default = `#version 300 es
|
|
||||||
precision highp float;
|
|
||||||
|
|
||||||
uniform float u_time;
|
|
||||||
|
|
||||||
in vec2 uv0;
|
|
||||||
|
|
||||||
out vec4 fragColor;
|
|
||||||
|
|
||||||
const float railWidth = 0.041666;
|
|
||||||
const float railWiggle = 0.0015;
|
|
||||||
|
|
||||||
vec3 mod289(vec3 x) {
|
|
||||||
return x - floor(x * (1.0 / 289.0)) * 289.0;
|
|
||||||
}
|
|
||||||
|
|
||||||
vec4 mod289(vec4 x) {
|
|
||||||
return x - floor(x * (1.0 / 289.0)) * 289.0;
|
|
||||||
}
|
|
||||||
|
|
||||||
vec4 permute(vec4 x) {
|
|
||||||
return mod289(((x*34.0)+1.0)*x);
|
|
||||||
}
|
|
||||||
|
|
||||||
vec4 taylorInvSqrt(vec4 r)
|
|
||||||
{
|
|
||||||
return 1.79284291400159 - 0.85373472095314 * r;
|
|
||||||
}
|
|
||||||
|
|
||||||
float snoise(vec3 v) {
|
|
||||||
const vec2 C = vec2(1.0/6.0, 1.0/3.0) ;
|
|
||||||
const vec4 D = vec4(0.0, 0.5, 1.0, 2.0);
|
|
||||||
|
|
||||||
// First corner
|
|
||||||
vec3 i = floor(v + dot(v, C.yyy) );
|
|
||||||
vec3 x0 = v - i + dot(i, C.xxx) ;
|
|
||||||
|
|
||||||
// Other corners
|
|
||||||
vec3 g = step(x0.yzx, x0.xyz);
|
|
||||||
vec3 l = 1.0 - g;
|
|
||||||
vec3 i1 = min( g.xyz, l.zxy );
|
|
||||||
vec3 i2 = max( g.xyz, l.zxy );
|
|
||||||
|
|
||||||
// x0 = x0 - 0.0 + 0.0 * C.xxx;
|
|
||||||
// x1 = x0 - i1 + 1.0 * C.xxx;
|
|
||||||
// x2 = x0 - i2 + 2.0 * C.xxx;
|
|
||||||
// x3 = x0 - 1.0 + 3.0 * C.xxx;
|
|
||||||
vec3 x1 = x0 - i1 + C.xxx;
|
|
||||||
vec3 x2 = x0 - i2 + C.yyy; // 2.0*C.x = 1/3 = C.y
|
|
||||||
vec3 x3 = x0 - D.yyy; // -1.0+3.0*C.x = -0.5 = -D.y
|
|
||||||
|
|
||||||
// Permutations
|
|
||||||
i = mod289(i);
|
|
||||||
vec4 p = permute( permute( permute(
|
|
||||||
i.z + vec4(0.0, i1.z, i2.z, 1.0 ))
|
|
||||||
+ i.y + vec4(0.0, i1.y, i2.y, 1.0 ))
|
|
||||||
+ i.x + vec4(0.0, i1.x, i2.x, 1.0 ));
|
|
||||||
|
|
||||||
// Gradients: 7x7 points over a square, mapped onto an octahedron.
|
|
||||||
// The ring size 17*17 = 289 is close to a multiple of 49 (49*6 = 294)
|
|
||||||
const float n_ = 0.142857142857; // 1.0/7.0
|
|
||||||
vec3 ns = n_ * D.wyz - D.xzx;
|
|
||||||
|
|
||||||
vec4 j = p - 49.0 * floor(p * ns.z * ns.z); // mod(p,7*7)
|
|
||||||
|
|
||||||
vec4 x_ = floor(j * ns.z);
|
|
||||||
vec4 y_ = floor(j - 7.0 * x_ ); // mod(j,N)
|
|
||||||
|
|
||||||
vec4 x = x_ *ns.x + ns.yyyy;
|
|
||||||
vec4 y = y_ *ns.x + ns.yyyy;
|
|
||||||
vec4 h = 1.0 - abs(x) - abs(y);
|
|
||||||
|
|
||||||
vec4 b0 = vec4( x.xy, y.xy );
|
|
||||||
vec4 b1 = vec4( x.zw, y.zw );
|
|
||||||
|
|
||||||
//vec4 s0 = vec4(lessThan(b0,0.0))*2.0 - 1.0;
|
|
||||||
//vec4 s1 = vec4(lessThan(b1,0.0))*2.0 - 1.0;
|
|
||||||
vec4 s0 = floor(b0)*2.0 + 1.0;
|
|
||||||
vec4 s1 = floor(b1)*2.0 + 1.0;
|
|
||||||
vec4 sh = -step(h, vec4(0, 0, 0, 0));
|
|
||||||
|
|
||||||
vec4 a0 = b0.xzyw + s0.xzyw*sh.xxyy ;
|
|
||||||
vec4 a1 = b1.xzyw + s1.xzyw*sh.zzww ;
|
|
||||||
|
|
||||||
vec3 p0 = vec3(a0.xy,h.x);
|
|
||||||
vec3 p1 = vec3(a0.zw,h.y);
|
|
||||||
vec3 p2 = vec3(a1.xy,h.z);
|
|
||||||
vec3 p3 = vec3(a1.zw,h.w);
|
|
||||||
|
|
||||||
//Normalise gradients
|
|
||||||
vec4 norm = taylorInvSqrt(vec4(dot(p0,p0), dot(p1,p1), dot(p2, p2), dot(p3,p3)));
|
|
||||||
p0 *= norm.x;
|
|
||||||
p1 *= norm.y;
|
|
||||||
p2 *= norm.z;
|
|
||||||
p3 *= norm.w;
|
|
||||||
|
|
||||||
// Mix final noise value
|
|
||||||
vec4 m = max(0.6 - vec4(dot(x0,x0), dot(x1,x1), dot(x2,x2), dot(x3,x3)), 0.0);
|
|
||||||
m = m * m;
|
|
||||||
return 42.0 * dot( m*m, vec4( dot(p0,x0), dot(p1,x1),
|
|
||||||
dot(p2,x2), dot(p3,x3) ) );
|
|
||||||
}
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
vec2 cUV = uv0 * 2.0 - 1.0;
|
|
||||||
float sintime = sin(u_time * 0.0001);
|
|
||||||
|
|
||||||
// wiggle
|
|
||||||
float vY = cos(uv0.y * sintime);
|
|
||||||
float vX = sin(uv0.x * sintime * 10000.0);
|
|
||||||
float vibes = railWiggle * snoise(vec3(vY, vX, u_time));
|
|
||||||
|
|
||||||
// smoothly calculate the wiggle
|
|
||||||
float rail = 1.0 - step(abs(pow(abs(cUV.y) - railWidth + vibes, 30.0)), 1.0);
|
|
||||||
|
|
||||||
// snip out wrapping
|
|
||||||
// if (abs(cUV.y) > railWidth * 2.0) {
|
|
||||||
// discard;
|
|
||||||
// }
|
|
||||||
|
|
||||||
vec4 railColor = vec4(rail);
|
|
||||||
|
|
||||||
// albedo (staticy colorful <333)
|
|
||||||
float noise = abs(sin(snoise(uv0.xxy * 10000. * u_time)));
|
|
||||||
float noise2 = abs(sin(snoise(uv0.yxy * 10000.* u_time)));
|
|
||||||
float noise3 = abs(sin(snoise(uv0.xyx * 10000. * u_time)));
|
|
||||||
railColor.rgb -= (vec3(noise, noise2, noise3) * 0.3);
|
|
||||||
|
|
||||||
// simplex noise based on 3 moire spirals
|
|
||||||
float theta = atan(cUV.y, uv0.x);
|
|
||||||
float spiral = sin(10.0 * (sqrt(19.0 + (15.0 * sintime * 0.05))) - 1000.0 * theta - 0.01 * u_time * 0.0001);
|
|
||||||
|
|
||||||
float theta2 = atan(1.0-(cUV.y / 1000.0), uv0.x - (railWidth / 20.));
|
|
||||||
float spiral2 = sin(10.0 * (sqrt(20.0 + u_time * 0.00001) - 10000.0 * theta2 - 0.01 * u_time * 0.0001));
|
|
||||||
|
|
||||||
float theta3 = atan(1.0 - uv0.y/10.0, uv0.x);
|
|
||||||
float spiral3 = sin(100.0 * (sqrt(100.0 + uv0.y) - 100000.0 * theta3 - 0.01 * sintime * 0.0001));
|
|
||||||
|
|
||||||
float sparkleNoise = snoise(vec3(spiral, spiral2, u_time * 0.00001));
|
|
||||||
fragColor.r = step(abs(spiral2 * spiral * sparkleNoise), mix(0.0333, 0.0666, abs(uv0.y + sin(u_time * 0.00001))));
|
|
||||||
fragColor.r *= pow(1.0 - abs(cUV.y), 3.0) * abs(spiral3);
|
|
||||||
fragColor.r *= 10.0;
|
|
||||||
|
|
||||||
if (cUV.y > 0.0) {
|
|
||||||
fragColor.r = 0.0;
|
|
||||||
}
|
|
||||||
|
|
||||||
// fragColor.g = spiral3;
|
|
||||||
|
|
||||||
// keep within 0-1
|
|
||||||
fragColor = clamp(vec4(fragColor + railColor), vec4(0), vec4(1));
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
// src/006-the-edge/shaders/rail.ts
|
|
||||||
var basicShaderConfig = {
|
|
||||||
attributes: {
|
|
||||||
vertex: "a_vertex",
|
|
||||||
uv0: "a_uv0",
|
|
||||||
normal: "a_normal",
|
|
||||||
vertexColor: "a_vertex_color"
|
|
||||||
},
|
|
||||||
uniforms: {
|
|
||||||
view: "u_view",
|
|
||||||
projection: "u_projection",
|
|
||||||
objectToWorld: "u_object_to_world",
|
|
||||||
objectToWorldInv: "u_object_to_world_inv",
|
|
||||||
light0: "u_light_0",
|
|
||||||
light0Color: "u_light_0_color",
|
|
||||||
time: "u_time",
|
|
||||||
albedo: "u_albedo",
|
|
||||||
texture0: "u_texture_0",
|
|
||||||
texture1: "u_texture_1",
|
|
||||||
texture2: "u_texture_2"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
var rail2 = (app, fragShader = rail_default) => new Shader(basicShaderConfig).vertex(basic_default).fragment(fragShader).app(app);
|
|
||||||
|
|
||||||
// src/006-the-edge/main.ts
|
|
||||||
var app = new WebGLApp({ fov: 45 });
|
|
||||||
var camera = new Transform([0, 0, 2], etoq([0, 0, 0]));
|
|
||||||
var transformRail = new Transform(v3(0), etoq(v3(0)), [1000, 1, 1]);
|
|
||||||
new Renderable(app, transformRail, new MeshRenderer(app, plane_default, rail2(app), camera).configure({}));
|
|
||||||
app.start();
|
|
||||||
|
|
5
html/chunk-0ef35489d83e6289.js
Normal file
5
html/chunk-0ef35489d83e6289.js
Normal file
File diff suppressed because one or more lines are too long
5
html/chunk-13ea4b456137d650.js
Normal file
5
html/chunk-13ea4b456137d650.js
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
class n{_;u;y;texture=null;width=0;height=0;constructor(_,u,y={}){this.app=_;this.url=u;this.config=y}setImage(_,u,y){return this.texture=_,this.width=u,this.height=y,this}async loadImage(){if(this.url==="manual"){if(this.texture===null)throw new Error("manual specified, but texture was not ready...");return}if(this.texture!==null)return;this.app.telemetry?.addTextures(-1),this.app.loading("Fetching textures...");const _=new Image;return new Promise((u,y)=>{_.onload=async()=>{this.texture=await createImageBitmap(_,{imageOrientation:"flipY"}),this.width=this.texture.width,this.height=this.texture.height,this.app.telemetry?.addTextures(2),u(void 0)},_.onerror=(f)=>{this.app.telemetry?.addTextures(1),y(new Error(`texture load of ${this.url} failed: ${f.toString()}`))},_.src=this.url})}}var q=`#version 300 es
|
||||||
|
uniform mat4 u_view;uniform mat4 u_projection;uniform mat4 u_object_to_world;uniform mat4 u_object_to_world_inv;uniform vec3 u_light_0;in vec4 a_vertex;in vec2 a_uv0;in vec3 a_normal;in vec4 a_vertex_color;out vec2 uv0;out vec3 normal;out vec4 vertex_color;out vec3 light_pos;
|
||||||
|
#define ROUNDING_FACTOR 230.0f
|
||||||
|
void main(){mat4 worldInv=inverse(u_view);mat4 MVW=u_projection*u_view*u_object_to_world;vec4 realPosition=MVW*a_vertex;realPosition.xyz=round(vec3(realPosition.xyz*ROUNDING_FACTOR))/ROUNDING_FACTOR;gl_Position=realPosition;uv0=a_uv0;normal=normalize(mat3(worldInv)*a_normal);vertex_color=a_vertex_color;light_pos=normalize(mat3(u_object_to_world_inv)*u_light_0);}`;
|
||||||
|
export{n as a,q as b};
|
File diff suppressed because it is too large
Load diff
|
@ -1,89 +0,0 @@
|
||||||
// src/renderer/texture.ts
|
|
||||||
class Texture {
|
|
||||||
app;
|
|
||||||
url;
|
|
||||||
config;
|
|
||||||
texture = null;
|
|
||||||
width = 0;
|
|
||||||
height = 0;
|
|
||||||
constructor(app, url, config = {}) {
|
|
||||||
this.app = app;
|
|
||||||
this.url = url;
|
|
||||||
this.config = config;
|
|
||||||
}
|
|
||||||
setImage(data, width, height) {
|
|
||||||
this.texture = data;
|
|
||||||
this.width = width;
|
|
||||||
this.height = height;
|
|
||||||
return this;
|
|
||||||
}
|
|
||||||
async loadImage() {
|
|
||||||
if (this.url === "manual") {
|
|
||||||
if (this.texture === null) {
|
|
||||||
throw new Error("manual specified, but texture was not ready...");
|
|
||||||
}
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (this.texture !== null) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.app.telemetry?.addTextures(-1);
|
|
||||||
this.app.loading("Fetching textures...");
|
|
||||||
const image = new Image;
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
image.onload = async () => {
|
|
||||||
this.texture = await createImageBitmap(image, {
|
|
||||||
imageOrientation: "flipY"
|
|
||||||
});
|
|
||||||
this.width = this.texture.width;
|
|
||||||
this.height = this.texture.height;
|
|
||||||
this.app.telemetry?.addTextures(2);
|
|
||||||
resolve(undefined);
|
|
||||||
};
|
|
||||||
image.onerror = (e) => {
|
|
||||||
this.app.telemetry?.addTextures(1);
|
|
||||||
reject(new Error(`texture load of ${this.url} failed: ${e.toString()}`));
|
|
||||||
};
|
|
||||||
image.src = this.url;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// src/common-shaders/basic-vertex-rounding.vert
|
|
||||||
var basic_vertex_rounding_default = `#version 300 es
|
|
||||||
uniform mat4 u_view;
|
|
||||||
uniform mat4 u_projection;
|
|
||||||
uniform mat4 u_object_to_world;
|
|
||||||
uniform mat4 u_object_to_world_inv;
|
|
||||||
uniform vec3 u_light_0;
|
|
||||||
// uniform vec4 u_light_0_color;
|
|
||||||
// uniform float u_time;
|
|
||||||
// uniform vec4 u_albedo;
|
|
||||||
|
|
||||||
in vec4 a_vertex;
|
|
||||||
in vec2 a_uv0;
|
|
||||||
in vec3 a_normal;
|
|
||||||
in vec4 a_vertex_color;
|
|
||||||
|
|
||||||
out vec2 uv0;
|
|
||||||
out vec3 normal;
|
|
||||||
out vec4 vertex_color;
|
|
||||||
out vec3 light_pos;
|
|
||||||
|
|
||||||
#define ROUNDING_FACTOR 230.0f
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
mat4 worldInv = inverse(u_view);
|
|
||||||
mat4 MVW = u_projection * u_view * u_object_to_world;
|
|
||||||
vec4 realPosition = MVW * a_vertex;
|
|
||||||
realPosition.xyz = round(vec3(realPosition.xyz * ROUNDING_FACTOR)) / ROUNDING_FACTOR;
|
|
||||||
gl_Position = realPosition;
|
|
||||||
|
|
||||||
uv0 = a_uv0;
|
|
||||||
normal = normalize(mat3(worldInv) * a_normal);
|
|
||||||
vertex_color = a_vertex_color;
|
|
||||||
light_pos = normalize(mat3(u_object_to_world_inv) * u_light_0);
|
|
||||||
|
|
||||||
}`;
|
|
||||||
|
|
||||||
export { Texture, basic_vertex_rounding_default };
|
|
|
@ -1,16 +0,0 @@
|
||||||
import {
|
|
||||||
Mesh
|
|
||||||
} from "./chunk-652b721da622b7d9.js";
|
|
||||||
|
|
||||||
// src/meshes/plane.ts
|
|
||||||
var plane_default = new Mesh({
|
|
||||||
colors: null,
|
|
||||||
faces: new Uint8Array([0, 1, 2, 0, 3, 1]),
|
|
||||||
name: "src/meshes/plane.ply",
|
|
||||||
normals: null,
|
|
||||||
positions: new Float32Array([1, -1, 0, -1, 1, 0, -1, -1, 0, 1, 1, 0]),
|
|
||||||
uvs: new Float32Array([1, 0, 0, 1, 0, 0, 1, 1]),
|
|
||||||
vertexCount: 4
|
|
||||||
});
|
|
||||||
|
|
||||||
export { plane_default };
|
|
2
html/chunk-d24458ad0a4be457.js
Normal file
2
html/chunk-d24458ad0a4be457.js
Normal file
|
@ -0,0 +1,2 @@
|
||||||
|
import{d as o} from"./chunk-0ef35489d83e6289.js";var u=new o({colors:null,faces:new Uint8Array([0,1,2,0,3,1]),name:"src/meshes/plane.ply",normals:null,positions:new Float32Array([1,-1,0,-1,1,0,-1,-1,0,1,1,0]),uvs:new Float32Array([1,0,0,1,0,0,1,1]),vertexCount:4});
|
||||||
|
export{u as c};
|
|
@ -1,6 +1,11 @@
|
||||||
#version 300 es
|
#version 300 es
|
||||||
precision highp float;
|
precision highp float;
|
||||||
|
|
||||||
|
/*
|
||||||
|
This one is weird... We ran into engine limitations that won't exist in future iterations
|
||||||
|
Namely that we don't have a way to get screen space pixel location yet.
|
||||||
|
*/
|
||||||
|
|
||||||
uniform float u_time;
|
uniform float u_time;
|
||||||
|
|
||||||
in vec2 uv0;
|
in vec2 uv0;
|
||||||
|
|
Loading…
Add table
Reference in a new issue